var DcmgrGUI = function(){};

//Refarence:http://wp.serpere.info/archives/1091
DcmgrGUI.Class = (function() {
  function subclass() {}
  return {
    create: function(parent) {
        function klass() {
          this.initialize.apply(this, arguments);
        }

        var index = 0;
        if(jQuery.isFunction(parent)) {
          index = 1;
          subclass.prototype = parent.prototype;
          klass.prototype = new subclass;
        }
        for(; index < arguments.length; ++index) {
            jQuery.extend(klass.prototype, arguments[index]);
        }
        return klass;
      }
    }
})();

DcmgrGUI.Filter = DcmgrGUI.Class.create({
  initialize: function(){
    this.filters = [];
  },
  add: function(filter){
    this.filters.push(filter);
  },
  execute: function(data){
    this.apply(0,data);
  },
  apply: function(index,data){
    if (this.filters[index] && typeof this.filters[index] === "function") {
      this.filters[index](data);
      var next_index = index + 1;
      if (this.filters[next_index]) {
        this.apply(next_index,data);
      } else {
        return data;
      };
    }
  }
});

DcmgrGUI.Converter = {};
DcmgrGUI.Converter.fromMBtoGB = function(data){
  return Math.ceil(data/1024) + 'GB';
};

DcmgrGUI.Pagenate = DcmgrGUI.Class.create({
  initialize: function(params) {
    this.element = $('#pagenate');
    this.view = $("#viewPagenate").text();
    this.total = params.total;
    this.page_count = this.getPageCount(params['total'],params['row']);
    this.current_page = 1;
    this.row = params['row'];
    this.start = this.getStartCount();
    this.offset = this.getOffsetCount();
    $('.prev').bind("click",{obj: this},this.updatePage);
    $('.next').bind("click",{obj: this},this.updatePage);

    this.renderPagenate();
  },
  getPageCount: function(total,row){
    return Math.ceil(total / row)
  },
  changeTotal: function(total){
    this.total = total;
    this.page_count = this.getPageCount(this.total,this.row)
    this.renderPagenate();
  },
  renderPagenate: function(){
    this.start = this.getStartCount();
    this.offset = this.getOffsetCount();
    var html = this.start + ' to ' + this.offset + ' of ' + this.total;
    $("#viewPagenate").html(html+' '+this.view);    
  },
  updatePage: function(event){

    var self = event.data.obj;
    var name = $(this).attr('class');
    
    if(self.current_page >= 1 && self.current_page < self.page_count) {
      if(name === 'next'){
        self.next_page = self.current_page +1;
        self.current_page = self.next_page;
      }
    }
    
    if(self.current_page > 1 && self.current_page <= self.page_count){
      if(name === 'prev'){
        self.prev_page = self.current_page -1;
        self.current_page = self.prev_page;
      }
    }
    self.renderPagenate();
    self.element.trigger('dcmgrGUI.updatePagenate');
  },
  getOffsetCount: function(){
    var count = (this.current_page * this.row);
    
    if (this.total < count) {
      return this.total;
    } else {
      return count;
    }
  },
  getStartCount: function(){
    if (this.current_page === 1) {
      var start = 1;
    } else {
      var start = ((this.current_page -1) * this.row) + 1;
    }
    return start;
  }
});

DcmgrGUI.Dialog = DcmgrGUI.Class.create({
  initialize: function(params) {
    this.target = $(params['target']);
    this.element = $('<div></div>')
    this.path_prefix = '/dialog';
    this.path = this.path_prefix + params['path'];
    this.width = params['width'];
    this.height = params['height'];
    this.title = params['title'];
    this.button = params['button'];
    this.callback = params['callback'] ||null;
  },
  open: function(params){
    //multi select action
    if(params){
      if(params.ids.length == 0){
        return false;
      }
      this.create(params);
    }else{
      //new create action
      this.create();
    }
    this.content.dialog('open');
  },
  disabledButton: function(buttonName,disabled){
    var widget = this.content
                  .dialog('widget')
                  .find(".ui-button-text:contains('"+ buttonName +"')")
                  .parent();
    if( widget ) {
      widget.button("option", "disabled", disabled);
    }       
  },
  close: function(){
    this.content.dialog('close');
  },
  create: function(params){
    this.content = this.element
        .load(this.path,params,this.callback)
  			.dialog({
  				title: this.title,
  				disable: false,
  				autoOpen: false,
  				bgiframe: true,
  				width: this.width,
  				height: this.height,
  				modal: true,
  				resizable: true,
  				closeOnEscape: true,
  				closeText: 'hide',
  				draggable:false,
  				buttons: this.button
  	});
  }
});

