Changeset 6


Ignore:
Timestamp:
May 29, 2014 5:50:37 PM (11 years ago)
Author:
dungnv
Message:
 
Location:
pro-bachkim-filespace/violetspace-prototype
Files:
6 added
5 edited

Legend:

Unmodified
Added
Removed

  • pro-bachkim-filespace/violetspace-prototype/assets/css/space/style.css

    r5 r6  
    9595        background: #FFFFFF;
    9696        float: left;
    97         width: calc(100% - 223px);
     97        width: calc(100% - 228px);
    9898        margin: 0px;
    9999        padding: 0px;
    … …  
    124124        padding-right: 5px;
    125125        padding-top: 15px;
    126         border-right: #F5F5F5 5px solid;
    127126        display: block;
    128127        width:100%;

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

    r5 r6  
    1919                        $('#directory-view-container').height(dirTreeHeight);
    2020                        $('#directory-content-view-container').height(dirTreeHeight);
    21                         $('#directory-content-view-container').width('calc(100% - ' + ($('#directory-view-container').width() + 3) + 'px)');
     21                        $('#directory-content-view-container').width('calc(100% - ' + ($('#directory-view-container').width() + 8) + 'px)');
    2222                        var scollWidth = $('#directory-content-view-container').width();
    2323
    … …  
    4949                */
    5050
     51                var privateGrid = $('#file-container').violetGrid ({directoryContent:null});
     52
    5153                var privateTree =  $('#treeview-container').violetTree({
    5254                        script:'getdata.php',
    5355                        expandEasing: 'easeOutBounce',
    5456                        collapseEasing: 'easeOutBounce',
    55                         homeDirNameDisplay: "ThÆ° mục gốc"
     57                        homeDirNameDisplay: "ThÆ° mục gốc",
     58                        grid: privateGrid
    5659                });
    5760

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

    r5 r6  
    1515                        if( o.collapseEasing == undefined ) o.collapseEasing = null;
    1616
     17                        if( o.directoryTreeData == undefined ) o.directoryTreeData = null;
     18                        if( o.grid == undefined ) o.grid = null;
     19
    1720                        // PRIVATE methods
    1821                        var sendCommand = function (p) {
    … …  
    4245
    4346                        var renderTree = function  (parseData) {
     47
     48                                o.directoryTreeData = parseData;                               
     49                                var directoryData = parseData.DIRECTORIES;
     50
    4451                                var homeNode = createNode({
    4552                                        id:0,
    … …  
    4855
    4956                                selectDir($(homeNode).find('> A'));
    50                                 if (parseData != null) {
    51                                         for (var i = 0; i < parseData.length ; i++) {
     57                                if (directoryData != null) {
     58                                        for (var i = 0; i < directoryData.length ; i++) {
    5259                                                var node = createNode ({
    53                                                         id: parseData[i].id,
    54                                                         name: parseData[i].name,
    55                                                         curentNode: $('#' + o.dirIDprefix + parseData[i].parentID).find('> A'),
    56                                                         hidden: (parseData[i].parentID > 0) ? true : false
     60                                                        id: directoryData[i].id,
     61                                                        name: directoryData[i].name,
     62                                                        curentNode: $('#' + o.dirIDprefix + directoryData[i].parentID).find('> A'),
     63                                                        hidden: (directoryData[i].parentID > 0) ? true : false
    5764                                                })
    5865                                        };
    … …  
    7178                               
    7279                                if (d.curentNode != null) {
    73                                         var strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + d.id + '" class="directory collapsed"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
     80                                        var strHTML = '<ul class="vstree"><li id="' + o.dirIDprefix + d.id + '" class="directory collapsed"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
    7481
    7582                                        $(d.curentNode).parent().append(strHTML);
    … …  
    7885                                       
    7986                                }else if (d.id == 0){
    80                                         var strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + d.id + '" class="home"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
     87                                        var strHTML = '<ul class="vstree"><li id="' + o.dirIDprefix + d.id + '" class="home"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
    8188                                        $(o.container).append(strHTML);
    8289                                }
    8390
    8491                                //bind event on new node
    85                                 $('#' + o.dirIDprefix + d.id).find('a').bind("click", function(e){d.clickEvent(this)});
     92                                $('#' + o.dirIDprefix + d.id).find('a').bind("click", function(e){d.clickEvent(this);return false;});
    8693                                $('#' + o.dirIDprefix + d.id).find('a').bind("contextmenu",function(e){
    8794                                e.preventDefault();
    … …  
    126133                                $('.currentDir').removeClass('currentDir');
    127134                                $(c).addClass('currentDir');
     135                                sendtoGrid();
    128136                        }
    129137
    … …  
    131139                                alert ('showContextMenu on ' + $(n).text());
    132140                        };
     141
     142                        var sendtoGrid = function () {
     143                                o.grid.getData({
     144                                                                directoryTreeData: o.directoryTreeData,
     145                                                                curentParent:$(o.container).find('.currentDir').parent().attr('id'),
     146                                                                dirIDprefix: o.dirIDprefix
     147                                                        });
     148                        }
    133149
    134150                        loadTree();
    … …  
    205221
    206222                violetGrid: function (o) {
     223                        if( !o ) var o = {};
    207224                        if( o.container == undefined ) o.container = $(this);
    208225                        if( o.defaultViewMode == undefined ) o.defaultViewMode = 'thumbnail';//or 'list'
    209 
    210                         if( o.directoryContent == undefined ) o.directoryContent = null;
    211 
     226                        if( o.directoryTreeData == undefined ) o.directoryTreeData = null;
     227                        if( o.dirIDprefix == undefined ) o.dirIDprefix = null;
     228
     229                        var createNode = function (d) {
     230                                if( !d ) var d = {};
     231                                if( d.id == undefined ) d.id = null;
     232                                if( d.name == undefined ) d.name = null;
     233                                if( d.minetype == undefined ) d.minetype = 'directory';
     234                                if( d.parentID == undefined ) d.parentID = null;
     235                                if( d.clickEvent == undefined ) d.clickEvent = null;
     236                                if( d.customEvent == undefined ) d.customEvent = null;
     237
     238                                var strHTML = '<div class="vscell" rel="id:' + d.id + '">';
     239                                        strHTML += '<div class="selector unselected">';
     240                                        strHTML +=      '<div class="icon-' + d.minetype + '"></div>';
     241                                        strHTML += '</div>';
     242                                        strHTML += '<div class="file-name unselected">' + d.name + '</div>';
     243                                        strHTML += '</div>';
     244
     245                                $(o.container).append(strHTML);
     246
     247                                $('div[rel="id:'+ d.id +'"]').bind('click',function(e){itemClick(this)});
     248                        }
     249
     250                        var itemClick = function (i) {
     251                                $(i).parent().find('.selector').removeClass('selected');
     252                                $(i).parent().find('.selector').addClass('unselected');
     253                                $(i).parent().find('.file-name').removeClass('selected');
     254                                $(i).parent().find('.file-name').addClass('unselected');
     255
     256                                $(i).find('.file-name').removeClass('unselected');
     257                                $(i).find('.file-name').addClass('selected');
     258                                $(i).find('.selector').removeClass('unselected');
     259                                $(i).find('.selector').addClass('selected');
     260                        }
     261
     262                        var renderGrid = function (o) {
     263                                $(o.container).find ('.vscell').remove();
     264                                var childDir = o.directoryTreeData.DIRECTORIES;
     265                                var childFile = o.directoryTreeData.FILES;
     266                                var curentDirID = o.curentParent.substring(o.dirIDprefix.length, o.curentParent.length);
     267                               
     268                                for (var i = 0 ; i < childDir.length; i++) {
     269                                        if (childDir[i].parentID != curentDirID) continue;
     270                                        createNode ({
     271                                                id: childDir[i].id,
     272                                                name: childDir[i].name,
     273                                                parentID: curentDirID,
     274                                        });
     275                                }
     276
     277                                for (var i = 0 ; i < childFile.length; i++) {
     278                                        if (childFile[i].parentID != curentDirID) continue;
     279                                        createNode ({
     280                                                id: childFile[i].id,
     281                                                name: childFile[i].name,
     282                                                parentID: curentDirID,
     283                                                minetype: childFile[i].minetype,
     284                                        });
     285                                }
     286                        }
     287
     288                        this.getData = function (data) {
     289                                o.directoryTreeData = data.directoryTreeData;
     290                                o.curentParent = data.curentParent;
     291                                o.dirIDprefix = data.dirIDprefix
     292                                renderGrid(o);
     293                        }
     294
     295                        this.initialize = function() {
     296                        return this;
     297                };
     298
     299                        return this.initialize();
    212300                }
    213301        });

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

    r5 r6  
    11<?php
    2 /**
    3 *array(
    4 *       0 => array ('id' => 1, 'name' => 'Dir 1', 'parentID' => 0),
    5 *       1 => array ('id' => 2, 'name' => 'Dir 2', 'parentID' => 0),
    6 *       2 => array ('id' => 3, 'name' => 'Dir 1.1', 'parentID' => 1),
    7 *       3 => array ('id' => 4, 'name' => 'Dir 1.1.1', 'parentID' => 3),
    8 *       4 => array ('id' => 5, 'name' => 'Dir 1.1.1.1', 'parentID' => 4),
    9 *)
    10 **/
    11 
    122
    133$aryDir = array(
    … …  
    2212                );
    2313
     14$aryFile = array(
     15                0 => array('id' => 1, 'name' => 'File 1', 'minetype' => 'text', 'size' => '1.5MB', 'parentID' => 1),
     16                1 => array('id' => 2, 'name' => 'File 2', 'minetype' => 'text', 'size' => '1.6MB', 'parentID' => 1),
     17                2 => array('id' => 3, 'name' => 'File 3', 'minetype' => 'text', 'size' => '1.7MB', 'parentID' => 2),
     18                3 => array('id' => 4, 'name' => 'File 4', 'minetype' => 'text', 'size' => '1.8MB', 'parentID' => 2),
     19                4 => array('id' => 5, 'name' => 'File 5', 'minetype' => 'text', 'size' => '1.8MB', 'parentID' => 0),
     20                5 => array('id' => 6, 'name' => 'File 6', 'minetype' => 'text', 'size' => '1.8MB', 'parentID' => 3),
     21                5 => array('id' => 7, 'name' => 'File 7', 'minetype' => 'text', 'size' => '1.8MB', 'parentID' => 5)
     22);
     23
     24$aryData = array('DIRECTORIES' => $aryDir, 'FILES' => $aryFile);
     25
     26
    2427if (isset($_POST['action'])) {
    25         if ($_POST['action'] == 'create_dir') {
     28        /*if ($_POST['action'] == 'create_dir') {
    2629                $newID = 9;
    2730                $aryNewDir = array('id' => $newID, 'name' => $_POST['name'], 'parentID' => $_POST['parentID']);
    … …  
    3134                $aryDelDir = array('id' => $_POST['id'], 'isSuccess' => true);
    3235                echo json_encode($aryDelDir);
    33         }
     36        }*/
    3437}
    3538else {
    36         echo json_encode($aryDir);
     39        echo json_encode($aryData);
    3740}

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

    r5 r6  
    6161            <div id="directory-content-view-container">
    6262                        <div id="file-container" class="vsgrid">
    63                                 <div class="vscell">
    64                                         <div class="selector">
     63                                <!-- <div class="vscell">
     64                                        <div class="selector unselected">
    6565                                                <div class="icon-directory"></div>
    6666                                        </div>
    67                                         <div class="file-name">Dir 1</div>
     67                                        <div class="file-name unselected">Dir 1</div>
    6868                                </div>
    6969
    7070                                <div class="vscell">
    71                                         <div class="selector">
     71                                        <div class="selector selected">
    7272                                                <div class="icon-directory"></div>
    7373                                        </div>
    74                                         <div class="file-name">Dir 2</div>
     74                                        <div class="file-name selected">Dir 2</div>
    7575                                </div>
    7676
    7777                                <div class="vscell">
    78                                         <div class="selector">
     78                                        <div class="selector unselected">
    7979                                                <div class="icon-directory"></div>
    8080                                        </div>
    81                                         <div class="file-name">Dir 3</div>
     81                                        <div class="file-name unselected">Dir 3</div>
    8282                                </div>
    8383
    8484                                <div class="vscell">
    85                                         <div class="selector">
     85                                        <div class="selector unselected">
    8686                                                <div class="icon-text"></div>
    8787                                        </div>
    88                                         <div class="file-name">File 1</div>
     88                                        <div class="file-name unselected">File 1</div>
    8989                                </div>
    9090
    9191                                <div class="vscell">
    92                                         <div class="selector">
     92                                        <div class="selector unselected">
    9393                                                <div class="icon-text"></div>
    9494                                        </div>
    95                                         <div class="file-name">File 2</div>
     95                                        <div class="file-name unselected">File 2</div>
    9696                                </div>
    9797
    9898                                <div class="vscell">
    99                                         <div class="selector">
     99                                        <div class="selector selected">
    100100                                                <div class="icon-text"></div>
    101101                                        </div>
    102                                         <div class="file-name">File 3</div>
     102                                        <div class="file-name selected">File 3</div>
    103103                                </div>
    104104
    105105                                <div class="vscell">
    106                                         <div class="selector">
     106                                        <div class="selector unselected">
    107107                                                <div class="icon-text"></div>
    108108                                        </div>
    109                                         <div class="file-name">File 4</div>
    110                                 </div>
     109                                        <div class="file-name unselected">File 4</div>
     110                                </div> -->
    111111                        </div>
    112112            </div>
Note: See TracChangeset for help on using the changeset viewer.