source: pro-bachkim-filespace/sourcecode/assets/js/grid.js @ 69

if(jQuery) (function($){
        $.extend($.fn, {
                violetGrid : function (o) {
                        if( !o ) var o = {};
                        if( o.data == undefined ) o.data = null;
                        if( o.draggable == undefined ) o.draggable = false;
                        if( o.manager ==  undefined) o.manager = null;
                        
                        var oContainer = this;
                        
                        var createNode = function (node) {
                                if( !node ) var node = {};
                                if( node.item == undefined ) node.item = null; //item.id, item.name, item.parentID
                                if( node.isDirectory == undefined ) node.isDirectory = false;
                                if( node.showContextMenu == undefined ) node.showContextMenu = true;
                                
                                var icon = (node.item.minetype != undefined) ? 'icon-' + node.item.minetype: 'icon-directory';
                                var type = (node.item.minetype != undefined) ? node.item.minetype: 'directory';
                                var div = $('<div></div>',{'class':icon});
                                
                                var inputID = $('<input />',{'class':'id', type:'hidden',value:node.item.id});
                                var inputName = $('<input />',{'class':'name',type:'hidden',value:node.item.name});
                                var inputType = $('<input />',{'class':'type',type:'hidden',value:type});
                                
                                var a = $('<a></a>',{id: node.item.id,href: '#',rel: node.item.name,text: node.item.name});
                                var divLink = $('<div></div>',{'class':'file-name'}).append(a,inputID,inputName,inputType);
                                var li = $('<li></li>',{'class':'vscell'}).append(div, divLink);
                                
                                bindNodeEvents(li);
                                
                                return li;
                        }
                        
                        var bindNodeEvents = function (node) {
                                $(node).bind("click", function (e){
                                        if(e.button == 0)nodeClick(this,e);return false;});
                        }
                        
                        var nodeClick = function (node, event) {
                                if (event.ctrlKey) {
                                        if (!isHightLight(node))
                                                hightlightNode(node);
                                        else
                                                clearHightLightNode(node);
                                }
                                else if (event.shiftKey) {
                                        var firstItem = $(oContainer).find('> UL > LI > DIV[class^="icon-"][class$="selected"]:first-child').parent();
                                        var aryNode = $(oContainer).find('> UL > LI > DIV[class^="icon-"]').parent();
                                        var start = aryNode.index(firstItem);
                                        var finish = aryNode.index(node);
                                        aryNode.slice(Math.min(start, finish), Math.max(start, finish) + 1).each( function (i,o){hightlightNode(o);});
                                }
                                else {
                                        clearAllHightLightNode(node);
                                        hightlightNode(node);
                                }
                        }
                        
                        var nodeDblClick = function (node) {
                                
                        }
                        
                        var hightlightNode = function (node) {
                                $(node).find('> DIV').addClass('selected');
                        }
                        
                        var isHightLight = function (node) {
                                return $(node).find('> DIV').hasClass('selected');
                        }
                        
                        var clearAllHightLightNode = function () {
                                $(oContainer).find('> UL > LI > DIV').removeClass('selected');
                        }
                        
                        var clearHightLightNode = function (node) {
                                $(node).find('> DIV').removeClass('selected');
                        }
                        
                        var initGrid = function () {
                                var ul = $('<ul></ul>',{'class':'vsgrid'});
                                var parentDirID = o.manager.getTreeCurrentNode();
                                if (o.data.DIRECTORIES.length > 0) {
                                        for (var i = 0; i < o.data.DIRECTORIES.length; i++) {
                                                if (o.data.DIRECTORIES[i].parentID == parentDirID) {
                                                        var li = createNode ({item: o.data.DIRECTORIES[i]});
                                                        $(ul).append(li);
                                                }
                                        }
                                }
                                
                                if (o.data.FILES.length > 0) {
                                        for (var i = 0; i < o.data.FILES.length; i++) {
                                                if (o.data.FILES[i].parentID == parentDirID) {
                                                        var li = createNode ({item: o.data.FILES[i]});
                                                        $(ul).append(li);
                                                }
                                        }
                                }
                                
                                $(oContainer).find ('UL').remove();
                                $(oContainer).append(ul);
                                
                                $(oContainer).attr('unselectable','on')
                             .css({'-moz-user-select':'-moz-none',
                                   '-moz-user-select':'none',
                                   '-o-user-select':'none',
                                   '-khtml-user-select':'none',
                                   '-webkit-user-select':'none',
                                   '-ms-user-select':'none',
                                   'user-select':'none'
                             }).bind('selectstart', function(){ return false; 
                             }).bind('click', function(){ clearAllHightLightNode(); return false; });
                        }
                        
                        this.reloadGrid = function (nodeID) {
                                initGrid();
                        }
                        
                        this.setData = function (data) {
                                o.data = data;
                        }
                        
                        this.rename = function (item) {
                                console.log('rename');
                                console.log(item);
                        }
                        
                        this.deletion = function (id) {
                                
                        }
                        
                        this.initialize = function () {
                                initGrid();
                                return this;
                        };
                        
                        return this.initialize();
                }
        });
})(jQuery);