@ntlab/ntjs-assets 1.1.0 → 1.1.1

package/assets/js/semantic-ui/components/form.css

@@ -1,5 +1,5 @@
 /*!
- * # Fomantic-UI - Form
+ * # Fomantic-UI 2.8.8 - Form
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -372,6 +372,7 @@
 }
 .ui.form ::-moz-placeholder {
   color: rgba(191, 191, 191, 0.87);
+  opacity: 1;
 }
 .ui.form :focus::-webkit-input-placeholder {
   color: rgba(115, 115, 115, 0.87);
@@ -480,11 +481,17 @@
   display: flex;
 }
 .ui.ui.form .fields.error .field label,
+.ui.ui.form .fields.error .field .ui.label:not(.corner),
 .ui.ui.form .field.error label,
+.ui.ui.form .field.error .ui.label:not(.corner),
 .ui.ui.form .fields.error .field .input,
 .ui.ui.form .field.error .input {
   color: #9F3A38;
 }
+.ui.form .fields.error .field .ui.label,
+.ui.form .field.error .ui.label {
+  background-color: #ecd1d1;
+}
 .ui.form .fields.error .field .corner.label,
 .ui.form .field.error .corner.label {
   border-color: #9F3A38;
@@ -599,7 +606,7 @@
 .ui.form .fields.error .field .ui.dropdown,
 .ui.form .fields.error .field .ui.dropdown .item,
 .ui.form .field.error .ui.dropdown,
-.ui.form .field.error .ui.dropdown .text,
+.ui.form .field.error .ui.dropdown > .text,
 .ui.form .field.error .ui.dropdown .item {
   background: #FFF6F6;
   color: #9F3A38;
@@ -663,6 +670,10 @@
 .ui.form .field.error .checkbox .box:after {
   color: #9F3A38;
 }
+.ui.inverted.form .fields.error .field label,
+.ui.inverted.form .error.field label {
+  color: #ecd1d1;
+}
 
 /* On Form */
 .ui.form.info .info.message:not(:empty) {
@@ -693,11 +704,17 @@
   display: flex;
 }
 .ui.ui.form .fields.info .field label,
+.ui.ui.form .fields.info .field .ui.label:not(.corner),
 .ui.ui.form .field.info label,
+.ui.ui.form .field.info .ui.label:not(.corner),
 .ui.ui.form .fields.info .field .input,
 .ui.ui.form .field.info .input {
   color: #276F86;
 }
