forked from kaitai-io/kaitai_struct_webide
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Initial work on FileTree, refactor of Compile grammar service
- Loading branch information
Showing
63 changed files
with
1,349 additions
and
742 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
93 changes: 93 additions & 0 deletions
93
src/Components/FileTree/FileSystemVisitors/FileSystemVisitor.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,93 @@ | ||
| import { | ||
| FILE_SYSTEM_TYPE_KAITAI, | ||
| FILE_SYSTEM_TYPE_LOCAL, | ||
| IFileSystem, | ||
| IFsItem, | ||
| ITEM_MODE_DIRECTORY, | ||
| ITEM_MODE_FILE | ||
| } from "../../../v1/FileSystems/FileSystemsTypes"; | ||
|
|
||
| export const OPEN_FOLDER = "OPEN_FOLDER"; | ||
| export const CLOSED_FOLDER = "CLOSED_FOLDER"; | ||
| export const EMPTY_FOLDER = "EMPTY_FOLDER"; | ||
| export const BINARY_FILE = "BINARY_FILE"; | ||
| export const KSY_FILE = "KSY_FILE"; | ||
|
|
||
| export type NodeType = typeof EMPTY_FOLDER | typeof OPEN_FOLDER | typeof CLOSED_FOLDER | typeof BINARY_FILE | typeof KSY_FILE; | ||
|
|
||
| export interface TreeNodeDisplay { | ||
| fullPath: string; | ||
| type: NodeType; | ||
| fileName: string; | ||
| isOpen: boolean; | ||
| storeId: typeof FILE_SYSTEM_TYPE_LOCAL | typeof FILE_SYSTEM_TYPE_KAITAI; | ||
| depth: number; | ||
| } | ||
|
|
||
| export class FileSystemVisitor { | ||
| private openPaths: string[]; | ||
| private currentPath: string[] = []; | ||
| private visibleFsItemsNew: TreeNodeDisplay[] = []; | ||
|
|
||
| public visit(fileSystem: IFileSystem, openPaths: string[]) { | ||
| this.openPaths = openPaths; | ||
| this.visitFileSystem(fileSystem); | ||
| return this.visibleFsItemsNew; | ||
| } | ||
|
|
||
| private visitFileSystem(fileSystem: IFileSystem) { | ||
| if (!fileSystem.getRootNode()) { | ||
| this.visibleFsItemsNew = []; | ||
| return; | ||
| } | ||
| this.visitNode(fileSystem.getRootNode()); | ||
|
|
||
| } | ||
|
|
||
| private visitNode(fsItem: IFsItem) { | ||
| this.currentPath.push(fsItem.fn); | ||
| const newNode = this.mapToNewNode(fsItem); | ||
| this.visibleFsItemsNew.push(newNode); | ||
|
|
||
| if (fsItem.type === ITEM_MODE_DIRECTORY && newNode.isOpen) { | ||
| Object.entries(fsItem.children || {}) | ||
| .forEach(([key, child]) => { | ||
| child.fn = key; | ||
| this.visitNode(child); | ||
| }); | ||
| } | ||
| this.currentPath.pop(); | ||
| } | ||
|
|
||
|
|
||
| private mapToNewNode(fsItem: IFsItem): TreeNodeDisplay { | ||
| const fullPath = this.currentPath.join("/"); | ||
| const isOpen = this.isDirectoryOpen(fullPath); | ||
| return { | ||
| type: this.getNodeType(isOpen, fsItem), | ||
| storeId: fsItem.fsType, | ||
| fullPath: fullPath, | ||
| fileName: fsItem.fn, | ||
| isOpen: isOpen, | ||
| depth: this.currentPath.length - 1 | ||
| }; | ||
| } | ||
|
|
||
| private getNodeType(isOpen: boolean, fsItem: IFsItem): NodeType { | ||
| switch (fsItem.type) { | ||
| case ITEM_MODE_FILE: { | ||
| return fsItem.fn.endsWith(".ksy") ? KSY_FILE : BINARY_FILE; | ||
| } | ||
| case ITEM_MODE_DIRECTORY: { | ||
| if (Object.keys(fsItem.children).length === 0) return EMPTY_FOLDER; | ||
| else if (isOpen) return OPEN_FOLDER; | ||
| else return CLOSED_FOLDER; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| private isDirectoryOpen(path: string) { | ||
| const tempPath = this.currentPath.join("/"); | ||
| return !!this.openPaths.find(openPath => openPath === tempPath); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,43 +1,62 @@ | ||
| <script setup lang="ts"> | ||
| import FileTreeLanguagesDropdown from "./FileTreeGenerateParserDropdown.vue"; | ||
| import FileTreeBottomActions from "./FileTreeActionButtons.vue"; | ||
| import {useFileSystems} from "./Store/FileSystemsStore"; | ||
| import FileTreeNodes from "./FileTreeNodes.vue"; | ||
| import {onMounted} from "vue"; | ||
| import {FILE_SYSTEM_TYPE_LOCAL, IFsItem, ITEM_MODE_DIRECTORY} from "../../v1/FileSystems/FileSystemsTypes"; | ||
| import {LocalForageWrapper} from "../../v1/utils/LocalForageWrapper"; | ||
| import {initKaitaiFs} from "../../v1/FileSystems/KaitaiFileSystem"; | ||
| import {OldLocalStorageFileSystem} from "../../v1/FileSystems/OldLocalStorageFileSystem"; | ||
| const store = useFileSystems(); | ||
| onMounted(async () => { | ||
| const defaultItem: IFsItem = { | ||
| fsType: FILE_SYSTEM_TYPE_LOCAL, | ||
| type: ITEM_MODE_DIRECTORY, | ||
| children: {}, | ||
| fn: "Local storage" | ||
| }; | ||
| const storedItem = await LocalForageWrapper.getFsItem(`fs_files`); | ||
| if (storedItem) { | ||
| storedItem.fn = "Local storage"; | ||
| } | ||
| store.addFileSystem(initKaitaiFs()); | ||
| store.addFileSystem(new OldLocalStorageFileSystem(storedItem || defaultItem)); | ||
| }); | ||
| </script> | ||
|
|
||
| <template> | ||
| <div id="fileTreeCont"> | ||
| <div id="fileTree" class="fileTree"> | ||
|
|
||
| </div> | ||
| <div class="footer btn-group" role="group"> | ||
| <button id="createLocalKsyFile" type="button" class="btn btn-default"><i | ||
| class="glyphicon glyphicon-file"></i></button> | ||
| <button id="uploadFile" type="button" class="btn btn-default"><i | ||
| class="glyphicon glyphicon-cloud-upload"></i></button> | ||
| <button id="downloadFile" type="button" class="btn btn-default disabled"><i | ||
| class="glyphicon glyphicon-cloud-download"></i></button> | ||
| <div id="fileTreeNew" class="file-tree-component"> | ||
| <div class="file-tree-list-container"> | ||
| <FileTreeNodes :fileSystem="fileSystem" v-for="fileSystem in store.fileSystems"/> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div id="fileTreeContextMenu" class="dropdown clearfix"> | ||
| <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" | ||
| style="display:block;position:static;margin-bottom:5px;"> | ||
| <li class="openItem"><a tabindex="-1" href="#"><i class="glyphicon glyphicon-pencil"></i> Open</a></li> | ||
| <li class="createFolder"><a tabindex="-1" href="#"><i class="glyphicon glyphicon-folder-open"></i> Create | ||
| folder</a></li> | ||
| <li class="createKsyFile"><a tabindex="-1" href="#"><i class="glyphicon glyphicon-list-alt"></i> Create .ksy | ||
| file</a></li> | ||
| <li class="cloneKsyFile"><a tabindex="-1" href="#"><i class="glyphicon fa fa-clone"></i> Clone</a></li> | ||
| <li class="generateParser dropdown-submenu"> | ||
| <a tabindex="-1" href="#"><i class="glyphicon glyphicon-flash"></i> Generate parser</a> | ||
| <FileTreeLanguagesDropdown/> | ||
| </li> | ||
| <li class="downloadItem"><a tabindex="-1" href="#"><i class="glyphicon glyphicon-cloud-download"></i> | ||
| Download</a></li> | ||
| <li class="deleteItem"><a tabindex="-1" href="#"><i class="glyphicon glyphicon-remove"></i> Delete</a></li> | ||
| </ul> | ||
| <FileTreeBottomActions/> | ||
| </div> | ||
| </template> | ||
|
|
||
| <!--font: 12px/normal "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro", monospace;--> | ||
|
|
||
| <style scoped> | ||
| .file-tree-component { | ||
| width: 100%; | ||
| height: 100%; | ||
| overflow: hidden; | ||
| font-family: Arial; | ||
| font-size: 12px; | ||
| color: #ccc; | ||
| user-select: none; | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: space-between; | ||
| } | ||
|
|
||
| .file-tree-list-container { | ||
| overflow: scroll; | ||
| width: 100%; | ||
| flex-grow: 1; | ||
| } | ||
|
|
||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| <script setup lang="ts"> | ||
| import {openUploadFilesOperatingSystemModal} from "../../v1/JQueryComponents/Files/UploadFilesOSModal"; | ||
| import {processUploadedFiles} from "../../GlobalActions/UploadFiles"; | ||
| const addKsyFile = () => { | ||
| }; | ||
| const uploadFile = () => { | ||
| openUploadFilesOperatingSystemModal(files => { | ||
| processUploadedFiles(files); | ||
| }); | ||
| }; | ||
| const downloadFile = () => { | ||
| }; | ||
| </script> | ||
|
|
||
| <template> | ||
| <div class="footer btn-group" role="group"> | ||
| <button type="button" class="action-button" @click="addKsyFile()"> | ||
| <i class="glyphicon glyphicon-file"/> | ||
| </button> | ||
| <button type="button" class="action-button" @click="uploadFile()"> | ||
| <i class="glyphicon glyphicon-cloud-upload"/> | ||
| </button> | ||
| <button type="button" class="action-button" @click="downloadFile()" disabled> | ||
| <i class="glyphicon glyphicon-cloud-download"/> | ||
| </button> | ||
| </div> | ||
| </template> | ||
|
|
||
| <style scoped> | ||
| .footer { | ||
| display: flex; | ||
| flex-direction: row; | ||
| width: 100%; | ||
| } | ||
| .action-button { | ||
| font-size: 13px; | ||
| padding: 7px 10px; | ||
| flex-grow: 1; | ||
| border-radius: 0; | ||
| background-color: rgb(70, 70, 70); | ||
| border: none; | ||
| } | ||
| .action-button:hover { | ||
| color: white; | ||
| background-color: rgb(30, 30, 30); | ||
| } | ||
| .action-button:disabled { | ||
| background-color: rgb(60, 60, 60); | ||
| color: inherit; | ||
| } | ||
| </style> |
38 changes: 0 additions & 38 deletions
38
src/Components/FileTree/FileTreeGenerateParserDropdown.vue
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.