A music player that connects to your cloud/distributed storage. diffuse.sh
Something went wrong. Try again.
7.3 kB · 235 lines
JavaScript
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236import foundation from "~/common/foundation.js";import { effect } from "~/common/signal.js";
const ATPROTO_OUTPUT_NAME = "dor-atproto-passkey";const ATPROTO_PASSKEY_NAME = "dtor-passkey-encryption";const ATPROTO_SYNC_NAME = "dtor-atproto-sync";
const ATPROTO_SPACE_OUTPUT_NAME = "dor-atproto-space";const ATPROTO_SPACE_SYNC_NAME = "dtor-atproto-space-sync";
const DASL_SYNC_NAME = "dtob-dasl-sync";const DROPBOX_OUTPUT_NAME = "dob-dropbox";const S3_OUTPUT_NAME = "dob-s3";
/** * @import OutputOrchestrator from "~/components/orchestrator/output/element.js" */
/** @type {Set<string>} */let previouslyActivated = new Set();
/** * Setup DOM elements when needed. */effect(() => { const output = foundation.signals.orchestrator.output(); if (!output) return;
atprotoPasskey(output); atprotoSpace(output); dropbox(output); s3(output);
output.loadSelected();});
/** * Dynamically import custom elements when needed. */effect(() => { const output = foundation.signals.orchestrator.output(); if (!output) return;
const set = output.activated(); const newlyActicated = set.difference(previouslyActivated);
previouslyActivated = set;
Array.from(newlyActicated).map((id) => { switch (id) { case "do-output__dc-output__atproto-passkey": return atprotoPasskeyCustomElements(); case "do-output__dc-output__atproto-space": return atprotoSpaceCustomElements(); case "do-output__dc-output__s3": return s3CustomElements(); case "do-output__dc-output__dropbox": return dropboxCustomElements(); } });});
////////////////////////////////////////////// AT PROTOCOL////////////////////////////////////////////
/** * Adds a few extra layers of functionality to the AT Protocol output, * optional passkey encryption and local-first syncing. * * @param {OutputOrchestrator} output */export function atprotoPasskey(output) { const out = document.createElement(ATPROTO_OUTPUT_NAME); out.setAttribute("group", foundation.GROUP); out.setAttribute("id", "do-output__dor-atproto-passkey");
const sync = document.createElement(ATPROTO_SYNC_NAME); sync.setAttribute("group", foundation.GROUP); sync.setAttribute("id", "do-output__dtor-atproto-sync"); sync.setAttribute("namespace", "atproto-passkey"); sync.setAttribute("output-selector", "#do-output__dor-atproto-passkey");
const passkey = document.createElement(ATPROTO_PASSKEY_NAME); passkey.setAttribute("group", foundation.GROUP); passkey.setAttribute("id", "do-output__dc-output__atproto-passkey"); passkey.setAttribute("label", "AT Protocol (Public)"); passkey.setAttribute("namespace", "atproto-passkey"); passkey.setAttribute( "connect", "facets/connect/atproto-passkey/index.html", ); passkey.setAttribute( "output-selector", "#do-output__dtor-atproto-sync", );
// Add elements to DOM, make sure the transformer // is added to the configurator so the user can select it. output.append(out); output.append(sync); output.outputConfigurator.append(passkey);}
export function atprotoPasskeyCustomElements() { import("~/components/output/raw/atproto-passkey/element.js"); import( "~/components/transformer/output/raw/atproto-sync/element.js" ); import( "~/components/transformer/output/refiner/passkey-encryption/element.js" );}
////////////////////////////////////////////// AT PROTOCOL (SPACES)////////////////////////////////////////////
/** * Exposes the AT Protocol space output as a user-data storage option. * * Unlike the public AT Protocol output there is no firehose-based sync or * passkey encryption. The raw space output is wrapped with a local-first sync * transformer (IndexedDB cache + union merge) so data — including the default * facets — is persisted and synced with the space. * * @param {OutputOrchestrator} output */export function atprotoSpace(output) { const out = document.createElement(ATPROTO_SPACE_OUTPUT_NAME); out.setAttribute("group", foundation.GROUP); out.setAttribute("id", "do-output__dor-atproto-space");
const sync = document.createElement(ATPROTO_SPACE_SYNC_NAME); sync.setAttribute("group", foundation.GROUP); sync.setAttribute("id", "do-output__dc-output__atproto-space"); sync.setAttribute("label", "AT Protocol (Space)"); sync.setAttribute("namespace", "atproto-space"); sync.setAttribute( "connect", "facets/connect/atproto-space/index.html", ); sync.setAttribute("output-selector", "#do-output__dor-atproto-space");
output.append(out); output.outputConfigurator.append(sync);}
export function atprotoSpaceCustomElements() { import("~/components/output/raw/atproto-space/element.js"); import( "~/components/transformer/output/raw/atproto-space-sync/element.js" );}
////////////////////////////////////////////// DROPBOX////////////////////////////////////////////
/** * Wraps user data in a custom CBOR encode data structure * which tracks what identifiers are removed. * The transformer used here allows for merging of data. * * @param {OutputOrchestrator} output */export function dropbox(output) { const out = document.createElement(DROPBOX_OUTPUT_NAME); out.setAttribute("group", foundation.GROUP); out.setAttribute("id", "do-output__dob-dropbox");
const sync = document.createElement(DASL_SYNC_NAME); sync.setAttribute("group", foundation.GROUP); sync.setAttribute("id", "do-output__dc-output__dropbox"); sync.setAttribute("label", "Dropbox"); sync.setAttribute("namespace", "dropbox"); sync.setAttribute( "connect", "facets/connect/dropbox/index.html", ); sync.setAttribute("output-selector", "#do-output__dob-dropbox");
// Add elements to DOM, make sure the transformer // is added to the configurator so the user can select it. output.append(out); output.outputConfigurator.append(sync);}
export function dropboxCustomElements() { import("~/components/output/bytes/dropbox/element.js"); import( "~/components/transformer/output/bytes/dasl-sync/element.js" );}
////////////////////////////////////////////// S3////////////////////////////////////////////
/** * Wraps user data in a custom CBOR encode data structure * which tracks what identifiers are removed. * The transformer used here allows for merging of data. * * @param {OutputOrchestrator} output */export function s3(output) { const out = document.createElement(S3_OUTPUT_NAME); out.setAttribute("group", foundation.GROUP); out.setAttribute("id", "do-output__dob-s3");
const sync = document.createElement(DASL_SYNC_NAME); sync.setAttribute("group", foundation.GROUP); sync.setAttribute("id", "do-output__dc-output__s3"); sync.setAttribute("label", "S3"); sync.setAttribute("namespace", "s3"); sync.setAttribute( "connect", "facets/connect/s3/index.html", ); sync.setAttribute("output-selector", "#do-output__dob-s3");
// Add elements to DOM, make sure the transformer // is added to the configurator so the user can select it. output.append(out); output.outputConfigurator.append(sync);}
export function s3CustomElements() { import("~/components/output/bytes/s3/element.js"); import( "~/components/transformer/output/bytes/dasl-sync/element.js" );}