/*
*
* Objet de construction des composantes HTML
*
*/
var tabbedCats = {

    /** Vars **/
    name            : 's2tWare-tabbedCats',
    id              : '#s2tWare-tabbedCats',
    list            : '#s2tWare-tabbedCats .list',
    classe          : '#s2tWare-tabbedCats .tabs',
    height          : null,
    width           : null,

    /** lists **/
    listHeight      : 0,

    /** Construction **/
    init: function () {
        this.construct(s2tWare.id);
        this.constructTabs();
        this.loadCatsList('mixs');
        this.resize();
        $j(this.id).fadeIn();
    },
    construct: function(parent) {
       var HTML = '<div id="' + this.name + '"><div class="tabs"></div><div class="list"></div></div>';
       $j(parent).prepend(HTML);
    },
    constructTabs: function () {
        var tabs = [
                {display: 'Mix', id: 'mixs', classe: 'active'},
                {display: 'Lives', id: 'lives', classe: 'off'},
                {display: 'Tracks', id: 'tracks', classe: 'off'},
                {display: 'Membres', id: 'members', classe: 'off decal5'}

        ];
        if(s2tWare.isUser) {
            tabs.push( {display: 'Mes contacts', id: 'contacts', classe: 'off'})
        }
        var t = "";
        for (i=0;i<tabs.length;i++)
        {
          t += "<a href='#' class='tabsCat " + tabs[i].classe + "' id='" + tabs[i].id + "'>" + tabs[i].display + "</a>";
        }

       $j(this.id + ' .tabs').append(t);
     },
     /** Functions **/
     addToDelayedSounds: function (soundId, memberId ) {

       me = this;
        var soundSplit = soundId.split('_');
        var idSound = soundSplit["2"];

        var MemberSplit = memberId.split('_');
        var idMember = MemberSplit ['2'];

            $j.ajax({
            type: "POST",
            url: s2tWare.comUrl + 'addToDelayedSounds',
            data: "idSound=" + idSound + "&idMember=" + idMember,
            success: function(msg){
              if(msg){
                 $j('#' + memberId).effect( 'pulsate',{ times:2 }, 300 )
              }
            }
            });

    },

    loadCatsList: function(id) {

        var me = this;

        $j(me.id + " .tabs a").removeClass('active').removeClass('off');
        $j(me.id + " .tabs a").addClass('off');
        $j(me.id + " #" + id ).removeClass('off').addClass('active');

        this.unloadList();

         switch (id) {
            case "members":
                me.membersList(id);
                break;
            case 'contacts':
                me.membersList(id)
            default:
                me.soundCatList(id);
        }
 
          
        
    },
    membersList: function(id) {

        var me = tabbedCats;
        

        $j(this.list).flexigrid ({
			title: 'Liste des membres'
			,url: s2tWare.comUrl + 'membersList&type='+id
			,dataType: 'json'
			// Définition des colonnes
			,colModel: [
                                    {display: 'Membre', name: 'u.username', sortable: true, align: 'left'},
                                    {display: 'Sound System', name: 'c.cb_crew',  sortable: true, align: 'left'},
                                    {display: 'Style de jeu', name: 'c.cb_monstyle', sortable: true, align: 'left'},
                                ]
			,searchitems : [
                                    {display: 'Membre', name : 'u.username', isdefault: true},
                                    {display: 'Sound System', name : 'c.cb_crew', isdefault: false},
                                    {display: 'Style de jeu', name : 'c.cb_monstyle ', isdefault: false}
				],
                        sortname: "u.username",
			sortorder: "asc",
			usepager: true,
			singleSelect: true,
			useRp: true,
			rp: 15,
			showTableToggleBtn: false,
			width: me.width,
			height: parseInt(me.listHeight),
                        onSuccess: function() {
                           
                            if (id == 'contacts') {
                              $j( me.id + " .list tr").droppable({
                                    over: function(event, ui){
                                        $j(this).addClass("hover");
                                    },
                                    out: function(event, ui){
                                        $j(this).removeClass("hover");
                                    },
                                    drop: function(event, ui){

                                        tabbedCats.addToDelayedSounds($j('.ui-draggable-dragging').attr('id'),$j(this).attr('id'));
                                        $j('.ui-draggable-dragging').remove();
                                        $j(this).removeClass("hover");
                                    }
                                    })
                             }
                        }
		})
       me.resize();

    },
    resize: function() {
        var me = this;
        $j(me.id).css({
            height: function(){
               me.height = (s2tWare.height/2) - s2tWare.margin * 2
               return me.height + "px";
            },
            width: function() {
               me.width = (s2tWare.width/2) - (s2tWare.logoWidth/2) - s2tWare.margin * 2
               return me.width + "px";
            },
            top: function (){
               var posi = s2tWare.margin;
               return posi + 'px'
            },
            left: function (){
               var posi = s2tWare.margin;
               return posi + 'px'
            }

        });
        me.listHeight = this.height - 84;
        $j(me.id +' .bDiv').height(me.listHeight)
        $j(me.id +' .flexigrid').width(me.width)
    },
     soundCatList: function(id) {
        var me = tabbedCats;
        $j(this.list).flexigrid ({
			title: 'Liste des categories'
			,url: s2tWare.comUrl + 'catList&type='+id
			,dataType: 'json'
			// Définition des colonnes
			,colModel: [
                                   {display: 'Categories', name: 'name',  sortable: false, align: 'left'},
                                   ],
                        sortname: "name",
			sortorder: "asc",
			usepager: true,
			singleSelect: true,
			useRp: true,
			rp: 15,
			showTableToggleBtn: false,
			width: me.width,
			height: parseInt(me.listHeight)
		})
       me.resize();

    },
    unloadList: function(){
        var me = this;
        if($j(me.id +' .flexigrid').size()) {
            $j(me.id +' .flexigrid').remove();
            $j(me.id).append('<div class="list"></div>');
        }
    }
}