summaryrefslogtreecommitdiffstats
path: root/afb-client/app/Frontend/widgets/FormInput/InputText.js
blob: 2653175a6e326008caf43d73ef3c1b18a99a751a (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

@media only all and (prefers-color-scheme: dark) {
.highlight .hll { background-color: #49483e }
.highlight .c { color: #75715e } /* Comment */
.highlight .err { color: #960050; background-color: #1e0010 } /* Error */
.highlight .k { color: #66d9ef } /* Keyword */
.highlight .l { color: #ae81ff } /* Literal */
.highlight .n { color: #f8f8f2 } /* Name */
.highlight .o { color: #f92672 } /* Operator */
.highlight .p { color: #f8f8f2 } /* Punctuation */
.highlight .ch { color: #75715e } /* Comment.Hashbang */
.highlight .cm { color: #75715e } /* Comment.Multiline */
.highlight .cp { color: #75715e } /* Comment.Preproc */
.highlight .cpf { color: #75715e } /* Comment.PreprocFile */
.highlight .c1 { color: #75715e } /* Comment.Single */
.highlight .cs { color: #75715e } /* Comment.Special */
.highlight .gd { color: #f92672 } /* Generic.Deleted */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .gi { color: #a6e22e } /* Generic.Inserted */
.highlight .gs { font-weight: bold } /* Generic.Strong */
.highlight .gu { color: #75715e } /* Generic.Subheading */
.highlight .kc { color: #66d9ef } /* Keyword.Constant */
.highlight .kd { color: #66d9ef } /* Keyword.Declaration */
.highlight .kn { color: #f92672 } /* Keyword.Namespace */
.highlight .kp { color: #66d9ef } /* Keyword.Pseudo */
.highlight .kr { color: #66d9ef } /* Keyword.Reserved */
.highlight .kt { color: #66d9ef } /* Keyword.Type */
.highlight .ld { color: #e6db74 } /* Literal.Date */
.highlight .m { color: #ae81ff } /* Literal.Number */
.highlight .s { color: #e6db74 } /* Literal.String */
.highlight .na { color: #a6e22e } /* Name.Attribute */
.highlight .nb { color: #f8f8f2 } /* Name.Builtin */
.highlight .nc { color: #a6e22e } /* Name.Class */
.highlight .no { color: #66d9ef } /* Name.Constant */
.highlight .nd { color: #a6e22e } /* Name.Decorator */
.highlight .ni { color: #f8f8f2 } /* Name.Entity */
.highlight .ne { color: #a6e22e } /* Name.Exception */
.highlight .nf { color: #a6e22e } /* Name.Function */
.highlight .nl { color: #f8f8f2 } /* Name.Label */
.highlight .nn { color: #f8f8f2 } /* Name.Namespace */
.highlight .nx { color: #a6e22e } /* Name.Other */
.highlight .py { color: #f8f8f2 } /* Name.Property */
.highlight .nt { color: #f92672 } /* Name.Tag */
.highlight .nv { color: #f8f8f2 } /* Name.Variable */
.highlight .ow { color: #f92672 } /* Operator.Word */
.highlight .w { color: #f8f8f2 } /* Text.Whitespace */
.highlight .mb { color: #ae81ff } /* Literal.Number.Bin */
.highlight .mf { color: #ae81ff } /* Literal.Number.Float */
.highlight .mh { color: #ae81ff } /* Literal.Number.Hex */
.highlight .mi { color: #ae81ff } /* Literal.Number.Integer */
.highlight .mo { color: #ae81ff } /* Literal.Number.Oct */
.highlight .sa { color: #e6db74 } /* Literal.String.Affix */
.highlight .sb { color: #e6db74 } /* Literal.String.Backtick */
.highlight .sc { color: #e6db74 } /* Literal.String.Char */
.highlight .dl { color: #e6db74 } /* Literal.String.Delimiter */
.highlight .sd { color: #e6db74 } /* Literal.String.Doc */
.highlight .s2 { color: #e6db74 } /* Literal.String.Double */
.highlight .se { color: #ae81ff } /* Literal.String.Escape */
.highlight .sh { color: #e6db74 } /* Literal.String.Heredoc */
.highlight .si { color: #e6db74 } /* Literal.String.Interpol */
.highlight .sx { color: #e6db74 } /* Literal.String.Other */
.highlight .sr { color: #e6db74 } /* Literal.String.Regex */
.highlight .s1 { color: #e6db74 } /* Literal.String.Single */
.highlight .ss { color: #e6db74 } /* Literal.String.Symbol */
.highlight .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
.highlight .fm { color: #a6e22e } /* Name.Function.Magic */
.highlight .vc { color: #f8f8f2 } /* Name.Variable.Class */
.highlight .vg { color: #f8f8f2 } /* Name.Variable.Global */
.highlight .vi { color: #f8f8f2 } /* Name.Variable.Instance */
.highlight .vm { color: #f8f8f2 } /* Name.Variable.Magic */
.highlight .il { color: #ae81ff } /* Literal.Number.Integer.Long */
}
@media (prefers-color-scheme: light) {
.highlight .hll { background-color: #ffffcc }
.highlight .c { color: #888888 } /* Comment */
.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
.highlight .k { color: #008800; font-weight: bold } /* Keyword */
.highlight .ch { color: #888888 } /* Comment.Hashbang */
.highlight .cm { color: #888888 } /* Comment.Multiline */
.highlight .cp { color: #cc0000; font-weight: bold } /* Comment.Preproc */
.highlight .cpf { color: #888888 } /* Comment.PreprocFile */
.highlight .c1 { color: #888888 } /* Comment.Single */
.highlight .cs { color: #cc0000; font-weight: bold; background-color: #fff0f0 } /* Comment.Special */
.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
.highlight .ge { font-style: italic } /* Generic.Emph */
.highlight .gr { color: #aa0000 } /* Generic.Error */
.highlight .gh { color: #333333 } /* Generic.Heading */
.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
.highlight .go { color: #888888 } /* Generic.Output */
.highlight .g
/* 
 * Copyright (C) 2015 "IoT.bzh"
 * Author "Fulup Ar Foll"
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details..
 */



(function() {
'use strict';

var tmpl = '<tip-modal tip="tip"></tip-modal>' +
           '<label for="{{name}}-intext">{{label}} <i ng-show="required" ng-click="ToBeDefined" ' +
           'class="required {{status}} fi-checkbox" title="Free Value But Mandatory Argument" alt="?"> &nbsp; </i></label>'+          
           '<input '+
           ' type="{{type}}" id="{{name}}-intext" placeholder="{{placeholder}}"  class="status-{{status}}"'+
           ' ng-model="value" ng-blur="validate()" ng-focus="selected()" '+
           ' ng-model-options="{ updateOn: \'default blur\', debounce: {default: 500, blur: 0} }"' +
           '><alert data-ng-show="!valid&&errmsg">{{errmsg}}</alert>';

var emailpatern = /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;

angular.module('InputText',['JQueryEmu'])

.directive('inputText', function(JQemu) {
    function mymethods(scope, elem, attrs) {
    
    // default value at 1st rendering
    scope.error  = false;
    scope.valid  = false;
    scope.status = 'untouch';
   
    scope.input = elem.find ("input");
    scope.required = 0;
    
    // requirer is use to increment requested counter
    if ("required" in attrs) {
        scope.required = 1;
        elem.addClass ("required");
    }
       
     // user enter input reset error status
     scope.selected = function () {
        scope.error=false; 
        scope.errmsg=false; 
        scope.status = 'touch';
     };   
            
     scope.validate = function () {
         
         // get value from input field bypassing Angular ng-model
         console.log ("Clicked InputText name=%s value=%s valid=%s", scope.name, scope.value, scope.valid);        

         // form is not untouched anymore
         scope.parent.removeClass ("ng-pristine");

         // if value not null clean up string
         if (scope.value) {
             scope.error=false; 
            // remove leading and trailling space
            scope.value = scope.value.trim();
         
            // remove any space is not allowed
            if ('nospace' in attrs) {
               scope.value=scope.value.replace(/\s/g, '');    
            }
         
            if ('lowercase' in attrs) {
               scope.value = scope.value.toLowerCase();
            }
         
            // check minimum lenght
            if ("minlen" in attrs) {
              if (scope.value.length < attrs.minlen) {
                 scope.status='invalid';
                 scope.errmsg=scope.name + ': Mininum Lengh= ' + attrs.minlen + ' Characters';
                 scope.error=true;
              }
            }
            
            if ('email' in attrs) {
            if (!emailpatern.test (scope.value)) {
                scope.status='invalid';
                scope.errmsg='invalid email address';
                scope.error=true;
            }
         }
         
        } else {
            if (scope.required) {
                 scope.status='invalid';
                 scope.errmsg=scope.name + ': Required Attribute';
                 scope.error=true; 
            }
        }
                           
         // If local control fail let's refuse input
         if (scope.error) {
             if (scope.required && scope.valid) {
                 scope.valid = false;
                 if (scope.l4acounter.validated > 0) scope.l4acounter.validated --;
             } 
             // use call to update form scope on form completeness
             scope.callback (attrs.name, null, scope.done);
         } else { 
             // localcheck is OK backup may nevertheless change status to false
            if (scope.required  && !scope.valid) scope.l4acounter.validated ++;
            scope.status='valid';
            scope.valid=true;
            scope.callback (attrs.name, scope.value, scope.done);
         }
          
     };
     
     // this method can be called from controller to update widget status
     scope.done=function (data) {
       console.log ("Text-Input Callback ID="+ attrs.name + " data=", data);
       for (var i in data) scope[i] = data[i];         
     };
     
     // Export some attributes within directive scope for template
     scope.label       = attrs.label;
     scope.name        = attrs.name;
     scope.placeholder = attrs.placeholder;
     scope.type        = attrs.type || "text";
     scope.tip         = attrs.tip;

     // search for form within parent elemnts
     scope.parent = JQemu.parent (elem, "FORM");

     // email enforce lowercase and nospace   
     if ("email" in attrs) {
        attrs.lowercase=true; 
        attrs.nospace=true; 
        attrs.minlen=6; 
     }

     if (scope.required) {
         scope.l4acounter = scope.parent.data ("l4acounter");
         if (!scope.l4acounter) { 
            scope.l4acounter =  {required:1, validated:0};
            console.log("Field "+scope.name+" is required (1st)");
            scope.parent.data ("l4acounter", scope.l4acounter); 
         } else {
             console.log("Field "+scope.name+" is required");
             scope.l4acounter.required ++;
         }
     }
         
     // refresh validation each time controler update value
     scope.$watch ('value', function(){
         if(scope.value) scope.validate(); }
     );
    
    }
    
    return {
        restrict: 'E',
        template: tmpl,
        link: mymethods,
        scope: {
            callback : '=',
            value: '='
        }
    };
});

console.log ("InputText Loaded");
})();