includes/clientside/static/autofill.js
changeset 582 a38876c0793c
parent 581 5e8fd89c02ea
child 645 24f2fa13a2a0
equal deleted inserted replaced
581:5e8fd89c02ea 582:a38876c0793c
     6 // fill schemas
     6 // fill schemas
     7 var autofill_schemas = {};
     7 var autofill_schemas = {};
     8 
     8 
     9 // default, generic schema
     9 // default, generic schema
    10 autofill_schemas.generic = {
    10 autofill_schemas.generic = {
    11   template: '<div id="--ID--_region" spry:region="autofill_region_--ID--" class="tblholder">' + "\n" +
    11   template: '<div id="--ID--_region" spry:region="autofill_ds_--CLASS--" class="tblholder">' + "\n" +
    12             '  <table border="0" cellspacing="1" cellpadding="3" style="font-size: smaller;">' + "\n" +
    12             '  <table border="0" cellspacing="1" cellpadding="3" style="font-size: smaller;">' + "\n" +
    13             '    <tr spry:repeat="autofill_region_--ID--">' + "\n" +
    13             '    <tr spry:repeat="autofill_region_--ID--">' + "\n" +
    14             '      <td class="row1" spry:suggest="{name}">{name}</td>' + "\n" +
    14             '      <td class="row1" spry:suggest="{name}">{name}</td>' + "\n" +
    15             '    </tr>' + "\n" +
    15             '    </tr>' + "\n" +
    16             '  </table>' + "\n" +
    16             '  </table>' + "\n" +
    17             '</div>',
    17             '</div>',
    18   
    18   
    19   init: function(element, fillclass)
    19   init: function(element, fillclass)
    20   {
    20   {
       
    21     // calculate positions before spry f***s everything up
       
    22     var top = $dynano(element).Top() + $dynano(element).Height() - 10; // tblholder has 10px top margin
       
    23     var left = $dynano(element).Left();
       
    24     
       
    25     // dataset name
       
    26     var ds_name = 'autofill_ds_' + fillclass;
       
    27     
       
    28     var allow_anon = ( params.allow_anon ) ? '1' : '0';
    21     // setup the dataset
    29     // setup the dataset
    22     window["autofill_region_" + element.id] = new Spry.Data.JSONDataSet(makeUrlNS('Special', 'Autofill', 'type=' + fillclass));
    30     window[ds_name] = new Spry.Data.JSONDataSet(makeUrlNS('Special', 'Autofill', 'type=' + fillclass + '&allow_anon' + allow_anon));
    23     
    31     
    24     // inject our HTML wrapper
    32     // inject our HTML wrapper
    25     var template = this.template.replace(new RegExp('--ID--', 'g'), element.id);
    33     var template = this.template.replace(new RegExp('--ID--', 'g'), element.id).replace(new RegExp('--CLASS--', 'g', fillclass));
    26     var wrapper = element.parentNode; // document.createElement('div');
    34     var wrapper = element.parentNode; // document.createElement('div');
    27     wrapper.id = 'autofill_wrap_' + element.id;
    35     wrapper.id = 'autofill_wrap_' + element.id;
    28     
    36     
    29     // a bunch of hacks to add a spry wrapper
    37     // a bunch of hacks to add a spry wrapper
    30     // var el2 = element.cloneNode(false);
    38     wrapper.innerHTML = template + wrapper.innerHTML;
    31     // wrapper.appendChild(el2);
       
    32     wrapper.innerHTML += template;
       
    33     // insertAfter(element.parentNode, wrapper, element);
       
    34     // element.parentNode.removeChild(element);
       
    35     // element = el2;
       
    36     
    39     
    37     var autosuggest = new Spry.Widget.AutoSuggest("autofill_wrap_" + element.id, element.id + '_region', window["autofill_region_" + element.id], 'name', {loadFromServer: true, urlParam: 'userinput', hoverSuggestClass: 'row2', minCharsType: 3});
    40     var autosuggest = new Spry.Widget.AutoSuggest("autofill_wrap_" + element.id, element.id + '_region', window[ds_name], 'name', {loadFromServer: true, urlParam: 'userinput', hoverSuggestClass: 'row2', minCharsType: 3});
       
    41     var regiondiv = document.getElementById(element.id + '_region');
       
    42     regiondiv.style.position = 'absolute';
       
    43     regiondiv.style.top = top + 'px';
       
    44     regiondiv.style.left = left + 'px';
    38   }
    45   }
    39 };
    46 };
    40 
    47 
    41 function autofill_init_element(element, params)
    48 function autofill_init_element(element, params)
    42 {
    49 {
    43   if ( element.parentNode.id.match(/^autofill_wrap_/) )
    50   if ( element.parentNode.id.match(/^autofill_wrap_/) )
    44     return false;
    51     return false;
       
    52   
       
    53   if ( !Spry.Data );
       
    54     load_spry_data();
    45   
    55   
    46   params = params || {};
    56   params = params || {};
    47   // assign an ID if it doesn't have one yet
    57   // assign an ID if it doesn't have one yet
    48   if ( !element.id )
    58   if ( !element.id )
    49   {
    59   {
    66   element.af_initted = true;
    76   element.af_initted = true;
    67 }
    77 }
    68 
    78 
    69 var autofill_onload = function()
    79 var autofill_onload = function()
    70 {
    80 {
       
    81   if ( this.loaded )
       
    82   {
       
    83     return true;
       
    84   }
       
    85   
    71   autofill_schemas.username = {
    86   autofill_schemas.username = {
    72     template: '<div id="--ID--_region" spry:region="autofill_region_--ID--" class="tblholder">' + "\n" +
    87     template: '<div id="--ID--_region" spry:region="autofill_ds_username" class="tblholder">' + "\n" +
    73               '  <table border="0" cellspacing="1" cellpadding="3" style="font-size: smaller;">' + "\n" +
    88               '  <table border="0" cellspacing="1" cellpadding="3" style="font-size: smaller;">' + "\n" +
    74               '    <tr>' + "\n" +
    89               '    <tr>' + "\n" +
    75               '      <th>' + $lang.get('user_autofill_heading_suggestions') + '</th>' + "\n" +
    90               '      <th>' + $lang.get('user_autofill_heading_suggestions') + '</th>' + "\n" +
    76               '    </tr>' + "\n" +
    91               '    </tr>' + "\n" +
    77               '    <tr spry:repeat="autofill_region_--ID--">' + "\n" +
    92               '    <tr spry:repeat="autofill_region_--ID--">' + "\n" +
    86       var top = $dynano(element).Top() + $dynano(element).Height() - 10; // tblholder has 10px top margin
   101       var top = $dynano(element).Top() + $dynano(element).Height() - 10; // tblholder has 10px top margin
    87       var left = $dynano(element).Left();
   102       var left = $dynano(element).Left();
    88       
   103       
    89       var allow_anon = ( params.allow_anon ) ? '1' : '0';
   104       var allow_anon = ( params.allow_anon ) ? '1' : '0';
    90       // setup the dataset
   105       // setup the dataset
    91       window["autofill_region_" + element.id] = new Spry.Data.JSONDataSet(makeUrlNS('Special', 'Autofill', 'type=' + fillclass + '&allow_anon' + allow_anon));
   106       if ( !window.autofill_ds_username )
    92       Spry.Data.initRegions(document.body);
   107       {
    93       (window["autofill_region_" + element.id]).loadData();
   108         window.autofill_ds_username = new Spry.Data.JSONDataSet(makeUrlNS('Special', 'Autofill', 'type=' + fillclass + '&allow_anon' + allow_anon));
       
   109       }
    94       
   110       
    95       // inject our HTML wrapper
   111       // inject our HTML wrapper
    96       var template = this.template.replace(new RegExp('--ID--', 'g'), element.id);
   112       var template = this.template.replace(new RegExp('--ID--', 'g'), element.id);
    97       var wrapper = element.parentNode; // document.createElement('div');
   113       var wrapper = element.parentNode; // document.createElement('div');
    98       wrapper.id = 'autofill_wrap_' + element.id;
   114       wrapper.id = 'autofill_wrap_' + element.id;
    99       
   115       
   100       // a bunch of hacks to add a spry wrapper
   116       // a bunch of hacks to add a spry wrapper
   101       wrapper.innerHTML = template + wrapper.innerHTML;
   117       wrapper.innerHTML = template + wrapper.innerHTML;
   102       
   118       
   103       var autosuggest = new Spry.Widget.AutoSuggest("autofill_wrap_" + element.id, element.id + '_region', window["autofill_region_" + element.id], 'name', {loadFromServer: true, urlParam: 'userinput', hoverSuggestClass: 'row2', minCharsType: 3});
   119       var autosuggest = new Spry.Widget.AutoSuggest("autofill_wrap_" + element.id, element.id + '_region', window.autofill_ds_username, 'name', {loadFromServer: true, urlParam: 'userinput', hoverSuggestClass: 'row2', minCharsType: 3});
   104       var regiondiv = document.getElementById(element.id + '_region');
   120       var regiondiv = document.getElementById(element.id + '_region');
   105       regiondiv.style.position = 'absolute';
   121       regiondiv.style.position = 'absolute';
   106       regiondiv.style.top = top + 'px';
   122       regiondiv.style.top = top + 'px';
   107       regiondiv.style.left = left + 'px';
   123       regiondiv.style.left = left + 'px';
   108     }
   124     }
   121               '</div>'
   137               '</div>'
   122   }
   138   }
   123   
   139   
   124   var inputs = document.getElementsByClassName('input', 'autofill');
   140   var inputs = document.getElementsByClassName('input', 'autofill');
   125   
   141   
       
   142   if ( inputs.length > 0 )
       
   143   {
       
   144     // we have at least one input that needs to be made an autofill element.
       
   145     // is spry data loaded?
       
   146     if ( !Spry.Data )
       
   147     {
       
   148       load_spry_data();
       
   149       return true;
       
   150     }
       
   151   }
       
   152   
       
   153   this.loaded = true;
       
   154   
   126   for ( var i = 0; i < inputs.length; i++ )
   155   for ( var i = 0; i < inputs.length; i++ )
   127   {
   156   {
   128     autofill_init_element(inputs[i]);
   157     autofill_init_element(inputs[i]);
   129   }
   158   }
   130 }
   159 }
   131 
   160 
   132 addOnloadHook(autofill_onload);
   161 addOnloadHook(autofill_onload);
       
   162 
       
   163 function autofill_force_region_refresh()
       
   164 {
       
   165   Spry.Data.initRegions();
       
   166 }
   133 
   167 
   134 function AutofillUsername(element, event, allowanon)
   168 function AutofillUsername(element, event, allowanon)
   135 {
   169 {
   136   element.onkeyup = element.onkeydown = element.onkeypress = function(e) {};
   170   element.onkeyup = element.onkeydown = element.onkeypress = function(e) {};
   137   
   171   
   141   autofill_init_element(element, {
   175   autofill_init_element(element, {
   142       allow_anon: allowanon
   176       allow_anon: allowanon
   143     });
   177     });
   144 }
   178 }
   145 
   179 
   146 function findParentForm(o)
   180 // load spry data components
       
   181 function load_spry_data()
   147 {
   182 {
   148   if ( o.tagName == 'FORM' )
   183   var scripts = [ 'SpryData.js', 'SpryJSONDataSet.js', 'SpryAutoSuggest.js' ];
   149     return o;
   184   for ( var i = 0; i < scripts.length; i++ )
   150   while(true)
       
   151   {
   185   {
   152     o = o.parentNode;
   186     load_component(scripts[i]);
   153     if ( !o )
       
   154       return false;
       
   155     if ( o.tagName == 'FORM' )
       
   156       return o;
       
   157   }
   187   }
   158   return false;
   188   autofill_onload();
   159 }
   189 }
   160