/*
@author   AFar        

@change: 17.03.2009  AFar add validationGroup

Exampel:
HTML
  <div class="template" id="templateId">
      <div class="Record" id="#FIELD:taskId:#">
          <p>
              Task # #FIELD:taskId:#</p>
          <p class="pTitle">
              <a href="#">#FIELD:title:#</a></p>
          <p>
              Set-up date: #FIELD:startDate:#</p>
          <p>
              Due date: #FIELD:finishDate:#</p>
      </div>
  </div>


  var taskServ = new serviceProxy("wcf/tasks.svc/");
  taskServ.invoke("getTask", { projectId: projectId},
  function(result) {

      $('#count').text($('tasks', result).length);
      var div = $.Mapper.createTemplate("templateId", $('tasks', result), 'xml', function (div,obj){..called after create each new element ..} );

      //you can bind some function on new objects
      $('someClass', div).bind('click', function() { ToDo($.Mapper.getCreateObject(this)); });

      $('#conteiner').empty().append(div);
  }, OnPageError, 'xml');


*/

//replase all #FIELD:fieldName:# on obj.getText(fieldName) for xml-type or obj[fieldName] for other type
$.Mapper = {
    createTemplate: function(template, object, type, onCreate, conteiner, templateNotId, objectAsElement) {
        function _mapObj2Template(template, obj, type) {
            var reg = /#FIELD:(\w+):#/;
            var a = $(template.match(/#FIELD:(\w+):#/g));
            for (var i = 0; i < a.length; i++) {
                var aa = reg.exec(a[i]);                
                if (aa)
                    template = template.replace(a[i], type == 'xml' ? obj.getText(aa[1]) : obj[aa[1]]);
            }
            var r = $(template);
            r[0]['createObject'] = obj;
            if (typeof onCreate == 'function') onCreate(r, obj);
            return r;
        }

        function _mapObjArr2Template(template, objects, type, conteiner) {
            var div = conteiner ? conteiner : $("<div>");
            $(objects).each(function() {
                div.append(_mapObj2Template(template, $(this), type));
            });
            return div;
        }

        if (!templateNotId) template = $('#' + template);
        if (typeof template != 'string') template = $(template).html();
        return !objectAsElement ? _mapObjArr2Template(template, object, type, conteiner) : _mapObj2Template(template, object, type, conteiner);
    },
    getCreateObject: function(obj) {
        var o = $(obj);
        while (o.length > 0 && !o[0].createObject)
            o = o.parent();
        return o.length > 0 && o[0].createObject ? o[0].createObject : null;
    },

    mapObj2Obj: function(htmlElement, obj, mapName, type) {
        function isText(tag, t) { return (tag == 'INPUT' && (t == 'text' || t == 'hidden')) || (tag == 'TEXTAREA') }
        var select = (mapName) ? '[mapName=' + mapName + ']' : '[mapField]';
        $(select, htmlElement).each(function() {
            var txt = obj ? type == 'xml' ? obj.getText($(this).attr('mapField')) : obj[$(this).attr('mapField')] : '';

            if (isText(this.tagName, this.type)) {
                $(this).val(txt);
            } else if ($(new Array('U', 'A', 'P', 'SPAN', 'DIV')).index(this.tagName) >= 0) {
                $(this).attr('mapHtml') ? $(this).html(txt) : $(this).text(txt);
            } else {
                alert('class Mapper, function mapObj2Obj do not support tag=' + this.tagName + '  type=' + this.type);
            }
        })
    }

}