DcmgrGUI.ContentBase = DcmgrGUI.Class.create({
  initialize: function(params){
    if (params.element_id) {
      this.element = $(params.element_id);
    } else {
      this.element = $('<div></div>');
    }
    
    this.template = params.template_id;
    this.events = this.events||[];
    //prototype.register_event function add to call before initialize function
    this.bind_events();
    this.filter = new DcmgrGUI.Filter();
  },
  update:function(request,async){
    this.request = request;
    this.async = async;
    var self = this;

    $("#list_load_mask").mask("Loading...");
    self.element.trigger('dcmgrGUI.beforeUpdate');
    $.ajax({
       async: async||true,
       url: request.url,
       dataType: "json",
       data: request.data,
       success: function(json,status,xhr){
         self.filter.execute(json); 
         self.element.trigger('dcmgrGUI.contentChange',[{"data":json,"self":self}]);
         self.element.trigger('dcmgrGUI.afterUpdate',[{"data":json,"self":self}]);
       },
       complete: function(xhr, status) {
         $("#list_load_mask").unmask();
       },
       error: function(xhr, status, error){
         alert('Dcmgr connection '+status);
       }
     });
  },
  register_event:function(name,handler){
    this.events = this.events||[]
    this.events.push({
      "name":name,
      "handler":handler
    })
  },bind_events:function(){
    for(var i in this.events){
      this.element.bind(this.events[i].name,this.events[i].handler);
    }
  }
});

DcmgrGUI.Util = {};
DcmgrGUI.Util.getPagePath = function(path,page,format){
    var format = format||'json';
    return path + page + '.' + format;
}
DcmgrGUI.Util.setfillData = function(maxrows,json){
    var fillCount = maxrows-json.length;
    var emptyObj = [];
    for (var key in json[0]) {
      emptyObj.key = ''
    }
    for(var i=0;i<fillCount;i++){
      json.push(emptyObj);
    }
  return json;
}

DcmgrGUI.Util.getLoadingImage = function(type){
  switch(type) {
    case "ball":
      var image = 'loader_ball.gif'
    break;
    
    case "boxes":
      var image = 'loader_boxes.gif'
    break;
    
    default:
      var image = 'loader_ball.gif'
    break;
  }
  return '<img src="images/'+image+'" />';
}


DcmgrGUI.Util.getPagenateData = function(start,limit){
  return "start=" + start + "&" + "limit=" + limit;
}

DcmgrGUI.List = DcmgrGUI.Class.create(DcmgrGUI.ContentBase, {
  initialize: function(params){
    DcmgrGUI.ContentBase.prototype.initialize(params);
    this.checked_list = {};
    this.detail_template = {};
    this.maxrow = params.maxrow
    this.page = params.page
    
    var self = this;

    this.element.bind('dcmgrGUI.afterUpdate',function(event){
      
      var bg;
      var kids;
      
      $("table").find('td').hover(
        function () {
         //Mouse over
         bg = $(this).parent().css("background-color");
         kids = $(this).parent().children();
         kids.css("background-color","#82c9d9");
        },
        function () {
         //Mouse over
         kids.css("background-color",bg);
        }
      );
      
      self.element.find("[type='checkbox']").each(function(key,value){
        var id = $(value).val();
        if(self.checked_list[id]){
          $(event.target).find("[type='checkbox']").each(function(){
            if($(this).val() === id){
              $(this).attr('checked',true);
            }
          })
        }
      })
    });
    
    this.element.bind('dcmgrGUI.updateList',function(event,params){
      self.update(params.request,true)
    });
    
  },
  setDetailTemplate:function(template){
    this.detail_template = template;
  },
  getCheckedInstanceIds:function(checked_list){
    var ids = []
    for(var id in this.checked_list){
      ids.push(id);
    }
    return { 
      'ids':ids 
    }
  },
  checkRadioButton:function(id){
    $('#'+id).attr("checked", true);
  },
  setData:function(json){
    var rows = []
    if(!json){
      rows = this.getEmptyData()
    }else{
      $.each(json,function(key,value){
        rows.push(value.result)
      });
    }
    var row = this.maxrow || 10;
    var data = {
      rows:DcmgrGUI.Util.setfillData(row,rows)
    };
    this.element.html('');
    if(data.rows){
      $( this.template )
        .tmpl( data )
        .appendTo( this.element );
    }
  },
  clearCheckedList:function(){
    this.checked_list = {}
  },
  changeStatus:function(state){
    $.each(this.checked_list,function(id,obj){
       obj.element.find('.state').html(state);
       $('#detail').find('#'+id).find('.state').html(state);
    });
  },
  currentChecked:function(){
    var id = this.element.find("[type='radio']:checked").val();
    if( id ){
      return id;
    }else{
      return null;
    }
  },
  singleCheckList:function(params){
    var self = this;
    this.element.find("[type='radio']").each(function(key,value){
      $(this).click(function(){
        var check_id = $(this).val();
        
        if($(this).is(':checked')){
          var c_detail = new DcmgrGUI.Detail({
            template_id:params.template_id
          });
          
          c_detail.element.bind('dcmgrGUI.contentChange',function(event,params){
            var data = { item:params.data }
            
            //initialize
            if(!params.data){
              data.item = self.getEmptyData();
            }
            
            if(data.item){
              $('#detail').html($( c_detail.template ).tmpl(data));
            }
          });
          
          c_detail.update({
            url:DcmgrGUI.Util.getPagePath(params.detail_path,check_id)
          },true);
          
        }else{
          $('#detail').html('');
        }
      });
    });
  },
  multiCheckList:function(params){
    var self = this;
    this.element.find("[type='checkbox']").each(function(key,value){
      $(this).click(function(){
        var check_id = $(this).val();
        
        if($(this).is(':checked')){

          //step1:onclick checkbox and generate detail object
          self.checked_list[check_id] = {
            //+1 is to remove table header
            element:$(self.element.find('tr')[key+1]),
            c_detail:new DcmgrGUI.Detail({
              //id is to search element key
              id:check_id,
              template_id:params.template_id
            })
          }
          
          //step2:bind event dcmgrGUI.contentChange
          self.checked_list[check_id].c_detail.element.bind('dcmgrGUI.contentChange',function(event,params){
            if(self.checked_list[check_id]){
            
              //step4:marge data in template
              var data = { item:params.data }
              
              //initialize
              if(!params.data){
                data.item = self.checked_list[check_id].c_detail.getEmptyData();
              }
              
              if (self.detail_template.filter) {
                self.detail_template.filter.execute(data);
              };
              self.checked_list[check_id].c_detail.filter.execute(data);
              
              if(data.item){
                $( self.checked_list[check_id].c_detail.template )
                  .tmpl(data)
                  .appendTo( $('#detail') );
              }
            }
          });
          
          //step3:update detail
          self.checked_list[check_id].c_detail.update({
            url:DcmgrGUI.Util.getPagePath(params.detail_path,check_id)
          },true);

        }else{
          //remove detail
          if(self.checked_list[check_id]){
           $($('#detail').find('#'+check_id)).remove();
           delete self.checked_list[check_id]
         }
          
        }
      });
    })
  }
});

