64 lines
3.1 KiB
Plaintext
64 lines
3.1 KiB
Plaintext
Updating the project editing:
|
|
[ Feature Update: Project Creation and Editing ]
|
|
|
|
As a user I want when I create a project to create a directory on the server.
|
|
The root of this project directory and its files is not accessible directly for the user.
|
|
It will contain settings and other organizational things.
|
|
However there's one directory called 'root' where the user is able to edit all files and subdirectories.
|
|
The creation of the project will create a first file "index.html" that can be viewed and edited, it contains a "Hello World!".
|
|
|
|
|
|
This update will add the feature, that projects create a real directory structure with an initial file in root.
|
|
|
|
After the project was created in projects, in the project entry a button "Edit" appears next to "Members" and "Delete".
|
|
|
|
It will open the "editor", which is a new page that is used for editing several things inside the project.
|
|
|
|
|
|
|
|
[ Editor Page ]
|
|
The editor page uses a system known from other editing system, where the editor has an active document, multiple selections
|
|
and maybe other editor related states (maybe somthing indicating loading or dialogs etc). The selections represent
|
|
possible other users that are also editing the document (via networking in realtime).
|
|
It has typical (asynchronous) undo system, that allows to edit a document. It should also
|
|
|
|
The EditorUI is built up as a customizable UI, which contains EditorPanels
|
|
that do things by listening to changes of the document, the selections
|
|
and editor states.
|
|
|
|
The editor UI allows to rearrange the EditorPanels. They are organized in a resizable grid of LayoutPanels,
|
|
which contain TabContainers, that hold multiple EditorPanels but show only the active one that is the selected tab.
|
|
|
|
For Landscape layouts:
|
|
3 LayoutPanels are used as base. Each layout panel can be divided horizontally which forms a LayoutPanelSection, which can
|
|
hold up to 3 TabContainers.
|
|
|
|
For Portrait layouts:
|
|
Only one LayoutPanelSection is visible. The others can be selected by the mainbar on top. They also contain up to 3 TabContainers.
|
|
|
|
|
|
Mocks can be found here:
|
|
history/2026/07-July/02-Thursday/desktop-layout.jpg
|
|
history/2026/07-July/02-Thursday/mobile-layout.jpg
|
|
history/2026/07-July/02-Thursday/tab-container.jpg
|
|
|
|
|
|
[ Editor Panels]
|
|
There will be multiple, different EditorPanels that have different tasks.
|
|
|
|
-- ActiveDocumentTabContainer:TabContainer
|
|
A special tab container, that contains a list of the active files that are currently in editing as well as
|
|
an DocumentEditor, an archetype for document editors that will be able to save/load document
|
|
|
|
-- HTMLEditor:DocumentEditor
|
|
A very rudimentary editor, that doesn't do much than just displaying the content and makes most elements "contenteditable" when they are
|
|
clicked. Head and Body should not be changable. There will one element named "<page-content></page-content>" which will be editable.
|
|
|
|
-- Project File Tree Viewer
|
|
Lists the directory structure of the project root
|
|
|
|
|
|
[ Creating/Opening a fresh project ]
|
|
|
|
On Desktop opening a project in the editor should load the index.html file in the HTMLEditor in the center and
|
|
show on the left side the project tree view. |