diff --git a/toolbox/demoapps/receive.html b/toolbox/demoapps/receive.html deleted file mode 100644 index 967ce8a60..000000000 --- a/toolbox/demoapps/receive.html +++ /dev/null @@ -1,98 +0,0 @@ - - - - -FDC3 Receive - - - - - - - - - - - - - - - - - - - - - - - - - - - -
FDC3 Provider Service:FDC3 Not Available
Context:
- - - - diff --git a/toolbox/fdc3-explained/1.0/index.html b/toolbox/fdc3-explained/1.0/index.html new file mode 100644 index 000000000..d4cad56cf --- /dev/null +++ b/toolbox/fdc3-explained/1.0/index.html @@ -0,0 +1,90 @@ + + + + FDC3 Explained + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Back to main page.
FDC3 Provider:FDC3 Not Available
FDC3 Version: + +
App Directory:No Application Directory Connected
Available Apps:
Broadcast Context: + + + +
Get Context: + +
+ +
+ + + + diff --git a/toolbox/fdc3-explained/1.0/main.js b/toolbox/fdc3-explained/1.0/main.js new file mode 100644 index 000000000..080848018 --- /dev/null +++ b/toolbox/fdc3-explained/1.0/main.js @@ -0,0 +1,46 @@ +// enable application when FDC3 is available +document.addEventListener('DOMContentLoaded', () => { + fdc3Init(enablePage); +}); + +// check if FDC3 is available +function fdc3Init(callback) { + let fdc3Tries = 10 + + const onFDC3Ready = () => { + if (window.fdc3) { + callback.call(this); + } else { + if (fdc3Tries > 0) { + fdc3Tries--; + window.setTimeout(onFDC3Ready, 100); + } + } + } + + onFDC3Ready(); +} + +const providerDetails = document.getElementById("providerDetails") +const broadcastButton = document.getElementById("broadcastButton") +const broadcastText = document.getElementById("broadcastText") + +function enablePage() { + console.log('FDC3 is available'); + + if (window.FSBL) { + window.FSBL.getFSBLInfo().then(info => providerDetails.innerHTML = 'Available - Finsemble ' + info.FSBLVersion); + } else if (window.fin) { + providerDetails.innerHTML = 'Available - OpenFin ' + fin.desktop.getVersion(); + } else { + providerDetails.innerHTML = 'Available - Unknown'; + } + + broadcastButton.disabled = false; + broadcastText.disabled = false; +} + +function broadcastFDC3Context() { + var context = JSON.parse(broadcastText.value); + fdc3.broadcast(context); +} diff --git a/toolbox/fdc3-explained/1.0/styles.css b/toolbox/fdc3-explained/1.0/styles.css new file mode 100644 index 000000000..b4e8c33e6 --- /dev/null +++ b/toolbox/fdc3-explained/1.0/styles.css @@ -0,0 +1,25 @@ +textarea { + width: 400px; + height: 150px; +} + +select { + width: 150px; + height: 24px; +} + +.ctxInput { + width: 241px; + height: 24px; +} + +.urlInput { + width: 400px; + height: 24px; +} + +.header { + width: 200px; + height: 40px; + font-weight: 700; +} diff --git a/website/static/fdc3-explained/1.1/index.html b/toolbox/fdc3-explained/1.1/index.html similarity index 62% rename from website/static/fdc3-explained/1.1/index.html rename to toolbox/fdc3-explained/1.1/index.html index ab2cb93d6..be9d85a99 100644 --- a/website/static/fdc3-explained/1.1/index.html +++ b/toolbox/fdc3-explained/1.1/index.html @@ -1,15 +1,10 @@ - - FDC3 Explained - - - - + FDC3 Explained + - @@ -19,36 +14,34 @@ Back to main page. + - -
- +
+ FDC3 Supported - Checking + Checking... - FDC3 Provider Service: - FDC3 Not Available + FDC3 Provider: + None - FDC3 Supported Version: - 1.1 + FDC3 Version: - - + - -
- +
@@ -62,10 +55,9 @@ + - -
- +
@@ -78,7 +70,6 @@ - Add App Channel: @@ -94,19 +85,27 @@ - -
- +
Broadcast Context: - - - + + + + + + @@ -122,9 +121,7 @@ - -
- +
@@ -136,8 +133,19 @@ - - + + + + + diff --git a/toolbox/fdc3-explained/1.1/main.js b/toolbox/fdc3-explained/1.1/main.js new file mode 100644 index 000000000..aecacaf75 --- /dev/null +++ b/toolbox/fdc3-explained/1.1/main.js @@ -0,0 +1,214 @@ +document.addEventListener('DOMContentLoaded', () => { + fdc3OnReady(main, displayFDC3Support); +}); + +function fdc3OnReady(success, error) { + let fdc3Tries = 10; + + const checkFDC3Ready = () => { + if (window.fdc3) { + success.call(this); + } else { + if (fdc3Tries > 0) { + fdc3Tries--; + window.setTimeout(checkFDC3Ready, 100); + } else { + error.call(this); + } + } + }; + checkFDC3Ready(); +} + +// use this to keep track of context listener - one per system channel +let contextListener = null; +let appChannels = []; + +function main() { + try { + console.log('FDC3 is ready and DOM has rendered'); + displayFDC3Support(); + getPlatform(); + populateHTML(); + setUpEventListeners(); + getContext(); + } catch (error) { + console.error(error); + } +} + +function displayFDC3Support() { + try { + const supportedElement = document.getElementById('fdc3-support'); + if (window.fdc3) { + supportedElement.innerHTML = 'Yes ✅'; + } else { + supportedElement.innerHTML = 'No ❌'; + } + } catch (error) { + console.error("Can't find FDC3 support", error); + } +} + +function getPlatform() { + const providerDetails = document.getElementById('providerDetails'); + + // TODO: add G42 and FDC3 Desktop Agent to vendors + if (window.FSBL) { + window.FSBL.getFSBLInfo().then(info => (providerDetails.innerHTML = 'Finsemble ' + info.FSBLVersion)); + } else if (window.fin) { + providerDetails.innerHTML = 'OpenFin ' + fin.desktop.getVersion(); + } else { + providerDetails.innerHTML = 'Unknown'; + } +} + +async function populateHTML() { + try { + //populate available channels list with system channels + const channelList = document.getElementById('system-channel-list'); + + const populateChannelsList = name => { + let node = document.createElement('li'); + let textNode = document.createTextNode(name); + node.appendChild(textNode); + channelList.appendChild(node); + }; + + const systemChannels = await fdc3.getSystemChannels(); + + // for all of the system channels populate dropdowns & lists + systemChannels.forEach(({ displayMetadata, id, type }) => { + let { name } = displayMetadata; + populateChannelsList(name); + populateChannelsDropDown(name); + }); + + // as FDC3 is supported we can enable the buttons again except those that are not yet supported features + document.querySelectorAll('button').forEach(button => { + if (!button.className.includes('not-supported')) { + button.disabled = false; + } + }); + } catch (error) { + console.error('unable to populate the html for the page ', error); + } +} + +function setUpEventListeners() { + document.getElementById('add-app-channel__btn').addEventListener('click', addAppChannel); + + document.getElementById('join-channel__btn').addEventListener('click', joinChannel); + + document.getElementById('leave-channel__btn').addEventListener('click', fdc3.leaveCurrentChannel); + + document.getElementById('broadcast__btn').addEventListener('click', broadcastFDC3Context); + + document.getElementById('raise-intent__btn').addEventListener('click', raiseIntent); + + document.getElementById('context-type').addEventListener('keyup', event => { + // we only want to get the context wen the user hits enter + if (event.key === 'Enter') { + event.preventDefault(); + + let contextType = event.target.value; + getContext(contextType); + } + }); +} + +/** + *Populate the channel dropdown elements + */ +function populateChannelsDropDown(newOptionText) { + try { + let dropdownElement = document.querySelector('.fdc3-channels'); + + if (newOptionText) { + dropdownElement.add(new Option(newOptionText)); + } else { + throw new Error('No option provided'); + } + } catch (error) { + console.error('could not add a new channel to the channel dropdown list', error); + } +} + +function joinChannel() { + try { + let dropdownElement = document.getElementById('join-channel'); + let channelName = dropdownElement.options[dropdownElement.selectedIndex].text.toLowerCase(); + fdc3.joinChannel(channelName); + } catch (error) { + console.error("Can't join channel", error); + } +} + +async function broadcastFDC3Context() { + try { + let contextData = document.getElementById('txtBroadcastData').value; + fdc3.broadcast(JSON.parse(contextData)); + } catch (error) { + console.error('could not broadcast', error); + } +} + +async function getContext(contextType) { + try { + let contextResultBox = document.getElementById('context-result'); + if (contextListener) contextListener.unsubscribe(); + + // if context type is passed in then only listen on that specific context + if (contextType) { + contextListener = fdc3.addContextListener( + contextType, + context => (contextResultBox.value = JSON.stringify(context)) + ); + } else { + contextListener = fdc3.addContextListener(context => (contextResultBox.value = JSON.stringify(context))); + } + } catch (error) { + console.error('Unable to add a context listener', error); + } +} + +async function addAppChannel() { + try { + let appChannelName = document.getElementById('app-channel').value; + + if (!appChannelName) throw new Error('no channel name set'); + + let appChannelExists = appChannels.find(appChannel => appChannel.id === appChannelName); + + if (!appChannelExists) { + let newAppChannel = await fdc3.getOrCreateChannel(appChannelName); + appChannels.push(newAppChannel); + + // add to the list of available app channels + let node = document.createElement('li'); + let textNode = document.createTextNode(appChannelName); + node.appendChild(textNode); + document.getElementById('app-channel-list').appendChild(node); + + //populate the channel list dropdown with new appChannel + populateChannelsDropDown(newAppChannel.id); + } else { + throw new Error('app channel already exists'); + } + } catch (error) { + console.error('could not add an app channel', error); + } +} + +async function raiseIntent() { + try { + // get the channel + let intent = document.getElementById('intent').value; + let context = JSON.parse(document.getElementById('intent-context').value); + + // TODO: add the target param + await fdc3.raiseIntent(intent, context); + } catch (err) { + console.error('intent did not resolve', err); + } +} diff --git a/website/static/fdc3-explained/1.1/styles.css b/toolbox/fdc3-explained/1.1/styles.css similarity index 96% rename from website/static/fdc3-explained/1.1/styles.css rename to toolbox/fdc3-explained/1.1/styles.css index d645a47f4..82dd27ac4 100644 --- a/website/static/fdc3-explained/1.1/styles.css +++ b/toolbox/fdc3-explained/1.1/styles.css @@ -24,7 +24,7 @@ td{ } textarea { width: 400px; - height: 100px; + height: 150px; } select { @@ -46,4 +46,4 @@ select { width: 200px; height: 40px; font-weight: 700; -} \ No newline at end of file +} diff --git a/website/static/fdc3-explained/1.2/index.html b/toolbox/fdc3-explained/1.2/index.html similarity index 67% rename from website/static/fdc3-explained/1.2/index.html rename to toolbox/fdc3-explained/1.2/index.html index dc6872744..299c89fa0 100644 --- a/website/static/fdc3-explained/1.2/index.html +++ b/toolbox/fdc3-explained/1.2/index.html @@ -19,29 +19,27 @@ FDC3 Supported - Checking + Checking... - FDC3 Provider Service: - FDC3 Not Available + FDC3 Provider: + None - FDC3 Supported Version: - 1.2 + FDC3 Version: - - + - -
- +
@@ -52,15 +50,12 @@ Available Apps: - - - + + - -
- +
@@ -73,7 +68,6 @@ - Add App Channel: @@ -89,19 +83,25 @@ - -
- +
Broadcast Context: - - - + + + + @@ -122,7 +122,7 @@ -
+
@@ -135,7 +135,17 @@ - + + + diff --git a/toolbox/fdc3-explained/1.2/main.js b/toolbox/fdc3-explained/1.2/main.js new file mode 100644 index 000000000..4c0911d6c --- /dev/null +++ b/toolbox/fdc3-explained/1.2/main.js @@ -0,0 +1,213 @@ +// check for FDC3 support +function fdc3OnReady(success, error) { + window.setTimeout(error, 1000); + if (window.fdc3) { + success(); + } else { + window.addEventListener('fdc3Ready', success); + } +} + +// Wait for the document to load +function documentLoaded(cb) { + if (document.readyState === 'loading') { + document.addEventListener('DOMContentLoaded', cb); + } else { + cb(); + } +} + +// use this to keep track of context listener - one per system channel +let contextListener = null; +let appChannels = []; + +// document and FDC3 have loaded start the main function +documentLoaded(() => { + fdc3OnReady(main, displayFDC3Support); +}); + +function main() { + try { + console.log('FDC3 is ready and DOM has rendered'); + displayFDC3Support(); + getPlatform(); + populateHTML(); + setUpEventListeners(); + getContext(); + } catch (error) { + console.error(error); + } +} + +function displayFDC3Support() { + try { + const supportedElement = document.getElementById('fdc3-support'); + if (window.fdc3) { + supportedElement.innerHTML = 'Yes ✅'; + } else { + supportedElement.innerHTML = 'No ❌'; + } + } catch (error) { + console.error("Can't find FDC3 support", error); + } +} + +function getPlatform() { + const providerDetails = document.getElementById('providerDetails'); + const fdc3Info = window.fdc3.getInfo(); + console.log('FDC3 info', fdc3Info); + + providerDetails.innerHTML = `${fdc3Info.provider} ${fdc3Info.providerVersion}`; +} + +async function populateHTML() { + try { + //populate available channels list with system channels + let channelList = document.getElementById('system-channel-list'); + + const populateChannelsList = name => { + let node = document.createElement('li'); + let textNode = document.createTextNode(name); + node.appendChild(textNode); + channelList.appendChild(node); + }; + + const systemChannels = await fdc3.getSystemChannels(); + + // for all of the system channels populate dropdowns & lists + systemChannels.forEach(({ displayMetadata, id, type }) => { + let { name } = displayMetadata; + populateChannelsList(name); + populateChannelsDropDown(name); + }); + + // as FDC3 is supported we can enable the buttons again except those that are not yet supported features + document.querySelectorAll('button').forEach(button => { + if (!button.className.includes('not-supported')) { + button.disabled = false; + } + }); + } catch (error) { + console.error('unable to populate the html for the page ', error); + } +} + +function setUpEventListeners() { + document.getElementById('add-app-channel__btn').addEventListener('click', addAppChannel); + + document.getElementById('join-channel__btn').addEventListener('click', joinChannel); + + document.getElementById('leave-channel__btn').addEventListener('click', fdc3.leaveCurrentChannel); + + document.getElementById('broadcast__btn').addEventListener('click', broadcastFDC3Context); + + document.getElementById('raise-intent__btn').addEventListener('click', raiseIntent); + + document.getElementById('context-type').addEventListener('keyup', event => { + // we only want to get the context wen the user hits enter + if (event.key === 'Enter') { + event.preventDefault(); + + let contextType = event.target.value; + getContext(contextType); + } + }); +} + +/** + *Populate the channel dropdown elements + */ +function populateChannelsDropDown(newOptionText) { + try { + let dropdownElement = document.querySelector('.fdc3-channels'); + + if (newOptionText) { + dropdownElement.add(new Option(newOptionText)); + } else { + throw new Error('No option provided'); + } + } catch (error) { + console.error('could not add a new channel to the channel dropdown list', error); + } +} + +function joinChannel() { + try { + let dropdownElement = document.getElementById('join-channel'); + let channelName = dropdownElement.options[dropdownElement.selectedIndex].text.toLowerCase(); + fdc3.joinChannel(channelName); + } catch (error) { + console.error("Can't join channel", error); + } +} + +async function broadcastFDC3Context() { + try { + let contextData = document.getElementById('txtBroadcastData').value; + fdc3.broadcast(JSON.parse(contextData)); + } catch (error) { + console.error('could not broadcast', error); + } +} + +async function getContext(contextType) { + try { + let contextResultBox = document.getElementById('context-result'); + if (contextListener) contextListener.unsubscribe(); + + // if context type is passed in then only listen on that specific context + if (contextType) { + contextListener = fdc3.addContextListener( + contextType, + context => (contextResultBox.innerText = JSON.stringify(context, null, 2)) + ); + } else { + contextListener = fdc3.addContextListener( + context => (contextResultBox.innerText = JSON.stringify(context, null, 2)) + ); + } + } catch (error) { + console.error('Unable to add a context listener', error); + } +} + +async function addAppChannel() { + try { + let appChannelName = document.getElementById('app-channel').value; + + if (!appChannelName) throw new Error('no channel name set'); + + let appChannelExists = appChannels.find(appChannel => appChannel.id === appChannelName); + + if (!appChannelExists) { + let newAppChannel = await fdc3.getOrCreateChannel(appChannelName); + appChannels.push(newAppChannel); + + // add to the list of available app channels + let node = document.createElement('li'); + let textNode = document.createTextNode(appChannelName); + node.appendChild(textNode); + document.getElementById('app-channel-list').appendChild(node); + + //populate the channel list dropdown with new appChannel + populateChannelsDropDown(newAppChannel.id); + } else { + throw new Error('app channel already exists'); + } + } catch (error) { + console.error('could not add an app channel', error); + } +} + +async function raiseIntent() { + try { + // get the channel + let intent = document.getElementById('intent').value; + let context = JSON.parse(document.getElementById('intent-context').value); + + // TODO: add the target param + await fdc3.raiseIntent(intent, context); + } catch (err) { + console.error('intent did not resolve', err); + } +} diff --git a/website/static/fdc3-explained/1.2/styles.css b/toolbox/fdc3-explained/1.2/styles.css similarity index 99% rename from website/static/fdc3-explained/1.2/styles.css rename to toolbox/fdc3-explained/1.2/styles.css index a993fd65a..ae2e66fd4 100644 --- a/website/static/fdc3-explained/1.2/styles.css +++ b/toolbox/fdc3-explained/1.2/styles.css @@ -78,7 +78,7 @@ td { } textarea { width: 400px; - height: 100px; + height: 150px; } select { diff --git a/toolbox/fdc3-explained/README.md b/toolbox/fdc3-explained/README.md new file mode 100644 index 000000000..b23c2df39 --- /dev/null +++ b/toolbox/fdc3-explained/README.md @@ -0,0 +1,21 @@ +# FDC3 Explained Logo + +FDC3 Explained was originally created by Johan Sandersson, an original maintainer of FDC3, and contributed to the project. It shows how easy it is to create very simple HTML and JavaScript that can use the FDC3 APIs to facilitate interoperability. + +It is also a useful tool for detecing whether FDC3 is enabled, by running the website inside an FDC3-supporting desktop agent, and for performing basic FDC3 operations to help test interoperability workflows. + +## Website + +FDC3 Explained can be accessed at the following URL: https://fdc3.finos.org/toolbox/fdc3-explained. + +Note that it will only detect and allow use of FDC3 when running in the context of an FDC3 desktop agent. + +## Build + +The NPM script `copy-explained` in the `website` folder copies the relevant files to the FDC3 website build for deployment. + +It is automatically executed during deployments to https://fdc3.finos.org. + +## Note + +FDC3 Explained does not aim to be an exhaustive reference implementation for each version of the FDC3 Standard, it is merely a convenient testing utility. diff --git a/website/static/fdc3-explained/index.html b/toolbox/fdc3-explained/index.html similarity index 90% rename from website/static/fdc3-explained/index.html rename to toolbox/fdc3-explained/index.html index 781fcbcbb..d8c7ebdae 100644 --- a/website/static/fdc3-explained/index.html +++ b/toolbox/fdc3-explained/index.html @@ -66,13 +66,10 @@ - - Legacy - 1.0 - + 1.1 diff --git a/website/static/fdc3-explained/logo.svg b/toolbox/fdc3-explained/logo.svg similarity index 100% rename from website/static/fdc3-explained/logo.svg rename to toolbox/fdc3-explained/logo.svg diff --git a/toolbox/openfin/platform.json b/toolbox/openfin/platform.json deleted file mode 100644 index 722a27cf9..000000000 --- a/toolbox/openfin/platform.json +++ /dev/null @@ -1,46 +0,0 @@ -{ - "runtime": { - "arguments": "--v=1 --inspect", - "version": "stable" - }, - "platform": { - "uuid": "fdc3_explained_platform", - "autoShow": false, - "defaultViewOptions": { - "fdc3InteropApi": "1.2" - } - }, - "snapshot": { - "windows": [ - { - "defaultWidth": 1000, - "defaultHeight": 800, - "defaultLeft": 50, - "defaultTop": 50, - "saveWindowState": false, - "backgroundThrottling": true, - "layout": { - "content": [ - { - "type": "stack", - "id": "no-drop-target", - "content": [ - { - "type": "component", - "componentName": "view", - "componentState": { - "name": "component_A1", - "processAffinity": "ps_1", - "showDevTools": true, - "url": "https://donbasuno.github.io/FDC3/toolbox/fdc3_explained.html" - } - } - ] - } - ] - } - } - ] - }, - "startup_app": null -} \ No newline at end of file diff --git a/toolbox/openfin/platform_no_fdc3.json b/toolbox/openfin/platform_no_fdc3.json deleted file mode 100644 index 4b9fe7455..000000000 --- a/toolbox/openfin/platform_no_fdc3.json +++ /dev/null @@ -1,45 +0,0 @@ -{ - "runtime": { - "arguments": "--v=1 --inspect", - "version": "stable" - }, - "platform": { - "uuid": "no_fdc3_explained_platform", - "autoShow": false, - "defaultViewOptions": { - } - }, - "snapshot": { - "windows": [ - { - "defaultWidth": 1000, - "defaultHeight": 800, - "defaultLeft": 50, - "defaultTop": 50, - "saveWindowState": false, - "backgroundThrottling": true, - "layout": { - "content": [ - { - "type": "stack", - "id": "no-drop-target", - "content": [ - { - "type": "component", - "componentName": "view", - "componentState": { - "name": "component_A1", - "processAffinity": "ps_1", - "showDevTools": true, - "url": "https://donbasuno.github.io/FDC3/toolbox/fdc3_explained.html" - } - } - ] - } - ] - } - } - ] - }, - "startup_app": null -} \ No newline at end of file diff --git a/toolbox/openfin/rt19.json b/toolbox/openfin/rt19.json deleted file mode 100644 index f613cce33..000000000 --- a/toolbox/openfin/rt19.json +++ /dev/null @@ -1,22 +0,0 @@ -{ - "startup_app": { - "name": "FDC3 Preload 0.2.2", - "url": "https://donbasuno.github.io/FDC3/toolbox/fdc3_explained.html", - "uuid": "fdc3_explained_app_preload", - "autoShow": true, - "defaultCentered": true, - "saveWindowState": false, - "defaultHeight": 778, - "defaultWidth": 970, - "preloadScripts": [{"url":"https://cdn.openfin.co/services/openfin/fdc3/0.2.5/openfin-fdc3.js", "mandatory": true}] - }, - "runtime": { - "arguments": "--enable-crash-reporting", - "version": "19.89.60.5" - }, - "services": [ - { - "name": "fdc3" - } - ] -} \ No newline at end of file diff --git a/toolbox/openfin/runtime_app.json b/toolbox/openfin/runtime_app.json deleted file mode 100644 index 05228af79..000000000 --- a/toolbox/openfin/runtime_app.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "startup_app": { - "name": "FDC3 Runtime", - "url": "https://donbasuno.github.io/FDC3/toolbox/fdc3_explained.html", - "uuid": "fdc3_explained_app_runtime", - "autoShow": true, - "defaultCentered": true, - "saveWindowState": false, - "defaultHeight": 778, - "defaultWidth": 970, - "fdc3Api": true - }, - "runtime": { - "arguments": "--enable-crash-reporting", - "version": "stable" - } -} diff --git a/toolbox/openfin/service_app.json b/toolbox/openfin/service_app.json deleted file mode 100644 index 6e2939bd5..000000000 --- a/toolbox/openfin/service_app.json +++ /dev/null @@ -1,22 +0,0 @@ -{ - "startup_app": { - "name": "FDC3 Preload 0.2.2", - "url": "https://donbasuno.github.io/FDC3/toolbox/fdc3_explained.html", - "uuid": "fdc3_explained_app_preload", - "autoShow": true, - "defaultCentered": true, - "saveWindowState": false, - "defaultHeight": 778, - "defaultWidth": 970, - "preloadScripts": [{"url":"https://cdn.openfin.co/services/openfin/fdc3/0.2.5/openfin-fdc3.js", "mandatory": true}] - }, - "runtime": { - "arguments": "--enable-crash-reporting", - "version": "stable" - }, - "services": [ - { - "name": "fdc3" - } - ] -} diff --git a/website/package.json b/website/package.json index 70764f564..00a9bd6f1 100644 --- a/website/package.json +++ b/website/package.json @@ -2,7 +2,7 @@ "scripts": { "examples": "docusaurus-examples", "start": "docusaurus-start", - "prebuild": "yarn run copy-appd && yarn run copy-schemas && yarn run copy-workbench", + "prebuild": "yarn run copy-appd && yarn run copy-schemas && yarn run copy-workbench && yarn run copy-explained", "build": "docusaurus-build", "prepublish-gh-pages": "yarn run copy-appd && yarn run copy-schemas && yarn run copy-workbench", "publish-gh-pages": "docusaurus-publish", @@ -10,6 +10,7 @@ "copy-appd": "cpy ../src/app-directory/specification/appd.yaml static/schemas/next --rename app-directory.yaml", "build-workbench": "cd ../toolbox/fdc3-workbench && yarn install && yarn build", "copy-workbench": "yarn del static/toolbox/fdc3-workbench && yarn build-workbench && cd ../toolbox/fdc3-workbench/build && cpy ** ../../../website/static/toolbox/fdc3-workbench --parents", + "copy-explained": "yarn del static/toolbox/fdc3-explained && cpy ./fdc3-explained ../website/static/toolbox --parents --cwd=../toolbox", "version": "yarn run version:docs && yarn run version:schemas && yarn run version:appd", "version:docs": "docusaurus-version ${VERSION}", "version:schemas": "cpy static/schemas/next/*.schema.json static/schemas/${VERSION} && replace-in-files --string=/schemas/next --replacement=/schemas/${VERSION} static/schemas/${VERSION}/*.schema.json", diff --git a/website/static/fdc3-explained/1.0/index.html b/website/static/fdc3-explained/1.0/index.html deleted file mode 100644 index 82aa188fc..000000000 --- a/website/static/fdc3-explained/1.0/index.html +++ /dev/null @@ -1,257 +0,0 @@ - - - - - FDC3 Explained - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Back to main page.
FDC3 Provider Service:FDC3 Not Available
FDC3 Supported Version:1.1 - - -
-
-
App Directory:No Application Directory Connected
Available Apps:
Load App Start Url:
-
-
Available Channels: 
-
-
Broadcast Context:Channel:
-
-
Get Context:Channel:
Context:
- - - - \ No newline at end of file diff --git a/website/static/fdc3-explained/1.1/main.js b/website/static/fdc3-explained/1.1/main.js deleted file mode 100644 index 2dd89e99e..000000000 --- a/website/static/fdc3-explained/1.1/main.js +++ /dev/null @@ -1,249 +0,0 @@ -import setVersionList from '../versions.js'; - -function fdc3OnReady(callback) { - let fdc3Tries = 10; //lets not check forever... - const checkFDC3Ready = () => { - if (window.fdc3) { - callback.call(this); - } - else { - if (fdc3Tries > 0) { - fdc3Tries--; - window.setTimeout(checkFDC3Ready, 2000); - } - } - }; - checkFDC3Ready(); -} - - -// Wait for the document to load -function documentLoaded(cb) { - if (document.readyState === 'loading') { - document.addEventListener('DOMContentLoaded', cb) - } else { cb() } -} - -// use this to keep track of context listener - one per system channel -let contextListener = null; -let appChannels = []; - - - -// document and FDC3 have loaded start the main function -documentLoaded(() => { - // set the versions of FDC3 Explained in the dropdown - setVersionList() - fdc3OnReady(main) -}); - -function main() { - try { - console.log("FDC3 is ready and DOM has rendered") - populateHTML() - setUpEventListeners() - getPlatform() - displayFDC3Support() - getContext() - } catch (error) { - console.error(error) - } -} - - -async function populateHTML() { - try { - - //populate available channels list with system channels - let channelList = document.getElementById("system-channel-list"); - - const populateChannelsList = (name) => { - let node = document.createElement("li"); - let textNode = document.createTextNode(name); - node.appendChild(textNode); - channelList.appendChild(node); - } - - const systemChannels = await fdc3.getSystemChannels(); - - // for all of the system channels populate dropdowns & lists - systemChannels.forEach(({ displayMetadata, id, type }) => { - let { name } = displayMetadata; - populateChannelsList(name) - populateChannelsDropDown(name) - - }); - - // as FDC3 is supported we can enable the buttons again except those that are not yet supported features - document.querySelectorAll("button").forEach(button => { - if (!button.className.includes("not-supported")) { - button.disabled = false - } - }) - } catch (error) { - console.error("unable to populate the html for the page ", error); - } - -} - -function setUpEventListeners() { - document.getElementById("add-app-channel__btn").addEventListener("click", addAppChannel); - - document.getElementById("join-channel__btn").addEventListener("click", joinChannel); - - document.getElementById("leave-channel__btn").addEventListener("click", fdc3.leaveCurrentChannel); - - document.getElementById("broadcast__btn").addEventListener("click", broadcastFDC3Context); - - document.getElementById("raise-intent__btn").addEventListener("click", raiseIntent); - - document.getElementById("context-type").addEventListener("keyup", (event) => { - // we only want to get the context wen the user hits enter - if (event.key === "Enter") { - event.preventDefault(); - - let contextType = event.target.value; - getContext(contextType) - } - }); - - } - -function displayFDC3Support() { - try { - let supportedElement = document.getElementById("fdc3-support") - if (window.fdc3) { supportedElement.innerHTML = "Yes ✅" } else { supportedElement.innerHTML = "No ❌" } - } catch (error) { - console.error("can't find FDC3 support", error) - } - -} - - -function getPlatform() { - - // TODO: add G42 to vendors - if (window.FSBL) { - window.FSBL.getFSBLInfo().then((info) => { - document.getElementById('providerDetails').innerHTML = "Finsemble Version:" + info.FSBLVersion; - }); - } else if (window.fin) { - fin.desktop.Application.getCurrent().getInfo((info) => { - document.getElementById('providerDetails').innerHTML = info.manifest.startup_app.name - }); - } else if (window.fdc3) { - document.getElementById('providerDetails').innerHTML = "FDC3 Desktop Agent Chrome Extension"; - } - else { - // no need to update the DOM there is already a default message just return - return - } - -} - - -/** - *Populate the channel dropdown elements - */ -function populateChannelsDropDown(newOptionText) { - try { - - let dropdownElement = document.querySelector(".fdc3-channels") - - if (newOptionText) { - dropdownElement.add(new Option(newOptionText)) - } - else { - throw new Error("No option provided") - } - - } catch (error) { - console.error("could not add a new channel to the channel dropdown list", error); - } - -} - -function joinChannel() { - try { - let dropdownElement = document.getElementById("join-channel") - let channelName = dropdownElement.options[dropdownElement.selectedIndex].text.toLowerCase(); - fdc3.joinChannel(channelName); - } catch (error) { - console.error("Can't join channel", error) - } - -} - -async function broadcastFDC3Context() { - try { - let contextData = document.getElementById('txtBroadcastData').value; - fdc3.broadcast(JSON.parse(contextData)); - } catch (error) { - console.error("could not broadcast", error) - } - -} - - -async function getContext(contextType) { - try { - let contextResultBox = document.getElementById("context-result"); - if (contextListener) contextListener.unsubscribe(); - - // if context type is passed in then only listen on that specific context - if (contextType) { - contextListener = fdc3.addContextListener(contextType, (context) => contextResultBox.value = JSON.stringify(context)) - } else { - contextListener = fdc3.addContextListener(context => contextResultBox.value = JSON.stringify(context)); - } - } catch (error) { - console.error("Unable to add a context listener", error) - } -} - - -async function addAppChannel() { - try { - let appChannelName = document.getElementById("app-channel").value; - - if (!appChannelName) throw new Error("no channel name set") - - let appChannelExists = appChannels.find(appChannel => appChannel.id === appChannelName) - - - if (!appChannelExists) { - let newAppChannel = await fdc3.getOrCreateChannel(appChannelName) - appChannels.push(newAppChannel); - - // add to the list of available app channels - let node = document.createElement("li"); - let textNode = document.createTextNode(appChannelName); - node.appendChild(textNode); - document.getElementById("app-channel-list").appendChild(node); - - //populate the channel list dropdown with new appChannel - populateChannelsDropDown(newAppChannel.id) - - - - } else { - throw new Error("app channel already exists") - } - } catch (error) { - console.error("could not add an app channel", error); - } -} - - -async function raiseIntent() { - try { - // get the channel - let intent = document.getElementById("intent").value; - let context = JSON.parse(document.getElementById("intent-context").value); - - // TODO: add the target param - await fdc3.raiseIntent(intent, context) - } catch (err) { - console.error("intent did not resolve", err) - } -} \ No newline at end of file diff --git a/website/static/fdc3-explained/1.2/main.js b/website/static/fdc3-explained/1.2/main.js deleted file mode 100644 index c901f78a6..000000000 --- a/website/static/fdc3-explained/1.2/main.js +++ /dev/null @@ -1,241 +0,0 @@ -import setVersionList from '../versions.js'; - -// check for FDC3 support -function fdc3OnReady(cb) { - if (window.fdc3) { cb() } - else { window.addEventListener('fdc3Ready', cb) } -} -// Wait for the document to load -function documentLoaded(cb) { - if (document.readyState === 'loading') { - document.addEventListener('DOMContentLoaded', cb) - } else { cb() } -} - -// use this to keep track of context listener - one per system channel -let contextListener = null; -let appChannels = []; - - - -// document and FDC3 have loaded start the main function -documentLoaded(() => { - // set the versions of FDC3 Explained in the dropdown - setVersionList() - fdc3OnReady(main) -}); - - -function main() { - try { - console.log("FDC3 is ready and DOM has rendered") - populateHTML() - setUpEventListeners() - getPlatform() - displayFDC3Support() - getContext() - } catch (error) { - console.error(error) - } -} - - -async function populateHTML() { - try { - - // set the versions of FDC3 Explained in the dropdown - setVersionList() - - //populate available channels list with system channels - let channelList = document.getElementById("system-channel-list"); - - const populateChannelsList = (name) => { - let node = document.createElement("li"); - let textNode = document.createTextNode(name); - node.appendChild(textNode); - channelList.appendChild(node); - } - - const systemChannels = await fdc3.getSystemChannels(); - - // for all of the system channels populate dropdowns & lists - systemChannels.forEach(({ displayMetadata, id, type }) => { - let { name } = displayMetadata; - populateChannelsList(name) - populateChannelsDropDown(name) - - }); - - // as FDC3 is supported we can enable the buttons again except those that are not yet supported features - document.querySelectorAll("button").forEach(button => { - if (!button.className.includes("not-supported")) { - button.disabled = false - } - }) - } catch (error) { - console.error("unable to populate the html for the page ", error); - } - -} - -function setUpEventListeners() { - document.getElementById("add-app-channel__btn").addEventListener("click", addAppChannel); - - document.getElementById("join-channel__btn").addEventListener("click", joinChannel); - - document.getElementById("leave-channel__btn").addEventListener("click", fdc3.leaveCurrentChannel); - - document.getElementById("broadcast__btn").addEventListener("click", broadcastFDC3Context); - - document.getElementById("raise-intent__btn").addEventListener("click", raiseIntent); - - document.getElementById("context-type").addEventListener("keyup", (event) => { - // we only want to get the context wen the user hits enter - if (event.key === "Enter") { - event.preventDefault(); - - let contextType = event.target.value; - getContext(contextType) - } - }); - -} - -function displayFDC3Support() { - try { - let supportedElement = document.getElementById("fdc3-support") - if (window.fdc3) { supportedElement.innerHTML = "Yes ✅" } else { supportedElement.innerHTML = "No ❌" } - } catch (error) { - console.error("can't find FDC3 support", error) - } - -} - - -function getPlatform() { - - // TODO: add G42 to vendors - if (window.FSBL) { - window.FSBL.getFSBLInfo().then((info) => { - document.getElementById('providerDetails').innerHTML = "Finsemble Version:" + info.FSBLVersion; - }); - } else if (window.fin) { - fin.desktop.Application.getCurrent().getInfo((info) => { - document.getElementById('providerDetails').innerHTML = info.manifest.startup_app.name - }); - } else if (window.fdc3) { - document.getElementById('providerDetails').innerHTML = "FDC3 Desktop Agent Chrome Extension"; - } - else { - // no need to update the DOM there is already a default message just return - return - } - -} - - -/** - *Populate the channel dropdown elements - */ -function populateChannelsDropDown(newOptionText) { - try { - - let dropdownElement = document.querySelector(".fdc3-channels") - - if (newOptionText) { - dropdownElement.add(new Option(newOptionText)) - } - else { - throw new Error("No option provided") - } - - } catch (error) { - console.error("could not add a new channel to the channel dropdown list", error); - } - -} - -function joinChannel() { - try { - let dropdownElement = document.getElementById("join-channel") - let channelName = dropdownElement.options[dropdownElement.selectedIndex].text.toLowerCase(); - fdc3.joinChannel(channelName); - } catch (error) { - console.error("Can't join channel", error) - } - -} - -async function broadcastFDC3Context() { - try { - let contextData = document.getElementById('txtBroadcastData').value; - fdc3.broadcast(JSON.parse(contextData)); - } catch (error) { - console.error("could not broadcast", error) - } - -} - - -async function getContext(contextType) { - try { - let contextResultBox = document.getElementById("context-result"); - if (contextListener) contextListener.unsubscribe(); - - // if context type is passed in then only listen on that specific context - if (contextType) { - contextListener = fdc3.addContextListener(contextType, (context) => contextResultBox.innerText = JSON.stringify(context, null, 2)) - } else { - contextListener = fdc3.addContextListener(context => contextResultBox.innerText = JSON.stringify(context, null, 2)); - } - } catch (error) { - console.error("Unable to add a context listener", error) - } -} - - -async function addAppChannel() { - try { - let appChannelName = document.getElementById("app-channel").value; - - if (!appChannelName) throw new Error("no channel name set") - - let appChannelExists = appChannels.find(appChannel => appChannel.id === appChannelName) - - - if (!appChannelExists) { - let newAppChannel = await fdc3.getOrCreateChannel(appChannelName) - appChannels.push(newAppChannel); - - // add to the list of available app channels - let node = document.createElement("li"); - let textNode = document.createTextNode(appChannelName); - node.appendChild(textNode); - document.getElementById("app-channel-list").appendChild(node); - - //populate the channel list dropdown with new appChannel - populateChannelsDropDown(newAppChannel.id) - - - - } else { - throw new Error("app channel already exists") - } - } catch (error) { - console.error("could not add an app channel", error); - } -} - - -async function raiseIntent() { - try { - // get the channel - let intent = document.getElementById("intent").value; - let context = JSON.parse(document.getElementById("intent-context").value); - - // TODO: add the target param - await fdc3.raiseIntent(intent, context) - } catch (err) { - console.error("intent did not resolve", err) - } -} \ No newline at end of file diff --git a/website/static/fdc3-explained/legacy/index.html b/website/static/fdc3-explained/legacy/index.html deleted file mode 100644 index 88ed53c3c..000000000 --- a/website/static/fdc3-explained/legacy/index.html +++ /dev/null @@ -1,244 +0,0 @@ - - - - - FDC3 Explained - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Back to main page.
FDC3 Provider Service:FDC3 Not Available
-
-
App Directory:No Application Directory Connected
Available Apps:
Load App Start Url:
-
-
Available Channels: 
-
-
Broadcast Context:Channel:
-
-
Get Context:Channel:
Context:
- - - - \ No newline at end of file diff --git a/website/static/fdc3-explained/versions.js b/website/static/fdc3-explained/versions.js deleted file mode 100644 index 0f98587d0..000000000 --- a/website/static/fdc3-explained/versions.js +++ /dev/null @@ -1,15 +0,0 @@ -export default function () { - - const versions = ["1.0", "1.1", "1.2"]; - - let versionDropdown = document.getElementById("versions") - - // populate the version dropdown with the versions - versions.forEach(version => { - let option = document.createElement("option"); - option.text = version; - option.value = version - versionDropdown.add(option); - }) - -} \ No newline at end of file