This page picks up a section of the same title on the About Frame Integrations page:
document.querySelector("button") .addEventListener("click", event => { window.parent.postMessage({ action:"showResult", page: { title: "Hello, World!", story: [ { type: "paragraph", text: "Greetings from frame content!", id: Math.abs(Math.random()*1e20|0) .toString(16) } ]}, keepLineup: event.shiftKey }, "*"); });
We extend the code on the Table Lookup and Dispatch page (see function ghost) to include code that creates a Ghost Page .
~
kohonen-stars github 
is an example for our library kohonen github , a basic implementation of SOM algorithm in JavaScript.
grid.html(open):
// http://code.fed.wiki/frame-integration-promises.html function open(page, keepLineup=false, forks=[]) { const asCopy = obj => JSON.parse(JSON.stringify(obj)) let date = Date.now() for (let item of page.story) item.id ||= (Math.random()*10**20).toFixed(0) page.journal ||= [{type:'create', date, item:asCopy(page)}, ...forks.map(site => ({type:'fork',date,site}))] let message = {action: "showResult", page, keepLineup} window.parent.postMessage(message, "*") }
called by
function doopen(event) { const info = event.target.getAttribute('info') const color = event.target.getAttribute('fill') if(!info || !color) return console.log({info,color}) const title = `${color?.toUpperCase()} Item Clicked` const story = [ {type:'paragraph',text:`Click arrived at ${new Date().toLocaleTimeString()}`}, {type:'code',text:`pos: [${info}]`} ] open({title,story},event.shiftKey) }
We wrap the Frame plugin's integrations with a promise-based interface and distribute them as an ES6 module along with a couple of helpers we've found useful.
A wiki page is rendered with a translucent background when that page exists only in the browser as a ghost of a page that has been or will soon be.
A page constructed for the browser but not yet stored anywhere else is shown as a translucent page with no border.