Added text and password widget HTML5 attributes required by plone.login.

AUTHOR.txt

@@ -22,3 +22,4 @@ Michael Howitz
 Michael Kerrin
 Paul Carduner
 Dylan Jay
+Chris Calloway

CHANGES.txt

@@ -5,8 +5,7 @@ CHANGES
 3.1.2 (unreleased)
 ------------------
 
-- Nothing changed yet.
-
+- Added text and password widget HTML5 attributes required by plone.login.
 
 3.1.1 (2014-03-02)
 ------------------

src/z3c/form/browser/interfaces.py

@@ -251,6 +251,20 @@ class IHTMLTextInputWidget(IHTMLFormElement):
                      u'characters the user may enter.'),
         required=False)
 
+    placeholder = zope.schema.TextLine(
+        title=u'Placeholder Text',
+        description=(u'This attribute represents a short hint '
+                     u'(a word or short phrase) intended to aid the user '
+                     u'with data entry when the control has no value.'),
+        required=False)
+
+    autocapitalize = zope.schema.Choice(
+        title=u'Auto-Capitalization Control',
+        description=(u'This attribute controls whether the browser should '
+                     u'automatically capitalize the input value.'),
+        values=('off', 'on'),
+        required=False)
+
 
 class IHTMLTextAreaWidget(IHTMLFormElement):
     """A widget using the HTML TEXTAREA element."""

src/z3c/form/browser/password.txt

@@ -55,6 +55,17 @@ reasons:
   <input type="password" id="widget.id" name="widget.name"
          class="password-widget" />
 
+Adding some more attributes to the widget will make it display more:
+
+  >>> widget.style = u'color: blue'
+  >>> widget.placeholder = u'Confirm password'
+  >>> widget.autocapitalize = u'off'
+
+  >>> print(widget.render())
+  <input type="password" id="widget.id" name="widget.name"
+         placeholder="Confirm password" autocapitalize="off"
+         style="color: blue" class="password-widget" />
+
 Let's now make sure that we can extract user entered data from a widget:
 
   >>> widget.request = TestRequest(form={'widget.name': 'password'})

src/z3c/form/browser/password_input.pt

@@ -30,5 +30,7 @@
                        accesskey view/accesskey;
                        onselect view/onselect;
                        size view/size;
-                       maxlength view/maxlength" />
+                       maxlength view/maxlength;
+                       placeholder view/placeholder;
+                       autocapitalize view/autocapitalize;" />
 </html>

src/z3c/form/browser/text.txt

@@ -50,9 +50,12 @@ Adding some more attributes to the widget will make it display more:
   >>> widget.name = 'name'
   >>> widget.value = u'value'
   >>> widget.style = u'color: blue'
+  >>> widget.placeholder = u'Email address'
+  >>> widget.autocapitalize = u'off'
 
   >>> print(widget.render())
   <input type="text" id="id" name="name" class="text-widget"
+         placeholder="Email address" autocapitalize="off"
          style="color: blue" value="value" />
 
 

src/z3c/form/browser/text_input.pt

@@ -31,5 +31,7 @@
                            accesskey view/accesskey;
                            onselect view/onselect;
                            size view/size;
-                           maxlength view/maxlength" />
+                           maxlength view/maxlength;
+                           placeholder view/placeholder;
+                           autocapitalize view/autocapitalize;" />
 </html>

src/z3c/form/browser/widget.py

@@ -187,6 +187,8 @@ class HTMLTextInputWidget(HTMLInputWidget):
 
     size = FieldProperty(interfaces.IHTMLTextInputWidget['size'])
     maxlength = FieldProperty(interfaces.IHTMLTextInputWidget['maxlength'])
+    placeholder = FieldProperty(interfaces.IHTMLTextInputWidget['placeholder'])
+    autocapitalize = FieldProperty(interfaces.IHTMLTextInputWidget['autocapitalize'])
 
 
 @zope.interface.implementer(interfaces.IHTMLTextAreaWidget)