From 2d59e363c04512b91aa3992f3b07adbf7eac498b Mon Sep 17 00:00:00 2001 From: ThatOneCalculator Date: Sat, 18 Feb 2023 11:33:25 -0800 Subject: [PATCH] feat: :sparkles: Show time for users --- locales/en-US.yml | 1 + package.json | 4 +- .../server/api/mastodon/endpoints/account.ts | 31 ++++--- packages/backend/src/server/web/bios.js | 78 ++++++++-------- packages/backend/src/server/web/boot.js | 92 ++++++++++--------- packages/backend/src/server/web/cli.js | 56 +++++------ packages/client/package.json | 9 +- .../src/components/global/MkPageHeader.vue | 2 +- .../client/src/pages/settings/profile.vue | 2 +- packages/client/src/pages/user/home.vue | 19 ++-- pnpm-lock.yaml | 52 +++++------ 11 files changed, 178 insertions(+), 168 deletions(-) diff --git a/locales/en-US.yml b/locales/en-US.yml index 173404e7c..97f5313c8 100644 --- a/locales/en-US.yml +++ b/locales/en-US.yml @@ -1400,6 +1400,7 @@ _profile: metadataContent: "Content" changeAvatar: "Change avatar" changeBanner: "Change banner" + locationDescription: "If entered properly, this will display your local time to other users." _exportOrImport: allNotes: "All posts" followingList: "Followed users" diff --git a/package.json b/package.json index dbb304cb9..11a539409 100644 --- a/package.json +++ b/package.json @@ -1,12 +1,12 @@ { "name": "calckey", - "version": "13.2.0-dev9", + "version": "13.2.0-dev11", "codename": "aqua", "repository": { "type": "git", "url": "https://codeberg.org/calckey/calckey.git" }, - "packageManager": "pnpm@7.27.0", + "packageManager": "pnpm@7.27.1", "private": true, "scripts": { "rebuild": "pnpm run clean && pnpm -r run build && pnpm run gulp", diff --git a/packages/backend/src/server/api/mastodon/endpoints/account.ts b/packages/backend/src/server/api/mastodon/endpoints/account.ts index 8ff7ba008..5b7df948e 100644 --- a/packages/backend/src/server/api/mastodon/endpoints/account.ts +++ b/packages/backend/src/server/api/mastodon/endpoints/account.ts @@ -98,20 +98,23 @@ export function apiAccountMastodon(router: Router): void { ctx.body = e.response.data; } }); - router.get<{ Params: { id: string } }>("/v1/accounts/:id(^.*\\d.*$)", async (ctx) => { - const BASE_URL = `${ctx.protocol}://${ctx.hostname}`; - const accessTokens = ctx.headers.authorization; - const client = getClient(BASE_URL, accessTokens); - try { - const data = await client.getAccount(ctx.params.id); - ctx.body = data.data; - } catch (e: any) { - console.error(e); - console.error(e.response.data); - ctx.status = 401; - ctx.body = e.response.data; - } - }); + router.get<{ Params: { id: string } }>( + "/v1/accounts/:id(^.*\\d.*$)", + async (ctx) => { + const BASE_URL = `${ctx.protocol}://${ctx.hostname}`; + const accessTokens = ctx.headers.authorization; + const client = getClient(BASE_URL, accessTokens); + try { + const data = await client.getAccount(ctx.params.id); + ctx.body = data.data; + } catch (e: any) { + console.error(e); + console.error(e.response.data); + ctx.status = 401; + ctx.body = e.response.data; + } + }, + ); router.get<{ Params: { id: string } }>( "/v1/accounts/:id/statuses", async (ctx) => { diff --git a/packages/backend/src/server/web/bios.js b/packages/backend/src/server/web/bios.js index 1acdafd1d..e715a0106 100644 --- a/packages/backend/src/server/web/bios.js +++ b/packages/backend/src/server/web/bios.js @@ -1,7 +1,7 @@ -'use strict'; +"use strict"; window.onload = async () => { - const account = JSON.parse(localStorage.getItem('account')); + const account = JSON.parse(localStorage.getItem("account")); const i = account.token; const api = (endpoint, data = {}) => { @@ -10,42 +10,44 @@ window.onload = async () => { if (i) data.i = i; // Send request - fetch(endpoint.indexOf('://') > -1 ? endpoint : `/api/${endpoint}`, { - method: 'POST', + fetch(endpoint.indexOf("://") > -1 ? endpoint : `/api/${endpoint}`, { + method: "POST", body: JSON.stringify(data), - credentials: 'omit', - cache: 'no-cache' - }).then(async (res) => { - const body = res.status === 204 ? null : await res.json(); + credentials: "omit", + cache: "no-cache", + }) + .then(async (res) => { + const body = res.status === 204 ? null : await res.json(); - if (res.status === 200) { - resolve(body); - } else if (res.status === 204) { - resolve(); - } else { - reject(body.error); - } - }).catch(reject); + if (res.status === 200) { + resolve(body); + } else if (res.status === 204) { + resolve(); + } else { + reject(body.error); + } + }) + .catch(reject); }); return promise; }; - const content = document.getElementById('content'); + const content = document.getElementById("content"); - document.getElementById('ls').addEventListener('click', () => { - content.innerHTML = ''; + document.getElementById("ls").addEventListener("click", () => { + content.innerHTML = ""; - const lsEditor = document.createElement('div'); - lsEditor.id = 'lsEditor'; + const lsEditor = document.createElement("div"); + lsEditor.id = "lsEditor"; - const adder = document.createElement('div'); - adder.classList.add('adder'); - const addKeyInput = document.createElement('input'); - const addValueTextarea = document.createElement('textarea'); - const addButton = document.createElement('button'); - addButton.textContent = 'Add'; - addButton.addEventListener('click', () => { + const adder = document.createElement("div"); + adder.classList.add("adder"); + const addKeyInput = document.createElement("input"); + const addValueTextarea = document.createElement("textarea"); + const addButton = document.createElement("button"); + addButton.textContent = "Add"; + addButton.addEventListener("click", () => { localStorage.setItem(addKeyInput.value, addValueTextarea.value); location.reload(); }); @@ -57,21 +59,21 @@ window.onload = async () => { for (let i = 0; i < localStorage.length; i++) { const k = localStorage.key(i); - const record = document.createElement('div'); - record.classList.add('record'); - const header = document.createElement('header'); + const record = document.createElement("div"); + record.classList.add("record"); + const header = document.createElement("header"); header.textContent = k; - const textarea = document.createElement('textarea'); + const textarea = document.createElement("textarea"); textarea.textContent = localStorage.getItem(k); - const saveButton = document.createElement('button'); - saveButton.textContent = 'Save'; - saveButton.addEventListener('click', () => { + const saveButton = document.createElement("button"); + saveButton.textContent = "Save"; + saveButton.addEventListener("click", () => { localStorage.setItem(k, textarea.value); location.reload(); }); - const removeButton = document.createElement('button'); - removeButton.textContent = 'Remove'; - removeButton.addEventListener('click', () => { + const removeButton = document.createElement("button"); + removeButton.textContent = "Remove"; + removeButton.addEventListener("click", () => { localStorage.removeItem(k); location.reload(); }); diff --git a/packages/backend/src/server/web/boot.js b/packages/backend/src/server/web/boot.js index f4e0707a9..e7e859d20 100644 --- a/packages/backend/src/server/web/boot.js +++ b/packages/backend/src/server/web/boot.js @@ -9,120 +9,122 @@ * 注: webpackは介さないため、このファイルではrequireやimportは使えません。 */ -'use strict'; +"use strict"; // ブロックの中に入れないと、定義した変数がブラウザのグローバルスコープに登録されてしまい邪魔なので (async () => { window.onerror = (e) => { console.error(e); - renderError('SOMETHING_HAPPENED', e); + renderError("SOMETHING_HAPPENED", e); }; window.onunhandledrejection = (e) => { console.error(e); - renderError('SOMETHING_HAPPENED_IN_PROMISE', e); + renderError("SOMETHING_HAPPENED_IN_PROMISE", e); }; //#region Detect language & fetch translations - const v = localStorage.getItem('v') || VERSION; + const v = localStorage.getItem("v") || VERSION; const supportedLangs = LANGS; - let lang = localStorage.getItem('lang'); + let lang = localStorage.getItem("lang"); if (lang == null || !supportedLangs.includes(lang)) { if (supportedLangs.includes(navigator.language)) { lang = navigator.language; } else { - lang = supportedLangs.find(x => x.split('-')[0] === navigator.language); + lang = supportedLangs.find((x) => x.split("-")[0] === navigator.language); // Fallback - if (lang == null) lang = 'en-US'; + if (lang == null) lang = "en-US"; } } const res = await fetch(`/assets/locales/${lang}.${v}.json`); if (res.status === 200) { - localStorage.setItem('lang', lang); - localStorage.setItem('locale', await res.text()); - localStorage.setItem('localeVersion', v); + localStorage.setItem("lang", lang); + localStorage.setItem("locale", await res.text()); + localStorage.setItem("localeVersion", v); } else { await checkUpdate(); - renderError('LOCALE_FETCH'); + renderError("LOCALE_FETCH"); return; } //#endregion //#region Script function importAppScript() { - import(`/assets/${CLIENT_ENTRY}`) - .catch(async e => { - await checkUpdate(); - console.error(e); - renderError('APP_IMPORT', e); - }); + import(`/assets/${CLIENT_ENTRY}`).catch(async (e) => { + await checkUpdate(); + console.error(e); + renderError("APP_IMPORT", e); + }); } // タイミングによっては、この時点でDOMの構築が済んでいる場合とそうでない場合とがある - if (document.readyState !== 'loading') { + if (document.readyState !== "loading") { importAppScript(); } else { - window.addEventListener('DOMContentLoaded', () => { + window.addEventListener("DOMContentLoaded", () => { importAppScript(); }); } //#endregion //#region Theme - const theme = localStorage.getItem('theme'); + const theme = localStorage.getItem("theme"); if (theme) { for (const [k, v] of Object.entries(JSON.parse(theme))) { document.documentElement.style.setProperty(`--${k}`, v.toString()); // HTMLの theme-color 適用 - if (k === 'htmlThemeColor') { + if (k === "htmlThemeColor") { for (const tag of document.head.children) { - if (tag.tagName === 'META' && tag.getAttribute('name') === 'theme-color') { - tag.setAttribute('content', v); + if ( + tag.tagName === "META" && + tag.getAttribute("name") === "theme-color" + ) { + tag.setAttribute("content", v); break; } } } } } - const colorSchema = localStorage.getItem('colorSchema'); + const colorSchema = localStorage.getItem("colorSchema"); if (colorSchema) { - document.documentElement.style.setProperty('color-schema', colorSchema); + document.documentElement.style.setProperty("color-schema", colorSchema); } //#endregion - const fontSize = localStorage.getItem('fontSize'); + const fontSize = localStorage.getItem("fontSize"); if (fontSize) { - document.documentElement.classList.add('f-' + fontSize); + document.documentElement.classList.add("f-" + fontSize); } - const useSystemFont = localStorage.getItem('useSystemFont'); + const useSystemFont = localStorage.getItem("useSystemFont"); if (useSystemFont) { - document.documentElement.classList.add('useSystemFont'); + document.documentElement.classList.add("useSystemFont"); } - const wallpaper = localStorage.getItem('wallpaper'); + const wallpaper = localStorage.getItem("wallpaper"); if (wallpaper) { document.documentElement.style.backgroundImage = `url(${wallpaper})`; } - const customCss = localStorage.getItem('customCss'); + const customCss = localStorage.getItem("customCss"); if (customCss && customCss.length > 0) { - const style = document.createElement('style'); + const style = document.createElement("style"); style.innerHTML = customCss; document.head.appendChild(style); } async function addStyle(styleText) { - let css = document.createElement('style'); + let css = document.createElement("style"); css.appendChild(document.createTextNode(styleText)); document.head.appendChild(css); } function renderError(code, details) { - let errorsElement = document.getElementById('errors'); + let errorsElement = document.getElementById("errors"); if (!errorsElement) { document.body.innerHTML = ` @@ -158,9 +160,9 @@
`; - errorsElement = document.getElementById('errors'); + errorsElement = document.getElementById("errors"); } - const detailsElement = document.createElement('details'); + const detailsElement = document.createElement("details"); detailsElement.innerHTML = `
@@ -278,25 +280,25 @@ details { width: 50%; } - `) + `); } async function checkUpdate() { try { - const res = await fetch('/api/meta', { - method: 'POST', - cache: 'no-cache' + const res = await fetch("/api/meta", { + method: "POST", + cache: "no-cache", }); const meta = await res.json(); if (meta.version != v) { - localStorage.setItem('v', meta.version); + localStorage.setItem("v", meta.version); refresh(); } } catch (e) { console.error(e); - renderError('UPDATE_CHECK', e); + renderError("UPDATE_CHECK", e); throw e; } } @@ -304,9 +306,9 @@ function refresh() { // Clear cache (service worker) try { - navigator.serviceWorker.controller.postMessage('clear'); - navigator.serviceWorker.getRegistrations().then(registrations => { - registrations.forEach(registration => registration.unregister()); + navigator.serviceWorker.controller.postMessage("clear"); + navigator.serviceWorker.getRegistrations().then((registrations) => { + registrations.forEach((registration) => registration.unregister()); }); } catch (e) { console.error(e); diff --git a/packages/backend/src/server/web/cli.js b/packages/backend/src/server/web/cli.js index 3dff1d486..290453f7e 100644 --- a/packages/backend/src/server/web/cli.js +++ b/packages/backend/src/server/web/cli.js @@ -1,51 +1,53 @@ -'use strict'; +"use strict"; window.onload = async () => { - const account = JSON.parse(localStorage.getItem('account')); + const account = JSON.parse(localStorage.getItem("account")); const i = account.token; const api = (endpoint, data = {}) => { const promise = new Promise((resolve, reject) => { // Append a credential if (i) data.i = i; - + // Send request - fetch(endpoint.indexOf('://') > -1 ? endpoint : `/api/${endpoint}`, { - method: 'POST', + fetch(endpoint.indexOf("://") > -1 ? endpoint : `/api/${endpoint}`, { + method: "POST", body: JSON.stringify(data), - credentials: 'omit', - cache: 'no-cache' - }).then(async (res) => { - const body = res.status === 204 ? null : await res.json(); - - if (res.status === 200) { - resolve(body); - } else if (res.status === 204) { - resolve(); - } else { - reject(body.error); - } - }).catch(reject); + credentials: "omit", + cache: "no-cache", + }) + .then(async (res) => { + const body = res.status === 204 ? null : await res.json(); + + if (res.status === 200) { + resolve(body); + } else if (res.status === 204) { + resolve(); + } else { + reject(body.error); + } + }) + .catch(reject); }); - + return promise; }; - document.getElementById('submit').addEventListener('click', () => { - api('notes/create', { - text: document.getElementById('text').value + document.getElementById("submit").addEventListener("click", () => { + api("notes/create", { + text: document.getElementById("text").value, }).then(() => { location.reload(); }); }); - api('notes/timeline').then(notes => { - const tl = document.getElementById('tl'); + api("notes/timeline").then((notes) => { + const tl = document.getElementById("tl"); for (const note of notes) { - const el = document.createElement('div'); - const name = document.createElement('header'); + const el = document.createElement("div"); + const name = document.createElement("header"); name.textContent = `${note.user.name} @${note.user.username}`; - const text = document.createElement('div'); + const text = document.createElement("div"); text.textContent = `${note.text}`; el.appendChild(name); el.appendChild(text); diff --git a/packages/client/package.json b/packages/client/package.json index fe6288406..4289d8049 100644 --- a/packages/client/package.json +++ b/packages/client/package.json @@ -6,13 +6,9 @@ "build": "pnpm vite build", "lint": "pnpm rome check \"src/**/*.{ts,vue}\"" }, - "dependencies": { - "@khmyznikov/pwa-install": "^0.2.0", - "chartjs-chart-matrix": "^2.0.1", - "gsap": "^3.11.4" - }, "devDependencies": { "@discordapp/twemoji": "14.0.2", + "@khmyznikov/pwa-install": "^0.2.0", "@rollup/plugin-alias": "3.1.9", "@rollup/plugin-json": "4.1.0", "@rollup/pluginutils": "^4.2.1", @@ -40,6 +36,8 @@ "chartjs-adapter-date-fns": "2.0.1", "chartjs-plugin-gradient": "0.5.1", "chartjs-plugin-zoom": "1.2.1", + "chartjs-chart-matrix": "^2.0.1", + "city-timezones": "^1.2.1", "compare-versions": "5.0.3", "cropperjs": "2.0.0-beta.2", "cross-env": "7.0.3", @@ -47,6 +45,7 @@ "date-fns": "2.29.3", "escape-regexp": "0.0.1", "eventemitter3": "4.0.7", + "gsap": "^3.11.4", "idb-keyval": "6.2.0", "insert-text-at-cursor": "0.3.0", "json5": "2.2.3", diff --git a/packages/client/src/components/global/MkPageHeader.vue b/packages/client/src/components/global/MkPageHeader.vue index 8fa3edfe1..5eaa5e4fe 100644 --- a/packages/client/src/components/global/MkPageHeader.vue +++ b/packages/client/src/components/global/MkPageHeader.vue @@ -143,7 +143,7 @@ let ro: ResizeObserver | null; onMounted(() => { calcBg(); globalEvents.on('themeChanged', calcBg); - + watch(() => [props.tab, props.tabs], () => { nextTick(() => { const tabEl = tabRefs[props.tab]; diff --git a/packages/client/src/pages/settings/profile.vue b/packages/client/src/pages/settings/profile.vue index 82b95718b..e201ed2d8 100644 --- a/packages/client/src/pages/settings/profile.vue +++ b/packages/client/src/pages/settings/profile.vue @@ -24,6 +24,7 @@ + @@ -76,7 +77,6 @@ import FormSelect from '@/components/form/select.vue'; import FormSplit from '@/components/form/split.vue'; import FormFolder from '@/components/form/folder.vue'; import FormSlot from '@/components/form/slot.vue'; -import { host } from '@/config'; import { selectFile } from '@/scripts/select-file'; import * as os from '@/os'; import { i18n } from '@/i18n'; diff --git a/packages/client/src/pages/user/home.vue b/packages/client/src/pages/user/home.vue index 23d8aa842..0fe4774bd 100644 --- a/packages/client/src/pages/user/home.vue +++ b/packages/client/src/pages/user/home.vue @@ -56,7 +56,7 @@
{{ i18n.ts.location }}
-
{{ user.location }}
+
{{ user.location }}{{ timeForThem }}
{{ i18n.ts.birthday }}
@@ -117,27 +117,24 @@