Updates to 'apps' from Tasia.
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@4846 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
parent
fbc3cfeda4
commit
08a2436b8f
@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"type": "tildefriends-app",
|
"type": "tildefriends-app",
|
||||||
"emoji": "💻",
|
"emoji": "💻",
|
||||||
"previous": "&33ngNe0YrH3JScss6krlCwddZcXl8C5szonp7DYy4qA=.sha256"
|
"previous": "&RdVEsVscZm3aWzcMrEZS8mskO5tUmvaEUihex2MMfZQ=.sha256"
|
||||||
}
|
}
|
||||||
154
apps/apps/app.js
154
apps/apps/app.js
@ -1,15 +1,31 @@
|
|||||||
|
/**
|
||||||
|
* Fetches information about the applications
|
||||||
|
* @param apps Record<appName, blobId>
|
||||||
|
* @returns an object including the apps' name, emoji, and blobs ids
|
||||||
|
*/
|
||||||
async function fetch_info(apps) {
|
async function fetch_info(apps) {
|
||||||
let result = {};
|
let result = {};
|
||||||
|
|
||||||
|
// For each app
|
||||||
for (let [key, value] of Object.entries(apps)) {
|
for (let [key, value] of Object.entries(apps)) {
|
||||||
|
// Get it's blob and parse it
|
||||||
let blob = await ssb.blobGet(value);
|
let blob = await ssb.blobGet(value);
|
||||||
blob = blob ? utf8Decode(blob) : '{}';
|
blob = blob ? utf8Decode(blob) : '{}';
|
||||||
|
|
||||||
|
// Add it to the result object
|
||||||
result[key] = JSON.parse(blob);
|
result[key] = JSON.parse(blob);
|
||||||
}
|
}
|
||||||
|
|
||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
*
|
||||||
|
*/
|
||||||
async function fetch_shared_apps() {
|
async function fetch_shared_apps() {
|
||||||
let messages = {};
|
let messages = {};
|
||||||
|
|
||||||
await ssb.sqlAsync(`
|
await ssb.sqlAsync(`
|
||||||
SELECT messages.*
|
SELECT messages.*
|
||||||
FROM messages_fts('"application/tildefriends"')
|
FROM messages_fts('"application/tildefriends"')
|
||||||
@ -29,6 +45,7 @@ async function fetch_shared_apps() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
let result = {};
|
let result = {};
|
||||||
for (let app of Object.values(messages).sort((x, y) => y.message.timestamp - x.message.timestamp)) {
|
for (let app of Object.values(messages).sort((x, y) => y.message.timestamp - x.message.timestamp)) {
|
||||||
let app_object = JSON.parse(utf8Decode(await ssb.blobGet(app.blob)));
|
let app_object = JSON.parse(utf8Decode(await ssb.blobGet(app.blob)));
|
||||||
@ -41,18 +58,26 @@ async function fetch_shared_apps() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function main() {
|
async function main() {
|
||||||
var apps = await fetch_info(await core.apps());
|
const apps = await fetch_info(await core.apps());
|
||||||
var core_apps = await fetch_info(await core.apps('core'));
|
const core_apps = await fetch_info(await core.apps('core'));
|
||||||
let shared_apps = await fetch_shared_apps();
|
const shared_apps = await fetch_shared_apps();
|
||||||
var doc = `<!DOCTYPE html>
|
|
||||||
<html>
|
const stylesheet = `
|
||||||
<head>
|
body {
|
||||||
<style>
|
color: whitesmoke;
|
||||||
|
font-family: sans-serif;
|
||||||
|
margin: 16px;
|
||||||
|
}
|
||||||
.container {
|
.container {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, 64px);
|
grid-template-columns: repeat(auto-fill, 64px);
|
||||||
|
gap: 1em;
|
||||||
justify-content: space-around;
|
justify-content: space-around;
|
||||||
|
background-color: #ffffff10;
|
||||||
|
border: 2px solid #073642;
|
||||||
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app {
|
.app {
|
||||||
height: 96px;
|
height: 96px;
|
||||||
width: 64px;
|
width: 64px;
|
||||||
@ -67,48 +92,87 @@ async function main() {
|
|||||||
max-width: 64px;
|
max-width: 64px;
|
||||||
text-overflow: ellipsis ellipsis;
|
text-overflow: ellipsis ellipsis;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
color: whitesmoke;
|
||||||
}
|
}
|
||||||
</style>
|
`;
|
||||||
</head>
|
|
||||||
<body style="background: #888">
|
|
||||||
<h1 id="apps_title">Apps</h1>
|
|
||||||
<div id="apps" class="container"></div>
|
|
||||||
<h1>Shared Apps</h1>
|
|
||||||
<div id="shared_apps" class="container"></div>
|
|
||||||
<h1>Core Apps</h1>
|
|
||||||
<div id="core_apps" class="container"></div>
|
|
||||||
</body>
|
|
||||||
<script>
|
|
||||||
function populate_apps(id, name, apps) {
|
|
||||||
var list = document.getElementById(id);
|
|
||||||
for (let app of Object.keys(apps).sort()) {
|
|
||||||
let div = list.appendChild(document.createElement('div'));
|
|
||||||
div.classList.add('app');
|
|
||||||
|
|
||||||
let href = name ? '/~' + name + '/' + app + '/' : ('/' + apps[app].blob_id + '/');
|
const body = `
|
||||||
let icon_a = document.createElement('a');
|
<h1 style="text-shadow: #808080 0 0 10px;">Welcome to Tilde Friends.</h1>
|
||||||
let icon = document.createElement('div');
|
|
||||||
icon.appendChild(document.createTextNode(apps[app].emoji || '📦'));
|
|
||||||
icon.style.fontSize = 'xxx-large';
|
|
||||||
icon_a.appendChild(icon);
|
|
||||||
icon_a.href = href;
|
|
||||||
icon_a.target = '_top';
|
|
||||||
div.appendChild(icon_a);
|
|
||||||
|
|
||||||
let a = document.createElement('a');
|
<h2>your apps</h2>
|
||||||
a.appendChild(document.createTextNode(app));
|
<div id="apps" class="container"></div>
|
||||||
a.href = href;
|
|
||||||
a.target = '_top';
|
<h2>shared apps</h2>
|
||||||
div.appendChild(a);
|
<div id="shared_apps" class="container"></div>
|
||||||
|
|
||||||
|
<h2>core apps</h2>
|
||||||
|
<div id="core_apps" class="container"></div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
const script = `
|
||||||
|
/*
|
||||||
|
* Creates a list of apps
|
||||||
|
* @param id the id of the element to populate
|
||||||
|
* @param name (a username, 'core' or undefined)
|
||||||
|
* @param apps Object, a list of apps
|
||||||
|
*/
|
||||||
|
function populate_apps(id, name, apps) {
|
||||||
|
// Our target
|
||||||
|
var list = document.getElementById(id);
|
||||||
|
|
||||||
|
// For each app in the provided list
|
||||||
|
for (let app of Object.keys(apps).sort()) {
|
||||||
|
|
||||||
|
// Create the item
|
||||||
|
let div = list.appendChild(document.createElement('div'));
|
||||||
|
div.classList.add('app');
|
||||||
|
|
||||||
|
// The app's icon
|
||||||
|
let href = name ? '/~' + name + '/' + app + '/' : ('/' + apps[app].blob_id + '/');
|
||||||
|
let icon_a = document.createElement('a');
|
||||||
|
let icon = document.createElement('div');
|
||||||
|
icon.appendChild(document.createTextNode(apps[app].emoji || '📦'));
|
||||||
|
icon.style.fontSize = 'xxx-large';
|
||||||
|
icon_a.appendChild(icon);
|
||||||
|
icon_a.href = href;
|
||||||
|
icon_a.target = '_top';
|
||||||
|
div.appendChild(icon_a);
|
||||||
|
|
||||||
|
// The app's name
|
||||||
|
let a = document.createElement('a');
|
||||||
|
a.appendChild(document.createTextNode(app));
|
||||||
|
a.href = href;
|
||||||
|
a.target = '_top';
|
||||||
|
div.appendChild(a);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
document.getElementById('apps_title').innerText = "~${escape(core.user.credentials?.session?.name || 'guest')}'s Apps";
|
populate_apps('apps', '${core.user.credentials?.session?.name}', ${JSON.stringify(apps)});
|
||||||
populate_apps('apps', '${core.user.credentials?.session?.name}', ${JSON.stringify(apps)});
|
populate_apps('core_apps', 'core', ${JSON.stringify(core_apps)});
|
||||||
populate_apps('core_apps', 'core', ${JSON.stringify(core_apps)});
|
populate_apps('shared_apps', undefined, ${JSON.stringify(shared_apps)});
|
||||||
populate_apps('shared_apps', undefined, ${JSON.stringify(shared_apps)});
|
`;
|
||||||
</script>
|
|
||||||
</html>`;
|
// Build the document
|
||||||
app.setDocument(doc);
|
const document = `
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<style>
|
||||||
|
${stylesheet}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
${body}
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
${script}
|
||||||
|
</script>
|
||||||
|
</html>`;
|
||||||
|
|
||||||
|
// Send it to the browser
|
||||||
|
app.setDocument(document);
|
||||||
}
|
}
|
||||||
|
|
||||||
main();
|
main();
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user