Button: disabled attribute; allowing number entry using HTML5 widgets

2 files changed, 22 insertions, 5 deletions

diff --git a/lib/js/urweb.js b/lib/js/urweb.js
index 222a8322..ebe192ca 100644
--- a/lib/js/urweb.js
+++ b/lib/js/urweb.js
@@ -1127,6 +1127,23 @@ function inpt(type, s, name) {
 
     return x;
 }
+function inpt_float(type, s, name) {
+    if (suspendScripts)
+        return;
+
+    var filterFloat = function(value) {
+	if (/^(\-|\+)?([0-9]+(\.[0-9]+)?|Infinity)$/
+	    .test(value))
+	    return Number(value);
+	return null;
+    }
+    var x = input(document.createElement("input"), s, function(x) { return function(v) { if (x.value != v) x.value = v; }; }, type, name);
+    x.value = s.data;
+    x.onkeyup = x.oninput = x.onchange = x.onpropertychange = function() { sv(s, filterFloat(x.value)) };
+
+    return x;
+}
+
 
 function inp(s, name) {
     return inpt("text", s, name);
@@ -1157,11 +1174,11 @@ function color(s, name) {
 }
 
 function number(s, name) {
-    return inpt("number", s, name);
+    return inpt_float("number", s, name);
 }
 
 function range(s, name) {
-    return inpt("range", s, name);
+    return inpt_float("range", s, name);
 }
 
 function date(s, name) {
diff --git a/lib/ur/basis.urs b/lib/ur/basis.urs
index 23896e27..89a48d59 100644
--- a/lib/ur/basis.urs
+++ b/lib/ur/basis.urs
@@ -1076,8 +1076,8 @@ val curl : ctext
 val ctel : ctext
 val ccolor : ctext
 
-val cnumber : cformTag ([Source = source float, Min = float, Max = float, Step = float, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
-val crange : cformTag ([Source = source float, Min = float, Max = float, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
+val cnumber : cformTag ([Source = source (option float), Min = float, Max = float, Step = float, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
+val crange : cformTag ([Source = source (option float), Min = float, Max = float, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
 val cdate : cformTag ([Source = source string, Min = string, Max = string, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
 val cdatetime : cformTag ([Source = source string, Min = string, Max = string, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
 val cdatetime_local : cformTag ([Source = source string, Min = string, Max = string, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
@@ -1085,7 +1085,7 @@ val cmonth : cformTag ([Source = source string, Min = string, Max = string, Size
 val cweek : cformTag ([Source = source string, Min = string, Max = string, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
 val ctime : cformTag ([Source = source string, Min = string, Max = string, Size = int, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []
 
-val button : cformTag ([Value = string] ++ boxAttrs) []
+val button : cformTag ([Value = string, Disabled = bool] ++ boxAttrs) []
 
 val ccheckbox : cformTag ([Size = int, Source = source bool, Onchange = transaction unit] ++ boxAttrs ++ inputAttrs) []