From be5f1b8f99bb4f200b420f7e0244ba3a342bf388 Mon Sep 17 00:00:00 2001 From: adbenitez Date: Sun, 2 Jan 2022 16:19:04 -0500 Subject: [PATCH 1/4] implement getAllUpdates() --- index.html | 1 + webxdc.js | 10 +++++----- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 9831560..2a4e511 100644 --- a/index.html +++ b/index.html @@ -20,6 +20,7 @@ } window.webxdc.setUpdateListener(receiveUpdate); + window.webxdc.getAllUpdates().forEach(receiveUpdate); diff --git a/webxdc.js b/webxdc.js index d80e91f..f528a7a 100644 --- a/webxdc.js +++ b/webxdc.js @@ -8,23 +8,23 @@ window.webxdc = (() => { selfAddr: () => window.xdcSelfAddr || "device0@local.host", setUpdateListener: (cb) => (window.xdcUpdateListener = cb), getAllUpdates: () => { - return JSON.parse( - '[]' - //'[{"action":"configure", "question":"your favorite colorxx", "answers":["red","green","blue","yellow","purple1"]},{"action":"vote", "sender":"foo2@bar.de", "vote":0},{"action":"vote", "sender":"foo@bar.de", "vote":0}]' - ); + return getXdcRoot().xdcUpdates; }, sendUpdate: (description, payload) => { // alert(description+"\n\n"+JSON.stringify(payload)); + var update = {payload: payload}; + getXdcRoot().xdcUpdates.push(update); var all = getAllXdcWindows(); all.forEach((w) => { //alert(w.xdcUpdateListener); - w.xdcUpdateListener({payload: payload}); + w.xdcUpdateListener(update); }); }, }; })(); window.allXdcWindows = [window]; +window.xdcUpdates = []; window.xdcUpdateListener = 12; var styleControlPanel = 'position: fixed; bottom:1em; left:1em; background-color: #000; opacity:0.8; padding:.5em; font-family: sans-serif; width: 50%;'; From 7eecf6d4efb9eba6c396cbc88da67817e7b6e60f Mon Sep 17 00:00:00 2001 From: adbenitez Date: Sun, 2 Jan 2022 18:18:15 -0500 Subject: [PATCH 2/4] use local storage if possible to persist updates --- webxdc.js | 71 +++++++++++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 61 insertions(+), 10 deletions(-) diff --git a/webxdc.js b/webxdc.js index f528a7a..5a4166f 100644 --- a/webxdc.js +++ b/webxdc.js @@ -1,5 +1,53 @@ // debug friend: document.writeln(JSON.stringify(value)); -// maybe helpful: window.sessionStorage, https://www.w3schools.com/html/html5_webstorage.asp +window.xdcStorage = (() => { + var updatesKey = "__xdcUpdatesKey__"; + var fakeStorage = { + _data: {}, + + setItem: function (id, val) { + return this._data[id] = String(val); + }, + + getItem: function (id) { + return this._data.hasOwnProperty(id) ? this._data[id] : undefined; + }, + + removeItem: function (id) { + return delete this._data[id]; + }, + + clear: function () { + return this._data = {}; + } + }; + var localStorageSupported = () => { + var testKey = "__xdcTestKey__"; + try { + var storage = window.localStorage; + storage.setItem(testKey, "1"); + storage.removeItem(testKey); + return true; + } catch (error) { + return false; + } + }; + var storage = localStorageSupported() ? window.localStorage : fakeStorage; + + return { + getUpdates: () => { + var updatesJSON = storage.getItem(updatesKey); + return updatesJSON ? JSON.parse(updatesJSON) : []; + }, + saveUpdate: (update) => { + var updates = window.xdcStorage.getUpdates(); + updates.push(update); + storage.setItem(updatesKey, JSON.stringify(updates)); + }, + clear: () => { + storage.clear(); + } + }; +})(); window.webxdc = (() => { var updateListener = () => {}; @@ -7,13 +55,11 @@ window.webxdc = (() => { return { selfAddr: () => window.xdcSelfAddr || "device0@local.host", setUpdateListener: (cb) => (window.xdcUpdateListener = cb), - getAllUpdates: () => { - return getXdcRoot().xdcUpdates; - }, + getAllUpdates: () => {return getXdcRoot().xdcStorage.getUpdates();}, sendUpdate: (description, payload) => { // alert(description+"\n\n"+JSON.stringify(payload)); - var update = {payload: payload}; - getXdcRoot().xdcUpdates.push(update); + var update = {payload: payload}; + getXdcRoot().xdcStorage.saveUpdate(update); var all = getAllXdcWindows(); all.forEach((w) => { //alert(w.xdcUpdateListener); @@ -24,10 +70,9 @@ window.webxdc = (() => { })(); window.allXdcWindows = [window]; -window.xdcUpdates = []; window.xdcUpdateListener = 12; -var styleControlPanel = 'position: fixed; bottom:1em; left:1em; background-color: #000; opacity:0.8; padding:.5em; font-family: sans-serif; width: 50%;'; +var styleControlPanel = 'position: fixed; bottom:1em; left:1em; background-color: #000; opacity:0.8; padding:.5em; font-family: sans-serif; width: 50%;color:#fff;'; var styleMenuLink = 'color:#fff; text-decoration: none;'; function getXdcRoot() { @@ -43,7 +88,7 @@ function getAllXdcWindows() { return xdcRoot.allXdcWindows; } -function addPeer() { +function addXdcPeer() { var xdcChild = window.open(window.location); var xdcRoot = getXdcRoot(); xdcChild.xdcRoot = xdcRoot; @@ -51,6 +96,11 @@ function addPeer() { xdcRoot.allXdcWindows.push(xdcChild); } +function clearXdcStorage() { + getXdcRoot().xdcStorage.clear(); + alert("Done."); +} + function alterApp() { var title = document.getElementsByTagName('title')[0]; if (typeof title == 'undefined') { @@ -63,7 +113,8 @@ function alterApp() { var div = document.createElement('div'); div.innerHTML = '
' + - 'Add Peer' + + 'Add Peer | ' + + 'Clear Storage' + '
'; document.getElementsByTagName('body')[0].append(div.firstChild); } From 7e9536c80629d9a533e2818c7028a7a0131c5657 Mon Sep 17 00:00:00 2001 From: adbenitez Date: Sun, 2 Jan 2022 18:34:13 -0500 Subject: [PATCH 3/4] use space instead of tab --- webxdc.js | 66 +++++++++++++++++++++++++++---------------------------- 1 file changed, 33 insertions(+), 33 deletions(-) diff --git a/webxdc.js b/webxdc.js index 57a71fa..457c0c4 100644 --- a/webxdc.js +++ b/webxdc.js @@ -2,50 +2,50 @@ window.xdcStorage = (() => { var updatesKey = "__xdcUpdatesKey__"; var fakeStorage = { - _data: {}, + _data: {}, - setItem: function (id, val) { - return this._data[id] = String(val); - }, + setItem: function (id, val) { + return this._data[id] = String(val); + }, - getItem: function (id) { - return this._data.hasOwnProperty(id) ? this._data[id] : undefined; - }, + getItem: function (id) { + return this._data.hasOwnProperty(id) ? this._data[id] : undefined; + }, - removeItem: function (id) { - return delete this._data[id]; - }, + removeItem: function (id) { + return delete this._data[id]; + }, - clear: function () { - return this._data = {}; - } + clear: function () { + return this._data = {}; + } }; var localStorageSupported = () => { - var testKey = "__xdcTestKey__"; - try { - var storage = window.localStorage; - storage.setItem(testKey, "1"); - storage.removeItem(testKey); - return true; - } catch (error) { - return false; - } + var testKey = "__xdcTestKey__"; + try { + var storage = window.localStorage; + storage.setItem(testKey, "1"); + storage.removeItem(testKey); + return true; + } catch (error) { + return false; + } }; var storage = localStorageSupported() ? window.localStorage : fakeStorage; return { - getUpdates: () => { + getUpdates: () => { var updatesJSON = storage.getItem(updatesKey); return updatesJSON ? JSON.parse(updatesJSON) : []; - }, - saveUpdate: (update) => { + }, + saveUpdate: (update) => { var updates = window.xdcStorage.getUpdates(); updates.push(update); storage.setItem(updatesKey, JSON.stringify(updates)); - }, - clear: () => { - storage.clear(); - } + }, + clear: () => { + storage.clear(); + } }; })(); @@ -114,10 +114,10 @@ function alterApp() { if (getXdcRoot() === window) { var div = document.createElement('div'); div.innerHTML = - '
' + - 'Add Peer | ' + - 'Clear Storage' + - '
'; + '
' + + 'Add Peer | ' + + 'Clear Storage' + + '
'; document.getElementsByTagName('body')[0].append(div.firstChild); } } From 53d708f8c8e7130c70db4a1a5241ccf00f75e824 Mon Sep 17 00:00:00 2001 From: adbenitez Date: Sun, 2 Jan 2022 18:38:12 -0500 Subject: [PATCH 4/4] rename alterApp() to use the same style of other xdc-related functions --- webxdc.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/webxdc.js b/webxdc.js index 457c0c4..26860b0 100644 --- a/webxdc.js +++ b/webxdc.js @@ -103,7 +103,7 @@ function clearXdcStorage() { alert("Done."); } -function alterApp() { +function alterXdcApp() { var title = document.getElementsByTagName('title')[0]; if (typeof title == 'undefined') { title = document.createElement('title'); @@ -122,4 +122,4 @@ function alterApp() { } } -window.addEventListener("load", alterApp); +window.addEventListener("load", alterXdcApp);