convert description options to new options system

src/uncategorized/descriptionOptions.tw

 :: Description Options [nobr]
 
-<style>
-.subHeading {
-	width: 85%;
-	text-align: center;
-	margin-top: 1.5em;
-}
-</style>
-
 <<set $nextButton = "Back">>
 <<if $storedLink !== "Slave Interact">>
 	<<if lastVisited("Slave Interact") === 1>>
@@ -18,109 +10,65 @@
 <</if>>
 <<set $nextLink = $storedLink>>
 
+<h1>Description Options</h1>
+
 //These options will affect both the long form description of each slave and the miniscenes available from the main menu.//
 
-<br>
-<<options $surnameOrder>>
-	<<option 0 "Allow nationality name order">>
-	Order names ''based on country of origin''.
-	<<option 1 "Force name surname">>
-	Names will always be ''Name Surname''.
-	<<option 2 "Force surname name">>
-	Names will always be ''Surname Name''.
-<</options>>
-
-<br>
-<<options $seeRace>>
-	<<option 0 "Disable most mentions of race">>
-		Ethnicity will ''almost never'' be mentioned.
-	<<option 1 "Enable mentions of race">>
-		Ethnicity will ''occasionally'' be mentioned.
-<</options>>
-<br>
-<<options $seeNationality>>
-	<<option 0 "Disable most mentions of nationality">>
-		Nationality will ''almost never'' be mentioned.
-	<<option 1 "Enable mentions of nationality">>
-		Nationality will ''occasionally'' be mentioned.
-<</options>>
-
-<br>
-<<options $showImplantEffects>>
-	The effects of implants are
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-
-<<options $showClothing>>
-	Clothing is mostly
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-<br>
-<<options $showAgeDetail>>
-	Detailed slave age information is
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-<br>
-<<options $showHeightCMs>>
-	Approximate height is
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-
-<<options $showBodyMods>>
-	Cosmetic body mods are
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-
-<br>
-<<options $showSexualHistory>>
-	Sexual histories are
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-
-<<options $showScores>>
-	Attractiveness and Sexual scores are
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-
-<br>
-<<options $showBoobCCs>>
-	Volume, in CCs, of breasts is
-	<<option 1 "Shown">>
-	<<option 0 "Hidden">>
-<</options>>
-<<options $showInches>>
-	Height and length units are in
-	<<option 0 "Metric">>
-	<<option 1 "Both">>
-	<<option 2 "Imperial">>
-<</options>>
-
-
-<div class="subHeading">
+<<set _options = new App.UI.OptionsGroup()>>
+
+<<run _options.addOption("", "surnameOrder")
+.addValue("Allow nationality name order", 0).customDescription("Order names ''based on country of origin''.")
+.addValue("Force name surname", 1).customDescription("Names will always be ''Name Surname''.")
+.addValue("Force surname name", 2).customDescription("Names will always be ''Surname Name''.")>>
+
+<<run _options.addOption("", "seeRace")
+.addValue("Disable most mentions of race", 0).off().customDescription("Ethnicity will ''almost never'' be mentioned.")
+.addValue("Enable mentions of race", 1).on().customDescription("Ethnicity will ''occasionally'' be mentioned.")>>
+
+<<run _options.addOption("", "seeNationality")
+.addValue("Disable most mentions of nationality", 0).off().customDescription("Nationality will ''almost never'' be mentioned.")
+.addValue("Enable mentions of nationality", 1).on().customDescription("Nationality will ''occasionally'' be mentioned.")>>
+
+<<run _options.addOption("The effects of implants are", "showImplantEffects")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Clothing is mostly", "showClothing")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Detailed slave age information is", "showAgeDetail")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Approximate height is", "showHeightCMs")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Cosmetic body mods are", "showBodyMods")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Sexual histories are", "showSexualHistory")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Attractiveness and Sexual scores are", "showScores")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Volume, in CCs, of breasts is", "showBoobCCs")
+.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
+
+<<run _options.addOption("Height and length units are in", "showInches")
+.addValueList([["Metric", 0], ["Both", 1], ["Imperial", 2]])>>
+
+
 <<if $seeDicks > 0>> <br>
-	<<options $showDickCMs>>
-		Approximate sizes of dicks and balls are
-		<<option 1 "Shown">>
-		<<option 0 "Hidden">>
-	<</options>>
+	<<run _options.addOption("Approximate sizes of dicks and balls are", "showDickCMs")
+	.addValue("Shown", 1).on().addValue("Hidden", 0).off()>>
 <</if>>
-</div>
-
-<div class="subHeading">
-<<if $showNumbers == 1>>Only numbers @@.cyan;UP TO $showNumbersMax@@<<else>>Numbers<</if>> are displayed as
-<<if $showNumbers == 1>>
-	words.
-	<<textbox "$showNumbersMax" $showNumbersMax>> //[[Words|Description Options][$showNumbers = 0]]// | //[[Integers|Description Options][$showNumbers = 2]]//
-<<elseif $showNumbers == 2>>
-	@@.yellow;INTEGERS.@@ //[[Words|Description Options][$showNumbers = 0]]// | //[[Both|Description Options][$showNumbers = 1, $showNumbersMax = 20]]//
-<<else>>
-	@@.yellow;WORDS.@@ //[[Integers|Description Options][$showNumbers = 2]]// | //[[Both|Description Options][$showNumbers = 1, $showNumbersMax = 20]]//
+
+
+<<run _options.addOption("Numbers are displayed as", "showNumbers")
+.addValueList([["Integers", 2], ["Both", 1], ["Words", 0]])>>
+
+<<if $showNumbers === 1>>
+	<<run _options.addOption("Only numbers up to $showNumbersMax are displayed as words", "showNumbersMax")
+	.addValue("Default (20)", 20).showTextBox()>>
 <</if>>
-</div>
+
+<<print App.UI.DOM.includeDOM(_options.render())>>