From 5a124809afec177b6828469f5b77c9fd9c254de3 Mon Sep 17 00:00:00 2001 From: Bruno Windels <274386+bwindels@users.noreply.github.com> Date: Tue, 17 Jan 2023 17:19:12 +0100 Subject: [PATCH 1/5] write docs how updates work --- doc/updates.md | 58 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 58 insertions(+) create mode 100644 doc/updates.md diff --git a/doc/updates.md b/doc/updates.md new file mode 100644 index 00000000..6522fd10 --- /dev/null +++ b/doc/updates.md @@ -0,0 +1,58 @@ +# Updates + +How updates flow from the model to the view model to the UI. + +## EventEmitter, single values + +When interested in updates from a single object, chances are it inherits from `EventEmitter` and it supports a `change` event. + +`ViewModel` by default follows this pattern, but it can be overwritten, see Collections below. + +### Parameters + +Often a `parameters` or `params` argument is passed with the name of the field who's value has now changed. This parameter is currently only sometimes used, e.g. when it is too complicated or costly to check every possible field. An example of this is `TilesListView.onUpdate` to see if the `shape` property of a tile changed and hence the view needs to be recreated. Other than that, bindings in the web UI just reevaluate all bindings when receiving an update. This is a soft convention that could probably be more standardized, and it's not always clear what to pass (e.g. when multiple fields are being updated). + +Another reason to keep this convention around is that if one day we decide to add support for a different platform with a different UI, it may not be feasible to reevaluate all data-bindings in the UI for a given view model when receiving an update. + +## Collections + +As an optimization, Hydrogen uses a pattern to let updates flow over an observable collection where this makes sense. There is an `update` event for this in both `ObservableMap` and `ObservableList`. This prevents having to listen for updates on each individual item in large collections. The `update` event uses the same `params` argument as explained above. + +Some values like `BaseRoom` emit both with a `change` event on the event emitter and also over the collection. This way consumers can use what fits best for their case: the left panel can listen for updates on the room over the collection to power the room list, and the room view model can listen to the event emitter to get updates from the current room only. + +### MappedMap and mapping models to `ViewModel`s + +This can get a little complicated when using `MappedMap`, e.g. when mapping a model from `matrix/` +to a view model in `domain/`. Often, view models will want to emit updates _spontanously_, +e.g. without a prior update being sent from the lower-lying model. An example would be to change the value of a field after the view has called a method on the view model. +To support this pattern while having updates still flow over the collection requires some extra work; +`ViewModel` has a `emitChange` option which you can pass in to override +what `ViewModel.emitChange` does (by default it emits the `change` event on the view model). +`MappedMap` passes a callback to emit an update over the collection to the mapper function. +You can pass this callback as the `emitChange` option and updates will now flow over the collection. + +`MappedMap` also accepts an updater function, which you can use to make the view model respond to updates +from the lower-lying model. + +Here is an example: + +```ts +const viewModels = someCollection.mapValues( + (model, emitChange) => new SomeViewModel(this.childOptions({ + model, + // will make ViewModel.emitChange go over + // the collection rather than emit a "change" event + emitChange, + })), + // an update came in from the model, let the vm know + (vm: SomeViewModel) => vm.onUpdate(), + ); +``` + +### `ListView` & the `parentProvidesUpdates` flag. + +`ObservableList` is always rendered in the UI using `ListView`. When receiving an update over the collection, it will find the child view for the given index and call `update(params)` on it. Views will typically need to be told whether they should listen to the `change` event in their view model or rather wait for their `update()` method to be called by their parent view, `ListView`. That's why the `mount(args)` method on a view supports a `parentProvidesUpdates` flag. If `true`, the view should not subscribe to its view model, but rather updates the DOM when its `update()` method is called. Also see `BaseUpdateView` and `TemplateView` for how this is implemented in the child view. + +## `ObservableValue` + +When some method wants to return an object that can be updated, often an `ObservableValue` is used rather than an `EventEmitter`. It's not 100% clear cut when to use the former or the latter, but `ObservableValue` is often used when the returned value in it's entirety will change rather than just a property on it. `ObservableValue` also has some nice facilities like lazy evaluation when subscribed to and the `waitFor` method to work with promises. \ No newline at end of file From 8b0b81368008e9a64c43d760f61bd4589df0e617 Mon Sep 17 00:00:00 2001 From: Bruno Windels <274386+bwindels@users.noreply.github.com> Date: Tue, 17 Jan 2023 17:28:29 +0100 Subject: [PATCH 2/5] organize documention and remove obsolete documents --- doc/FAQ.md => FAQ.md | 0 doc/GOAL.md | 8 -- doc/TODO.md | 77 --------------- doc/api.md | 90 ------------------ doc/{ => architecture}/SKINNING.md | 0 doc/{ => architecture}/THEMING.md | 0 doc/{ => architecture}/UI/index.md | 0 .../UI/render-dom-elements.md | 0 doc/{ => architecture}/UI/ui.md | 0 doc/{ => architecture}/architecture.md | 0 .../images/coloring-process.png | Bin .../images/svg-icon-example.png | Bin .../images/theming-architecture.png | Bin .../persisted-network-calls.md | 0 doc/{ => architecture}/sync-updates.md | 0 doc/{ => architecture}/updates.md | 0 .../CATCHUP-BACKFILL.md | 0 doc/{ => implementation planning}/CSS.md | 0 .../DESIGN.md | 0 .../E2EE.md | 0 .../FRAGMENTS.md | 0 .../LOCAL-ECHO-STATE.md | 0 .../LOGIN.md | 0 .../MEMBERS.md | 0 .../PENDING_REPLIES.md | 0 .../PUSH.md | 0 .../QUESTIONS.md | 0 .../READ-RECEIPTS.md | 0 .../RECONNECTING.md | 0 .../RELATIONS.md | 0 doc/{ => implementation planning}/RELEASE.md | 0 .../REPLIES.md | 0 .../ROOM-VERSIONS.md | 0 .../SDK.md | 0 doc/{ => implementation planning}/SENDING.md | 0 .../SSO.md | 0 .../VIEW-UPDATES.md | 0 .../background-tasks.md | 0 .../html-messages.md | 0 doc/{ => implementation planning}/invites.md | 0 .../room-types.ts | 0 .../session-container.md | 0 .../timeline-member.md | 0 doc/{ => problem solving}/IMPORT-ISSUES.md | 0 doc/{ => problem solving}/INDEXEDDB.md | 0 .../domexception_mapping.md | 0 doc/viewhierarchy.md | 21 ---- 47 files changed, 196 deletions(-) rename doc/FAQ.md => FAQ.md (100%) delete mode 100644 doc/GOAL.md delete mode 100644 doc/TODO.md delete mode 100644 doc/api.md rename doc/{ => architecture}/SKINNING.md (100%) rename doc/{ => architecture}/THEMING.md (100%) rename doc/{ => architecture}/UI/index.md (100%) rename doc/{ => architecture}/UI/render-dom-elements.md (100%) rename doc/{ => architecture}/UI/ui.md (100%) rename doc/{ => architecture}/architecture.md (100%) rename doc/{ => architecture}/images/coloring-process.png (100%) rename doc/{ => architecture}/images/svg-icon-example.png (100%) rename doc/{ => architecture}/images/theming-architecture.png (100%) rename doc/{ => architecture}/persisted-network-calls.md (100%) rename doc/{ => architecture}/sync-updates.md (100%) rename doc/{ => architecture}/updates.md (100%) rename doc/{impl-thoughts => implementation planning}/CATCHUP-BACKFILL.md (100%) rename doc/{ => implementation planning}/CSS.md (100%) rename doc/{impl-thoughts => implementation planning}/DESIGN.md (100%) rename doc/{impl-thoughts => implementation planning}/E2EE.md (100%) rename doc/{impl-thoughts => implementation planning}/FRAGMENTS.md (100%) rename doc/{impl-thoughts => implementation planning}/LOCAL-ECHO-STATE.md (100%) rename doc/{impl-thoughts => implementation planning}/LOGIN.md (100%) rename doc/{impl-thoughts => implementation planning}/MEMBERS.md (100%) rename doc/{impl-thoughts => implementation planning}/PENDING_REPLIES.md (100%) rename doc/{impl-thoughts => implementation planning}/PUSH.md (100%) rename doc/{ => implementation planning}/QUESTIONS.md (100%) rename doc/{impl-thoughts => implementation planning}/READ-RECEIPTS.md (100%) rename doc/{impl-thoughts => implementation planning}/RECONNECTING.md (100%) rename doc/{impl-thoughts => implementation planning}/RELATIONS.md (100%) rename doc/{ => implementation planning}/RELEASE.md (100%) rename doc/{impl-thoughts => implementation planning}/REPLIES.md (100%) rename doc/{impl-thoughts => implementation planning}/ROOM-VERSIONS.md (100%) rename doc/{impl-thoughts => implementation planning}/SDK.md (100%) rename doc/{ => implementation planning}/SENDING.md (100%) rename doc/{impl-thoughts => implementation planning}/SSO.md (100%) rename doc/{impl-thoughts => implementation planning}/VIEW-UPDATES.md (100%) rename doc/{impl-thoughts => implementation planning}/background-tasks.md (100%) rename doc/{impl-thoughts => implementation planning}/html-messages.md (100%) rename doc/{ => implementation planning}/invites.md (100%) rename doc/{impl-thoughts => implementation planning}/room-types.ts (100%) rename doc/{impl-thoughts => implementation planning}/session-container.md (100%) rename doc/{impl-thoughts => implementation planning}/timeline-member.md (100%) rename doc/{ => problem solving}/IMPORT-ISSUES.md (100%) rename doc/{ => problem solving}/INDEXEDDB.md (100%) rename doc/{ => problem solving}/domexception_mapping.md (100%) delete mode 100644 doc/viewhierarchy.md diff --git a/doc/FAQ.md b/FAQ.md similarity index 100% rename from doc/FAQ.md rename to FAQ.md diff --git a/doc/GOAL.md b/doc/GOAL.md deleted file mode 100644 index 3883cf27..00000000 --- a/doc/GOAL.md +++ /dev/null @@ -1,8 +0,0 @@ -goal: - -write client that works on lumia 950 phone, so I can use matrix on my phone. - -try approach offline to indexeddb. go low-memory, and test the performance of storing every event individually in indexeddb. - -try to use little bandwidth, mainly by being an offline application and storing all requested data in indexeddb. -be as functional as possible while offline diff --git a/doc/TODO.md b/doc/TODO.md deleted file mode 100644 index 7d16400d..00000000 --- a/doc/TODO.md +++ /dev/null @@ -1,77 +0,0 @@ -# Minimal thing to get working - - - DONE: finish summary store - - DONE: move "sdk" bits over to "matrix" directory - - DONE: add eventemitter - - DONE: make sync work - - DONE: store summaries - - DONE: setup editorconfig - - DONE: setup linting (also in editor) - - DONE: store timeline - - DONE: store state - - DONE: make summary work better (name and joined/inviteCount doesn't seem to work well) - - DONE: timeline doesn't seem to recover it's key well upon loading, the query in load seems to never yield an event in the persister - - DONE: map DOMException to something better - - it's pretty opaque now when something idb related fails. DOMException has these fields: - code: 0 - message: "Key already exists in the object store." - name: "ConstraintError" - - DONE: emit events so we can start showing something on the screen maybe? - - DONE: move session._rooms over to Map, so we can iterate over it, ... - - DONE: build a very basic interface with - - DONE: a start/stop sync button - - DONE: a room list sorted alphabetically - - DONE: do some preprocessing on sync response which can then be used by persister, summary, timeline - - DONE: support timeline - - DONE: clicking on a room list, you see messages (userId -> body) - - DONE: style minimal UI - - DONE: implement gap filling and fragments (see FRAGMENTS.md) - - DONE: allow collection items (especially tiles) to self-update - - improve fragmentidcomparer::add - - DONE: better UI - - fix MappedMap update mechanism - - see if in BaseObservableMap we need to change ...params - - DONE: put sync button and status label inside SessionView - - fix some errors: - - find out if `(this._emitCollectionUpdate)(this)` is different than `this._emitCollectionUpdate(this)` - - got "database tried to mutate when not allowed" or something error as well - - find out why when RoomPersister.(\_createGapEntry/\_createEventEntry) we remove .buffer the transaction fails (good), but upon fixing and refreshing is missing a message! syncToken should not be saved, so why isn't this again in the sync response and now the txn does succeed? - - DONE: take access token out of IDB? this way it can be stored in a more secure thing for non-web clients, together wit encryption key for olm sessions ... ? like macos keychain, gnome keyring, ... maybe using https://www.npmjs.com/package/keytar - - DONE: experiment with using just a normal array with 2 numbers for sortkeys, to work in Edge as well. - - DONE: send messages - - DONE: fill gaps with call to /messages - - - DONE: build script - - DONE: take dev index.html, run some dom modifications to change script tag with `parse5`. - - DONE: create js bundle, rollup - - DONE: create css bundle, postcss, probably just need postcss-import for now, but good to have more options - - DONE: put all in /target - - have option to run it locally to test - - - deploy script - - upload /target to github pages - - - DONE: offline available - - both offline mechanisms have (filelist, version) as input for their template: - - create appcache manifest with (index.html, brawl.js, brawl.css) and print version number in it - - create service worker wit file list to cache (at top const files = "%%FILES_ARRAY%%", version = "%%VERSION%%") - - write web manifest - - DONE: delete and clear sessions from picker - - option to close current session and go back to picker - - - accept invite - - member list - - e2e encryption - - sync retry strategy - - instead of stopping sync on fetch error, show spinner and status and have auto retry strategy - - - create room - - join room - - leave room - - unread rooms, badge count, sort rooms by activity - - - DONE: create sync filter - - DONE: lazy loading members - - decide denormalized data in summary vs reading from multiple stores PER room on load - - allow Room/Summary class to be subclassed and store additional data? - - store account data, support read markers diff --git a/doc/api.md b/doc/api.md deleted file mode 100644 index 89e03639..00000000 --- a/doc/api.md +++ /dev/null @@ -1,90 +0,0 @@ -Session - properties: - rooms -> Rooms - -# storage -Storage - key...() -> KeyRange - start...Txn() -> Transaction -Transaction - store(name) -> ObjectStore - finish() - rollback() -ObjectStore : QueryTarget - index(name) -Index : QueryTarget - - -Rooms: EventEmitter, Iterator - get(id) -> RoomSummary ? -InternalRoom: EventEmitter - applySync(roomResponse, membership, txn) - - this method updates the room summary - - persists the room summary - - persists room state & timeline with RoomPersister - - updates the OpenRoom if present - - - applyAndPersistSync(roomResponse, membership, txn) { - this._summary.applySync(roomResponse, membership); - this._summary.persist(txn); - this._roomPersister.persist(roomResponse, membership, txn); - if (this._openRoom) { - this._openRoom.applySync(roomResponse); - } - } - -RoomPersister - RoomPersister (persists timeline and room state) - RoomSummary (persists room summary) -RoomSummary : EventEmitter - methods: - async open() - id - name - lastMessage - unreadCount - mentionCount - isEncrypted - isDirectMessage - membership - - should this have a custom reducer for custom fields? - - events - propChange(fieldName) - -OpenRoom : EventEmitter - properties: - timeline - events: - - -RoomState: EventEmitter - [room_id, event_type, state_key] -> [sort_key, event] -Timeline: EventEmitter - // should have a cache of recently lookup sender members? - // can we disambiguate members like this? - methods: - lastEvents(amount) - firstEvents(amount) - eventsAfter(sortKey, amount) - eventsBefore(sortKey, amount) - events: - eventsApppended - -RoomMembers : EventEmitter, Iterator - // no order, but need to be able to get all members somehow, needs to map to a ReactiveMap or something - events: - added(ids, values) - removed(ids, values) - changed(id, fieldName) -RoomMember: EventEmitter - properties: - id - name - powerLevel - membership - avatar - events: - propChange(fieldName) \ No newline at end of file diff --git a/doc/SKINNING.md b/doc/architecture/SKINNING.md similarity index 100% rename from doc/SKINNING.md rename to doc/architecture/SKINNING.md diff --git a/doc/THEMING.md b/doc/architecture/THEMING.md similarity index 100% rename from doc/THEMING.md rename to doc/architecture/THEMING.md diff --git a/doc/UI/index.md b/doc/architecture/UI/index.md similarity index 100% rename from doc/UI/index.md rename to doc/architecture/UI/index.md diff --git a/doc/UI/render-dom-elements.md b/doc/architecture/UI/render-dom-elements.md similarity index 100% rename from doc/UI/render-dom-elements.md rename to doc/architecture/UI/render-dom-elements.md diff --git a/doc/UI/ui.md b/doc/architecture/UI/ui.md similarity index 100% rename from doc/UI/ui.md rename to doc/architecture/UI/ui.md diff --git a/doc/architecture.md b/doc/architecture/architecture.md similarity index 100% rename from doc/architecture.md rename to doc/architecture/architecture.md diff --git a/doc/images/coloring-process.png b/doc/architecture/images/coloring-process.png similarity index 100% rename from doc/images/coloring-process.png rename to doc/architecture/images/coloring-process.png diff --git a/doc/images/svg-icon-example.png b/doc/architecture/images/svg-icon-example.png similarity index 100% rename from doc/images/svg-icon-example.png rename to doc/architecture/images/svg-icon-example.png diff --git a/doc/images/theming-architecture.png b/doc/architecture/images/theming-architecture.png similarity index 100% rename from doc/images/theming-architecture.png rename to doc/architecture/images/theming-architecture.png diff --git a/doc/persisted-network-calls.md b/doc/architecture/persisted-network-calls.md similarity index 100% rename from doc/persisted-network-calls.md rename to doc/architecture/persisted-network-calls.md diff --git a/doc/sync-updates.md b/doc/architecture/sync-updates.md similarity index 100% rename from doc/sync-updates.md rename to doc/architecture/sync-updates.md diff --git a/doc/updates.md b/doc/architecture/updates.md similarity index 100% rename from doc/updates.md rename to doc/architecture/updates.md diff --git a/doc/impl-thoughts/CATCHUP-BACKFILL.md b/doc/implementation planning/CATCHUP-BACKFILL.md similarity index 100% rename from doc/impl-thoughts/CATCHUP-BACKFILL.md rename to doc/implementation planning/CATCHUP-BACKFILL.md diff --git a/doc/CSS.md b/doc/implementation planning/CSS.md similarity index 100% rename from doc/CSS.md rename to doc/implementation planning/CSS.md diff --git a/doc/impl-thoughts/DESIGN.md b/doc/implementation planning/DESIGN.md similarity index 100% rename from doc/impl-thoughts/DESIGN.md rename to doc/implementation planning/DESIGN.md diff --git a/doc/impl-thoughts/E2EE.md b/doc/implementation planning/E2EE.md similarity index 100% rename from doc/impl-thoughts/E2EE.md rename to doc/implementation planning/E2EE.md diff --git a/doc/impl-thoughts/FRAGMENTS.md b/doc/implementation planning/FRAGMENTS.md similarity index 100% rename from doc/impl-thoughts/FRAGMENTS.md rename to doc/implementation planning/FRAGMENTS.md diff --git a/doc/impl-thoughts/LOCAL-ECHO-STATE.md b/doc/implementation planning/LOCAL-ECHO-STATE.md similarity index 100% rename from doc/impl-thoughts/LOCAL-ECHO-STATE.md rename to doc/implementation planning/LOCAL-ECHO-STATE.md diff --git a/doc/impl-thoughts/LOGIN.md b/doc/implementation planning/LOGIN.md similarity index 100% rename from doc/impl-thoughts/LOGIN.md rename to doc/implementation planning/LOGIN.md diff --git a/doc/impl-thoughts/MEMBERS.md b/doc/implementation planning/MEMBERS.md similarity index 100% rename from doc/impl-thoughts/MEMBERS.md rename to doc/implementation planning/MEMBERS.md diff --git a/doc/impl-thoughts/PENDING_REPLIES.md b/doc/implementation planning/PENDING_REPLIES.md similarity index 100% rename from doc/impl-thoughts/PENDING_REPLIES.md rename to doc/implementation planning/PENDING_REPLIES.md diff --git a/doc/impl-thoughts/PUSH.md b/doc/implementation planning/PUSH.md similarity index 100% rename from doc/impl-thoughts/PUSH.md rename to doc/implementation planning/PUSH.md diff --git a/doc/QUESTIONS.md b/doc/implementation planning/QUESTIONS.md similarity index 100% rename from doc/QUESTIONS.md rename to doc/implementation planning/QUESTIONS.md diff --git a/doc/impl-thoughts/READ-RECEIPTS.md b/doc/implementation planning/READ-RECEIPTS.md similarity index 100% rename from doc/impl-thoughts/READ-RECEIPTS.md rename to doc/implementation planning/READ-RECEIPTS.md diff --git a/doc/impl-thoughts/RECONNECTING.md b/doc/implementation planning/RECONNECTING.md similarity index 100% rename from doc/impl-thoughts/RECONNECTING.md rename to doc/implementation planning/RECONNECTING.md diff --git a/doc/impl-thoughts/RELATIONS.md b/doc/implementation planning/RELATIONS.md similarity index 100% rename from doc/impl-thoughts/RELATIONS.md rename to doc/implementation planning/RELATIONS.md diff --git a/doc/RELEASE.md b/doc/implementation planning/RELEASE.md similarity index 100% rename from doc/RELEASE.md rename to doc/implementation planning/RELEASE.md diff --git a/doc/impl-thoughts/REPLIES.md b/doc/implementation planning/REPLIES.md similarity index 100% rename from doc/impl-thoughts/REPLIES.md rename to doc/implementation planning/REPLIES.md diff --git a/doc/impl-thoughts/ROOM-VERSIONS.md b/doc/implementation planning/ROOM-VERSIONS.md similarity index 100% rename from doc/impl-thoughts/ROOM-VERSIONS.md rename to doc/implementation planning/ROOM-VERSIONS.md diff --git a/doc/impl-thoughts/SDK.md b/doc/implementation planning/SDK.md similarity index 100% rename from doc/impl-thoughts/SDK.md rename to doc/implementation planning/SDK.md diff --git a/doc/SENDING.md b/doc/implementation planning/SENDING.md similarity index 100% rename from doc/SENDING.md rename to doc/implementation planning/SENDING.md diff --git a/doc/impl-thoughts/SSO.md b/doc/implementation planning/SSO.md similarity index 100% rename from doc/impl-thoughts/SSO.md rename to doc/implementation planning/SSO.md diff --git a/doc/impl-thoughts/VIEW-UPDATES.md b/doc/implementation planning/VIEW-UPDATES.md similarity index 100% rename from doc/impl-thoughts/VIEW-UPDATES.md rename to doc/implementation planning/VIEW-UPDATES.md diff --git a/doc/impl-thoughts/background-tasks.md b/doc/implementation planning/background-tasks.md similarity index 100% rename from doc/impl-thoughts/background-tasks.md rename to doc/implementation planning/background-tasks.md diff --git a/doc/impl-thoughts/html-messages.md b/doc/implementation planning/html-messages.md similarity index 100% rename from doc/impl-thoughts/html-messages.md rename to doc/implementation planning/html-messages.md diff --git a/doc/invites.md b/doc/implementation planning/invites.md similarity index 100% rename from doc/invites.md rename to doc/implementation planning/invites.md diff --git a/doc/impl-thoughts/room-types.ts b/doc/implementation planning/room-types.ts similarity index 100% rename from doc/impl-thoughts/room-types.ts rename to doc/implementation planning/room-types.ts diff --git a/doc/impl-thoughts/session-container.md b/doc/implementation planning/session-container.md similarity index 100% rename from doc/impl-thoughts/session-container.md rename to doc/implementation planning/session-container.md diff --git a/doc/impl-thoughts/timeline-member.md b/doc/implementation planning/timeline-member.md similarity index 100% rename from doc/impl-thoughts/timeline-member.md rename to doc/implementation planning/timeline-member.md diff --git a/doc/IMPORT-ISSUES.md b/doc/problem solving/IMPORT-ISSUES.md similarity index 100% rename from doc/IMPORT-ISSUES.md rename to doc/problem solving/IMPORT-ISSUES.md diff --git a/doc/INDEXEDDB.md b/doc/problem solving/INDEXEDDB.md similarity index 100% rename from doc/INDEXEDDB.md rename to doc/problem solving/INDEXEDDB.md diff --git a/doc/domexception_mapping.md b/doc/problem solving/domexception_mapping.md similarity index 100% rename from doc/domexception_mapping.md rename to doc/problem solving/domexception_mapping.md diff --git a/doc/viewhierarchy.md b/doc/viewhierarchy.md deleted file mode 100644 index c4e6355a..00000000 --- a/doc/viewhierarchy.md +++ /dev/null @@ -1,21 +0,0 @@ -view hierarchy: -``` - BrawlView - SwitchView - SessionView - SyncStatusBar - ListView(left-panel) - RoomTile - SwitchView - RoomPlaceholderView - RoomView - MiddlePanel - ListView(timeline) - event tiles (see ui/session/room/timeline/) - ComposerView - RightPanel - SessionPickView - ListView - SessionPickerItemView - LoginView -``` From 13aea539fa65811952ca9085c538ae58f099e901 Mon Sep 17 00:00:00 2001 From: Bruno Windels <274386+bwindels@users.noreply.github.com> Date: Tue, 17 Jan 2023 17:30:48 +0100 Subject: [PATCH 3/5] move ts style guide to own dir --- doc/{TS-MIGRATION.md => style guide/typescript.md} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename doc/{TS-MIGRATION.md => style guide/typescript.md} (100%) diff --git a/doc/TS-MIGRATION.md b/doc/style guide/typescript.md similarity index 100% rename from doc/TS-MIGRATION.md rename to doc/style guide/typescript.md From 887dea528d8721e0ac8b287c7662f245ecd551ca Mon Sep 17 00:00:00 2001 From: Bruno Windels <274386+bwindels@users.noreply.github.com> Date: Tue, 17 Jan 2023 17:31:48 +0100 Subject: [PATCH 4/5] update dirs in docs --- FAQ.md | 2 +- README.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/FAQ.md b/FAQ.md index 0823ee08..43053c2f 100644 --- a/FAQ.md +++ b/FAQ.md @@ -36,4 +36,4 @@ Published builds can be found at https://github.com/vector-im/hydrogen-web/relea ## I want to embed Hydrogen in my website, how should I do that? -Hydrogen aims to be usable as an SDK, and while it is still early days, you can find some documentation how to do that in [SDK.md](SDK.md). +Hydrogen aims to be usable as an SDK, and while it is still early days, you can find some documentation how to do that in [SDK.md](doc/SDK.md). diff --git a/README.md b/README.md index a4c1529f..7ad012a5 100644 --- a/README.md +++ b/README.md @@ -43,4 +43,4 @@ PS: You need nodejs, running yarn on top of any other js platform is not support # FAQ -Some frequently asked questions are answered [here](doc/FAQ.md). +Some frequently asked questions are answered [here](FAQ.md). From bd648c1de33082830c9f9a5382cadc4ecb5ab341 Mon Sep 17 00:00:00 2001 From: Bruno Windels <274386+bwindels@users.noreply.github.com> Date: Thu, 19 Jan 2023 09:25:11 +0100 Subject: [PATCH 5/5] skinning support is broken, remove doc --- doc/architecture/SKINNING.md | 22 ---------------------- 1 file changed, 22 deletions(-) delete mode 100644 doc/architecture/SKINNING.md diff --git a/doc/architecture/SKINNING.md b/doc/architecture/SKINNING.md deleted file mode 100644 index 5f1c735d..00000000 --- a/doc/architecture/SKINNING.md +++ /dev/null @@ -1,22 +0,0 @@ -# Replacing javascript files - -Any source file can be replaced at build time by mapping the path in a JSON file passed in to the build command, e.g. `yarn build --override-imports customizations.json`. The file should be written like so: - -```json -{ - "src/platform/web/ui/session/room/timeline/TextMessageView.js": "src/platform/web/ui/session/room/timeline/MyTextMessageView.js" -} -``` -The paths are relative to the location of the mapping file, but the mapping file should be in a parent directory of the files you want to replace. - -You should see a "replacing x with y" line (twice actually, for the normal and legacy build). - -# Injecting CSS - -You can override the location of the main css file with the `--override-css ` option to the build script. The default is `src/platform/web/ui/css/main.css`, which you probably want to import from your custom css file like so: - -```css -@import url('src/platform/web/ui/css/main.css'); - -/* additions */ -```