Skip to content

decentral-ninja/website

BranchesTags

Repository files navigation

Decentral Ninja

The easiest way to connect with others without the need for phone numbers or email exchanges!

👆 chat @ decentral.ninja

Install & Run

  • git submodule update --init --recursive
  • npm install
  • npm run serve

Icon Lib

https://tabler.io/icons

TODO:

  • choose license (https://www.infoworld.com/article/3703768/the-open-source-licensing-war-is-over.html?utm_source=changelog-news)
  • move exampleTwo to here...
  • textarea instead of input field
  • reorganize exampleTwo, hidden appear effect, chat-, room-, user-, provider- controller
  • finish completely style/transform exampleTwo
  • src/es/chat/es/components/molecules/Users.js listen to "yjs-users" event dispatched from controller/Users.js with func. detail.getData() and not awareness-change event!!!
  • pimp Router to open new components on certain query parameters (as key) and make room view to choose room or create room
  • header controls in dialog (nav modal)
  • replace confirm box with input dialog and fix lost username by storing it to local storage
  • controllers/Rooms.js getting a room event from EventDrivenYjs.js and maintaining the rooms at local storage for further consumption at Rooms view / manifest to fullscreen / give option to open in new tab
  • delete room local storage
  • add an atom listening to "yjs-room" any event and displaying the "room name" info "in the header" (also replace 'yjs-get-room' in the header with that atom) where ever placed (general element with info batch support and dispatch Event to open dialog menu) & nickname on each message which on click opens the nickname window and updates on yjs-nickname
  • on app reset directly route to last visited room vs. home
  • room overview show current chat grayed out
  • notification on request per room (deliver through message channel), cache notification at sw cache with room name (cache this uid, see MasterServiceWorker.js L:37), badge: https://developer.mozilla.org/en-US/docs/Web/API/Badging_API
  • MasterServiceWorker add a Notification Queue which can be read through events
  • WebWorkers for controller/Notifications.js _updateNotifications, controller/User.js + controller/Provider.js
  • add scroll down/not read messages button
  • room filter rooms list by typing
  • Delete message disappear effect
  • wormhole iframe does not work due to policy restrictions
  • start video meeting in iframe (JitsiDialog)
  • replyTo (continuer src/es/chat/es/components/atoms/Input.js L:136 + src/es/chat/es/components/molecules/dialogs/MessageDialog.js L:121)
  • copy message button
  • each instance of message must link to chat ul main message and update on each connect, resp replace with fresh clone, or rerender with fresh data
  • message dialog on initial open scroll to bottom
  • dialog close cross hover color
  • message edit self and info other make same info icon or other ...
  • emoji (https://nolanlawson.github.io/emoji-picker-element/) all in one dialog overlay per message but triggers normal reply message with one emoji and effect on intersection evtl. (done by reply and keep existing picker for the moment)
  • QR code generator (something like https://github.com/sumimakito/Awesome-qr.js#browsers) and print css https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_media_queries/Printing
  • empty message when opening new chat room
  • process message at ww
  • share room, share in this room, share api + https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API
  • on resize scroll to right message position, last message visible scroll to that instead
  • not connected providers users crdt delete mechanism at users controller
  • BUG: notifications are empty from websocket
  • navigation menu redesign, new icon, room link share from rooms menu with qr
    • user dialog and clean up users dialog
    • providers dialog and share incl. provider choose in dialog
      • fixes: Providers.js molecules status active check hostname for provider and hostname for url instead of only includes, only order providers after closing dialog
      • connected providers counter (number bubble)
      • info users connected with specific provider, historical providers and users at user overview card inside details summary
      • user view show all, incl. none active connections, to inform about providers | details summary with option to see all historical connections
      • [/] provider graph tab which opens user graph (remove list link to user graph)
      • move user info besides provider icon
      • user dialog - no innerHTML at the TODO marked sections within: src/es/chat/es/components/molecules/Users.js (// TODO: Proper update diffing logic, only render the graph when having changes, to avoid jumping on multiple updates) / consider awarenessEventListenerDelay exception dialog open again on 200ms instead of now 2000ms
      • at user graph/connection detail card, click on provider (make a provider atom similar to nickname atom) opens provider dialog and scrolls to the provider as well as graph svg click within provider dialog should scroll to the provider, also active room notification on provider open dialog -> scroll to the certain provider! (provider-dialog-show-event)
      • [/] providers with origins: ['crdt'] && status: ['unknown'] were never connected but a user in the crdt claims the connection. sort those providers into a details-summary labeled further providers (fixed with "connected" providers not allProviders)
      • WebSocket api call to check the status and deliver some context from the owner as well as fallback providers (if websocket pingProviders after api info call, on 503 service unavailable or 511 = failed) data.getWebsocketInfo data.pingProvider
      • infos about provider origins
      • [/] indicate providerFallbacks especially when provider active but not connected with highlight
      • [/] dialog share room with provider selection options
      • dialog share/clipboard to message/copy the provider url
      • [/] permanentFallbacks test (see Environment.js), regex with enforce fallback
      • no default providers when room is opened, don't enforce those when no provider is chosen
      • hint at provider icon if none is connected/active
      • [/] when sharing room without provider selected hint with open the provider dialog or other hint
      • link to users dialog, docker hub and github y-websocket repo and add p2pGraph for connected providers
      • fix btn hover and connect/disconnect button different color
      • mute state change loading animation
      • rename chat-notification-mutes and add provider urls to include as well as inform at notification event if provider is included
      • intersection lazy load provider
      • notifications do abort by signal all fetches
      • allow mute even when there is no message (this allows to block unwanted or dead providers), allow unmute (add) for those which were even not included in the getNotification and not muted (add those ignored providers, when added, to localStorage) [NOTE: think about all possible notification states (success, failed, ignored, muted)]
      • [/] show at status connected provider the amount of users and on the header provider icon the amount of connected providers
      • provider url is missing :port
      • Provider controller getWebsocketInfo function save ('yjs-merge-unique-active-room') fallbacks to local storage, incase api call does not always work. And consume it at fillProvidersWithProvidersFromRooms.
      • check for notifications at provider molecule for origin/host related notifications
      • mute/un-mute providers regarding notifications at notification molecule and controller, saving providers for which to block get-notifications (loading animation on change)
      • only show notification on provider if websocket is available
      • [/] sort muted providers last (will be sorted by statusPriority)
      • update Providers when link copy/pasted into room name field
      • [/] dialog for choosing providers when sharing (show provider dialog link to adjust) and entering room, remove default provider at src/es/components/pages/Chat.js:39 and take only default from Environment when no other provider present, attention local storage router-resume (only share the connected providers with a share link)
      • [/] dialog for choosing providers before entering a new room (when receiving a link, automatically choose those providers)
      • [/] shared room link in message or pasted room link in room dialog input: navigate to provider select window with preselection provider query param from link (already shared through crdt)
      • [/] Kill Room Button for KeepAlive at "You are alone" disconnect, before unload, change room
      • [/] share provider setting with other users to click & change (sends a message with the provider to share, when clicked opens the provider dialog and adds the received provider for the session) (The connected)
      • open at rooms online status in room overview and/or navigation
      • ping providers to see if they are online before trying connection or proposing it for connection: https://jsfiddle.net/4yrmknfa/15/ (Image error) , check if self online
      • check navigator online offline
  • Decentral href share inside message, open by routing (no refresh) same as room input field
  • End-to-End encryption Part 1: NOTE: Automatic sharing would generate many private key messages. Each user has one sync key times other users. Expl.: 2users = 2keys x 1other user = 2encrypted keys or 10users = 10keys x 9other users = 90encrypted keys. Also, newest crdt sync key entry approach would still create many but less private key messages. Expl.: 2users = 1key x 1other user = 1encrypted keys or example with three key overwrites when users joined 10users = 4keys x 9other users = 36encrypted keys. ==> The manual, user interaction approach, is more UI heavy but far more transparent and controllable for the user as well as it only sends the minimum, requested or voluntarily shared private key messages.
    • a: Each user creates per room a private/public key pair. The private key is stored locally, the public key at the user object along the uid.
    • b: A user can create synchronous keys (not shared plainly) but stored locally. These keys can be used at multiple rooms.
    • c: (Private key message) A synchronous key is salted, encrypted with the public key of other/receiving user and shared as a message with public viewable properties: TO user uid and key uid.

    Should read:

    Workflow encrypted message:

    • 1. Encrypted message: User [User A] salts and encrypts message with synchronous key (b). Message object holds key uid at public viewable properties.
    • 2. Public request message: Other user [User B], who does not have the synchronous key locally (b), see's encrypted message with UI hint (UI-Request) to request the synchronous key. The user sends the request holding the key uid in a public request message to every one, on user interaction.
    • 3. Private key message: Users [User B or other User] who have the requested key, see the public request message with the key uid request as UI hint (UI-Reply) to reply with the requested synchronous key (c) as a private key message holding public viewable properties TO user uid and key uid (c).
    • 4. At requesting user [User A], the UI hint (UI-Request) on message (2) to request is removed, since key, received as private key message, was decrypted, stored locally and message (1) was decrypted.
    • 5. For every user, the public request message UI hint (UI-Reply) is marked checked/done and disabled by the existence (:has(...)) of the reply as private key message. NOTE: Hide public request message and reply private key message, once the request is satisfied, to keep the public message chat clean. Option to make it visible. Workflow sharing key:
    • 1. Private key message: User [User A] sends key in a message holding public viewable properties TO user uid and key uid (c).
    • 2. Receiving user [User B] sees UI hint to store key locally
    • show KeyName at KeyStatus when active
    • on reply choose same key if applicable
    • on receive, set received key as default, if no active key
    • display: none request messages should be hidden first and also no delete effect if user does not have key to send and display-none anyway
    • generate truly random room name
    • key sorting
  • cooler https://github.com/ipv6rslimited/cloudseeder/blob/main/LICENSE.md , AGPL-3.0 https://github.com/Chocobozzz/PeerTube?tab=AGPL-3.0-1-ov-file#readme
  • reload smart icon (move it left of notification icon)
  • when room delete also delete localStorage and Indexeddb
  • provider: data.getWebsocketInfo "get-info"
  • linter, Update yjs rollup stuff rollup stuff needs updates, note only yjs had major changes by 2026
  • Service Worker for caching assets PWA + Fallback local hosting von decentral.ninja, https://docs.pwabuilder.com/#/home/sw-intro?id=pre-caching-during-the-install-event
  • host on multiple strong websocket instances (pangolin)
    • test again webRTC server and fire up an instance, also get some backup server instances
    • server.js pass new vapid keys by env var
    • cleanup; fallbacks at environment and server.js... start new proper instances, not local tunnel 'Bypass-Tunnel-Reminder': 'yup'
    • from local instance https://github.com/Weedshaker/y-websocket
    • from local instance https://github.com/yjs/y-webrtc
    • update flux alternative website hosts
  • [/] BugFix, persistence clears document (crdt) before timeout or possible never saved it, research: https://github.com/Weedshaker/y-websocket/blob/master/bin/utils.js#L243
  • refresh notifications key

--- Beta ---

--- Version One ---

--- Version Two ---

--- UI / UX ---

  • Add Days or/and Date of the message section

--- Emoji TODO ---

  • evaluate: https://nolanlawson.github.io/emoji-picker-element/
  • Output larger if only emoji is sent
  • Make EmojiPicker Responsive
  • create top global used emojis list
  • search function for emojis
  • display recent used emojis
  • add emojis where cursor is in text
  • dont hide emoji picker when clicked in textarea
  • use "own" emoji style --> symbl.cc

About

WEB3.0 Chat to communicate anonymously through decentralized networks. Using CRDTs (offline-first PWA), Websocket, WebRTC, WebTorrent, IPFS and all fully end-to-end encrypted. Always, 100% - FOSS - open source!

decentral.ninja

Topics

websocket webrtc ipfs decentralized crdt yjs end-to-end-encryption local-first

Resources

Readme

License

View license
Activity
Custom properties

Stars

1 star

Watchers

3 watching

Forks

1 fork
Report repository

Contributors

Languages