easy-file-system 2.1.31 → 2.1.33

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "easy-file-system",
   "author": "James Smith",
-  "version": "2.1.31",
+  "version": "2.1.33",
   "license": "MIT, Anti-996",
   "homepage": "https://github.com/djalbat/easy-file-system",
   "description": "A file system explorer and a rubbish bin.",

package/src/eventTypes.js

@@ -2,9 +2,9 @@
 
 export const OPEN_EVENT_TYPE = "open";
 export const MOVE_EVENT_TYPE = "move";
+export const EDIT_EVENT_TYPE = "edit";
 export const CHANGE_EVENT_TYPE = "change";
 export const CANCEL_EVENT_TYPE = "cancel";
-export const RENAME_EVENT_TYPE = "rename";
 export const REMOVE_EVENT_TYPE = "remove";
 export const SELECT_EVENT_TYPE = "select";
 export const CREATE_EVENT_TYPE = "create";
@@ -14,7 +14,7 @@ export default {
   MOVE_EVENT_TYPE,
   CHANGE_EVENT_TYPE,
   CANCEL_EVENT_TYPE,
-  RENAME_EVENT_TYPE,
+  EDIT_EVENT_TYPE,
   REMOVE_EVENT_TYPE,
   SELECT_EVENT_TYPE,
   CREATE_EVENT_TYPE

package/src/example/view/explorer/first.js

@@ -6,10 +6,12 @@ export default class FirstExplorer extends Explorer {
   initialise() {
     super.initialise();
 
-    this.addFilePath("directory1/file1.txt");
-    this.addFilePath("directory1/file2.txt");
+    const readOnly = true;
 
-    this.addDirectoryPath("directory1/directory3");
+    this.addFilePath("directory1/file1.txt", readOnly);
+    this.addFilePath("directory1/file2.txt", readOnly);
+
+    this.addDirectoryPath("directory1/directory3", readOnly);
   }
 
   static defaultProperties = {

package/src/example/view.js

@@ -11,12 +11,6 @@ import SecondExplorer from "./view/explorer/second";
 const { first, second } = arrayUtilities;
 
 export default class View extends Element {
-  createFilePathButtonClickHandler = (event, element) => {
-    const firstExplorer = this.getFirstExplorer();
-
-    firstExplorer.createFilePath();
-  }
-
   createDirectoryPathButtonClickHandler = (event, element) => {
     const Explorer = this.getFirstExplorer();
 
@@ -29,24 +23,30 @@ export default class View extends Element {
     firstExplorer.editSelectedPath();
   }
 
+  createFilePathButtonClickHandler = (event, element) => {
+    const firstExplorer = this.getFirstExplorer();
+
+    firstExplorer.createFilePath();
+  }
+
   openHandler = (filePath, explorer) => {
     console.log("open", filePath)
   }
 
-  moveHandler = (pathMaps, explorer, done) => {
-    console.log("move", JSON.stringify(pathMaps, null, "  "))
+  editHandler = (pathMaps, explorer, done) => {
+    console.log("edit", JSON.stringify(pathMaps, null, "  "))
 
     done();
   }
 
-  removeHandler = (pathMaps, explorer, done) => {
-    console.log("remove", JSON.stringify(pathMaps, null, "  "))
+  moveHandler = (pathMaps, explorer, done) => {
+    console.log("move", JSON.stringify(pathMaps, null, "  "))
 
     done();
   }
 
-  renameHandler = (pathMaps, explorer, done) => {
-    console.log("rename", JSON.stringify(pathMaps, null, "  "))
+  removeHandler = (pathMaps, explorer, done) => {
+    console.log("remove", JSON.stringify(pathMaps, null, "  "))
 
     done();
   }
@@ -88,15 +88,15 @@ export default class View extends Element {
       <RubbishBin onRemove={this.removeHandler} />,
       <FirstExplorer onOpen={this.openHandler}
                      onMove={this.moveHandler}
+                     onEdit={this.editHandler}
                      onRemove={this.removeHandler}
-                     onRename={this.renameHandler}
                      onCreate={this.createHandler}
                      onSelect={this.selectHandler}
       />,
       <SecondExplorer onOpen={this.openHandler}
                       onMove={this.moveHandler}
+                      onEdit={this.editHandler}
                       onRemove={this.removeHandler}
-                      onRename={this.renameHandler}
                       onCreate={this.createHandler}
       />,
       <Button onClick={this.createFilePathButtonClickHandler}>

package/src/explorer.js

@@ -2,8 +2,8 @@
 
 import withStyle from "easy-with-style";  ///
 
-import { Element } from "easy";
 import { dropMixins } from "easy-drag-and-drop";
+import { Element, window } from "easy";
 import { keyCodes, pathUtilities, arrayUtilities } from "necessary";
 
 import EntriesList from "./list/entries";
@@ -105,9 +105,10 @@ class Explorer extends Element {
 
       if (selectedDragEntryItem !== null) {
         const dragEntryItem = selectedDragEntryItem,  ///
+              dragEntryItemReadOnly = dragEntryItem.isReadOnly(),
               dragEntryItemEditable = dragEntryItem.isEditable();
 
-        if (dragEntryItemEditable) {
+        if (dragEntryItemReadOnly || dragEntryItemEditable) {
           return;
         }
 
@@ -307,7 +308,11 @@ class Explorer extends Element {
     const selectedDragEntryItem = this.retrieveSelectedDragEntryItem();
 
     if (selectedDragEntryItem !== null) {
-      selectedDragEntryItem.edit();
+      const selectedDragEntryItemReadOnly = selectedDragEntryItem.isReadOnly();
+
+      if (!selectedDragEntryItemReadOnly) {
+        selectedDragEntryItem.edit();
+      }
     }
   }
 
@@ -353,13 +358,13 @@ class Explorer extends Element {
     }
   }
 
-  renameDragEntryItem(dragEntryItem, done) {
+  editDragEntryItem(dragEntryItem, done) {
     const sourceEntryPath = sourceEntryPathFromEntryItem(dragEntryItem),
           targetEntryPath = targetEntryPathFromEntryItem(dragEntryItem),
           pathMaps = dragEntryItem.getPathMaps(sourceEntryPath, targetEntryPath),
           explorer = this;  ///
 
-    this.renameDragEntryItems(pathMaps, explorer, () => {
+    this.editDragEntryItems(pathMaps, explorer, () => {
       done();
     });
   }
@@ -398,8 +403,8 @@ class Explorer extends Element {
     });
   }
 
-  moveDragEntryItems(pathMaps, explorer, done) {
-    this.callMoveHandlersAsync(pathMaps, explorer, () => {
+  editDragEntryItems(pathMaps, explorer, done) {
+    this.callEditHandlersAsync(pathMaps, explorer, () => {
       pathMaps.forEach((pathMap) => {
         this.removeDragEntryItem(pathMap, explorer);
       });
@@ -412,8 +417,8 @@ class Explorer extends Element {
     });
   }
 
-  removeDragEntryItems(pathMaps, explorer, done) {
-    this.callRemoveHandlersAsync(pathMaps, explorer, () => {
+  moveDragEntryItems(pathMaps, explorer, done) {
+    this.callMoveHandlersAsync(pathMaps, explorer, () => {
       pathMaps.forEach((pathMap) => {
         this.removeDragEntryItem(pathMap, explorer);
       });
@@ -426,8 +431,8 @@ class Explorer extends Element {
     });
   }
 
-  renameDragEntryItems(pathMaps, explorer, done) {
-    this.callRenameHandlersAsync(pathMaps, explorer, () => {
+  removeDragEntryItems(pathMaps, explorer, done) {
+    this.callRemoveHandlersAsync(pathMaps, explorer, () => {
       pathMaps.forEach((pathMap) => {
         this.removeDragEntryItem(pathMap, explorer);
       });
@@ -468,7 +473,7 @@ class Explorer extends Element {
 
     this.onDrop(this.dropHandler);
 
-    this.onKeyDown(this.keyDownHandler);
+    window.onKeyDown(this.keyDownHandler);
 
     moveHandler && this.onMove(moveHandler);
 
@@ -491,7 +496,7 @@ class Explorer extends Element {
 
     this.offDrop(this.dropHandler);
 
-    this.onKeyDown(this.keyDownHandler);
+    window.onKeyDown(this.keyDownHandler);
 
     moveHandler && this.offMove(moveHandler);
 

package/src/item/entry/drag/directoryName.js

@@ -14,7 +14,51 @@ import { FILE_NAME_DRAG_ENTRY_TYPE, FILE_NAME_MARKER_ENTRY_TYPE, DIRECTORY_NAME_
 const { concatenatePaths } = pathUtilities;
 
 export default class DirectoryNameDragEntryItem extends DragEntryItem {
-  dropHandler = (dragElement, aborted, element, done) => {
+	dragOverHandler = (dragElement, element) => {
+		const dragElementDragEntryItem = (dragElement instanceof DragEntryItem);
+
+		if (!dragElementDragEntryItem) {
+			return;
+		}
+
+		const collapsed = this.isCollapsed();
+
+		if (collapsed) {
+			return;
+		}
+
+		const path = this.getPath(),
+					explorer = this.getExplorer(),
+					dragEntryItem = dragElement,  ///
+					dragEntryItemExplorer = dragEntryItem.getExplorer(),
+					dragEntryItemExplorerIgnored = explorer.isExplorerIgnored(dragEntryItemExplorer);
+
+		if (dragEntryItemExplorerIgnored) {
+			return;
+		}
+
+		const markerEntryItem = this.retrieveMarkerEntryItem(),
+					dragEntryItemName = dragEntryItem.getName();
+
+		let markerEntryItemPath = markerEntryItem.getPath(),
+				markerEntryItemExplorer = markerEntryItem.getExplorer(),
+				previousMarkerEntryItemPath = markerEntryItemPath, ///
+				previousMarkerEntryItemExplorer = markerEntryItemExplorer; ///
+
+		markerEntryItemPath = concatenatePaths(path, dragEntryItemName);
+
+		markerEntryItemExplorer = explorer;  ///
+
+		if ((markerEntryItemExplorer !== previousMarkerEntryItemExplorer) || (markerEntryItemPath !== previousMarkerEntryItemPath)) {
+			const dragEntryItemType = dragEntryItem.getType();
+
+			previousMarkerEntryItemExplorer.removeMarker();
+
+			markerEntryItemExplorer.addMarker(markerEntryItemPath, dragEntryItemType);
+		}
+	}
+
+	dropHandler = (dragElement, aborted, element, done) => {
     const dragElementDragEntryItem = (dragElement instanceof DragEntryItem);
 
     if (!dragElementDragEntryItem) {
@@ -38,50 +82,6 @@ export default class DirectoryNameDragEntryItem extends DragEntryItem {
     markerEntryItemExplorer.dropDragEntryItem(dragEntryItem, done);
   }
 
-  dragOverHandler = (dragElement, element) => {
-    const dragElementDragEntryItem = (dragElement instanceof DragEntryItem);
-
-    if (!dragElementDragEntryItem) {
-      return;
-    }
-
-    const collapsed = this.isCollapsed();
-
-    if (collapsed) {
-      return;
-    }
-
-    const path = this.getPath(),
-          explorer = this.getExplorer(),
-          dragEntryItem = dragElement,  ///
-          dragEntryItemExplorer = dragEntryItem.getExplorer(),
-          dragEntryItemExplorerIgnored = explorer.isExplorerIgnored(dragEntryItemExplorer);
-
-    if (dragEntryItemExplorerIgnored) {
-      return;
-    }
-
-    const markerEntryItem = this.retrieveMarkerEntryItem(),
-          dragEntryItemName = dragEntryItem.getName();
-
-    let markerEntryItemPath = markerEntryItem.getPath(),
-        markerEntryItemExplorer = markerEntryItem.getExplorer(),
-        previousMarkerEntryItemPath = markerEntryItemPath, ///
-        previousMarkerEntryItemExplorer = markerEntryItemExplorer; ///
-
-    markerEntryItemPath = concatenatePaths(path, dragEntryItemName);
-
-    markerEntryItemExplorer = explorer;  ///
-
-    if ((markerEntryItemExplorer !== previousMarkerEntryItemExplorer) || (markerEntryItemPath !== previousMarkerEntryItemPath)) {
-      const dragEntryItemType = dragEntryItem.getType();
-
-      previousMarkerEntryItemExplorer.removeMarker();
-
-      markerEntryItemExplorer.addMarker(markerEntryItemPath, dragEntryItemType);
-    }
-  }
-
   isBefore(entryItem) {
 		let before;
 

package/src/item/entry/drag.js

@@ -33,7 +33,7 @@ class DragEntryItem extends EntryItem {
       return;
     }
 
-    explorer.renameDragEntryItem(dragEntryItem, () => {
+    explorer.editDragEntryItem(dragEntryItem, () => {
       this.done();
     });
   }
@@ -81,6 +81,12 @@ class DragEntryItem extends EntryItem {
     markerEntryItemExplorer.dropDragEntryItem(dragEntryItem, done);
   }
 
+  isReadOnly() {
+    const { readOnly } = this.properties;
+
+    return readOnly;
+  }
+
   getPathMap(sourceEntryPath, targetEntryPath) {
     const name = this.getName(),
           collapsed = this.isCollapsed(),
@@ -204,6 +210,12 @@ class DragEntryItem extends EntryItem {
   }
 
   didMount() {
+    const readOnly = this.isReadOnly();
+
+    if (readOnly) {
+      return;
+    }
+
     this.onStopDrag(this.stopDragHandler);
 
     this.onStartDrag(this.startDragHandler);
@@ -216,6 +228,12 @@ class DragEntryItem extends EntryItem {
 	}
 
 	willUnmount() {
+    const readOnly = this.isReadOnly();
+
+    if (readOnly) {
+      return;
+    }
+
     this.offStopDrag(this.stopDragHandler);
 
     this.offStartDrag(this.startDragHandler);
@@ -245,6 +263,10 @@ class DragEntryItem extends EntryItem {
 
   static NameSpan = NameSpan;
 
+  static ignoredProperties = [
+    "readOnly"
+  ];
+
   static defaultProperties = {
 		className: "drag"
 	};

package/src/list/entries.js

@@ -19,7 +19,7 @@ Object.assign(globalThis, {
 
 class EntriesList extends Element {
   isTopmost() {
-    const { topmost } = this.properties;
+    const { topmost = false } = this.properties;
 
     return topmost;
   }
@@ -104,7 +104,7 @@ class EntriesList extends Element {
     }
   }
 
-  addFilePath(filePath) {
+  addFilePath(filePath, readOnly = false) {
 		let fileNameDragEntryItem;
 
     const topmostDirectoryName = topmostDirectoryNameFromPath(filePath);
@@ -115,7 +115,7 @@ class EntriesList extends Element {
       fileNameDragEntryItem = this.findFileNameDragEntryItem(fileName);
 
       if (fileNameDragEntryItem === null) {
-        fileNameDragEntryItem = this.createFileNameDragEntryItem(fileName);
+        fileNameDragEntryItem = this.createFileNameDragEntryItem(fileName, readOnly);
 
         this.addEntryItem(fileNameDragEntryItem);
       }
@@ -134,7 +134,7 @@ class EntriesList extends Element {
 
       filePath = filePathWithoutTopmostDirectoryName; ///
 
-      fileNameDragEntryItem = topmostDirectoryNameDragEntryItem.addFilePath(filePath);
+      fileNameDragEntryItem = topmostDirectoryNameDragEntryItem.addFilePath(filePath, readOnly);
     }
 
 		return fileNameDragEntryItem;
@@ -183,7 +183,7 @@ class EntriesList extends Element {
     });
   }
 
-  addDirectoryPath(directoryPath, collapsed = true) {
+  addDirectoryPath(directoryPath, readOnly = false, collapsed = true) {
     let directoryNameDragEntryItem;
 
     const topmostDirectoryName = topmostDirectoryNameFromPath(directoryPath);
@@ -194,7 +194,7 @@ class EntriesList extends Element {
       directoryNameDragEntryItem = this.findDirectoryNameDragEntryItem(directoryName);
 
       if (directoryNameDragEntryItem === null) {
-        directoryNameDragEntryItem = this.createDirectoryNameDragEntryItem(directoryName, collapsed);
+        directoryNameDragEntryItem = this.createDirectoryNameDragEntryItem(directoryName, readOnly, collapsed);
 
         this.addEntryItem(directoryNameDragEntryItem);
       } else {
@@ -206,7 +206,7 @@ class EntriesList extends Element {
       let topmostDirectoryNameDragEntryItem = this.findDirectoryNameDragEntryItem(topmostDirectoryName);
 
       if (topmostDirectoryNameDragEntryItem === null) {
-        topmostDirectoryNameDragEntryItem = this.createDirectoryNameDragEntryItem(topmostDirectoryName, collapsed);
+        topmostDirectoryNameDragEntryItem = this.createDirectoryNameDragEntryItem(topmostDirectoryName, readOnly, collapsed);
 
         this.addEntryItem(topmostDirectoryNameDragEntryItem);
       }
@@ -215,7 +215,7 @@ class EntriesList extends Element {
 
       directoryPath = directoryPathWithoutTopmostDirectoryName; ///
 
-      directoryNameDragEntryItem = topmostDirectoryNameDragEntryItem.addDirectoryPath(directoryPath, collapsed);
+      directoryNameDragEntryItem = topmostDirectoryNameDragEntryItem.addDirectoryPath(directoryPath, readOnly, collapsed);
     }
 
     return directoryNameDragEntryItem;
@@ -366,27 +366,27 @@ class EntriesList extends Element {
     });
   }
 
-  createFileNameDragEntryItem(fileName) {
+  createFileNameDragEntryItem(fileName, readOnly) {
 		const name = fileName,	///
 					explorer = this.getExplorer(),
 					FileNameDragEntryItem = explorer.getFileNameDragEntryItem(),
 					fileNameDragEntryItem =
 
-						<FileNameDragEntryItem name={name} explorer={explorer} />
+						<FileNameDragEntryItem name={name} readOnly={readOnly} explorer={explorer} />
 
 					;
 
 		return fileNameDragEntryItem;
 	}
 
-	createDirectoryNameDragEntryItem(directoryName, collapsed) {
+	createDirectoryNameDragEntryItem(directoryName, readOnly, collapsed) {
 		const name = directoryName,	///
           topmost = this.isTopmost(),
 					explorer = this.getExplorer(),
 					DirectoryNameDragEntryItem = explorer.getDirectoryNameDragEntryItem(topmost),
 					directoryNameDragEntryItem =
 
-						<DirectoryNameDragEntryItem name={name} explorer={explorer} collapsed={collapsed} />
+						<DirectoryNameDragEntryItem name={name} explorer={explorer} readOnly={readOnly} collapsed={collapsed} />
 
 					;
 

package/src/mixins/explorer.js

@@ -2,7 +2,7 @@
 
 import { asynchronousUtilities } from "necessary";
 
-import { MOVE_EVENT_TYPE, OPEN_EVENT_TYPE, REMOVE_EVENT_TYPE, RENAME_EVENT_TYPE, SELECT_EVENT_TYPE, CREATE_EVENT_TYPE } from "../eventTypes";
+import { MOVE_EVENT_TYPE, OPEN_EVENT_TYPE, REMOVE_EVENT_TYPE, EDIT_EVENT_TYPE, SELECT_EVENT_TYPE, CREATE_EVENT_TYPE } from "../eventTypes";
 
 const { forEach } = asynchronousUtilities;
 
@@ -20,6 +20,20 @@ function offOpen(openHandler, element) {
   this.removeEventListener(eventType, handler, element);
 }
 
+function onEdit(renameHandler, element) {
+  const eventType = EDIT_EVENT_TYPE,
+        handler = renameHandler;  ///
+
+  this.addEventListener(eventType, handler, element);
+}
+
+function offEdit(renameHandler, element) {
+  const eventType = EDIT_EVENT_TYPE,
+        handler = renameHandler;  ///
+
+  this.removeEventListener(eventType, handler, element);
+}
+
 function onMove(moveHandler, element) {
   const eventType = MOVE_EVENT_TYPE,
         handler = moveHandler;  ///
@@ -48,20 +62,6 @@ function offRemove(removeHandler, element) {
   this.removeEventListener(eventType, handler, element);
 }
 
-function onRename(renameHandler, element) {
-  const eventType = RENAME_EVENT_TYPE,
-      handler = renameHandler;  ///
-
-  this.addEventListener(eventType, handler, element);
-}
-
-function offRename(renameHandler, element) {
-  const eventType = RENAME_EVENT_TYPE,
-      handler = renameHandler;  ///
-
-  this.removeEventListener(eventType, handler, element);
-}
-
 function onCreate(createHandler, element) {
   const eventType = CREATE_EVENT_TYPE,
         handler = createHandler;  ///
@@ -96,7 +96,7 @@ function callOpenHandlers(filePath, explorer) {
 
   eventListeners.forEach((eventListener) => {
     const { handler, element } = eventListener,
-        openHandler = handler;  ///
+          openHandler = handler;  ///
 
     openHandler.call(element, filePath, explorer, this);  ///
   });
@@ -114,42 +114,42 @@ function callSelectHandlers(path, selected, explorer) {
   });
 }
 
-function callMoveHandlersAsync(pathMaps, explorer, done) {
-  const eventType = MOVE_EVENT_TYPE,
+function callEditHandlersAsync(pathMaps, explorer, done) {
+  const eventType = EDIT_EVENT_TYPE,
         eventListeners = this.findEventListeners(eventType);
 
   forEach(eventListeners, (eventListener, next) => {
     const { handler, element } = eventListener,
-          moveHandler = handler,  ///
+          renameHandler = handler,  ///
           done = next;  ///
 
-    moveHandler.call(element, pathMaps, explorer, done);
+    renameHandler.call(element, pathMaps, explorer, done);
   }, done);
 }
 
-function callRemoveHandlersAsync(pathMaps, explorer, done) {
-  const eventType = REMOVE_EVENT_TYPE,
+function callMoveHandlersAsync(pathMaps, explorer, done) {
+  const eventType = MOVE_EVENT_TYPE,
         eventListeners = this.findEventListeners(eventType);
 
   forEach(eventListeners, (eventListener, next) => {
     const { handler, element } = eventListener,
-          removeHandler = handler,  ///
+          moveHandler = handler,  ///
           done = next;  ///
 
-    removeHandler.call(element, pathMaps, explorer, done);
+    moveHandler.call(element, pathMaps, explorer, done);
   }, done);
 }
 
-function callRenameHandlersAsync(pathMaps, explorer, done) {
-  const eventType = RENAME_EVENT_TYPE,
+function callRemoveHandlersAsync(pathMaps, explorer, done) {
+  const eventType = REMOVE_EVENT_TYPE,
         eventListeners = this.findEventListeners(eventType);
 
   forEach(eventListeners, (eventListener, next) => {
     const { handler, element } = eventListener,
-          renameHandler = handler,  ///
+          removeHandler = handler,  ///
           done = next;  ///
 
-    renameHandler.call(element, pathMaps, explorer, done);
+    removeHandler.call(element, pathMaps, explorer, done);
   }, done);
 }
 
@@ -171,19 +171,19 @@ const explorerMixins = {
   offOpen,
   onMove,
   offMove,
+  onEdit,
+  offEdit,
   onRemove,
   offRemove,
-  onRename,
-  offRename,
   onCreate,
   offCreate,
   onSelect,
   offSelect,
   callOpenHandlers,
   callSelectHandlers,
+  callEditHandlersAsync,
   callMoveHandlersAsync,
   callRemoveHandlersAsync,
-  callRenameHandlersAsync,
   callCreateHandlersAsync
 };
 

package/src/mixins/nameSpan.js

@@ -43,8 +43,8 @@ function callChangeHandlers() {
 }
 
 function callCancelHandlers() {
-    const eventType = CANCEL_EVENT_TYPE,
-          eventListeners = this.findEventListeners(eventType);
+  const eventType = CANCEL_EVENT_TYPE,
+        eventListeners = this.findEventListeners(eventType);
 
   eventListeners.forEach((eventListener) => {
     const { handler, element } = eventListener,