+.ui.form .fields.info .field .ui.label,
+.ui.form .field.info .ui.label {
+  background-color: #c6e3e9;
+}
 .ui.form .fields.info .field .corner.label,
 .ui.form .field.info .corner.label {
   border-color: #276F86;
@@ -812,7 +829,7 @@
 .ui.form .fields.info .field .ui.dropdown,
 .ui.form .fields.info .field .ui.dropdown .item,
 .ui.form .field.info .ui.dropdown,
-.ui.form .field.info .ui.dropdown .text,
+.ui.form .field.info .ui.dropdown > .text,
 .ui.form .field.info .ui.dropdown .item {
   background: #F8FFFF;
   color: #276F86;
@@ -876,6 +893,10 @@
 .ui.form .field.info .checkbox .box:after {
   color: #276F86;
 }
+.ui.inverted.form .fields.info .field label,
+.ui.inverted.form .info.field label {
+  color: #c6e3e9;
+}
 
 /* On Form */
 .ui.form.success .success.message:not(:empty) {
@@ -906,11 +927,17 @@
   display: flex;
 }
 .ui.ui.form .fields.success .field label,
+.ui.ui.form .fields.success .field .ui.label:not(.corner),
 .ui.ui.form .field.success label,
+.ui.ui.form .field.success .ui.label:not(.corner),
 .ui.ui.form .fields.success .field .input,
 .ui.ui.form .field.success .input {
   color: #2C662D;
 }
+.ui.form .fields.success .field .ui.label,
+.ui.form .field.success .ui.label {
+  background-color: #b9d1ad;
+}
 .ui.form .fields.success .field .corner.label,
 .ui.form .field.success .corner.label {
   border-color: #2C662D;
@@ -1025,7 +1052,7 @@
 .ui.form .fields.success .field .ui.dropdown,
 .ui.form .fields.success .field .ui.dropdown .item,
 .ui.form .field.success .ui.dropdown,
-.ui.form .field.success .ui.dropdown .text,
+.ui.form .field.success .ui.dropdown > .text,
 .ui.form .field.success .ui.dropdown .item {
   background: #FCFFF5;
   color: #2C662D;
@@ -1089,6 +1116,10 @@
 .ui.form .field.success .checkbox .box:after {
   color: #2C662D;
 }
+.ui.inverted.form .fields.success .field label,
+.ui.inverted.form .success.field label {
+  color: #b9d1ad;
+}
 
 /* On Form */
 .ui.form.warning .warning.message:not(:empty) {
@@ -1119,11 +1150,17 @@
   display: flex;
 }
 .ui.ui.form .fields.warning .field label,
+.ui.ui.form .fields.warning .field .ui.label:not(.corner),
 .ui.ui.form .field.warning label,
+.ui.ui.form .field.warning .ui.label:not(.corner),
 .ui.ui.form .fields.warning .field .input,
 .ui.ui.form .field.warning .input {
   color: #573A08;
 }
+.ui.form .fields.warning .field .ui.label,
+.ui.form .field.warning .ui.label {
+  background-color: #d7ccb5;
+}
 .ui.form .fields.warning .field .corner.label,
 .ui.form .field.warning .corner.label {
   border-color: #573A08;
@@ -1238,7 +1275,7 @@
 .ui.form .fields.warning .field .ui.dropdown,
 .ui.form .fields.warning .field .ui.dropdown .item,
 .ui.form .field.warning .ui.dropdown,
-.ui.form .field.warning .ui.dropdown .text,
+.ui.form .field.warning .ui.dropdown > .text,
 .ui.form .field.warning .ui.dropdown .item {
   background: #FFFAF3;
   color: #573A08;
@@ -1302,6 +1339,10 @@
 .ui.form .field.warning .checkbox .box:after {
   color: #573A08;
 }
+.ui.inverted.form .fields.warning .field label,
+.ui.inverted.form .warning.field label {
+  color: #d7ccb5;
+}
 
 /*--------------------
          Disabled

package/assets/js/semantic-ui/components/form.js

@@ -1,5 +1,5 @@
 /*!
- * # Fomantic-UI - Form Validation
+ * # Fomantic-UI 2.8.8 - Form Validation
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -91,6 +91,7 @@ $.fn.form = function(parameters) {
           else {
             if(instance !== undefined) {
               instance.invoke('destroy');
+              module.refresh();
             }
             module.verbose('Initializing form validation', $module, settings);
             module.bindEvents();
@@ -171,11 +172,9 @@ $.fn.form = function(parameters) {
           }
 
           $field.on('change click keyup keydown blur', function(e) {
-            $(this).triggerHandler(e.type + ".dirty");
+            module.determine.isDirty();
           });
 
-          $field.on('change.dirty click.dirty keyup.dirty keydown.dirty blur.dirty', module.determine.isDirty);
-
           $module.on('dirty' + eventNamespace, function(e) {
             settings.onDirty.call();
           });
@@ -302,10 +301,6 @@ $.fn.form = function(parameters) {
               module.set.clean();
             }
 
-            if (e && e.namespace === 'dirty') {
-              e.stopImmediatePropagation();
-              e.preventDefault();
-            }
           }
         },
 
@@ -313,13 +308,6 @@ $.fn.form = function(parameters) {
           bracketedRule: function(rule) {
             return (rule.type && rule.type.match(settings.regExp.bracket));
           },
-          shorthandFields: function(fields) {
-            var
-              fieldKeys = Object.keys(fields),
-              firstRule = fields[fieldKeys[0]]
-            ;
-            return module.is.shorthandRules(firstRule);
-          },
           // duck type rule test
           shorthandRules: function(rules) {
             return (typeof rules == 'string' || Array.isArray(rules));
@@ -422,7 +410,7 @@ $.fn.form = function(parameters) {
               ;
               if( key == keyCode.escape) {
                 module.verbose('Escape key pressed blurring field');
-                $field
+                $field[0]
                   .blur()
                 ;
               }
@@ -444,15 +432,11 @@ $.fn.form = function(parameters) {
                 $fieldGroup     = $field.closest($group),
                 validationRules = module.get.validation($field)
               ;
-              if( $fieldGroup.hasClass(className.error) ) {
+              if(validationRules && (settings.on == 'blur' || ( $fieldGroup.hasClass(className.error) && settings.revalidate) )) {
                 module.debug('Revalidating field', $field, validationRules);
-                if(validationRules) {
-                  module.validate.field( validationRules );
-                }
-              }
-              else if(settings.on == 'blur') {
-                if(validationRules) {
-                  module.validate.field( validationRules );
+                module.validate.field( validationRules );
+                if(!settings.inline) {
+                  module.validate.form(false,true);
                 }
               }
             },
@@ -465,7 +449,7 @@ $.fn.form = function(parameters) {
               if(validationRules && (settings.on == 'change' || ( $fieldGroup.hasClass(className.error) && settings.revalidate) )) {
                 clearTimeout(module.timer);
                 module.timer = setTimeout(function() {
-                  module.debug('Revalidating field', $field,  module.get.validation($field));
+                  module.debug('Revalidating field', $field, validationRules);
                   module.validate.field( validationRules );
                   if(!settings.inline) {
                     module.validate.form(false,true);
@@ -527,15 +511,19 @@ $.fn.form = function(parameters) {
               fullFields = {}
             ;
             $.each(fields, function(name, rules) {
-              if(typeof rules == 'string') {
-                rules = [rules];
+              if (!Array.isArray(rules) && typeof rules === 'object') {
+                fullFields[name] = rules;
+              } else {
+                if (typeof rules == 'string') {
+                  rules = [rules];
+                }
+                fullFields[name] = {
+                  rules: []
+                };
+                $.each(rules, function (index, rule) {
+                  fullFields[name].rules.push({type: rule});
+                });
               }
-              fullFields[name] = {
-                rules: []
-              };
-              $.each(rules, function(index, rule) {
-                fullFields[name].rules.push({ type: rule });
-              });
             });
             return fullFields;
           },
@@ -551,8 +539,23 @@ $.fn.form = function(parameters) {
               requiresValue = (prompt.search('{value}') !== -1),
               requiresName  = (prompt.search('{name}') !== -1),
               $label,
-              name
+              name,
+              parts,
+              suffixPrompt
             ;
+            if(ancillary && ancillary.indexOf('..') >= 0) {
+              parts = ancillary.split('..', 2);
+              if(!rule.prompt) {
+                suffixPrompt = (
+                    parts[0] === '' ? settings.prompt.maxValue.replace(/\{ruleValue\}/g,'{max}') :
+                    parts[1] === '' ? settings.prompt.minValue.replace(/\{ruleValue\}/g,'{min}') :
+                    settings.prompt.range
+                );
+                prompt += suffixPrompt.replace(/\{name\}/g, ' ' + settings.text.and);
+              }
+              prompt = prompt.replace(/\{min\}/g, parts[0]);
+              prompt = prompt.replace(/\{max\}/g, parts[1]);
+            }
             if(requiresValue) {
               prompt = prompt.replace(/\{value\}/g, $field.val());
             }
@@ -588,7 +591,7 @@ $.fn.form = function(parameters) {
               }
               else {
                 // 2.x
-                if(parameters.fields && module.is.shorthandFields(parameters.fields)) {
+                if(parameters.fields) {
                   parameters.fields = module.get.fieldsFromShorthand(parameters.fields);
                 }
                 settings   = $.extend(true, {}, $.fn.form.settings, parameters);
@@ -616,7 +619,7 @@ $.fn.form = function(parameters) {
             instance = $module.data(moduleNamespace);
 
             // refresh selector cache
-            module.refresh();
+            (instance || module).refresh();
           },
           field: function(identifier) {
             module.verbose('Finding field with identifier', identifier);
@@ -862,16 +865,7 @@ $.fn.form = function(parameters) {
             module.debug('Adding rules', newValidation.rules, validation);
           },
           fields: function(fields) {
-            var
-              newValidation
-            ;
-            if(fields && module.is.shorthandFields(fields)) {
-              newValidation = module.get.fieldsFromShorthand(fields);
-            }
-            else {
-              newValidation = fields;
-            }
-            validation = $.extend({}, validation, newValidation);
+            validation = $.extend({}, validation, module.get.fieldsFromShorthand(fields));
           },
           prompt: function(identifier, errors, internal) {
             var
@@ -1165,6 +1159,14 @@ $.fn.form = function(parameters) {
                 }
               }
             });
+          },
+          optional: function(identifier, bool) {
+            bool = (bool !== false);
+            $.each(validation, function(fieldName, field) {
+              if (identifier == fieldName || identifier == field.identifier) {
+                field.optional = bool;
+              }
+            });
           }
         },
 
@@ -1201,6 +1203,24 @@ $.fn.form = function(parameters) {
               if(event && $module.data('moduleApi') !== undefined) {
                 event.stopImmediatePropagation();
               }
+              if(settings.errorFocus) {
+                var focusElement, hasTabIndex = true;
+                if (typeof settings.errorFocus === 'string') {
+                  focusElement = $(settings.errorFocus);
+                  hasTabIndex = focusElement.is('[tabindex]');
+                  // to be able to focus/scroll into non input elements we need a tabindex
+                  if (!hasTabIndex) {
+                    focusElement.attr('tabindex',-1);
+                  }
+                } else {
+                  focusElement = $group.filter('.' + className.error).first().find(selector.field);
+                }
+                focusElement.focus();
+                // only remove tabindex if it was dynamically created above
+                if (!hasTabIndex){
+                  focusElement.removeAttr('tabindex');
+                }
+              }
               if(ignoreCallbacks !== true) {
                 return settings.onFailure.call(element, formErrors, values);
               }
@@ -1290,7 +1310,7 @@ $.fn.form = function(parameters) {
                 // cast to string avoiding encoding special values
                 value = (value === undefined || value === '' || value === null)
                     ? ''
-                    : (settings.shouldTrim) ? String(value + '').trim() : String(value + '')
+                    : (settings.shouldTrim && rule.shouldTrim !== false) || rule.shouldTrim ? String(value + '').trim() : String(value + '')
                 ;
                 return ruleFunction.call(field, value, ancillary, $module);
               }
@@ -1506,6 +1526,7 @@ $.fn.form.settings = {
 
   autoCheckRequired : false,
   preventLeaving    : false,
+  errorFocus        : false,
   dateHandling      : 'date', // 'date', 'input', 'formatter'
 
   onValid           : function() {},
@@ -1534,12 +1555,16 @@ $.fn.form.settings = {
   },
 
   text: {
+    and              : 'and',
     unspecifiedRule  : 'Please enter a valid value',
     unspecifiedField : 'This field',
     leavingMessage   : 'There are unsaved changes on this page which will be discarded if you continue.'
   },
 
   prompt: {
+    range                : '{name} must be in a range from {min} to {max}',
+    maxValue             : '{name} must have a maximum value of {ruleValue}',
+    minValue             : '{name} must have a minimum value of {ruleValue}',
     empty                : '{name} must have a value',
     checked              : '{name} must be checked',
     email                : '{name} must be a valid e-mail',
@@ -1571,9 +1596,9 @@ $.fn.form.settings = {
   selector : {
     checkbox   : 'input[type="checkbox"], input[type="radio"]',
     clear      : '.clear',
-    field      : 'input:not(.search), textarea, select',
+    field      : 'input:not(.search):not([type="file"]), textarea, select',
     group      : '.field',
-    input      : 'input',
+    input      : 'input:not([type="file"])',
     message    : '.error.message',
     prompt     : '.prompt.label',
     radio      : 'input[type="radio"]',
@@ -1702,11 +1727,24 @@ $.fn.form.settings = {
       }
       return value.match( new RegExp(regExp, flags) );
     },
-
+    minValue: function(value, range) {
+      return $.fn.form.settings.rules.range(value, range+'..', 'number');
+    },
+    maxValue: function(value, range) {
+      return $.fn.form.settings.rules.range(value, '..'+range, 'number');
+    },
     // is valid integer or matches range
     integer: function(value, range) {
+      return $.fn.form.settings.rules.range(value, range, 'integer');
+    },
+    range: function(value, range, regExp) {
+      if(typeof regExp == "string") {
+        regExp = $.fn.form.settings.regExp[regExp];
+      }
+      if(!(regExp instanceof RegExp)) {
+        regExp = $.fn.form.settings.regExp.integer;
+      }
       var
-        intRegExp = $.fn.form.settings.regExp.integer,
         min,
         max,
         parts
@@ -1715,34 +1753,34 @@ $.fn.form.settings = {
         // do nothing
       }
       else if(range.indexOf('..') == -1) {
-        if(intRegExp.test(range)) {
+        if(regExp.test(range)) {
           min = max = range - 0;
         }
       }
       else {
         parts = range.split('..', 2);
-        if(intRegExp.test(parts[0])) {
+        if(regExp.test(parts[0])) {
           min = parts[0] - 0;
         }
-        if(intRegExp.test(parts[1])) {
+        if(regExp.test(parts[1])) {
           max = parts[1] - 0;
         }
       }
       return (
-        intRegExp.test(value) &&
+        regExp.test(value) &&
         (min === undefined || value >= min) &&
         (max === undefined || value <= max)
       );
     },
 
     // is valid number (with decimal)
-    decimal: function(value) {
-      return $.fn.form.settings.regExp.decimal.test(value);
+    decimal: function(value, range) {
+      return $.fn.form.settings.rules.range(value, range, 'decimal');
     },
 
     // is valid number
-    number: function(value) {
-      return $.fn.form.settings.regExp.number.test(value);
+    number: function(value, range) {
+      return $.fn.form.settings.rules.range(value, range, 'number');
     },
 
     // is value (case insensitive)
@@ -1947,8 +1985,8 @@ $.fn.form.settings = {
         return;
       }
 
-      // allow dashes in card
-      cardNumber = cardNumber.replace(/[\-]/g, '');
+      // allow dashes and spaces in card
+      cardNumber = cardNumber.replace(/[\s\-]/g, '');
 
       // verify card types
       if(requiredTypes) {