source: pro-violet-viettel/www/deploy/20150304/assets/js/vsgrid.js @ 794

Last change on this file since 794 was 780, checked in by dungnv, 10 years ago
File size: 12.8 KB
Line 
1if(jQuery) (function($){
2       
3        $.extend($.fn, {
4                violetGrid: function (o) {
5                        if( !o ) var o = {};
6                        if( o.container == undefined ) o.container = $(this);
7                        if( o.defaultViewMode == undefined ) o.defaultViewMode = 'thumbnail';//or 'list'
8                        if( o.directoryTreeData == undefined ) o.directoryTreeData = null;
9                        if( o.dirIDprefix == undefined ) o.dirIDprefix = null;
10                        if( o.host == undefined ) o.host = 'http://localhost/';
11                        if( o.tree == undefined ) o.tree = null;
12                       
13                        if( o.sharemodal == undefined ) o.sharemodal = $("#box-shareto");
14                        if( o.copymodal == undefined ) o.copymodal = $("#box-copyto");
15                        if( o.movemodal == undefined ) o.movemodal = $("#box-moveto");
16                       
17                        var currentObj = {};
18                       
19                        var createNode = function (d) {
20                                if( !d ) var d = {};
21                                if( d.id == undefined ) d.id = null;
22                                if( d.name == undefined ) d.name = null;
23                                if( d.minetype == undefined ) d.minetype = 'directory';
24                                if( d.parentID == undefined ) d.parentID = null;
25                                if( d.clickEvent == undefined ) d.clickEvent = null;
26                                if( d.customEvent == undefined ) d.customEvent = null;
27
28                                var strHTML = '<div class="vscell '+ d.minetype +'" rel="id:' + d.id + '">';
29                                        strHTML += '<div class="selector unselected">';
30                                        strHTML +=      '<div class="icon-' + d.minetype + '"></div>';
31                                        strHTML += '</div>';
32                                        strHTML += '<div class="file-name unselected">' + d.name + '</div>';
33                                        strHTML += '</div>';
34                               
35                                var disabledItemsList = null;
36                                var enabledItemsList = null;
37                                var menuName = '';
38                               
39                                if (d.minetype == 'directory') {
40                                        disabledItemsList = ['preview'];
41                                        menuName = 'gridMenuDir';
42                                }
43                                else {
44                                        disabledItemsList = ['newfolder'];
45                                        menuName = 'gridMenuFile';
46                                }
47                               
48                                $(o.container).append(strHTML);
49
50                                $('div[rel="id:'+ d.id +'"].' + d.minetype).bind('click',function(e){itemClick(this)});
51                                $('div[rel="id:'+ d.id +'"].' + d.minetype).bind('dblclick',function(e){doubleClick(this)});
52                               
53                                $('div[rel="id:'+ d.id +'"].' + d.minetype).draggable({ containment: "parent",helper: "original" });
54                               
55                                $('div[rel="id:'+ d.id +'"].' + d.minetype).contextMenu({
56                                        menu: menuName,
57                                        disabledItems: disabledItemsList,
58                                        enabledItems: enabledItemsList
59                                }, function(action, el, pos) {
60                                        itemClick(el);
61                                        switch(action) {
62                                                case 'newfolder':
63                                                        openNewFolderModal(currentObj);
64                                                        break;
65                                                case 'rename':
66                                                        rename(el);
67                                                        break;
68                                                case 'share':
69                                                        showShareModal(currentObj);
70                                                        break;
71                                                case 'copy':
72                                                case 'cut':
73                                                        showCopyModal(currentObj, action);
74                                                        break;
75                                                default:
76                                                        break;
77                                        }
78                                });
79                        }
80                       
81                        var openNewFolderModal = function (c) {
82                                $('#box-newfolder').modal('show');
83                                $('#frm-newfolder').find('#f-parentid').val(c.id);
84                        }
85                       
86                        var bindCreateFolder = function () {
87                                $('#box-newfolder').find('#frm-newfolder').unbind('submit');
88                                $('#box-newfolder').find('#btn-submit-newfolder').unbind('click');
89                               
90                                $('#box-newfolder').find('#frm-newfolder').bind('submit',
91                                        function(e){
92                                                if ($('#frm-newfolder').find('#f-newfoldername').val() == '') {
93                                                        alert('Chưa nhập tên thư mục mới!');
94                                                }else {
95                                                        var postData = $('#box-newfolder').find('#frm-newfolder').serializeArray();
96                                                        var script = 'ajax/privatecontent/createdir';
97                                                        sendCommand({
98                                                                script: script,
99                                                                postdata:postData,
100                                                                callbackSuccess: function (parsedData) {
101                                                                                                        createNode({
102                                                                                                                id: parsedData.id,
103                                                                                                                name: parsedData.name,
104                                                                                                                curentNode: currentObj,
105                                                                                                                hidden: false,
106                                                                                                                addToJSONData:true});
107                                                                                                        o.tree.createDir(parsedData);
108                                                                                                }
109                                                        });
110                                                       
111                                                        $('#box-newfolder').modal('hide');
112                                                }
113                                               
114                                                e.preventDefault();
115                                });
116                               
117                                $('#box-newfolder').on('show.bs.modal', function () {
118                                        $('#box-newfolder').find('#frm-newfolder').get(0).reset();
119                                });
120                               
121                                $('#box-newfolder').on('shown.bs.modal', function () {
122                                        $('#box-newfolder').find('#frm-newfolder').find('#f-newfoldername').focus();
123                                });
124                               
125                                $('#box-newfolder').find('#btn-submit-newfolder').bind('click',
126                                        function (){
127                                                $('#box-newfolder').find('#frm-newfolder').submit();
128                                });
129                        }
130                       
131                        var keyboardRename = function () {
132                                $(document).bind('keydown','keypress', function(e) {
133                                        var selectedItem = $('.selector.selected').parent();
134                                       
135                                        switch( e.keyCode ) {
136                                                case 113:
137                                                        rename(selectedItem);
138                                                        break;
139                                                case 27:
140                                                        cancelRename(selectedItem);
141                                                        break;
142                                                default:
143                                                        break;
144                                        }
145                                });
146                        }
147                       
148                        var showShareModal = function (obj) {
149                                if (obj.type == undefined || obj.type == null) obj.type = 'directory';
150                                $(o.sharemodal).modal('show');
151                                $(o.sharemodal).find('INPUT#txtSelectedObj').val(obj.name);
152                                $(o.sharemodal).find('.modal-header').text('Chia sẻ ' + (obj.type == 'directory'?'thư mục ':'file ') + obj.name);
153                        }
154                       
155                        var showCopyModal = function (obj, action) {
156                                var modalTitle = action == 'copy' ? 'Sao chép ' + (obj.type == 'directory'?'thư mục ':'file ') + obj.name:'Di chuyển ' + (obj.type == 'directory'?'thư mục':'file') + ' ' + obj.name
157                                var submitTitle = action == 'copy' ? 'Sao chép' : 'Di chuyển';
158                                var submitIcon = action == 'copy' ? '<i class="icon-copy"></i>' : '<i class="icon-cut"></i>';
159                                               
160                                //btn-primary
161                                $(o.copymodal).modal('show');
162                                $(o.copymodal).find('INPUT#txtSelectedObj').val(obj.name);
163                                $(o.copymodal).find('.modal-header').text(modalTitle);
164                                $(o.copymodal).find('.btn-primary').empty();
165                                $(o.copymodal).find('.btn-primary').append(submitIcon + "\n" + submitTitle);
166                               
167                                var selectTree = $(o.copymodal).find('#select-destination-tree').violetTree({
168                                        container: $('#select-destination-tree'),
169                                        expandEasing: 'easeOutBounce',
170                                        collapseEasing: 'easeOutBounce',
171                                        homeDirNameDisplay: "Thư mục gốc",
172                                        contextmenuON: false
173                                });
174                               
175                                $(o.copymodal).find('.btn-primary').button().click(function() {excuteCopy(obj, selectTree, action)})
176                               
177                                $(o.copymodal).on('hide.bs.modal', function () {
178                                        $(o.copymodal).find('.btn-primary').unbind('click');
179                                });
180                        }
181                       
182                        var excuteCopy = function (obj, tree, action) {
183                                var destObj = tree.getSelectedObj();
184                               
185                                //sendCommand
186                                var postdata = {sourceid:obj.id,
187                                                sourcetype:obj.type,
188                                                destid: destObj.id,
189                                                desttype: destObj.type,
190                                                flag:action}
191                               
192                                sendCommand({
193                                        script:'ajax/privatecontent/copy',
194                                        postdata:postdata,
195                                        callbackSuccess: function (parsedData) {
196                                                if (parsedData.RESULT == true) {
197                                                        //please add code here
198                                                }else return false;
199                                        }
200                                });
201                        }
202
203                        var itemClick = function (i) {
204                                $(i).parent().find('.selector').removeClass('selected');
205                                $(i).parent().find('.selector').addClass('unselected');
206                                $(i).parent().find('.file-name').removeClass('selected');
207                                $(i).parent().find('.file-name').addClass('unselected');
208
209                                $(i).find('.file-name').removeClass('unselected');
210                                $(i).find('.file-name').addClass('selected');
211                                $(i).find('.selector').removeClass('unselected');
212                                $(i).find('.selector').addClass('selected');
213                               
214                                if ($(i).find('.file-name').text() != '')
215                                        currentObj.name = $(i).find('.file-name').text();
216                               
217                                currentObj.id = $(i).attr('rel').substring(3);
218                                currentObj.type = $(i).find('>div>div').hasClass('icon-directory') ? 'directory':'file';
219                                var item = searchItemByID(currentObj.id, currentObj.type);
220                                currentObj.parentID = item.parentID;
221                        }
222                       
223                        var doubleClick = function (i) {
224                                var rel = $(i).attr('rel');
225                                if ($(i).hasClass('directory')) {                               
226                                        var id = rel.substring(3, rel.length);
227                                        o.curentParent = o.dirIDprefix + id;
228                                        renderGrid(o);
229                                        o.tree.openTreeOffset(id);
230                                }
231                        }
232                       
233                        var searchItemByID = function (itemID, type) {
234                                var source = (type == 'directory') ? o.directoryTreeData.DIRECTORIES : (type == 'file') ? o.directoryTreeData.FILES : null;
235                                var item = {};
236                                if (itemID == 0) {
237                                        item.id = 0;
238                                        item.parentID = 0;
239                                        item.name = 'Home';
240                                }
241                                else {
242                                        for (var i = 0 ; i < source.length; i++) {
243                                                if (source[i].id == itemID) {
244                                                        item = source[i];
245                                                        break;
246                                                }
247                                        }
248                                }
249                               
250                                item.type = type;
251                                return item;
252                        }
253
254                        var renderGrid = function (o) {
255                                $(o.container).find ('.vscell').remove();
256                               
257                                var childDir = o.directoryTreeData.DIRECTORIES;
258                                var childFile = o.directoryTreeData.FILES;
259                                var currentDirID = o.curentParent.substring(o.dirIDprefix.length, o.curentParent.length);
260                               
261                                var disabledItemsList = ['preview','rename','copy','cut','delete','open'];
262                                var item = searchItemByID(currentDirID,'directory');
263                               
264                                $(o.container).contextMenu({
265                                        menu: 'gridMenuParent',
266                                        disabledItems: disabledItemsList
267                                }, function(action, el, pos) {
268                                        switch(action) {
269                                                case 'newfolder':
270                                                        openNewFolderModal(item);
271                                                        break;
272                                                case 'share':
273                                                        showShareModal(item);
274                                                        break;
275                                                default:
276                                                        break;
277                                        }
278                                });
279                               
280                                for (var i = 0 ; i < childDir.length; i++) {
281                                        if (childDir[i].parentID != currentDirID) continue;
282                                        createNode ({
283                                                id: childDir[i].id,
284                                                name: childDir[i].name,
285                                                parentID: currentDirID,
286                                        });
287                                }
288                               
289                                for (var i = 0 ; i < childFile.length; i++) {
290                                        if (childFile[i].parentID != currentDirID) continue;
291                                        createNode ({
292                                                id: childFile[i].id,
293                                                name: childFile[i].name,
294                                                parentID: currentDirID,
295                                                minetype: childFile[i].minetype,
296                                        });
297                                }
298                               
299                                keyboardRename();
300                                bindCreateFolder();
301                        }
302                       
303                        var rename = function (e) {
304                                var nameObj = $(e).find('.file-name');
305                                var editor = document.createElement ('INPUT');
306                                editor.type = 'text';
307                                editor.className = 'rename';
308                               
309                                $(nameObj).text('');
310                                $(nameObj).append(editor);
311                               
312                                $(editor).attr('value', currentObj.name); 
313                                editor.focus();
314                                $(editor).select();
315                                $(editor).bind('focusout',function (e) {
316                                        cancelRename($(this).parent().parent());
317                                });
318                               
319                                $(editor).bind('keypress',function (e) {
320                                var keycode = (e.keyCode ? e.keyCode : e.which);
321                                if(keycode == '13'){
322                                        completeRename($(this).parent());
323                                }
324                                else {
325                                       
326                                }
327                                e.stopPropagation();
328                                });
329                        }
330                       
331                        var cancelRename = function (e) {
332                                $(e).find('INPUT.rename').remove();
333                                $(e).find('.file-name').text(currentObj.name);
334                        }
335                       
336                        var completeRename = function (e) {
337                               
338                                var postdata = {id:currentObj.id,
339                                                                objtype:currentObj.type,
340                                                                newname:$(e).find('INPUT.rename').val()}
341                                sendCommand({
342                                        script:'ajax/privatecontent/rename',
343                                        postdata:postdata,
344                                        callbackSuccess: function (parsedData) {
345                                                if (parsedData.RESULT == true) {
346                                                        currentObj.name = parsedData.UPDATED.name;
347                                                        $(e).find('INPUT.rename').remove();
348                                                        $(e).text(currentObj.name);
349                                                }else return false;
350                                        }
351                                });
352                        }
353                       
354                        var sendCommand = function (p) {
355                                if( p.postdata == undefined ) p.postdata = null;
356                                if( p.script == undefined ) p.script = o.script;
357                                if( p.callbackSuccess == undefined ) p.callbackSuccess = null;
358                                if( p.callbackDone == undefined ) p.callbackDone = null;
359                                if( p.callbackFail == undefined ) p.callbackFail = null;
360                                if( p.callbackAlways == undefined ) p.callbackAlways = null;
361
362                                if (p.script != null) {
363                                        $.post(o.host + p.script, p.postdata, function (data){
364                                                if (data) {
365                                                        parseData = $.parseJSON(data);
366                                                }
367
368                                                if (p.callbackSuccess != null) {
369                                                        p.callbackSuccess(parseData);
370                                                }
371                                        }).done(function() {if (p.callbackDone != null)p.callbackDone(this);}).fail(function() {if (p.callbackFail != null)p.callbackFail(this);}).always(function() {if (p.callbackAlways != null)p.callbackAlways(this);});
372                                }
373                        }
374
375                        this.setData = function (data) {
376                                o.directoryTreeData = data.directoryTreeData;
377                                o.curentParent = data.curentParent;
378                                o.dirIDprefix = data.dirIDprefix;
379                                renderGrid(o);
380                        }
381                       
382                        this.setTree = function (treeObj) {
383                                o.tree = treeObj;
384                        }
385                       
386                        this.showModal = function (obj, act) {
387                                switch( act ) {
388                                        case 'newfolder':
389                                                openNewFolderModal(obj);
390                                                break;
391                                        case 'copy':
392                                        case 'cut':
393                                                showCopyModal(obj, act);
394                                                break;
395                                        case 'share':
396                                                showShareModal(obj);
397                                                break;
398                                        default:
399                                                break;
400                                }
401                        }
402                       
403                        this.searchItem = function (id, type) {
404                                return searchItemByID (id, type);
405                        }
406
407                        this.initialize = function() {
408                        return this;
409                };
410
411                        return this.initialize();
412                }
413        });
414
415})(jQuery);
Note: See TracBrowser for help on using the repository browser.