105 lines
2.8 KiB
JavaScript
105 lines
2.8 KiB
JavaScript
import ComponentsLibrary from './interface/ComponentsLibrary.mjs';
|
|
import HashSlotNav from './slots/HashSlotNav.mjs';
|
|
import Interface from './interface/Interface.mjs';
|
|
import LocalStorage from './storage/LocalStorage.mjs';
|
|
import MultiLocalStorage from './storage/MultiLocalStorage.mjs';
|
|
import SequenceDiagram from '../../scripts/sequence/SequenceDiagram.mjs';
|
|
import SlotLocalStores from './slots/SlotLocalStores.mjs';
|
|
import requestSlot from './slots/requestSlot.mjs';
|
|
import {require} from './requireCDN.mjs';
|
|
|
|
const defaultCode = (
|
|
'title Labyrinth\n' +
|
|
'\n' +
|
|
'Bowie -> Goblin: You remind me of the babe\n' +
|
|
'Goblin -> Bowie: What babe?\n' +
|
|
'Bowie -> Goblin: The babe with the power\n' +
|
|
'Goblin -> Bowie: What power?\n' +
|
|
'note right of Bowie, Goblin: Most people get muddled here!\n' +
|
|
'Bowie -> Goblin: "The power of voodoo"\n' +
|
|
'Goblin -> Bowie: "Who-do?"\n' +
|
|
'Bowie -> Goblin: You do!\n' +
|
|
'Goblin -> Bowie: Do what?\n' +
|
|
'Bowie -> Goblin: Remind me of the babe!\n' +
|
|
'\n' +
|
|
'Bowie -> Audience: Sings\n' +
|
|
'\n' +
|
|
'terminators box\n'
|
|
);
|
|
|
|
function migrateOldDocument(slotStorage) {
|
|
const oldStorage = new LocalStorage('src');
|
|
const doc = oldStorage.get();
|
|
if(doc) {
|
|
const newSlot = slotStorage.nextAvailableSlot();
|
|
slotStorage.set(newSlot, doc);
|
|
oldStorage.remove();
|
|
}
|
|
}
|
|
|
|
function loadHashDocument(hashNav, slotStorage) {
|
|
const editPrefix = 'edit:';
|
|
const hash = hashNav.getRawHash();
|
|
if(!hash.startsWith(editPrefix)) {
|
|
return;
|
|
}
|
|
|
|
let doc = hash
|
|
.substr(editPrefix.length)
|
|
.split('/')
|
|
.map(decodeURIComponent)
|
|
.join('\n');
|
|
|
|
if(!doc) {
|
|
return;
|
|
}
|
|
|
|
if(!doc.endsWith('\n')) {
|
|
doc += '\n';
|
|
}
|
|
|
|
const newSlot = slotStorage.nextAvailableSlot();
|
|
slotStorage.set(newSlot, doc);
|
|
hashNav.setSlot(newSlot);
|
|
}
|
|
|
|
window.addEventListener('load', () => {
|
|
const loader = window.document.getElementById('loader');
|
|
const [nav] = loader.getElementsByTagName('nav');
|
|
const linkElements = nav.getElementsByTagName('a');
|
|
const links = [];
|
|
for(let i = 0; i < linkElements.length; ++ i) {
|
|
const element = linkElements[i];
|
|
links.push({
|
|
href: element.getAttribute('href'),
|
|
label: element.textContent,
|
|
target: element.getAttribute('target'),
|
|
touchLabel: element.dataset.touch,
|
|
});
|
|
}
|
|
|
|
const slotStorage = new SlotLocalStores();
|
|
migrateOldDocument(slotStorage);
|
|
|
|
const hashNav = new HashSlotNav(() => {
|
|
// If the slot is changed by the user, reload to force a document load
|
|
window.location.reload();
|
|
});
|
|
loadHashDocument(hashNav, slotStorage);
|
|
|
|
loader.parentNode.removeChild(loader);
|
|
|
|
requestSlot(hashNav, slotStorage).then(() => {
|
|
const ui = new Interface({
|
|
defaultCode,
|
|
library: ComponentsLibrary,
|
|
links,
|
|
require,
|
|
sequenceDiagram: new SequenceDiagram(),
|
|
storage: new MultiLocalStorage(hashNav, slotStorage),
|
|
touchUI: ('ontouchstart' in window),
|
|
});
|
|
ui.build(window.document.body);
|
|
});
|
|
});
|