More documentation for the AIs to read.
This commit is contained in:
Scott Idem
120
README_guidelines_ui_ux.md
Normal file
120
README_guidelines_ui_ux.md
Normal file
@@ -0,0 +1,120 @@
|
||||
# AE UI Components, Layout, and Style Standards (HTML/CSS)
|
||||
|
||||
## Aether Components
|
||||
### System Components
|
||||
* [header]
|
||||
* [main/module]s
|
||||
* [footer]
|
||||
* [app] refresh, clear IDB, clear local storage (settings), iframe toggle (also updates URL param), copy URL, generate and show QR
|
||||
* [menu][mode] edit, more (all or details)
|
||||
* [menu][access_type] passcode input, clear
|
||||
* [menu][user] sign in/out, reset password, email link, change username and email
|
||||
* [menu][theme] mode (light/dark), name (theme list)
|
||||
* [debug] toggle (also updates URL param), show core and module storages, manually set init timestamp
|
||||
* [scroll_to] top, page up, page down, bottom
|
||||
|
||||
### Core Components
|
||||
* [copy_btn] clipboard, bind:value, btn_text, btn_html
|
||||
* [txt_editor] textarea
|
||||
* [md_editor] CodeMirror, ShadEditor TipTap (need to remove)
|
||||
* [html_editor]
|
||||
* [media_player]
|
||||
* hosted_file archive_content media_player,
|
||||
* bind:host_id,
|
||||
* bind:media_type
|
||||
* status - stopped, paused, playing
|
||||
* [hosted_file_li] manage_hosted_file_li, make available for selection
|
||||
* [hosted_file_link_to] list links per object, bind:add link, bind:remove link
|
||||
* [upload_to_host] - input_hosted_file; needs to handle multiple files
|
||||
* link_type,
|
||||
* link_id,
|
||||
* inner fragment - label html
|
||||
* bind:trigger
|
||||
* bind:show_spinner
|
||||
* bind:show_percent
|
||||
* status
|
||||
* result - started, uploading, finished
|
||||
* [upload_file_tbl] input_hosted_file_tbl, check for dup file hash, remove from list
|
||||
* [download_from_host]
|
||||
* bind:host_file_id
|
||||
* bind:filename
|
||||
* bind:file_ext
|
||||
* btn inner fragment
|
||||
* bind:trigger
|
||||
* bind:show_spinner
|
||||
* bind:show_percent
|
||||
* status
|
||||
* result - started, downloading, finished
|
||||
* [data_store]
|
||||
* [ae_crud] need to simplify! obj, prop, current_value, bind:value, bind:trigger, inner fragment
|
||||
* [ae_obj_prop_val] - essentially a wrapper for the function
|
||||
* bind:obj_type
|
||||
* bind:obj_id
|
||||
* bind:obj_prop
|
||||
* bind:obj_value
|
||||
* bind:obj_new_value
|
||||
* bind:trigger
|
||||
* bind:show_spinner
|
||||
* bind:show_percent
|
||||
* status
|
||||
* result
|
||||
* [sql_qry]
|
||||
* [obj_tbl] obj sql results tbl or similar
|
||||
* [qr_scanner]
|
||||
* [websocket]
|
||||
|
||||
### Main / Module Components
|
||||
* [menu][options] various settings, show/hide content and options, limit, sorting options, etc
|
||||
* [menu][actions] various actions, sign in/out, email
|
||||
|
||||
### Object Menu
|
||||
* properties: id, name, group, priority, sort, alert, hide, enable, note
|
||||
* future properties: ext_id (not ready yet), ext_sys_id (not ready yet), code (not ready yet)
|
||||
* actions: create, view, edit, update, hide, disable, delete, alert (message), archive (not ready yet)
|
||||
* future actions: copy, import
|
||||
* sort options:
|
||||
* [default] group > priority > sort (ASC/DESC) > alert > name
|
||||
* [sort_updated] group > priority > sort (ASC/DESC) > alert > updated_on > created_on
|
||||
* [priority_updated] group > priority > updated_on (ASC/DESC) > created_on
|
||||
* [priority_name] group > priority > name (ASC/DESC) > sort > alert > updated_on > created_on
|
||||
* [name] priority > name (ASC/DESC) > sort > alert > updated_on > created_on
|
||||
* [created_on] priority > created_on (ASC/DESC)
|
||||
* [updated_on] priority > updated_on (ASC/DESC) > created_on
|
||||
|
||||
### Pop-ups:
|
||||
* modal_header
|
||||
* title
|
||||
* close
|
||||
* modal_main
|
||||
* modal_meta
|
||||
* modal_footer
|
||||
* close
|
||||
#### Pop-up Modal (blocking)
|
||||
* modal position
|
||||
#### Pop-up Modal Inline
|
||||
* inline, inline-block, block
|
||||
#### Pop-up Dialog
|
||||
* dialog position
|
||||
|
||||
## Containers
|
||||
### Navigation
|
||||
* link
|
||||
* download
|
||||
|
||||
### Forms
|
||||
* save
|
||||
* clear value
|
||||
* set null value
|
||||
|
||||
### Other Containers
|
||||
* help - blue
|
||||
* info - blue
|
||||
* alert - yellow
|
||||
* warning - orange
|
||||
* error - red
|
||||
* message - green
|
||||
|
||||
---
|
||||
|
||||
## Need to organize:
|
||||
* lu: id, account_id, for_obj_id, code, name, description, group, sort, priority, enable, perm_level
|
||||
147
README_guidelines_v2.md
Normal file
147
README_guidelines_v2.md
Normal file
@@ -0,0 +1,147 @@
|
||||
# AE Svelte and SvelteKit Technical Standards
|
||||
|
||||
## Official Modules
|
||||
### Core
|
||||
* Accounts - Minimal
|
||||
* Files
|
||||
* People - Minimal
|
||||
* Sites - Minimal
|
||||
* Users - Minimal
|
||||
### Extended
|
||||
Archives - Minimal, Events - Badges, Events - Presentation Management, Posts - Minimal, Journals
|
||||
### Custom
|
||||
IDAA - Archives, IDAA - BB, IDAA - Recovery Meetings
|
||||
|
||||
---
|
||||
|
||||
## localStorage:
|
||||
* api
|
||||
* app - global
|
||||
* core - core modules
|
||||
* [module] - extended modules
|
||||
* [custom] - custom modules
|
||||
|
||||
---
|
||||
|
||||
## Indexed DB
|
||||
* ae_core_db
|
||||
* [module]
|
||||
* [custom] - custom modules: none currently
|
||||
|
||||
---
|
||||
|
||||
## Data Sorting
|
||||
* group > priority > sort > updated/created on
|
||||
* type > start date/time > code or name
|
||||
|
||||
---
|
||||
|
||||
## Objects
|
||||
### Function - Obj Prop Update
|
||||
* obj_type
|
||||
* obj_id
|
||||
* obj_prop
|
||||
* obj_value
|
||||
### Core
|
||||
### Extended
|
||||
### Custom
|
||||
|
||||
---
|
||||
|
||||
## Object Properties or Fields
|
||||
### Core
|
||||
Expected standard field names: id, id_random, [obj-type]_id_random, code, name, enable, hide, priority, sort, group, notes, created_on, updated_on
|
||||
Special use field names: for_type, for_id, archive_on, passcode, external_id
|
||||
|
||||
### Configs and Fields with JSON
|
||||
* cfg_json
|
||||
* data_json
|
||||
* linked_li_json
|
||||
|
||||
### Special Generated Fields
|
||||
tmp_sort_1, tmp_sort_2,
|
||||
|
||||
|
||||
### Future standard fields!!!
|
||||
obj_id?: null|string;
|
||||
obj_ext_uid?: null|string; // Probably not needed for journals
|
||||
obj_ext_id?: null|string; // Probably not needed for journals
|
||||
obj_import_id?: null|string; // Probably not needed for journals
|
||||
obj_code?: null|string;
|
||||
obj_account_id?: null|string;
|
||||
obj_passcode?: null|string;
|
||||
obj_type?: null|string; // Should always be 'journal' in this case
|
||||
obj_type_ver_id?: null|string; // The ID from the table for the object type
|
||||
obj_name?: null|string;
|
||||
obj_summary?: null|string; // LLM (AI) generated summary...???
|
||||
obj_outline?: null|string; // LLM (AI) generated outline...???
|
||||
obj_description?: null|string; // Probably not needed for journals
|
||||
obj_enable?: null|boolean;
|
||||
obj_enable_on?: null|Date;
|
||||
obj_archive_on?: null|Date;
|
||||
obj_hide?: null|boolean;
|
||||
obj_priority?: null|number;
|
||||
obj_sort?: null|number;
|
||||
obj_group?: null|string;
|
||||
obj_cfg_json?: null|string;
|
||||
obj_notes?: null|string;
|
||||
obj_created_on?: Date;
|
||||
obj_updated_on?: null|Date;
|
||||
|
||||
## Dixie IDB liveQuery with Select Objects (slct) and Lists of Objects (slct_x_li)
|
||||
Use this method below to create a read/write snapshot of the current liveQuery results. This allows you to use it as part of a form and binding values. It might make since to call this something like "lqw__x_obj" and "lqw__x_obj_li". lqw = liveQuery writable
|
||||
|
||||
lq__xyz_obj - Use for general read only
|
||||
lqw__xyz_obj - Use for forms and binding values. What happens if the actual LQ obj is updated after the bind?
|
||||
$slct or $lqw ?
|
||||
|
||||
|
||||
Sort of related.... more permission/security though: Create a new table that will be attached to every v_ view in the DB. This new table would be a field permission list. It could work similar to the data_store table and related view. This seems like a good idea????? 2025-08-11
|
||||
|
||||
```ts
|
||||
let lq__post_obj = $derived(liveQuery(async () => {
|
||||
if (log_lvl) {
|
||||
console.log(`lq__post_obj: post_id = ${$idaa_slct?.post_id}`);
|
||||
}
|
||||
let results = await db_posts.post
|
||||
.get($idaa_slct.post_id ?? ''); // null or undefined does not reset things like '' does
|
||||
|
||||
// Check if results are different than the current $idaa_slct.post_obj
|
||||
if ($idaa_slct.post_obj && results) {
|
||||
if (JSON.stringify($idaa_slct.post_obj) !== JSON.stringify(results)) {
|
||||
$idaa_slct.post_obj = { ...results};
|
||||
if (log_lvl) {
|
||||
console.log(`$idaa_slct.post_obj = `, $idaa_slct.post_obj);
|
||||
}
|
||||
} else {
|
||||
if (log_lvl) {
|
||||
console.log(`Post object has not changed for post_id: ${$idaa_slct.post_id}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return results;
|
||||
}));
|
||||
|
||||
let lq__post_comment_obj_li = $derived(liveQuery(async () => {
|
||||
let results = await db_posts.comment
|
||||
.where('post_id')
|
||||
.equals($idaa_slct.post_id ?? '') // null or undefined does not reset things like '' does
|
||||
.reverse()
|
||||
.sortBy('updated_on');
|
||||
// .sortBy('title');
|
||||
|
||||
if ($idaa_slct.post_comment_obj_li && JSON.stringify($idaa_slct.post_comment_obj_li) !== JSON.stringify(results)) {
|
||||
$idaa_slct.post_comment_obj_li = [...results];
|
||||
if (log_lvl) {
|
||||
console.log(`$idaa_slct.post_comment_obj_li = `, $idaa_slct.post_comment_obj_li);
|
||||
}
|
||||
} else {
|
||||
if (log_lvl) {
|
||||
console.log(`Post comment object list has not changed for post_id: ${$idaa_slct.post_id}`);
|
||||
}
|
||||
}
|
||||
|
||||
return results;
|
||||
}));
|
||||
```
|
||||
Reference in New Issue
Block a user