forked from davidtodd/landmarks
-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #187 from matatk/splash
Initial attempt at splash screen
- Loading branch information
Showing
9 changed files
with
1,709 additions
and
1,889 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
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
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
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
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
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
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
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,5 @@ | ||
| td.error { | ||
| background-color: #d00; | ||
| color: white; | ||
| font-weight: bold; | ||
| } |
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,214 @@ | ||
| 'use strict' | ||
| // FIXME localise (remember: table headings, button contents, ...) | ||
| // FIXME what to do when content script is re-loaded and disconnected in Blink | ||
|
|
||
| const chromeLike = window.chrome ? true : false | ||
|
|
||
| const splashPage = { | ||
| contains: [ | ||
| // more stuff is added later | ||
| ] | ||
| } | ||
|
|
||
| const shortcutTableRows = [ | ||
| { | ||
| element: 'tr', | ||
| contains: [ | ||
| { element: 'th', content: 'Action' }, | ||
| { element: 'th', content: 'Keyboard shortcut' } | ||
| ] | ||
| } | ||
| ] | ||
|
|
||
| const chromeKeyboardShortcutsButton = { | ||
| element: 'p', contains: [{ | ||
| element: 'button', | ||
| content: 'Add or change shortcuts', | ||
| listen: { | ||
| event: 'click', | ||
| handler: () => browser.runtime.sendMessage({ | ||
| request: 'splash-open-configure-shortcuts' | ||
| }) | ||
| } | ||
| }] | ||
| } | ||
|
|
||
|
|
||
| function makePart(structure, root) { | ||
| let newPart | ||
|
|
||
| for (const key in structure) { | ||
| switch (key) { | ||
| case 'element': | ||
| newPart = document.createElement(structure[key]) | ||
| root.appendChild(newPart) | ||
| break | ||
| case 'class': | ||
| newPart.classList.add(structure[key]) | ||
| break | ||
| case 'text': | ||
| root.appendChild(document.createTextNode(structure[key])) | ||
| break | ||
| case 'content': | ||
| newPart.appendChild(document.createTextNode(structure[key])) | ||
| break | ||
| case 'listen': | ||
| newPart.addEventListener( | ||
| structure[key].event, structure[key].handler) | ||
| break | ||
| case 'contains': | ||
| for (const contained of structure[key]) { | ||
| makePart(contained, newPart ? newPart : root) | ||
| } | ||
| break | ||
| default: | ||
| throw Error(`Unexpected structure key ${key} encountered.`) | ||
| } | ||
| } | ||
|
|
||
| return root | ||
| } | ||
|
|
||
|
|
||
| function addCommandRowAndReportIfMissing(command) { | ||
| // Work out the command's friendly name | ||
| let action | ||
|
|
||
| if (command.name === '_execute_browser_action') { | ||
| action = 'Show pop-up' | ||
| } else if (chromeLike) { | ||
| // Chrome returns the full descriptions | ||
| action = command.description | ||
| } else { | ||
| // Firefox requires the descriptions to be translated | ||
| const messageName = command.description.slice(6, -2) | ||
| action = browser.i18n.getMessage(messageName) | ||
| } | ||
|
|
||
| // Work out the command's shortcut | ||
| let shortcutCellElement | ||
|
|
||
| if (command.shortcut) { | ||
| // Firefox gives "Alt+Shift+N" but Chrome gives ⌥⇧N | ||
| if (chromeLike) { | ||
| shortcutCellElement = { element: 'td', contains: [ | ||
| { element: 'kbd', content: command.shortcut } | ||
| ]} | ||
| } else { | ||
| shortcutCellElement = { element: 'td', contains: | ||
| firefoxShortcutElements(command.shortcut) | ||
| } | ||
| } | ||
| } else { | ||
| shortcutCellElement = { element: 'td', class: 'error', contains: [ | ||
| { text: 'Not set up' } | ||
| ]} | ||
| } | ||
|
|
||
| shortcutTableRows.push({ | ||
| element: 'tr', | ||
| contains: [ | ||
| { element: 'td', content: action }, | ||
| shortcutCellElement | ||
| ] | ||
| }) | ||
| } | ||
|
|
||
|
|
||
| function firefoxShortcutElements(shortcut) { | ||
| const shortcutElements = [] | ||
| const shortcutParts = shortcut.split(/(\+)/) | ||
|
|
||
| for (const keyOrPlus of shortcutParts) { | ||
| if (keyOrPlus !== '+') { | ||
| shortcutElements.push({ element: 'kbd', content: keyOrPlus }) | ||
| } else { | ||
| shortcutElements.push({ text: ' + ' }) | ||
| } | ||
| } | ||
|
|
||
| return shortcutElements | ||
| } | ||
|
|
||
|
|
||
| browser.runtime.onMessage.addListener(function(message) { | ||
| if (message.request !== 'splash-populate-commands') return | ||
|
|
||
| // Chrome allows only four keyboard shortcuts to be specified in the | ||
| // manifest; Firefox allows many. | ||
| // | ||
| // The extra ones for Firefox are patched in via its specific manifest file | ||
| // when the manifest is merged. | ||
| // | ||
| // The commands are in the manifest in the opposite order to that which | ||
| // seems most logical, and need to be reversed to pop out in the right | ||
| // order on the splash page. This is because the merging in of the extra | ||
| // keyboard shortcuts means that the commands with added keyboard shortucts | ||
| // in Firefox are bumped to the top of the commands object. | ||
| // | ||
| // What is a bit odd is that, on Chrome, it appears the reversal is not | ||
| // needed. | ||
| const commandsInOrder = chromeLike ? | ||
| message.commands : message.commands.reverse() | ||
|
|
||
| for (const command of commandsInOrder) { | ||
| addCommandRowAndReportIfMissing(command) | ||
| } | ||
|
|
||
| splashPage.contains.push({ | ||
| element: 'table', | ||
| contains: shortcutTableRows | ||
| }) | ||
|
|
||
| if (chromeLike) splashPage.contains.push(chromeKeyboardShortcutsButton) | ||
|
|
||
|
|
||
| // Create new bits | ||
|
|
||
| const heading = document.getElementById('via-shortcut-key') | ||
| const parent = heading.parentNode | ||
| const splashContainer = document.createElement('div') | ||
|
|
||
| parent.insertBefore( | ||
| makePart(splashPage, splashContainer), heading.nextSibling) | ||
| }) | ||
|
|
||
|
|
||
| function main() { | ||
| // Check for various README elements and escape if things aren't as expected | ||
|
|
||
| const installationTocEntry = document.getElementsByTagName('li')[0] | ||
| if (!installationTocEntry | ||
| || installationTocEntry.textContent !== 'Installation') return | ||
|
|
||
| const installationHeading = document.getElementById('installation') | ||
| if (!installationHeading) return | ||
|
|
||
| const shortcutKeysHeading = document.getElementById('via-shortcut-key') | ||
| if (!shortcutKeysHeading) return | ||
|
|
||
| // Remove installation section | ||
|
|
||
| installationTocEntry.remove() | ||
|
|
||
| while (installationHeading.nextSibling.tagName !== 'H2') { // FIXME H | ||
| installationHeading.nextSibling.remove() | ||
| } | ||
|
|
||
| installationHeading.remove() | ||
|
|
||
| // Remove static keyboard shortcuts section content | ||
|
|
||
| while (shortcutKeysHeading.nextSibling.tagName !== 'H3') { // FIXME H | ||
| shortcutKeysHeading.nextSibling.remove() | ||
| } | ||
|
|
||
| // Kickstart process to get commands and create new HTML | ||
|
|
||
| browser.runtime.sendMessage({ | ||
| request: 'get-commands' | ||
| }) | ||
| } | ||
|
|
||
|
|
||
| main() |