address standardization, part 2

[freeside.git] / httemplate / elements / location.html

diff --git a/httemplate/elements/location.html b/httemplate/elements/location.html
index b5f0a96..7055545 100644 (file)
--- a/httemplate/elements/location.html
+++ b/httemplate/elements/location.html
@@ -19,6 +19,9 @@ Example:
 
 </%doc>
 
+<SCRIPT SRC="<% $fsurl %>elements/jquery.deserialize.min.js"></SCRIPT>
+<SCRIPT SRC="<% $fsurl %>elements/polyfill.js"></SCRIPT>
+
 % if ( $opt{'alt_format'} ) {
 
 <TR>
@@ -268,9 +271,10 @@ Example:
 % }
 %# Placeholders
 <& hidden.html, field => $pre.'cachenum', value => '' &>
-<& hidden.html, field => $pre.'addr_clean', value => '' &>
+<& hidden.html, field => $pre.'addr_clean', value => $object->get('addr_clean') &>
 
 <SCRIPT TYPE="text/javascript">
+// XXX some of this should go away after address standardization changes...
 <&| /elements/onload.js &>
   var clear_coords_ids = [
     '<%$pre%>latitude',
@@ -324,6 +328,110 @@ Example:
   }
 
 </&>
+
+% if (! $m->notes('location_js') ) {
+%   $m->notes('location_js', 1);
+
+function Location(fieldset, prefix) {
+  if ( typeof fieldset == 'String' ) {
+    fieldset = $('#' + fieldset);
+  }
+  this.fieldset = $(fieldset);
+  this.prefix = prefix || '';
+
+  var errorbox = document.createElement('DIV');
+  errorbox.className = 'error';
+  fieldset.append(errorbox); // after the <table>
+  $(errorbox).position({
+    my: 'left',
+    at: 'right+20px',
+    of: fieldset
+  });
+  this.errorbox = $(errorbox); // so we can find it
+
+  var img_tick = $('<IMG SRC="<% $fsurl %>images/tick.png">');
+  var img_wait = $('<IMG SRC="<% $fsurl %>images/wait-orange.gif">');
+
+  if ( $('#' + prefix + 'addr_clean').prop('value') ) {
+    $(errorbox).append(img_tick);
+  }
+
+  // get/set the serialized (URL parameter string) contents of the form fields
+  this.value = function(newvalue) {
+    if (newvalue) {
+      try {
+        this.fieldset.deserialize(newvalue);
+        this.errorbox.empty();
+        if ( newvalue['error'] ) {
+          this.errorbox.text(newvalue['error']);
+        } else {
+          this.errorbox.append(img_tick);
+        }
+      } catch(err) {
+        console.log("Couldn't parse returned data:\n" + newvalue);
+        // show an error also
+      }
+    }
+    return this.fieldset.serialize();
+  };
+
+  // send a standardization request and push the result into this.value()
+  this.standardize = function(callback) {
+    this.errorbox.empty();
+    this.errorbox.append(img_wait);
+    $.ajax({
+      type: 'POST',
+      url: '<% $fsurl %>misc/address_standardize.cgi',
+      success: this.value.bind(this),
+      data: this.value()
+    });
+  };
+
+  var location_change_timer;
+
+  // check if required fields are filled, and if so, wait 2 seconds, then
+  // call "standardize"
+  var standardize_if_ready = function( ev ) {
+    // pull the location object back out
+    var loc = ev.data;
+
+    if ( location_change_timer ) {
+      console.log("reset timer...");
+      window.clearTimeout(location_change_timer);
+    }
+
+    // require address1 and either (zip) or (city and state)
+    // before trying to standardize
+    var ready =
+         $('#' + loc.prefix + 'address1').val()
+      && (
+           (    $('#' + loc.prefix + 'city').val()
+             && $('#' + loc.prefix + 'state').val()
+           )
+           || $('#' + loc.prefix + 'zip').val()
+         )
+    ;
+
+    if ( ready ) {
+      console.log("start timer...");
+      location_change_timer = window.setTimeout( loc.standardize.bind(loc),
+                                                 2000 );
+    }
+  };
+
+  // event handler; the Location object is passed in event.data
+  var location_changed = standardize_if_ready;
+
+  // bind only to the fields that are used in standardization
+  // (so that it's possible to manually edit coords, etc.)
+  var onchange_fields = 
+    [ 'address1', 'address2', 'city', 'state', 'zip', 'country' ];
+  for ( var i = 0; i < onchange_fields.length; i++ ) {
+    $('#' + prefix + onchange_fields[i]).on('change', this, location_changed);
+  }
+}
+
+% }
 </SCRIPT>
 
 <%init>