Allow Max control to add maxlength to text input. Update docs.

README.md

@@ -267,6 +267,17 @@ The textinput works very similar like the number input but with a string. You
 can enter a String into it and when you are done with your change it is sent to
 the ESP.
 
+If you attach a Max control to the text input then a max length will be applied
+to the control. 
+
+```
+ text = ESPUI.text("Label", callback, ControlColor::Dark, "Initial value");
+ ESPUI.addControl(ControlType::Max, "", "32", ControlColor::None, text);
+```
+
+However even with a set maximum length, user input should still be validated 
+because it is easy to bypass client-side checks.
+
 #### Graph
 
 ![graph](https://github.com/s00500/ESPUI/blob/master/docs/ui_graph.png)

data/js/controls.js

@@ -441,7 +441,13 @@ function start() {
         if (data.parentControl) {
           var parent = $("#id" + data.parentControl + " input");
           if (parent.size()) {
-            parent.attr("max", data.value);
+            if(!parent.attr("type")) {
+              //type is not set so therefore it is a text input
+              parent.attr("maxlength", data.value);
+            } else {
+              //type might be range (slider) or number
+              parent.attr("max", data.value);
+            }
           }
         }
         break;

data/js/controls.min.js

@@ -26,7 +26,7 @@ data.selected+
 data.label+
 "</option>");}
 break;case UI_MIN:if(data.parentControl){var parent=$("#id"+data.parentControl+" input");if(parent.size()){parent.attr("min",data.value);}}
-break;case UI_MAX:if(data.parentControl){var parent=$("#id"+data.parentControl+" input");if(parent.size()){parent.attr("max",data.value);}}
+break;case UI_MAX:if(data.parentControl){var parent=$("#id"+data.parentControl+" input");if(parent.size()){if(!parent.attr("type")){parent.attr("maxlength",data.value);}else{parent.attr("max",data.value);}}}
 break;case UI_STEP:if(data.parentControl){var parent=$("#id"+data.parentControl+" input");if(parent.size()){parent.attr("step",data.value);}}
 break;case UI_GRAPH:if(data.visible){addToHTML(data);graphData[data.id]=restoreGraphData(data.id);renderGraphSvg(graphData[data.id],"graph"+data.id);}
 break;case ADD_GRAPH_POINT:var ts=Math.round(new Date().getTime()/1000);graphData[data.id].push({x:ts,y:data.value});saveGraphData();renderGraphSvg(graphData[data.id],"graph"+data.id);break;case CLEAR_GRAPH:graphData[data.id]=[];saveGraphData();renderGraphSvg(graphData[data.id],"graph"+data.id);break;case UI_ACCEL:if(hasAccel)break;hasAccel=true;if(data.visible){addToHTML(data);requestOrientationPermission();}