Add range widget explanation

appsocially · Aug 7, 2020 · cdc7597 · cdc7597
1 parent 7b726cd
commit cdc7597
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 1 deletion.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,4 +1,5 @@
 {
     "editor.formatOnSave": true,
-    "editor.formatOnPaste": true
+    "editor.formatOnPaste": true,
+    "editor.tabSize": 2
 }
diff --git a/docs/widgets/README.md b/docs/widgets/README.md
@@ -80,4 +80,50 @@ DIALOG birthday
 /DIALOG
 RUN birthday
 ```
+</WizardMode>
+
+## Range
+
+::: warning
+The `range` widget is currently only available in form-mode based scripts
+:::
+
+The `range` widget lets users choose a number between `min` and `max` values that the scriptwriter chooses. The scriptwriter can also choose an optional `unit` label.
+<br/>
+<br/>
+
+<FormMode>
+```
+DIALOG range
+  TEMPLATE range
+    {
+      formText: "Minutes",
+      min: 10,
+      max: 20,
+      unit: "分"
+    }
+  "How long did it take?"
+  >>minutes
+  /TEMPLATE
+/DIALOG
+RUN range
+```
+</FormMode>
+
+<WizardMode hideScript>
+```
+DIALOG range
+  TEMPLATE range
+    {
+      formText: "Minutes",
+      min: 10,
+      max: 20,
+      unit: "分"
+    }
+  "How long did it take?"
+  >>minutes
+  /TEMPLATE
+/DIALOG
+RUN range
+```
 </WizardMode>