处理各种表单, 以及链接,按钮的通用组件

/**
 * Push button action [btn_action]data into form
 * If there is prescript , run the pre script
 */
\"use strict\";
//All ajax request are synchronized by default
var ajaxSynchronized = true;
//All ajax request will be unblock by default
var ajaxAutoUnblock = true;

var ajax_action_button = function (e){
 var btn = $(this);
 //Add prescript
 var pre_script;
 if(pre_script = btn.attr(\"pre_script\")){
  var ret = eval(pre_script);
  if(ret==false){
   return false;
  }
 }
 var btn_action = btn.attr(\'value\');
 if(btn_action){
  $(this).closest(\'form\').data(\'btn_action\',
   { name:\'btn_action\',value:btn_action }
   );
 }
};

/**
 * Update the extra form data in FormElement with Form element, Key and Value
 */
var ajax_update_post_data = function(formEle, k, v){
 var form = $(formEle);
 var post_data = form.data(\'post_data\');
 if( post_data == undefined ){
  post_data = {};
 }

 if( v == undefined ){
  delete post_data[k];
 }else{
  post_data[k] = v;
 }
 form.data(\'post_data\',post_data);
 return true;
};

/**
 * Bool Checkbox is special checkbox which needs to keep UNCHECK value
 * And post with ajax form ,the form is in the parent
 */
var bool_checkbox = function(){
 var ipt = $(this);
 var formEle = ipt.closest(\"form\");
 var _check = ipt.prop(\"checked\");
 if(_check){
  ajax_update_post_data(formEle,ipt.attr(\'name\'));
 }else{
  ajax_update_post_data(formEle,ipt.attr(\'name\'),\'f\');
 }
};

/**
 * Init the spin number
 */
var spin_number = function(){
 var spin = $(this);
 var config = {
  lock:true,
    imageBasePath: \'{webpath}/css/images/spin/\',
    btnCss: null,
    txtCss: null,
    btnClass:\'spin_btn\',
 };
 var interval = spin.attr(\'interval\');
 if(interval){
  config.interval = interval;
 }else{
  config.interval = 1;
 }

 var min = spin.attr(\'min\');
 if( min ){
  config.min = min;
 }

 var max = spin.attr(\'max\');
 if( max ){
  config.max = max;
 }

 spin.spin(config);
 return true;
};

/**
 * Init the date input
 */
var date_input = function(){
 var ipt = $(this);
 var config = {
  offset:[4,0],
  selectors:true,
  lang: \'{lang}\',
  firstDay : 1,
  format: \'yyyy-mm-dd\',
 };

 var min = ipt.attr(\'min\');
 if( min ){
  config.min = min;
 }

 var min = ipt.attr(\'min\');
 if( min ){
  config.min = min;
 }

 ipt.dateinput(config);
 return true;
};

/**
 * Init the timePicker
 */
var time_picker = function(){
 var ipt = $(this);
 var config = { };

 var step = ipt.attr(\"step\");
 if( step ){
  config.step = step;
 }

 ipt.timePicker( config );
 return true;
};

/**
 * Generic Ajax Form post function
 * If btn_action is set, then add data into form
 * if returi is set, redirect to returi
 * if reload is set, reload
 * else Show block message
 *
 * the form will be validated.
 */
var ajax_form_post = function(e){
 var form = $(this);
 var pre_script;
 if(pre_script = form.attr(\"pre_script\")){
  var ret = eval(pre_script);
  if(ret==false){
   return false;
  }
 }
 var errHint = form.find(\".formError\").first();
 if(errHint.size() == 0){
  errHint = $(\"#pageError\");
 }
 errHint.text(\'\').hide();

 //Cleanup the pageError
 if(!e.isDefaultPrevented()){
  //Hide all .formError
  $.blockUI({ message:\"{__(\'L_PROCESSING\')}\" });
  var formArray = form.serializeArray();
  var btn_action_data;
  var btn_action;
  if(btn_action_data = form.data(\'btn_action\')){
   formArray.push(btn_action_data);
   form.removeData(\'btn_action\');
   btn_action = btn_action_data.value;
  }else{
   btn_action = \'\';
  }

  console.log(\'btn action:\'+btn_action);
  //Add extra Data
  var post_data;
  if(post_data = form.data(\'post_data\')){
   for (var k in post_data ){
    //if post_data[k] is array,need more to do
    formArray.push( { name:k ,value: post_data[k] } );
   }
   form.removeData(\'post_data\');
  }

  $.post(form.attr(\'action\'), formArray,function(json){
    if($(window).data(\'blockUI.isBlocked\') == 1){
     $.unblockUI();
    }
    if(json.code === true){
     var returi = \"\";
     var retData = \"{__(\'L_PROCESSED\')}!\";
     if(json.data){
      retData = json.data; 
     }

     //TODO Add suppport to allow save and stay
     if(btn_action ==\'reqonly\'){
      if(returi = form.attr(\'returi\')){
       $(window).data(\'blockUI.returi\',returi);
       ajaxAutoUnblock = false;
      }
      $.blockUI({ message:retData, css:{ cursor:\'pointer\',padding:\'4px\',border:\'3px solid #CC0000\',}, overlayCSS:{ cursor:\'pointer\' } });
      $(\".blockUI\").addClass(\"blockwarn\");
     } //if there is returi set, then return to uri
     else if(returi = form.attr(\'returi\')){
      window.location = returi;
     //Else if reload is set, then will be reload
     }else if(form.attr(\'reload\')!=undefined){
      window.location.reload();
     }else{
      $.blockUI({ message:retData });
      $.unblockUI();
     }
    }
    else{
     if(typeof (json.data.errmsg) == \'string\'){
      errHint.html(json.data).show();
      //$.blockUI({ message:json.data, css:{ cursor:\'pointer\',padding:\'4px\',border:\'3px solid #CC0000\',}, overlayCSS:{ cursor:\'pointer\' } });
      //$(\".blockUI\").addClass(\"blockwarn\");
     }else{
      errHint.html(\"{Html::text(__(\'E_FORM\'))}\").show();
      for(var p in json.data){
       var msg = json.data[p];
       //Process hidden value,None hidden input should has refid refered to hidden value
       //Showing the Server message to ref
       var ele = form.find(\"[type=hidden][name=\"+p+\"]\");
       if(ele.length){
        delete json.data.p;
        refid = ele.attr(\"id\");
        refname = form.find(\"[hidden-id=\"+refid+\"]\").attr(\"name\");
        json.data[refname]=+msg;
       }

       //Muti checkbox
       var ele = form.find(\"[type=checkbox][name=\'\"+p+\"[]\']\");
       if(ele.length){
        delete json.data.p;
        refname = p+\'[]\';
        json.data[refname]=+msg;
       }
       //@END
      }
     }
     /*
      * Checking the hidden values
      */
     form.data(\"validator\").invalidate(json.data);
    } },\'json\');
    e.preventDefault();
 }else{
  errHint.html(\"{Html::text(__(\'E_FORM\'))}\").show();
 }
};

/***
 * Reset the input
 */
var ajax_post_form_hidden = function(){
  var form  = $(this);

  form.find(\"[hidden-id]\").each(function(){
   //Clear the message of Reference
   var input = $(this);
   var refid = input.attr(\"hidden-id\");
   var field = $(\"#\" + refid + \"\");
   //Setup the clear of Errmsg
   //Monitor the change event on ID element, remove error message
   //of Real input
   field.change(function(){
    //Hidden input
    var hinput  = $(this);
    //real input
    var rinput = $(\"[hidden-id=\"+hinput.attr(\"id\")+\"]\").first();
    form.data(\'validator\').reset(rinput)
    });
   });
  };

var validate_hidden_id =  function(input) {
 var refid = input.attr(\"hidden-id\");
 var field = $(\"#\" + refid + \"\");
 var msg = field.attr(\'msg\');
 if( !msg ){
  msg = \"{__(\'E_NOT_EMPTY\')}\";
 }

 return field.val() ? true : msg;
};

var data_equals_validate =  function(input) {
 var field;
 var name = input.attr(\"data-equals\");
 field = this.getInputs().filter(\"[name=\" + name + \"]\");
 return input.val() == field.val() ? true : [name];
};

/**
 * Ajax request through link
 * If confirm is set, confirm before send request
 * Support returi and reload
 * Else show block message
 */
var ajax_link_req = function(){
 var l = $(this);
 var hint = l.attr(\'hint\');
 if(hint){
  var errHint = $(l.attr(\'hint\'));
  errHint.text(\'\').hide();
 }
 //If the confirm message is set, then should be confirmed from client
 if(l.attr(\'confirm\')){
  if(!confirm(l.attr(\'confirm\'))){
   return false;
  }
 }

 $.blockUI({ message:\"{__(\'L_PROCESSING\')}\" });

 var pre_script;
 if(pre_script = l.attr(\"pre_script\")){
  var ret = eval(pre_script);
  if(ret==false){
   return false;
  }
 }

 var block = l.attr(\'block\');
 if(block != undefined){
  ajaxAutoUnblock = false ;
 }

 $.get(l.attr(\'href\'),function(json){
   if(json.code == true){
    var retData = \"{__(\'L_PROCESSED\')}!\";
    var returi;
    //If success to execute funtion for each
    var successFunc = l.attr(\'success\');
    if(successFunc){
     l.each(window[successFunc]);
    }

    if(json.data){
     retData = json.data; 
    }
    //IF Require warning before
    if( l.attr(\'value\') == \'reqonly\'){
     alert(retData);
    }else if(returi = l.attr(\'returi\')){
     window.location = returi;
    }
    else if(l.attr(\'reload\')!=undefined){
     window.location.reload();
    }
    else{
     $.blockUI({ message:retData, css:{ cursor:\'pointer\',padding:\'4px\',border:\'3px solid #CC0000\',}, overlayCSS:{ cursor:\'pointer\' } });
     $(\".blockUI\").addClass(\"blockwarn\");
    }
   }else{
    //$.unblockUI();
    //Only could support Text errmsg
    if(hint){
     errHint.text(json.data).show();
    }else{
     alert(json.data);
    }
   }},\'json\');
 return false;
};

/**
 * Supporting the button base navigation
 * Only jump to new href
 */
var btn_nav = function(){
 var input = $(this);
 var href = input.attr(\"href\");
 if(href){
  window.location = href;
 }else{
  alert(\"Href not set\");
 }
 return false;
};

/**
 * Support button base Ajax get method request
 * support returi and reload
 */
var btn_req = function(){
 var input = $(this);
 var href = input.attr(\"href\");

 var hint = input.attr(\'hint\');
 if(hint){
  var errHint = $(hint).first();
  if(errHint.size() == 0){
   errHint = $(\"#pageError\");
  }
  errHint.text(\'\').hide();
 }

 var block = input.attr(\'block\');
 if(block != undefined){
  ajaxAutoUnblock = false 
 }

 $.get(href,function(json){
   if(json.code == true){
   var returi;
   if(returi = input.attr(\'returi\')){
    window.location = returi;
   }
   else if(input.attr(\"reload\")!=undefined){
    window.location.reload();
   }else{
     var retData = \"{__(\'L_PROCESSED\')}!\";
     if(json.data){
      retData = json.data; 
     }
     $.blockUI({ message:retData,css:{ cursor:\'pointer\' },overlayCSS:{ cursor:\'pointer\' } });
    }
   }else{
    if(hint){
     $.unblockUI();
     errHint.html(json.data.errmsg).show();
    }else{
     $.blockUI({ message:json.data.errmsg, css:{ cursor:\'pointer\',padding:\'4px\',border:\'3px solid #CC0000\',}, overlayCSS:{ cursor:\'pointer\' } });
     $(\".blockUI\").addClass(\"blockwarn\");
    }
   }
   },\'json\');
 return false;
};

/**
 * Generic Ajax Checkbox
 * The default action is prevented and submit real request through URL
 */
var ajax_checkbox = function(){
 event.preventDefault();
 var action = $(this);
 var url = action.attr(\'url\');
 var _check = action.prop(\"checked\");
 console.log(_check);
 var op ;
 if(_check){
  op = \"1\";
 }else{
  op = \"0\";
 }
 $.get(url + op ,function(json){
  if(json.code == true){
    if(_check){
     action.prop(\"checked\",true);
    }else{
     action.prop(\"checked\",false);
    }
    return true;
   }else{
    return false;
   }
 },\'json\');
};

/**
 * Crete Root picklist
 */
var picklistinit = function(){
 var _select = $(this);
 var _hidden_id = _select.attr(\'hidden-id\');
 var _un = _select.attr(\'un\');
 var _lovchildren = _select.data(\'lovtree\').c;
 var _rowvalue = _select.data(\'rowvalue\');

 $(\"<OPTION>\").append(\"{__(\'L_SELECT\')}\").appendTo(_select);
 for(var _kid in _lovchildren){
  var _lov = _lovchildren[_kid][\'lov\'];
  $(\"<OPTION>\").val(_lov.lov_id).append(_lov.v).attr(\'k\',_lov.id).attr(\'is_leaf\',_lov.is_leaf).appendTo(_select);
 }
 _select.change(picklistchange);

 //Select the list
 if(_rowvalue){
  _select.find(\"[value=\"+_rowvalue[0]+\"]\").prop(\"selected\",true);
  _select.change();
 }
 return true;
};

/**
 * Select pick list
 */
var picklistchange = function (){
 var _select = $(this);
 var _hidden_id = _select.attr(\'hidden-id\');
 var _un = _select.attr(\'un\');

 //Remove all the subsequent
 var _lovtree = _select.data(\'lovtree\');
 var _rowvalue = _select.data(\'rowvalue\');

 _select.nextAll().remove();

 //This is value of Current Select
 var _selected = _select.find(\':selected\');
 if(_selected.attr(\'is_leaf\')==\"{DB::T}\"){
  $(\"#\"+_hidden_id).val(_select.val());
  _select.after(\"<img src=\'/s.gif\' class=\'sprite_global successimg\'/>\");
 }else{
  var _val = _select.val();
  var _k = _selected.attr(\'k\');

  //Getting Children list
  if(_lovtree.c[_k].c == undefined){
   return false;
  }
  var _c_lovtree =  _lovtree.c[_k];

  var _c_select = $(\'<SELECT>\').data(\'lovtree\',_c_lovtree).
   data(\'rowvalue\',_rowvalue).
   attr(\'hidden-id\',_hidden_id).attr(\'un\',_un).
   attr(\'name\',_un+\'_\'+_k);
  $(\"<OPTION>\").append(\"{__(\'L_SELECT\')}\").appendTo(_c_select);
  //Building the option list
  for(var _kid in _c_lovtree.c){
   var _lov = _c_lovtree.c[_kid][\'lov\'];
   $(\"<OPTION>\").val(_lov.lov_id).append(_lov.v).attr(\'k\',_lov.id).attr(\'is_leaf\',_lov.is_leaf).appendTo(_c_select);
   //Insert after
   _select.after(_c_select);
   //Onchange
  }
  _c_select.change(picklistchange);

  if(_rowvalue){
   _c_select.find(\"[value=\"+_rowvalue[_k]+\"]\").prop(\"selected\",true);
   _c_select.change();
  }
 }
};

var lookup_new = function(){
 var lookup = $(this);
 var pre_script;
 if(pre_script = lookup.attr(\"pre_script\")){
  var ret = eval(pre_script);
  if(ret==false){
   return false;
  }
 }
 var url = lookup.attr(\"url\");
 if(!url){
  alert(\'url not set\');
  return false;
 }
 var height = lookup.attr(\'h\');
 if(!height){
  height = 600;
 }
 var width = lookup.attr(\'w\');
 if(!width){
  width = 800;
 }
 window.open(url,\"pselect\",\"scrollbars=yes,menubar=no,height=\"+height+\",width=\"+width+\",resizable=yes,toolbar=no,location=no,status=no\");
 return false;
};

/**
 * Lookup  new value for hidden value
 */
var parent_lookup = function(){
 var lookup = $(this);
 var pid = opener.$(\"#\" + lookup.attr(\'pid\'));
 if(!pid.length){
  alert(lookup.attr(\'pid\')+ \" not found\");
  return false;
 }
 var pname = opener.$( \"#\" + lookup.attr(\'pname\'));
 if(!pname.length){
  alert(lookup.attr(\'pname\')+ \" not found\");
  return false;
 }

 var aft_script;
 //Run current after script
 if(aft_script = lookup.attr(\'aft_script\')){
  window.eval(aft_script);
 }

 pid.val($(this).attr(\"refid\")); 
 //Only operation from opener could trigger change event
 pid.change();
 pname.val($(this).attr(\"refvalue\")); 
 pname.change();
 //Parent after_script
 if(aft_script = pname.attr(\'aft_script\')){
  opener.window.eval(aft_script);
 }
 if(aft_script = pid.attr(\'aft_script\')){
  opener.window.eval(aft_script);
 }
 window.close();
};

/**
 * Default upload complete
 */
//var uploadComplete = function(event, id, fileName, responseJSON) {
var uploadComplete = function(e, data) {
 //To be replaced by jquery uploader
 var _fileUpload = $(this);
 //console.log(_fileUpload);
 //console.log(data.result);
 if(_fileUpload.attr(\'reload\')!=undefined){
  window.location.reload();
 }
};

/**
 * File upload function ,the following attribute to control action of upload
 * \'endpoint\' as upload url
 * \'sid\' as session id
 * \'complete\' optional to configure the custom upload complete function
 */
var genericUpload = function(dom){
 var endpointurl = $(this).attr(\'endpoint\');
 var sid = $(this).attr(\"sid\");
 var completeFunc = \'uploadComplete\';
 //Setup custome complete function
 var cusComplete = $(this).attr(\'complete\');
 if(cusComplete){
  completeFunc = cusComplete;
 }

 $(this).fileupload({
  url: endpointurl,
  autoUpload:true,
  dataType:\'json\',
  formData: [{ \'sessionid\': sid }],
  paramName: \'Filedata\',
 }).bind(\'fileuploaddone\',window[completeFunc]);
};

/**
 * Matched errors with input
 * Only matched errors could be identified here
 */
var advance_validate = function(errors, event) {
 var conf = this.getConf();
 // loop errors
 $.each(errors, function(index, error) {
   // add error class into input Dom element
   var input = error.input;     

   input.addClass(conf.errorClass);

   // get handle to the error container
   var msg = input.data(\"msg.el\");

   // create Error data if not present, and add error class for input
   // \"msg.el\" data is linked to error message Dom Element
   if (!msg) {
   //msg = $(conf.message).addClass(conf.messageClass).insertAfter(input);
   msg = $(conf.message).addClass(conf.messageClass).appendTo(input.parent());
   input.data(\"msg.el\", msg);
   } 

   // clear the container
   msg.css({visibility: \'hidden\'}).find(\"span\").remove();

   // populate messages
   $.each(error.messages, function(i, m) {
     $(\"<span/>\").html(m).appendTo(msg);   
     });

   // make sure the width is not full body width so it can be positioned correctly
   if (msg.outerWidth() == msg.parent().width()) {
    msg.add(msg.find(\"span\"));  
   }

   //insert into correct position (relative to the field)

   msg.css({ visibility: \'visible\'}) .fadeIn(conf.speed);    
   msg.parent().addClass(\"colError\");
 });
};

var advance_inputs = function(inputs) {
 var conf = this.getConf();    
 inputs.removeClass(conf.errorClass).each(function() {
   var msg = $(this).data(\"msg.el\");
   if (msg) {
   msg.hide();
   msg.parent().removeClass(\"colError\");
   }
   });
 if($(\".colError\").size() == 0){ 
  var form = $(this);
  var errHint = form.find(\".formError\").first();
  if(errHint.size() == 0){
   errHint = $(\"#pageError\");
   errHint.text(\'\').hide();
  }
 }
};

/**
 * When refname is contained to be selected
 */
var checkall = function() {
 var check = $(this);
 var refname = check.attr(\'refname\');
 if(refname){
  if(check.prop(\"checked\")){
   $(\"input[name*=\'\"+refname+\"\']\").prop(\"checked\",true);
  }else{
   $(\"input[name*=\'\"+refname+\"\']\").prop(\"checked\",false);
  }
 }

 var refclass = check.attr(\'refclass\');
 if(refclass){
  if(check.prop(\"checked\")){
   $(\"input.\"+refclass).prop(\"checked\",true);
  }else{
   $(\"input.\"+refclass).prop(\"checked\",false);
  }
 }
};

/**
 * Setup readonly checkbox
 */
var readonlyCheck = function(e){
 e.preventDefault(); 
 return false;
};

/**
 * Select List disable
 */
var readonlySelect = function(){
 $(this).prop(\"disabled\", true);
};

$(document).ready(function() {
  $(document).ajaxStart(function(){
   //Clean up the Ajax request Page Level Error
   $(\"#pageError\").text(\'\').hide();
   //Clean up teh Form Error
   $(\".formError\").text(\'\').hide();
   //Blocking all ajax processing
   if(ajaxSynchronized){
    $.blockUI({ message:\"{__(\'L_PROCESSING\')}\" });
    }
   });
  $(document).ajaxStop(function(){
   if(ajaxSynchronized){
    if($(window).data(\'blockUI.isBlocked\') == 1){
     if(ajaxAutoUnblock){
      $.unblockUI();
     }else{
        ajaxAutoUnblock = true;
     }
    }
   }else{//Change back to default Synchronized mode from Async
    ajaxAutoUnblock = true;
    ajaxSynchronized =  true;
   }
   });
  $(document).ajaxError(function(event, request, settings){
   alert(\'Ajax Request Error! URL=\'+settings.url);
   if(ajaxSynchronized){
    if($(window).data(\'blockUI.isBlocked\') == 1){
     if(ajaxAutoUnblock){
      $.unblockUI();
     }else{
        ajaxAutoUnblock = true;
     }
    }
   }else{
    ajaxAutoUnblock = true;
    ajaxSynchronized =  true;
   }
   });

  //Force unblockUI
  $(document).click(function(){
    if($(window).data(\'blockUI.isBlocked\') == 1){
     $.unblockUI();
     var returi = $(window).data(\'blockUI.returi\');
     if(returi){
      window.location = returi;
     }
    }});

  $.tools.validator.addEffect(\"advanced\", advance_validate,advance_inputs);
  $.tools.validator.fn(\"[data-equals]\", { \"{lang}\":\"{__(\'E_NOTEQUAL\')}\" }, data_equals_validate );
  $.tools.validator.fn(\"[hidden-id]\",validate_hidden_id);

  $(\".ajax_form_post\").validator({ lang:\'{lang}\',effect:\'advanced\' }) .submit( ajax_form_post );
  $(\".ajax_form_post\").each(ajax_post_form_hidden);
  $(\".spin_number\").each(spin_number);
  $(\".date_input\").each(date_input);
  $(\".time_picker\").each(time_picker);

  $(\'.ajax_link_req\').click(ajax_link_req);
  //Client validation for the hidden ID
  $(\".require_validate\").validator({ lang:\'{lang}\',effect:\'advanced\' });

  $(\".btn_nav\").click( btn_nav );
  $(\".btn_req\").click( btn_req );
  $(\"button.btn_action\").click(ajax_action_button);
  $(\".lookup_new\").click(lookup_new);
  $(\".parent_lookup\").click(parent_lookup);
  $(\".ajax_checkbox\").click(ajax_checkbox);
  $(\".bool_checkbox\").click(bool_checkbox);
  $(\".checkall\").click(checkall);
  $(\"img[rel]\").overlay();
     $(\"input[tip]\").tooltip({ position:\"center right\"});

  //At last we will do localize
  $.tools.validator.localize(\"{lang}\", {
   \'*\'     : \"{__(\'E_ALL\')}\",
   \':email\'    : \"{__(\'E_EMAIL\')}\",
   \':number\'   : \"{__(\'E_DECIMAL\')}\",
   \':url\'      : \"{__(\'E_URL\')}\",
   \'[max]\'     : \"{__(\'E_MAX_LENGTH\')}\",
   \'[min]\'     : \"{__(\'E_MIN_LENGTH\')}\",
   \'[required]\'    : \"{__(\'E_NOT_EMPTY\')}\",
   });
});