source: pro-bachkim-filespace/sourcecode/assets/js/vsgrid.js @ 47

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