Просмотр исходного кода

Add empty-space folder context menu

Enable right-click on the file area background to open a folder-level context menu with New Folder and Folder Properties actions. Refactor menu positioning into a shared helper so both item and folder menus are clamped to the viewport, and add the new context-menu locale keys across supported languages.
Toby Chui 3 дней назад
Родитель
Сommit
4dd3411a88

+ 50 - 2
src/web/SystemAO/file_system/file_selector.html

@@ -854,7 +854,7 @@
                     </div>
 
                     <div class="fsContent">
-                        <div class="fsFiles" id="fileArea">
+                        <div class="fsFiles" id="fileArea" oncontextmenu="showFolderContextMenu(event);">
                             <div class="fsPlaceholder" id="loadingPlaceholder">
                                 <div class="fsSpinner"></div>
                                 <div locale="message/loading">Loading</div>
@@ -2627,8 +2627,43 @@
                 var menu = $("#contextMenu");
                 menu.html(buildContextMenuItems(isDir));
                 menu.addClass("open");
+                positionContextMenu(menu, event);
+            }
+
+            /*
+                Right click on empty space acts on the folder being browsed
+                rather than on any item, so it offers the two things that make
+                sense there. The per item handler above stops propagation, so
+                this only ever runs for a click that missed every file object.
+            */
+            function showFolderContextMenu(event){
+                event.preventDefault();
+                event.stopPropagation();
+                if (inlineEditActive){
+                    return;
+                }
+                //No item is involved - onContextAction keys off this being null
+                contextTarget = null;
+                closeMoreMenu();
+
+                var menu = $("#contextMenu");
+                menu.html(buildFolderContextMenuItems());
+                menu.addClass("open");
+                positionContextMenu(menu, event);
+            }
 
-                //Clamp to the viewport so the menu never opens off screen
+            function buildFolderContextMenuItems(){
+                var items = [];
+                items.push(contextMenuItem("newfolder", ICONS.folderPlus,
+                    applocale.getString("ctx/newfolder", "New Folder")));
+                items.push('<div class="fsMenuSep"></div>');
+                items.push(contextMenuItem("folderproperties", ICONS.info,
+                    applocale.getString("ctx/folderproperties", "Folder Properties")));
+                return items.join("");
+            }
+
+            //Clamp to the viewport so a menu never opens off screen
+            function positionContextMenu(menu, event){
                 var width = menu.outerWidth();
                 var height = menu.outerHeight();
                 var left = event.clientX;
@@ -2673,6 +2708,19 @@
             function onContextAction(action){
                 var target = contextTarget;
                 closeContextMenu();
+
+                /*
+                    Folder level actions come from the empty space menu and have
+                    no target, so they are handled before the guard below.
+                */
+                if (action == "newfolder"){
+                    newFolder();
+                    return;
+                }else if (action == "folderproperties"){
+                    ctxProperties(currentDir);
+                    return;
+                }
+
                 if (target == null){
                     return;
                 }

+ 18 - 6
src/web/SystemAO/locale/file_selector.json

@@ -71,7 +71,9 @@
                 "message/nameexists": "已有相同名稱的項目",
                 "message/zipfailed": "無法壓縮此資料夾",
                 "": "",
-                "footer/create": "建立"
+                "footer/create": "建立",
+                "ctx/newfolder": "新增資料夾",
+                "ctx/folderproperties": "資料夾內容"
             },
             "titles": {
                 "Back": "上一頁",
@@ -163,7 +165,9 @@
                 "message/nameexists": "已有相同名稱的項目",
                 "message/zipfailed": "無法壓縮此資料夾",
                 "": "",
-                "footer/create": "建立"
+                "footer/create": "建立",
+                "ctx/newfolder": "新增資料夾",
+                "ctx/folderproperties": "資料夾內容"
             },
             "titles": {
                 "Back": "上一頁",
@@ -255,7 +259,9 @@
                 "message/nameexists": "已有相同名称的项目",
                 "message/zipfailed": "无法压缩此文件夹",
                 "": "",
-                "footer/create": "创建"
+                "footer/create": "创建",
+                "ctx/newfolder": "新建文件夹",
+                "ctx/folderproperties": "文件夹属性"
             },
             "titles": {
                 "Back": "上一页",
@@ -347,7 +353,9 @@
                 "message/nameexists": "An item with that name already exists",
                 "message/zipfailed": "Unable to compress this folder",
                 "": "",
-                "footer/create": "Create"
+                "footer/create": "Create",
+                "ctx/newfolder": "New Folder",
+                "ctx/folderproperties": "Folder Properties"
             },
             "titles": {
                 "Back": "Back",
@@ -439,7 +447,9 @@
                 "message/nameexists": "同じ名前の項目が既に存在します",
                 "message/zipfailed": "このフォルダを圧縮できません",
                 "": "",
-                "footer/create": "作成"
+                "footer/create": "作成",
+                "ctx/newfolder": "新しいフォルダー",
+                "ctx/folderproperties": "フォルダーのプロパティ"
             },
             "titles": {
                 "Back": "戻る",
@@ -531,7 +541,9 @@
                 "message/nameexists": "같은 이름의 항목이 이미 있습니다",
                 "message/zipfailed": "이 폴더를 압축할 수 없습니다",
                 "": "",
-                "footer/create": "만들기"
+                "footer/create": "만들기",
+                "ctx/newfolder": "새 폴더",
+                "ctx/folderproperties": "폴더 속성"
             },
             "titles": {
                 "Back": "뒤로",