Changeset 4


Ignore:
Timestamp:
May 26, 2014 6:12:35 PM (11 years ago)
Author:
dungnv
Message:
 
Location:
pro-bachkim-filespace/violetspace-prototype
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • pro-bachkim-filespace/violetspace-prototype/assets/css/jquery/jqueryFileTree.css

    r1 r4  
    3131
    3232/* Core Styles */
    33 .jqueryFileTree LI.home { background: url(../../images/filetree/home.png) left top no-repeat; }
     33.jqueryFileTree LI.home { background: url(../../images/filetree/home.png) left top no-repeat;}
    3434.jqueryFileTree LI.directory { background: url(../../images/filetree/directory.png) left top no-repeat; }
    3535.jqueryFileTree LI.expanded { background: url(../../images/filetree/folder_open.png) left top no-repeat; }

  • pro-bachkim-filespace/violetspace-prototype/assets/js/filemanager/filemanager.js

    r1 r4  
    5959
    6060                $('#btnNewFolder').click (function(){
    61                         //privateTree.expandAll();
    62                         //alert(privateTree.getCurrentDir());
     61                        var curDir = privateTree.getCurrentDir();
     62                        privateTree.createDir(curDir);
     63                });
     64
     65                $('#btnDel').click (function() {
     66                        var curDir = privateTree.getCurrentDir();
     67                        privateTree.deleteDir(curDir);
    6368                });
    6469

  • pro-bachkim-filespace/violetspace-prototype/assets/js/vsfilemanager.js

    r1 r4  
    33        $.extend($.fn, {
    44                violetTree: function(o) {
    5                         var loadedNode = null;
    6 
    75                        if( !o ) var o = {};
    86                        if( o.user == undefined ) o.user = null;
    … …  
    1917                        if( o.collapseEasing == undefined ) o.collapseEasing = null;
    2018
    21                         $(this).each( function() {
    22                                 function loadTree() {
    23                                         if (o.dataSource == 'AJAX') {
    24                                                 $.post(o.script,
    25                                                         function(data){
    26                                                                 if (!data) return;
    27                                                                 var parsedData = $.parseJSON(data);
    28                                                                 o.data = parsedData;
    29                                                                 renderTree ();
    30                                                         }
    31                                                 )
    32                                                 .done(function() {
    33                                                         //alert( "second success" );
     19                        // PRIVATE methods
     20                        var loadTree = function () {
     21                                if (o.dataSource == 'AJAX') {
     22                                        $.post(o.script,
     23                                                function(data){
     24                                                        if (!data) return;
     25                                                        var parsedData = $.parseJSON(data);
     26                                                        o.data = parsedData;
     27                                                        renderTree ();
     28                                                }
     29                                        ).done(function() {}).fail(function() {}).always(function() {});
     30                                }                               
     31                        };
     32
     33                        var renderTree = function  () {
     34                                var homeNode = createNode({
     35                                        id:0,
     36                                        name:o.homeDirNameDisplay,
     37                                });
     38
     39                                selectDir($(homeNode).find('> A'));
     40
     41                                if (o.data != null) {
     42                                        for (var i = 0; i < o.data.length ; i++) {
     43                                                var node = createNode ({
     44                                                        id: o.data[i].id,
     45                                                        name: o.data[i].name,
     46                                                        curentNode: $('#' + o.dirIDprefix + o.data[i].parentID).find('> A'),
     47                                                        hidden: (o.data[i].parentID > 0) ? true : false
    3448                                                })
    35                                                 .fail(function() {
    36                                                         //alert( "error" );
    37                                                 })
    38                                                 .always(function() {
    39                                                         //alert( "finished" );
    40                                                 });
    41                                         }                               
    42                                 };
     49                                        };
     50                                }
     51                        };
    4352
    44                                 function renderTree () {
    45                                         $(o.container).click(function(){return false;}).mousedown(function(){return false;});
    46                                         $(o.container).bind("contextmenu",function(e){e.preventDefault();});
     53                        //Create a node of Tree
     54                        var createNode = function (d) {
     55                                if( !d ) var d = {};
     56                                if( d.id == undefined ) d.id = null;
     57                                if( d.name == undefined ) d.name = null;
     58                                if( d.curentNode == undefined ) d.curentNode = null;
     59                                if( d.hidden == undefined ) d.hidden = true;
     60                                if( d.clickEvent == undefined ) d.clickEvent = openDir;
     61                                if( d.customEvent == undefined ) d.customEvent = null; //customEvent.eventName, customEvent.eventTrigger
     62                               
     63                                if (d.curentNode != null) {
     64                                        var strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + d.id + '" class="directory collapsed"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
    4765
    48                                         //Home directory
    49                                         strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + 0 + '" class="home"><a href="#" rel="spacehome">' + o.homeDirNameDisplay + '</a></li></ul>';
     66                                        $(d.curentNode).parent().append(strHTML);
     67                                        if (d.hidden == true)
     68                                                $('#' + o.dirIDprefix + d.id).parent().css('display','none');
     69                                       
     70                                }else if (d.id == 0){
     71                                        var strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + d.id + '" class="home"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
    5072                                        $(o.container).append(strHTML);
    51                                         $('#' + o.dirIDprefix + 0).find('a').click(function(){return false;}).mousedown(function(){return false;});
    52                                         $('#' + o.dirIDprefix + 0).find('a').bind("contextmenu",function(e){
    53                                         e.preventDefault();
    54                                         showContextMenu (this);
    55                                         });
    56 
    57                                         if (o.data != null) {
    58                                                 for (var i = 0; i < o.data.length ; i++) {
    59                                                         strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + o.data[i].id + '" class="directory collapsed"><a href="#" rel="' + o.data[i].name + '">' + o.data[i].name + '</a></li></ul>';
    60 
    61                                                         if (o.data[i].parentID > 0){
    62                                                                 $('#' + o.dirIDprefix + o.data[i].parentID).append(strHTML);
    63                                                                 $('#' + o.dirIDprefix + o.data[i].id).parent().css('display','none');
    64                                                         }
    65                                                         else {
    66                                                                
    67                                                                 $('#' + o.dirIDprefix + 0).append(strHTML);
    68                                                         }
    69 
    70                                                         $('#' + o.dirIDprefix + o.data[i].id).find('a').click(function(){openDir(this);return false;}).mousedown(function(){return false;});
    71                                                         $('#' + o.dirIDprefix + o.data[i].id).find('a').bind("contextmenu",function(e){
    72                                                         e.preventDefault();
    73                                                         showContextMenu (this);
    74                                                      });
    75                                                 };
    76                                         }
    77                                 };
    78 
    79                                 function openDir (o) {
    80                                         if( $(o).parent().hasClass('collapsed') ) {
    81                                                 $(o).parent().find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
    82                                                 $(o).parent().removeClass('collapsed').addClass('expanded');
    83                                         }
    84                                         else if( $(o).parent().hasClass('expanded') ) {
    85                                                 $(o).parent().find('> UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
    86                                                 $(o).parent().removeClass('expanded').addClass('collapsed');
    87                                         }
    88                                         selectDir(o);
    8973                                }
    9074
    91                                 function selectDir(o) {
    92                                         $('.currentDir').removeClass('currentDir');
    93                                         $(o).addClass('currentDir');
     75                                //bind event on new node
     76                                $('#' + o.dirIDprefix + d.id).find('a').bind("click", function(e){d.clickEvent(this)});
     77                                $('#' + o.dirIDprefix + d.id).find('a').bind("contextmenu",function(e){
     78                                e.preventDefault();
     79                                showContextMenu (this);
     80                                });
     81
     82                                if (d.customEvent != null)
     83                                        $('#' + o.dirIDprefix + d.id).find('a').bind(d.customEvent.eventName, function(e){d.customEvent.eventTrigger(this)});
     84
     85                                return $('#' + o.dirIDprefix + d.id);
     86                        }
     87                        //END - Create a node of Tree
     88
     89                        var deleteNode = function (n) {
     90                                if (!$(n).parent().hasClass('home'))
     91                                        $(n).remove();
     92                        }
     93
     94                        var isHome = function (n) {
     95                                return $(n).parent().hasClass('home');
     96                        }
     97
     98                        var countNodeChild = function (n) {
     99                                var parent = $(n).parent();
     100                                return $(parent).find('UL').size();
     101                        }
     102
     103                        var openDir = function (o) {
     104                                if( $(o).parent().hasClass('collapsed') ) {
     105                                        $(o).parent().find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
     106                                        $(o).parent().removeClass('collapsed').addClass('expanded');
    94107                                }
     108                                else if( $(o).parent().hasClass('expanded') ) {
     109                                        $(o).parent().find('> UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
     110                                        $(o).parent().removeClass('expanded').addClass('collapsed');
     111                                }
     112                                selectDir(o);
     113                        }
    95114
    96                                 function showContextMenu (n) {
    97                                         alert ('showContextMenu on ' + $(n).text());
    98                                 };
     115                        var selectDir = function (c) {
     116                                $('.currentDir').removeClass('currentDir');
     117                                $(c).addClass('currentDir');
     118                        }
    99119
     120                        var showContextMenu = function  (n) {
     121                                alert ('showContextMenu on ' + $(n).text());
     122                        };
    100123
     124                        loadTree();
     125                        // END - PRIVATE methods
    101126
    102                                 loadTree();
    103                         });
    104127
    105128                        this.expandAll = function() {
    … …  
    107130                        };
    108131
    109                         this.getCurrentDir = function() {
     132                        this.getCurrentDirName = function() {
    110133                                return $(o.container).find('.currentDir').attr('rel');
    111134                        };
    112135
    113                         this.createDir = function() {
    114                                         /**
    115                                         * 1. Send request create directory to server
    116                                         * 2. Get ID of new directory from server
    117                                         * 3. Create node of tree
    118                                         */
     136                        this.getCurrentDir = function() {
     137                                return $(o.container).find('.currentDir');
     138                        };
    119139
     140                        this.createDir = function(c) {
    120141
    121                                         $.post(o.script,{action:"create_dir",parentID:pid}, function (data) {
     142                                var cid = $(c).parent().attr('id');
     143                                var pid = cid.substring(o.dirIDprefix.length, cid.length);
    122144
     145                                var dirName = prompt("Please enter new directory name", "");
     146
     147                                $.post(o.script,{action:"create_dir",parentID:pid,name:dirName}, function (data) {
     148                                        if (!data) return;
     149                                        var parsedData = $.parseJSON(data);
     150
     151                                        createNode({
     152                                                id: parsedData.id,
     153                                                name: parsedData.name,
     154                                                curentNode: c,
     155                                                hidden: false,
     156                                                //customEvent: {eventName: "click", eventTrigger: function(o){alert('This click!')}}
    123157                                        });
     158                                });
     159                        }
     160
     161                        this.deleteDir = function (c) {
     162                                var childExisted = (countNodeChild(c) > 0) ? true:false;
     163                                var confirmDel = false;
     164                                var confirmChild = true;
     165
     166                                if (isHome(c)) return;
     167
     168                                confirmDel = confirm('Are you sure you want to delete this Directory?');
     169
     170                                if (childExisted > 0 && confirmDel)
     171                                        confirmChild = confirm('This node has childs, you still want to delete it?');
     172
     173                                if (confirmDel && confirmChild) deleteNode(c);
     174
    124175                        }
    125176
    … …  
    130181                        return this.initialize();
    131182                },
    132                
    133                
    134                 /*violetGrid: function(o, h) {
    135 
    136                 }*/
    137183        });
    138184

  • pro-bachkim-filespace/violetspace-prototype/getdata.php

    r1 r4  
    2222                );
    2323
    24 if (count($_POST) == 0) {
     24if (isset($_POST['action'])) {
     25        if ($_POST['action'] == 'create_dir') {
     26                $newID = 9;
     27                $aryNewDir = array('id' => $newID, 'name' => $_POST['name'], 'parentID' => $_POST['parentID']);
     28                echo json_encode($aryNewDir);
     29        }
     30}
     31else {
    2532        echo json_encode($aryDir);
    2633}

  • pro-bachkim-filespace/violetspace-prototype/index.html

    r1 r4  
    3636                        <div class="btn-group">
    3737                                <button id="btnNewFolder" class="btn btn-success" title="Tạo thÆ° mục mới"><i class="icon-folder-close"></i></button>
     38                                <button id="btnDel" class="btn btn-success" title="Xóa"><i class="icon-eraser"></i></button>
    3839                                <button class="btn btn-success" title="Sao chép"><i class="icon-copy"></i></button>
    3940                                <button class="btn btn-success" title="Cắt"><i class="icon-cut"></i></button>
Note: See TracChangeset for help on using the changeset viewer.