From 28b6a4060f49d7d573aec3a76f403f5307b47204 Mon Sep 17 00:00:00 2001 From: Misode Date: Tue, 8 Dec 2020 02:52:44 +0100 Subject: [PATCH] Re-add share functionality --- src/app/App.ts | 1 + src/app/Router.ts | 10 +++++++++- src/app/components/panels/SourcePanel.ts | 14 ++++++++++++-- 3 files changed, 22 insertions(+), 3 deletions(-) diff --git a/src/app/App.ts b/src/app/App.ts index 8e7dfbe8..6accbd36 100644 --- a/src/app/App.ts +++ b/src/app/App.ts @@ -45,6 +45,7 @@ export const App = { language: new LocalStorageProperty('language', 'en') .watch(Tracker.dimLanguage), model: new Property(null), + jsonOutput: new Property(''), errorsVisible: new Property(false), jsonError: new Property(null), preview: new Property(null) diff --git a/src/app/Router.ts b/src/app/Router.ts index 7444e2e6..03f9a3e2 100644 --- a/src/app/Router.ts +++ b/src/app/Router.ts @@ -1,4 +1,4 @@ -import { App } from './App'; +import { App, Models } from './App'; import { View } from './views/View'; import { Home } from './views/Home' import { Generator } from './views/Generator' @@ -10,6 +10,8 @@ const categories = config.models.filter(m => m.category === true) const router = async () => { const urlParts = location.pathname.split('/').filter(e => e) + const urlParams = new URLSearchParams(location.search) + const target = document.getElementById('app')! const view = new View() let title = locale('title.home') @@ -22,6 +24,12 @@ const router = async () => { target.innerHTML = Home(view) } else { App.model.set(config.models.find(m => m.id === urlParts.join('/'))!) + if (urlParams.has('q')) { + try { + const data = atob(urlParams.get('q') ?? '') + Models[App.model.get()!.id].reset(JSON.parse(data)) + } catch (e) {} + } target.innerHTML = Generator(view) if (App.model.get()) { title = locale('title.generator', [locale(App.model.get()!.id)]) diff --git a/src/app/components/panels/SourcePanel.ts b/src/app/components/panels/SourcePanel.ts index cc701acf..1b773154 100644 --- a/src/app/components/panels/SourcePanel.ts +++ b/src/app/components/panels/SourcePanel.ts @@ -8,7 +8,8 @@ import { App } from '../../App'; export const SourcePanel = (view: View, model: DataModel) => { const updateContent = (el: HTMLTextAreaElement) => { const data = model.schema.hook(transformOutput, new ModelPath(model), model.data); - el.value = JSON.stringify(data, null, 2) + App.jsonOutput.set(JSON.stringify(data, null, 2)) + el.value = App.jsonOutput.get() } const source = view.register(el => { updateContent(el as HTMLTextAreaElement) @@ -42,7 +43,16 @@ export const SourcePanel = (view: View, model: DataModel) => { Tracker.download() } const shareSource = (el: Element) => { - el.closest('.panel-controls')?.querySelector('input') + const shareInput = el.closest('.panel-controls')?.querySelector('input')! + const data = btoa(JSON.stringify(JSON.parse(App.jsonOutput.get()))) + const url = window.location.origin + window.location.pathname + '?q=' + data + shareInput.value = url + shareInput.style.display = 'inline-block' + document.body.addEventListener('click', evt => { + shareInput.style.display = 'none' + }, { capture: true, once: true }) + shareInput.select() + document.execCommand('copy'); Tracker.share() } return `