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

Last change on this file since 794 was 780, checked in by dungnv, 10 years ago
File size: 12.5 KB
Line 
1if(jQuery) (function($){
2       
3        $.extend($.fn, {
4                violetTree: function(o) {
5                        if( !o ) var o = {};
6                        if( o.user == undefined ) o.user = null;
7                        if( o.homeDirNameDisplay == undefined ) o.homeDirNameDisplay = 'Home';
8                        if( o.host == undefined ) o.host = 'http://localhost/';
9                        if( o.script == undefined ) o.script = 'ajax/privatecontent/getcontent';
10                        if( o.container == undefined ) o.container = null;
11                        if( o.dirIDprefix == undefined ) o.dirIDprefix = 'vsdir_';
12
13                        if( o.expandSpeed == undefined ) o.expandSpeed= 500;
14                        if( o.collapseSpeed == undefined ) o.collapseSpeed= 500;
15                        if( o.expandEasing == undefined ) o.expandEasing = null;
16                        if( o.collapseEasing == undefined ) o.collapseEasing = null;
17                        if( o.me == undefined ) o.me = this;
18
19                        if( o.directoryTreeData == undefined ) o.directoryTreeData = null;
20                        if( o.grid == undefined ) o.grid = null;
21                        if( o.contextmenuON == undefined ) o.contextmenuON = true;
22                       
23                        var currentObj = {};
24                        if ( currentObj.type == undefined ) currentObj.type = 'directory';
25                       
26                        // PRIVATE methods
27                        var sendCommand = function (p) {
28                                if( p.postdata == undefined ) p.postdata = null;
29                                if( p.script == undefined ) p.script = o.script;
30                                if( p.callbackSuccess == undefined ) p.callbackSuccess = null;
31                                if( p.callbackDone == undefined ) p.callbackDone = null;
32                                if( p.callbackFail == undefined ) p.callbackFail = null;
33                                if( p.callbackAlways == undefined ) p.callbackAlways = null;
34
35                                if (p.script != null) {
36                                        $.post(o.host + p.script, p.postdata, function (data){
37                                                if (data) {
38                                                        parseData = $.parseJSON(data);
39                                                }
40
41                                                if (p.callbackSuccess != null) {
42                                                        p.callbackSuccess(parseData);
43                                                }
44
45                                        }).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);});
46                                }
47                        }
48
49                        var loadTree = function () {
50                                sendCommand ({postdata:null,callbackSuccess:renderTree});
51                        };
52
53                        var renderTree = function  (parseData) {
54                                $(o.container).find ('.vstree').remove();
55                               
56                                o.directoryTreeData = parseData;                               
57                                var directoryData = parseData.DIRECTORIES;
58                               
59                                var homeNode = createNode({
60                                        id:0,
61                                        name:o.homeDirNameDisplay,
62                                });
63                               
64                                selectDir($(homeNode).find('> A'));
65                                if (directoryData != null) {
66                                        var count = 0;
67                                        for (var i = 0; i < directoryData.length ; i++) {
68                                                var htmlNode = $(o.container).find('#' + o.dirIDprefix + directoryData[i].parentID);
69                                               
70                                                var node = createNode ({
71                                                        id: directoryData[i].id,
72                                                        name: directoryData[i].name,
73                                                        currentNode: $(htmlNode).find('> A'),
74                                                        hidden: (directoryData[i].parentID > 0) ? true : false
75                                                })
76                                               
77                                                count ++;
78                                        };
79                                }
80                        };
81
82                        //Create a node of Tree
83                        var createNode = function (d) {
84                                if( !d ) var d = {};
85                                if( d.id == undefined ) d.id = null;
86                                if( d.name == undefined ) d.name = null;
87                                if( d.currentNode == undefined ) d.currentNode = null;
88                                if( d.hidden == undefined ) d.hidden = true;
89                                if( d.clickEvent == undefined ) d.clickEvent = openDir;
90                                if( d.customEvent == undefined ) d.customEvent = null; //customEvent.eventName, customEvent.eventTrigger
91                                if( d.addToJSONData == undefined ) d.addToJSONData = false;
92                               
93                                var disabledItemsList = null;
94                                if (d.name == o.homeDirNameDisplay)
95                                        disabledItemsList = ['rename','copy','cut','delete'];
96                               
97                                if (d.currentNode != null) {
98                                        var strHTML = '<ul class="vstree"><li id="' + o.dirIDprefix + d.id + '" class="directory collapsed"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
99
100                                        $(d.currentNode).parent().append(strHTML);
101                                        if (d.hidden == true)
102                                                $(o.container).find('#' + o.dirIDprefix + d.id).parent().css('display','none');
103                                       
104                                }else if (d.id == 0){
105                                        var strHTML = '<ul class="vstree"><li id="' + o.dirIDprefix + d.id + '" class="home"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
106                                        $(o.container).append(strHTML);
107                                }
108
109                                //bind new node to data
110                                if (d.addToJSONData == true) {
111                                        var newdir = {};
112                                        newdir.id = d.id;
113                                        newdir.name = d.name;
114                                        newdir.parentID = $(o.container).find(d.currentNode).parent().attr('id').substring(o.dirIDprefix.length, $(d.currentNode).parent().attr('id').length);
115                                        o.directoryTreeData.DIRECTORIES.push(newdir);
116                                        sendtoGrid();
117                                }
118                               
119                                //bind event on new node
120                                $(o.container).find('#' + o.dirIDprefix + d.id).find('a').bind("click", function(e){d.clickEvent(this);return false;});
121                               
122                                if (o.contextmenuON) {
123                                        $(o.container).find('#' + o.dirIDprefix + d.id).find('a').contextMenu({
124                                                menu: 'treeMenu',
125                                                disabledItems: disabledItemsList
126                                        }, function(action, el, pos) {
127                                                selectDir(el);
128                                                switch(action) {
129                                                        case 'rename':
130                                                                rename(el);
131                                                                break;
132                                                        case 'newfolder':
133                                                        case 'share':
134                                                        case 'copy':
135                                                        case 'cut':
136                                                                o.grid.showModal(currentObj, action);
137                                                                break;
138                                                        case 'delete':
139                                                                break;
140                                                        default:
141                                                                break;
142                                                }
143                                        });
144                                }
145                               
146                                if (d.customEvent != null)
147                                        $(o.container).find('#' + o.dirIDprefix + d.id).find('a').bind(d.customEvent.eventName, function(e){d.customEvent.eventTrigger(this)});
148
149                                return $(o.container).find('#' + o.dirIDprefix + d.id);
150                        }
151                        //END - Create a node of Tree
152                       
153                        var deleteNode = function (parsedData) {
154                                if (parsedData.isSuccess == false) return false;
155                                if (!$('#' + o.dirIDprefix + parsedData.id).hasClass('home'))
156                                        $('#' + o.dirIDprefix + parsedData.id).parent().remove();
157                        }
158
159                        var isHome = function (n) {
160                                return $(n).parent().hasClass('home');
161                        }
162
163                        var countNodeChild = function (n) {
164                                var parent = $(n).parent();
165                                return $(parent).find('UL').size();
166                        }
167                       
168                        var openDirById = function (dirID) {
169                                console.log(o.grid);
170                                var item = o.grid.searchItem(dirID, 'directory');
171                                var treeNode = $(o.container).find('#' + o.dirIDprefix + item.id);
172                               
173                                if(item.parentID != 0) {
174                                        var parent = $(o.container).find('#' + o.dirIDprefix + item.parentID);
175                                        if( $(parent).hasClass('collapsed') ) {
176                                                $(parent).removeClass('collapsed').addClass('expanded');
177                                                $(parent).find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
178                                        }
179                                }
180                               
181                                if( $(treeNode).hasClass('collapsed') ) {
182                                        $(treeNode).find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
183                                        $(treeNode).parent().parent().find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
184                                        $(treeNode).removeClass('collapsed').addClass('expanded');
185                                }
186                               
187                                selectDir($(treeNode).find('> A'));
188                        }
189
190                        var openDir = function (i) {
191                                closeAllChild($(i).parent());
192                               
193                                if( $(i).parent().hasClass('collapsed') ) {
194                                        $(i).parent().find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
195                                        $(i).parent().removeClass('collapsed').addClass('expanded');
196                                }
197                                else if( $(i).parent().hasClass('expanded') ) {
198                                        $(i).parent().find('> UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
199                                        $(i).parent().removeClass('expanded').addClass('collapsed');
200                                }
201                               
202                                selectDir(i);
203                        }
204                       
205                        var closeAllChild = function (i) {
206                                if ($(i).hasClass('home')) return;
207                                var aryChildDir = $(i).find ('UL');
208                                for (var i = 0; i < aryChildDir.length; i++) {
209                                        $(aryChildDir[i]).slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
210                                        $(aryChildDir[i]).find('> LI').removeClass('expanded').addClass('collapsed');
211                                }
212                        }
213
214                        var selectDir = function (c) {
215                                $('.currentDir').removeClass('currentDir');
216                                $(c).addClass('currentDir');
217                               
218                                var cid = $(c).parent().attr('id');
219                                var pid = cid.substring(o.dirIDprefix.length, cid.length);
220                               
221                                currentObj.id = pid;
222                                currentObj.name = $(c).attr('rel');
223                               
224                                keyboardRename ();
225                               
226                                sendtoGrid();
227                        }
228
229                        var sendtoGrid = function () {
230                                if (o.grid == null) return false;
231                               
232                                o.grid.setTree(o.me);
233                                o.grid.setData({
234                                                                directoryTreeData: o.directoryTreeData,
235                                                                curentParent:$(o.container).find('.currentDir').parent().attr('id'),
236                                                                dirIDprefix: o.dirIDprefix
237                                                        });
238                        }
239
240                        var rename = function (o) {
241                                var editor = document.createElement ('INPUT');
242                                editor.type = 'text';
243                                editor.className = 'rename';
244                               
245                                $(o).text('');
246                                $(o).append(editor);
247                               
248                                $(editor).attr('value', currentObj.name); 
249                                editor.focus();
250                                $(editor).select();
251                               
252                                $(editor).bind('focusout',function (e) {
253                                        cancelRename($(o));
254                                });
255                               
256                                $(editor).bind('keypress',function (e) {
257                                var keycode = (e.keyCode ? e.keyCode : e.which);
258                                if(keycode == '13'){
259                                        completeRename($(o));
260                                }
261                                else {
262                                       
263                                }
264                                e.stopPropagation();
265                                });
266                        }
267                       
268                        var cancelRename = function (o) {
269                                $(o).find('>INPUT').remove();
270                                $(o).text(currentObj.name);
271                        }
272                       
273                        var completeRename = function (o) {
274                                var postdata = {id:currentObj.id,
275                                                objtype:'directory',
276                                                newname:$(o).find('INPUT.rename').val()}
277                               
278                                sendCommand({
279                                        script:'ajax/privatecontent/rename',
280                                        postdata:postdata,
281                                        callbackSuccess: function (parsedData) {
282                                                if (parsedData.RESULT == true) {
283                                                        currentObj.name = parsedData.UPDATED.name;
284                                                        $(o).find('INPUT.rename').remove();
285                                                        $(o).text(currentObj.name);
286                                                }else return false;
287                                        }
288                                });
289                        }
290                       
291                        var keyboardRename = function () {
292                                $(document).bind('keydown','keypress', function(e) {
293                                        var selectedItem = $('.currentDir');
294                                       
295                                        switch( e.keyCode ) {
296                                                case 113:
297                                                        rename(selectedItem);
298                                                        break;
299                                                case 27:
300                                                        cancelRename(selectedItem);
301                                                        break;
302                                                default:
303                                                        break;
304                                        }
305                                });
306                        }
307                       
308                        loadTree();
309                        // END - PRIVATE methods
310
311
312                        this.expandAll = function() {
313                                $(o.container).find('UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
314                        };
315
316                        this.getCurrentDirName = function() {
317                                return $(o.container).find('.currentDir').attr('rel');
318                        };
319
320                        this.getCurrentDir = function() {
321                                return $(o.container).find('.currentDir');
322                        };
323
324                        this.createDir = function(data) {
325                                var cNode = $('#' + o.dirIDprefix + data.parentID).find('> A');
326                                createNode({
327                                        id: data.id,
328                                        name: data.name,
329                                        currentNode: cNode,
330                                        hidden: false,
331                                        addToJSONData:true});
332                        };
333
334                        this.deleteDir = function (c) {
335                                if (isHome(c)) return;
336                                var childExisted = (countNodeChild(c) > 0) ? true:false;
337                               
338                                $.confirm ({
339                                    text: 'Bạn có muốn xóa thư mục <span style="font-weight:bold">' + currentObj.name + "</span> khÃŽng?",
340                                    title: "Xác nhận xóa!",
341                                    confirm: function(button) {
342                                                var cid = $(c).parent().attr('id');
343                                                var pid = cid.substring(o.dirIDprefix.length, cid.length);
344                                                var postdata = {id:pid,delallchild:true}
345                                                sendCommand({
346                                                        script:'ajax/privatecontent/deletedir',
347                                                        postdata:postdata,
348                                                        callbackSuccess: function (parsedData) {deleteNode(parsedData)}
349                                                });
350                                    },
351                                    cancel: function(button) {
352                                        // do something
353                                    },
354                                    confirmButton: "Đồng Ü xóa",
355                                    cancelButton: "KhÃŽng",
356                                    post: false
357                                });
358                        }
359                       
360                        this.upload = function () {
361                                $('#box-upload').modal('show');
362                               
363                                $("#fileuploader").uploadFile({
364                                        url: o.host + 'ajax/privatecontent/upload',
365                                        fileName:"myfile",
366                                        multiple:true,
367                                        maxFileCount: 5,
368                                        dragDropStr: "<span><b>Kéo thả các file vào đây!</b></span>",
369                                        uploadErrorStr:"Tải lên có lỗi!"
370                                });
371                               
372                                $('#box-upload').on('hide.bs.modal', function () {
373                                        $('#box-upload').find('.modal-body>.row>.col-xs-12>').remove();
374                                        $('#box-upload').find('.modal-body>.row>.col-xs-12').append('<div id="fileuploader">Chọn file:</div>');
375                                });
376                        }
377
378                        this.copy = function () {
379                               
380                        }
381
382                        this.paste = function () {
383                               
384                        }
385                       
386                        this.openTreeOffset = function (nodeID) {
387                                openDirById(nodeID);
388                        }
389
390                        this.initialize = function() {
391                        return this;
392                };
393               
394                this.getSelectedObj = function () {
395                        return currentObj;
396                }
397
398                        return this.initialize();
399                }
400        });
401
402})(jQuery);
Note: See TracBrowser for help on using the repository browser.