-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Deploying to gh-pages from @ 9460fdd 🚀
- Loading branch information
Showing
5 changed files
with
161 additions
and
0 deletions.
There are no files selected for viewing
32 changes: 32 additions & 0 deletions
32
web/vnext/web-interop-support-context-and-intents/common/apps-tools.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| { | ||
| "applications": [ | ||
| { | ||
| "appId": "custom-tab", | ||
| "name": "custom-tab", | ||
| "title": "Custom Tab", | ||
| "description": "A custom tab app that lets you preview a url and navigate to it if it can be loaded. A tool to quickly test a url before adding it as an app.", | ||
| "categories": ["view", "tool"], | ||
| "version": "1.0.0", | ||
| "tooltip": "Add a custom tab to preview urls.", | ||
| "lang": "en-US", | ||
| "icons": [ | ||
| { | ||
| "src": "https://built-on-openfin.github.io/web-starter/web/vnext/web-interop-support-context-and-intents/favicon.ico" | ||
| } | ||
| ], | ||
| "screenshots": [ | ||
| { | ||
| "src": "https://built-on-openfin.github.io/web-starter/web/vnext/web-interop-support-context-and-intents/images/previews/preview-app-custom-tab.jpeg" | ||
| } | ||
| ], | ||
| "contactEmail": "[email protected]", | ||
| "supportEmail": "[email protected]", | ||
| "publisher": "OpenFin", | ||
| "type": "web", | ||
| "details": { | ||
| "url": "https://built-on-openfin.github.io/web-starter/web/vnext/web-interop-support-context-and-intents/platform/custom-tab/custom-tab.html" | ||
| }, | ||
| "interop": {} | ||
| } | ||
| ] | ||
| } |
Binary file added
BIN
+27.6 KB
...interop-support-context-and-intents/images/previews/preview-app-custom-tab.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
41 changes: 41 additions & 0 deletions
41
web/vnext/web-interop-support-context-and-intents/platform/custom-tab/custom-tab.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| <!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width,initial-scale=1" /> | ||
| <title>Custom Tab</title> | ||
| <link rel="icon" type="image/x-icon" href="../../favicon.ico" /> | ||
| <link rel="stylesheet" href="../../common/style/app.css" /> | ||
| <script defer="defer" src="./custom-tab.js"></script> | ||
| <style> | ||
| .query-container { | ||
| padding-top: 125px; | ||
| } | ||
| .preview { | ||
| height: 100%; | ||
| padding: 0px; | ||
| } | ||
| </style> | ||
| </head> | ||
|
|
||
| <body class="col fill gap20"> | ||
| <header class="row spread middle"> | ||
| <div class="col"> | ||
| <h1>Custom Tab</h1> | ||
| </div> | ||
| </header> | ||
| <main class="form fill col gap20 middle scroll-vertical"> | ||
| <div id="preview" class="width-full row preview" style="display: none"> | ||
| <iframe id="preview-iframe" class="width-full preview" src="about:blank"></iframe> | ||
| </div> | ||
| <div id="url-container" class="width-full row pad20 query-container"> | ||
| <input id="url" type="text" class="large center full" placeholder="http://www.example.com" /> | ||
| </div> | ||
| <div class="width-full row pad20 center"> | ||
| <button type="submit" id="previewBtn" disabled="true">Preview</button> | ||
| <button type="submit" id="cancelBtn" style="display: none; margin-right: 10px">Cancel</button> | ||
| <button type="submit" id="actionBtn" style="display: none">Navigate</button> | ||
| </div> | ||
| </main> | ||
| </body> | ||
| </html> |
87 changes: 87 additions & 0 deletions
87
web/vnext/web-interop-support-context-and-intents/platform/custom-tab/custom-tab.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,87 @@ | ||
| const url = document.querySelector('#url'); | ||
| const actionBtn = document.querySelector('#actionBtn'); | ||
| const previewBtn = document.querySelector('#previewBtn'); | ||
| const cancelBtn = document.querySelector('#cancelBtn'); | ||
| const previewContainer = document.querySelector('#preview'); | ||
| const previewFrame = document.querySelector('#preview-iframe'); | ||
| const urlContainer = document.querySelector('#url-container'); | ||
|
|
||
| /** | ||
| * Is the query text a url. | ||
| * @param value The value to test. | ||
| * @returns True if the input is a url. | ||
| */ | ||
| function isValueAUrl(value) { | ||
| return /^https?:\/\//.test(value); | ||
| } | ||
|
|
||
| /** | ||
| * Switch the label based on the content. | ||
| * @param e The event to get the value from. | ||
| */ | ||
| function validateValue(e) { | ||
| setPreviewEnabledState(e.target.value); | ||
| } | ||
|
|
||
| /** | ||
| * Sets whether the preview button is enabled. | ||
| * @param urlToValidate The url to validate. | ||
| */ | ||
| function setPreviewEnabledState(urlToValidate) { | ||
| if (isValueAUrl(urlToValidate)) { | ||
| previewBtn.disabled = false; | ||
| } else { | ||
| previewBtn.disabled = true; | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * Open the query or search. | ||
| */ | ||
| async function actionQuery() { | ||
| const targetUrl = url.value; | ||
| if (isValueAUrl(targetUrl)) { | ||
| location.href = url.value; | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * Init the content. | ||
| */ | ||
| async function init() { | ||
| url.addEventListener('input', validateValue); | ||
| url.addEventListener('keydown', (event) => { | ||
| if (event.key === 'Enter') { | ||
| actionQuery(); | ||
| } | ||
| }); | ||
| actionBtn.addEventListener('click', actionQuery); | ||
| previewBtn.addEventListener('click', async () => { | ||
| urlContainer.style.display = 'none'; | ||
| previewContainer.style.display = 'block'; | ||
| previewFrame.src = url.value; | ||
| cancelBtn.style.display = 'block'; | ||
| previewBtn.style.display = 'none'; | ||
| actionBtn.style.display = 'block'; | ||
| }); | ||
| cancelBtn.addEventListener('click', () => { | ||
| urlContainer.style.display = 'block'; | ||
| previewContainer.style.display = 'none'; | ||
| previewFrame.src = 'about:blank'; | ||
| cancelBtn.style.display = 'none'; | ||
| previewBtn.style.display = 'block'; | ||
| actionBtn.style.display = 'none'; | ||
| url.focus(); | ||
| }); | ||
| setTimeout(() => { | ||
| setPreviewEnabledState(url.value); | ||
| }, 500); | ||
| } | ||
|
|
||
| document.addEventListener('DOMContentLoaded', () => { | ||
| try { | ||
| init(); | ||
| } catch (error) { | ||
| console.error(error); | ||
| } | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters