文件移动及重命名功能

lang/zh-cn/zh-cn.js

@@ -57,6 +57,7 @@ KityMinder.LANG['zh-cn'] = {
         'err_share_data': '加载分享内容出错',
         'err_share_sync_fail': '分享内容同步失败',
         'err_move_file': '文件移动失败',
+        'err_rename': '重命名失败',
 
         'unknownreason': '可能是外星人篡改了代码...',
         'pcs_code': {
@@ -131,12 +132,16 @@ KityMinder.LANG['zh-cn'] = {
     'ui': {
         'load_share_for_edit': '正在加载分享的文件...',
         'share_sync_success': '分享内容已同步',
+        'recycle_clear_confirm': '确认清空回收站么？清空后的文件无法恢复。',
 
         'fullscreen_exit_hint': '按 Esc 或 F11 退出全屏',
 
         'error_detail': '详细信息',
         'copy_and_feedback': '复制并反馈',
         'move_file_confirm': '确定把 "{0}" 移动到 "{1}" 吗？',
+        'rename': '重命名',
+        'rename_success': '<b>{0}</b> 重命名成功',
+        'move_success': '<b>{0}</b> 移动成功',
 
         'command': {
             'appendsiblingnode': '插入同级主题',

src/module/expand.js

@@ -74,8 +74,6 @@ KityMinder.registerModule('Expand', function() {
         policy = policy || EXPAND_POLICY.KEEP_STATE;
         policy(node, state, policy);
 
-        if (!changed) return;
-
         node.renderTree().getMinder().layout(100);
 
         /* 如何加展开效果：

ui/doc.js

@@ -13,6 +13,33 @@ KityMinder.registerUI('doc', function(minder) {
     var current = { saved: true };
     var loading = false;
     var notice = minder.getUI('widget/notice');
+    var finder = minder.getUI('widget/netdiskfinder');
+
+    finder.on('mv', trackFileMove);
+
+    function trackFileMove(from, to) {
+
+        if (current.source != 'netdisk') return;
+
+        var fromPath = from.split('/');
+        var toPath = to.split('/');
+
+        function preCommonLength(a, b) {
+            var i = 0;
+            while((i in a) && (i in b) && a[i] == b[i]) i++;
+            return (i in b) ? 0 : i;
+        }
+
+
+        var originPath = current.path.split('/');
+        var clen = preCommonLength(originPath, fromPath);
+        if (clen) {
+            var movedPath = toPath.concat(originPath.slice(clen));
+            current.path = movedPath.join('/');
+            current.title = movedPath.pop();
+            ret.fire('docchange', current);
+        }
+    }
 
     /**
      * 加载文档
@@ -46,9 +73,8 @@ KityMinder.registerUI('doc', function(minder) {
             doc.data = data;
             doc.json = JSON.stringify(data);
 
-            minder.getUI('topbar/title').setTitle(doc.title, doc.saved);
-
             ret.fire('docload', doc);
+            ret.fire('docchange', doc);
 
             return doc;
 
@@ -67,9 +93,10 @@ KityMinder.registerUI('doc', function(minder) {
         current = doc;
         doc.data = minder.exportJson();
         doc.json = JSON.stringify(doc.data);
+        doc.saved = true;
 
-        minder.getUI('topbar/title').setTitle(doc.title, doc.saved = true);
         ret.fire('docsave', doc);
+        ret.fire('docchange', doc);
     }
 
     function getCurrent() {
@@ -87,24 +114,16 @@ KityMinder.registerUI('doc', function(minder) {
         minder.on('contentchange', function() {
             if (loading) return;
 
-            var $title = minder.getUI('topbar/title');
-
             if (current.source != 'netdisk') {
 
                 current.title = minder.getMinderTitle();
-                $title.setTitle(current.title, current.saved = false);
-                ret.fire('docchange', current);
+                current.saved = false;
 
             } else {
-
-                if (current.json != JSON.stringify(minder.exportJson())) {
-                    $title.setSaved(current.saved = false);
-                    ret.fire('docchange', current);
-                } else {
-                    $title.setSaved(current.saved = true);
+                current.saved = current.json == JSON.stringify(minder.exportJson());
             }
 
-            }
+            ret.fire('docchange', current);
         });
     }, 1000);
 

ui/menu/open/draft.js

@@ -96,6 +96,7 @@ KityMinder.registerUI('menu/open/draft', function(minder) {
     renderList();
 
     function pushDraft(doc) {
+        if (doc.saved) return;
         if (doc == lastDoc) {
             if (current) {
                 draftList.remove(0);

ui/menu/open/netdisk.js

@@ -18,7 +18,7 @@ KityMinder.registerUI('menu/open/netdisk', function(minder) {
     var notice = minder.getUI('widget/notice');
 
     /* 网盘面板 */
-    var $panel = $($open.createSub('netdisk'));
+    var $panel = $($open.createSub('netdisk')).addClass('netdisk-open-panel');
 
     /* extension => protocol */
     var supports = {};

ui/menu/open/recent.js

@@ -15,6 +15,7 @@ KityMinder.registerUI('menu/open/recent', function(minder) {
     var frdTime = minder.getUI('widget/friendlytimespan');
     var doc = minder.getUI('doc');
     var recentList = minder.getUI('widget/locallist').use('recent');
+    var finder = minder.getUI('widget/netdiskfinder');
 
     /* 网盘面板 */
     var $panel = $($open.createSub('recent')).addClass('recent-file-panel');
@@ -59,8 +60,33 @@ KityMinder.registerUI('menu/open/recent', function(minder) {
     doc.on('docload', addToList);
     doc.on('docsave', addToList);
 
+    finder.on('mv', trackFileMove);
+
     renderList();
 
+    function trackFileMove(from, to) {
+        var fromPath = from.split('/');
+        var toPath = to.split('/');
+
+        function preCommonLength(a, b) {
+            var i = 0;
+            while((i in a) && (i in b) && a[i] == b[i]) i++;
+            return (i in b) ? 0 : i;
+        }
+
+        recentList.forEach(function(item) {
+            var originPath = item.path.split('/');
+            var clen = preCommonLength(originPath, fromPath);
+            if (clen) {
+                var movedPath = toPath.concat(originPath.slice(clen));
+                item.path = movedPath.join('/');
+                item.filename = toPath.pop();
+            }
+        });
+
+        renderList();
+    }
+
     function addToList(doc) {
 
         if (doc.source != 'netdisk') return;

ui/menu/save/netdisk.js

@@ -66,6 +66,8 @@ KityMinder.registerUI('menu/save/netdisk', function(minder) {
 
     $format.val('.km');
 
+    $format.on('change', normalizeFilename);
+
     /* 保存按钮 */
     var $saveBtn = $('<button></button>')
         .addClass('save-button')
@@ -73,7 +75,7 @@ KityMinder.registerUI('menu/save/netdisk', function(minder) {
         .click(save)
         .appendTo($selects);
 
-    $menu.on('show', setFileName);
+    $menu.on('show', setFilename);
 
     $finder.on('fileclick', function(file) {
         $finder.select(file.path);
@@ -98,7 +100,8 @@ KityMinder.registerUI('menu/save/netdisk', function(minder) {
     var autoSaveTimer = 0;
 
     function autoSave() {
-        function lazySave() {
+        function lazySave(doc) {
+            if (doc.saved) return;
             clearTimeout(autoSaveTimer);
             autoSaveTimer = setTimeout(saveCurrent, autoSaveDuration);
         }
@@ -127,13 +130,26 @@ KityMinder.registerUI('menu/save/netdisk', function(minder) {
         return doSave(doc.path, doc.protocol, doc, $title, 'leaveTheMenu');
     }
 
-    function getSaveContext() {
+    function normalizeFilename() {
         var filename = $filename.val();
+        var info = fio.file.anlysisPath(filename);
+        var ext = info.extension;
+
+        if (ext != $format.val()) {
+            if (ext in supports) {
+                $filename.val(info.name + $format.val());
+            } else {
+                $filename.val(filename + $format.val());
+            }
+            $filename[0].select();
+        }
 
-        if (fio.file.anlysisPath(filename).extension != $format.val()) {
-            $filename.val(filename += $format.val())[0].select();
+        return $filename.val();
     }
 
+    function getSaveContext() {
+        var filename = normalizeFilename();
+
         var path = $finder.pwd() + filename;
         var doc = $doc.current();
         var protocol = supports[$format.val()];
@@ -212,22 +228,27 @@ KityMinder.registerUI('menu/save/netdisk', function(minder) {
         });
     }
 
-    function setFileName() {
+    function setFilename() {
         var doc = $doc.current();
 
         switch (doc.source) {
             case 'netdisk':
-                setFileNameForNetDiskSource(doc);
+                setFilenameForNetDiskSource(doc);
                 break;
             default:
-                setFileNameForOtherSource(doc);
+                setFilenameForOtherSource(doc);
                 break;
         }
 
         $filename[0].select();
     }
 
-    function setFileNameForNetDiskSource(doc) {
+    function setFilenameInputValue(filename) {
+        $filename.val(filename);
+        normalizeFilename(filename);
+    }
+
+    function setFilenameForNetDiskSource(doc) {
         if (!fio.user.current()) return;
 
         var path = doc.path;
@@ -242,11 +263,11 @@ KityMinder.registerUI('menu/save/netdisk', function(minder) {
             $finder.select(path);
         }
 
-        $filename.val(pathInfo.filename);
+        setFilenameInputValue(pathInfo.filename);
     }
 
-    function setFileNameForOtherSource(doc) {
-        $filename.val(doc.title);
+    function setFilenameForOtherSource(doc) {
+        setFilenameInputValue(doc.title);
         $finder.select(null);
     }
 

ui/menu/share/share.js

@@ -11,11 +11,19 @@ KityMinder.registerUI('menu/share/share', function(minder) {
     var $share_menu = minder.getUI('menu/menu').createSubMenu('share');
     var $create_menu = $($share_menu.createSub('createshare'));
     var $manage_menu = $($share_menu.createSub('manageshare'));
+    var $share_list = $('<ul>')
+        .attr('id', 'manage-share-list')
+        .appendTo($manage_menu);
     var $doc = minder.getUI('doc');
     var notice = minder.getUI('widget/notice');
+    var finder = minder.getUI('widget/netdiskfinder');
 
     var BACKEND_URL = 'http://naotu.baidu.com/share.php';
 
+    if (window.location.host == 'local.host') {
+        BACKEND_URL = 'http://naotu.baidu.com/share_debug.php'; // 测试环境
+    }
+
     var currentShare = null;
     var shareList = [];
 
@@ -67,6 +75,51 @@ KityMinder.registerUI('menu/share/share', function(minder) {
         }
     });
 
+    finder.on('mv', trackFileMove);
+
+    function trackFileMove(from, to) {
+        var fromPath = from.split('/');
+        var toPath = to.split('/');
+
+        function preCommonLength(a, b) {
+            var i = 0;
+            while((i in a) && (i in b) && a[i] == b[i]) i++;
+            return (i in b) ? 0 : i;
+        }
+
+        shareListLoaded.then(function(list) {
+            var userChecked = fio.user.check();
+            list.forEach(function(item) {
+                var originPath = item.path.split('/');
+                var clen = preCommonLength(originPath, fromPath);
+                if (clen) {
+
+                    var movedPath = toPath.concat(originPath.slice(clen));
+
+                    userChecked.then(function(user) {
+                        $.pajax({
+                            url: BACKEND_URL,
+                            type: 'POST',
+                            data: {
+                                action: 'move',
+                                ak: user.access_token,
+                                id: item.id || item.shareMinder.id,
+                                path: movedPath.join('/')
+                            }
+                        }).then(function() {
+                            notice.info(minder.getLang('ui.share_sync_success', item.title));
+                        })['catch'](function(e) {
+                            notice.error('err_share_sync_failed', e);
+                        });
+                    });
+                    item.path = movedPath.join('/');
+                }
+            });
+            renderShareList(list);
+
+        });
+    }
+
     function loadShareFile() {
 
         var pattern = /(?:shareId|share_id)=(\w+)([&#]|$)/;
@@ -424,12 +477,10 @@ KityMinder.registerUI('menu/share/share', function(minder) {
 
     function renderShareList(list) {
         var frdTime = minder.getUI('widget/friendlytimespan');
-        var $list = $('<ul>')
-            .attr('id', 'manage-share-list')
-            .appendTo($manage_menu);
         if (!list) return;
+        $share_list.empty();
         list.forEach(function(share) {
-            $list.append(buildShareItem(share));
+            $share_list.append(buildShareItem(share));
         });
     }
 

ui/theme/default/css/_kityminder.less

@@ -71,6 +71,47 @@ html, body {
         text-align: center;
         font-weight: normal;
         color: @ui-fore;
+        vertical-align: middle;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+
+        span {
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+        }
+
+        input {
+            outline: none;
+            font-size: 14px;
+            border: none;
+            border-radius: 2px;
+            box-shadow: 0 0 3px black;
+            padding: 3px 2px 3px 5px;
+            background: white;
+        }
+
+        &.rename-enabled{
+            cursor: text;
+            &:after {
+                content: ' ';
+                width: 20px;
+                height: 20px;
+                display: inline-block;
+                background: url(../images/icons.png) 1px -1110px;
+                vertical-align: middle;
+                position: relative;
+                top: -1px;
+                margin-left: 5px;
+                opacity: 0;
+                transition: opacity ease .3s;
+            }
+        }
+
+        &.rename-enabled:hover:after {
+            opacity: 0.6;
+        }
     
         &.loading {
             &:before {

ui/theme/default/css/_mainmenu.less

@@ -37,7 +37,7 @@
 }
 
 #main-menu {
-    @left-width: 200px;
+    @left-width: 150px;
     background: white;
     
     .dock;

ui/theme/default/css/_netdisk.less

@@ -7,6 +7,13 @@
     100% { transform: translate(0, 0); }
 }
 
+@keyframes shake-left-right {
+    0% { transform: translate(0, 0); }
+    25% { transform: translate(-3px, 0); }
+    75% { transform: translate(3px, 0); }
+    100% { transform: translate(0, 0); }
+}
+
 .netdisk-finder {
     
     .dir.drag-enter {
@@ -23,23 +30,44 @@
         }
     }
 
+    &.recycle-bin {
+        .head .control {
+            .button.mkdir {
+                display: none;
+            }
+            .button.recycle {
+                display: none;
+            }
+            .button.recycle-clear {
+                display: block;
+            }
+        }
+        .file-list .file-list-item.dir:after {
+            display: none;
+        }
+    }
+
     .head {
         padding-bottom: 10px;
         height: 30px;
         border-bottom: 1px solid #eee;
         .control {
             float: right;
-            .mkdir {
-            }
             .button {
                 vertical-align: middle;
                 font-size: 0;
                 background: url(../images/finder.svg) no-repeat;
-                box-sizing: border-box;
                 width: 30px;
                 height: 30px;
                 border-radius: 2px;
+                box-sizing: border-box;
                 border: 1px solid transparent;
+                &:hover {
+                    border: 1px solid lighten(#717B94, 30%);
+                }
+                &:active {
+                    box-shadow: inset 0 1px 3px fadeOut(#717B94, 80%);
+                }
 
                 &.recycle {
                     background-position: -30px 0;
@@ -48,12 +76,11 @@
                     }
                 }
 
-                &:hover {
-                    border: 1px solid lighten(#717B94, 30%);
-                }
-                &:active {
-                    box-shadow: inset 0 1px 3px fadeOut(#717B94, 80%);
+                &.recycle-clear {
+                    display: none;
+                    background-position: -90px 0;
                 }
+
             }
         }
         .nav {
@@ -111,6 +138,7 @@
     }
 
     .file-list {
+        .dock(41px, 0, 0, 0);
         margin: 0;
         padding: 0;
         list-style: none;
@@ -124,6 +152,7 @@
         }
         .file-list-item {
             font-size: 14px;
+            height: 20px;
             line-height: 20px;
             padding: 10px 20px 10px 40px;
             cursor: default;
@@ -131,13 +160,51 @@
             -khtml-user-drag: element;
             border: 1px solid transparent;
 
+            .rename-button {
+                display: inline-block;
+                width: 20px;
+                height: 20px;
+                margin-left: 15px;
+                vertical-align: middle;
+                border-radius: 2px;
+                box-sizing: border-box;
+                border: 1px solid transparent;
+                opacity: 0;
+                transition: transform,opacity ease .2s;
+                transform: scale(0);
+                font-size: 0;
                 &:hover {
-/*                 background-color: lighten(@tab-hover, 55%); */
+                    border: 1px solid lighten(#717B94, 30%);
                 }
                 &:active {
-                background-color: lighten(@tab-hover, 50%);
+                    box-shadow: inset 0 1px 3px fadeOut(#717B94, 80%);
+                }
+            }
+
+            .filename {
+                height: 20px;
+                line-height: 20px;
+                vertical-align: middle;
+            }
+
+            input {
+                margin: 0;
+                outline: none;
+                width: 61.80%;
+            }
+            
+            &:hover {
+                .rename-button {
+                    transition: transform,opacity ease .2s .5s;
+                    transform: scale(1);
+                    opacity: 1;
+                    background: url(../images/icons.png) 1px -1130px;
+                }
             }
             &.selected {
+                &:hover .rename-button {
+                    background: url(../images/icons.png) 1px -1110px;
+                }
                 background-color: lighten(@tab-active, 20%);
                 color: white;
                 &.dir .icon {
@@ -165,6 +232,14 @@
                     background: url(../images/icons.png) 0 -445px no-repeat;
                 }
             }
+            &.renaming {
+                input.invalid-name {
+                    animation: shake-left-right .3s ease;
+                }
+                .rename-button {
+                    display: none !important;
+                }
+            }
             &.dir {
                 position: relative;
                 .icon {
@@ -183,16 +258,19 @@
                     top: 20px;
                     margin-top: -4px;
                 }
-                input {
-                    margin: 0;
-                    outline: none;
-                    width: 61.80%;
-                }
             }
         }
     }
 }
 
+.netdisk-open-panel .netdisk-finder {
+    .dock;
+}
+
+.netdisk-save-panel .netdisk-finder {
+    .dock(0, 0, 50px, 0);
+}
+
 // for save
 .netdisk-save-panel .netdisk-file-list {
     bottom: 50px;

ui/theme/default/css/_share.less

@@ -30,6 +30,7 @@
     overflow: auto;
     overflow-x: hidden;
     overflow-y: auto;
+    padding-right: 10px;
 
     &:empty:after {
         content: '没有分享';

ui/topbar/title.js

@@ -9,46 +9,120 @@
 
 KityMinder.registerUI('topbar/title', function(minder) {
     var $title = $('<h1>').appendTo('#panel');
+    var $doc = minder.getUI('doc');
+    var finder = minder.getUI('widget/netdiskfinder');
+    var notice = minder.getUI('widget/notice');
+    var renameEnabled = false;
+    var renameMode = false;
 
-    var _title = minder.getLang('ui.untitleddoc');
-    var _saved = false;
+    $doc.on('docchange', update);
 
-    function update() {
+    $title.on('click', rename);
 
-        function setTitle(title) {
-            $title.text(title);
-            document.title = title + ' - 百度脑图';
+    function rename() {
+        if (!renameEnabled || renameMode) return;
+
+        var doc = $doc.current();
+
+        var $input = $('<input>').width($title.find('.title-content').width());
+        var oldFilename = doc.title;
+        var oldPath = doc.path;
+
+        $input.val(oldFilename);
+        setTimeout(function() {
+            $input[0].select();
+        });
+
+        $title.addClass('rename-mode');
+        $title.empty();
+        $title.append($input);
+
+        renameMode = true;
+
+        $input.on('keydown', function(e) {
+            if (e.keyCode == 13) confirm();
+            else if (e.keyCode == 27) {
+                cancel();
+                e.stopPropagation();
             }
+        }).on('blur', cancel);
 
-        if (_saved) {
-            setTitle(_title);
-        } else {
-            setTitle('* ' + _title);
+        function exit() {
+            setTimeout(function() {
+                renameMode = false;
+            });
         }
+
+        function cancel() {
+            update();
+            exit();
         }
 
+        function confirm() {
+            var newFilename = $input.val();
+            var oldFilenameInfo = fio.file.anlysisPath(oldFilename);
+            var newFilenameInfo = fio.file.anlysisPath(newFilename);
+
+            if (!newFilenameInfo.name.length) return cancel();
+
+            newFilename = newFilenameInfo.name + oldFilenameInfo.extension;
+
+            var newPath = fio.file.anlysisPath(oldPath).parentPath + newFilename;
+
+            if (newPath == oldPath) return cancel();
+
+            $title.addClass('loading');
+
+            fio.file.move({
+                path: oldPath,
+                newPath: newPath
+            }).then(function() {
+                doc.path = newPath;
+                doc.title = newFilename;
+                finder.fire('mv', oldPath, newPath);
+                notice.info(minder.getLang('ui.rename_success', newFilename));
+            })['catch'](function(e) {
+                notice.error('err_rename', e);
+            }).then(function() {
+                $title.removeClass('loading');
                 update();
+                exit();
+            });
+        }
+    }
 
-    return {
-        $title: $title,
+    function enableRename(enabled) {
+        renameEnabled = enabled;
+        if (enabled) $title.addClass('rename-enabled');
+        else $title.removeClass('rename-enabled');
+    }
 
-        setTitle: function(title, saved) {
-            _title = title;
+    function update() {
 
-            return this.setSaved(saved);
-        },
+        var doc = $doc.current();
 
-        getTitle: function() {
-            return _title;
-        },
+        function setTitle(title) {
+            title = title || minder.getLang('ui.untitleddoc');
+            $title.empty().append('<span class="title-content">' + title + '</span>');
+            document.title = title ? title + ' - 百度脑图' : '百度脑图';
+        }
 
-        setSaved: function(saved) {
+        if (doc.saved) {
+            setTitle(doc.title);
+        } else {
+            setTitle('* ' + doc.title);
+        }
 
-            _saved = saved !== false;
+        enableRename(doc.source == 'netdisk' && doc.saved);
+    }
 
     update();
 
-            return this;
+    return {
+        $title: $title,
+
+        getTitle: function() {
+            return $doc.current().title;
         }
     };
 });
\ No newline at end of file

ui/widget/locallist.js

@@ -70,6 +70,7 @@ KityMinder.registerUI('widget/locallist', function() {
 
         function forEach(callback) {
             list.forEach(callback);
+            save();
         }
 
         load.call(this);