DcmgrGUI.Detail = DcmgrGUI.Class.create(DcmgrGUI.ContentBase, {
});

DcmgrGUI.Refresh = DcmgrGUI.Class.create({
  initialize: function(){
    this.element = $('.refresh');
    var self = this;
    self.element.live('click',function(){
      self.element.trigger('dcmgrGUI.refresh');
    })
  },
});

DcmgrGUI.ItemSelector = DcmgrGUI.Class.create({
  
  initialize: function(params) {

    this.left_select_id = params.left_select_id;
    this.right_select_id = params.right_select_id;
    this.data = params.data;
    
    this.leftSelectionsArray = [];
    var dataSize = this.data.length;
    for(var i = 0;i < dataSize ;i++) {
      var html = '<option id="'+i+'" value="'+ this.data[i]['value'] +'">'+ this.data[i]['name'] +'</option>';
      this.leftSelectionsArray[i] = $(html);
    }
    this.rightSelectionsArray = this.emptyArray(this.data.length);
    
    this.refreshOptions(this.left_select_id,this.leftSelectionsArray);
  },
  refreshOptions: function(select_id,selectionsArray){
    var selectionsSize = selectionsArray.length;
    $(select_id).html('');
    for(var i = 0;i < selectionsSize  ;i++) {
      if(selectionsArray[i] !== null ){
        $(select_id).append(selectionsArray[i]);
      }
    }
  },
  emptyArray: function(size) {
    var data = [];
    for(var i = 0;i < size  ;i++) {
      data[i] = null;
    }
    return data;
  },
  leftToRight: function() {
    var self = this;
    $(this.left_select_id).find('option:selected').each(function(){
      var index = $(this).attr('id');
      self.leftSelectionsArray[index] = null;
      self.rightSelectionsArray[index] = this;
      $(this).remove();
    });
    
    this.refreshOptions(this.right_select_id,this.rightSelectionsArray);
  },
  rightToLeft: function() {
    var self = this;
    $(this.right_select_id).find('option:selected').each(function(){
      var index = $(this).attr('id');
      self.leftSelectionsArray[index] = this;
      self.rightSelectionsArray[index] = null;
      $(this).remove();
    });
    
    this.refreshOptions(this.left_select_id,this.leftSelectionsArray);
  }
});

DcmgrGUI.prototype = {
  initialize:function(){
    $.deferred.define();
  }
}