feat: Get extension working in the Edge browser
To accomplish this, it needed to be bundled up in a zip file, so code to do that was added. (Quite possibly the zip will be able to be renamed as an .xpi file to create the file needed for Firefox. At the moment, you must extract this zip and "sideload" the extension into Edge by selected the extracted folder. I read that Edge will handle the packing into a single extension file itself. Also, some of the features used in the extension had to be polyfilled into Edge. And the final major change is that the "Xray" feature is not available in Edge, so data passed from the content script to the script injected into the page had to be moved from Xray to attributes of the script element. This all represents more progress on #28, Chrome(ium) is next.
This commit is contained in:
parent
fff75f67e3
commit
b4f732d5bf
2
.gitignore
vendored
2
.gitignore
vendored
@ -3,6 +3,8 @@ tsbuild
|
|||||||
jsbuild
|
jsbuild
|
||||||
public/js
|
public/js
|
||||||
extension
|
extension
|
||||||
|
archematics
|
||||||
|
archematics.zip
|
||||||
|
|
||||||
# Editor backups
|
# Editor backups
|
||||||
*~
|
*~
|
||||||
|
@ -8,11 +8,15 @@
|
|||||||
"content_scripts": [
|
"content_scripts": [
|
||||||
{
|
{
|
||||||
"matches": ["*://*/*"],
|
"matches": ["*://*/*"],
|
||||||
"js": ["giveAwrl.js"]
|
"js": [
|
||||||
|
"browser-polyfill.js",
|
||||||
|
"custom-elements.min.js",
|
||||||
|
"giveAwrl.js"
|
||||||
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"matches": ["*://*/*"],
|
"matches": ["*://*/*"],
|
||||||
"js": ["adapptext.js"],
|
"js": ["browser-polyfill.js", "adapptext.js"],
|
||||||
"run_at": "document_start"
|
"run_at": "document_start"
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
@ -14,12 +14,12 @@
|
|||||||
// Use the Typescript compiler to create the final .js files:
|
// Use the Typescript compiler to create the final .js files:
|
||||||
build_js: 'tsc && mkdir -p public/js && cp -r jsbuild/* public/js',
|
build_js: 'tsc && mkdir -p public/js && cp -r jsbuild/* public/js',
|
||||||
build_deps: 'bash tools/copyDeps.bash public/js/deps',
|
build_deps: 'bash tools/copyDeps.bash public/js/deps',
|
||||||
build_plugin: 'bash tools/makePlugin.bash extension',
|
build_plugin: 'bash tools/makePlugin.bash archematics',
|
||||||
build: 'pnpm --sequential /build_/',
|
build: 'pnpm --sequential /build_/',
|
||||||
start: 'node public/js',
|
start: 'node public/js',
|
||||||
go: 'pnpm --sequential "/build|start/"',
|
go: 'pnpm --sequential "/build|start/"',
|
||||||
serve: 'pnpm build && http-server',
|
serve: 'pnpm build && http-server',
|
||||||
clean: 'rm -rf tsbuild jsbuild public/js extension',
|
clean: 'rm -rf tsbuild jsbuild public/js archematics archematics.zip',
|
||||||
},
|
},
|
||||||
packageManager: 'pnpm',
|
packageManager: 'pnpm',
|
||||||
keywords: [
|
keywords: [
|
||||||
@ -37,9 +37,11 @@
|
|||||||
'@danielx/civet': '^0.6.43',
|
'@danielx/civet': '^0.6.43',
|
||||||
'@types/firefox-webext-browser': '^111.0.2',
|
'@types/firefox-webext-browser': '^111.0.2',
|
||||||
'@types/jquery': '^3.5.22',
|
'@types/jquery': '^3.5.22',
|
||||||
|
'@webcomponents/custom-elements': '^1.6.0',
|
||||||
'http-server': '^14.1.1',
|
'http-server': '^14.1.1',
|
||||||
rollup: '^4.0.2',
|
rollup: '^4.0.2',
|
||||||
typescript: '^5.2.2',
|
typescript: '^5.2.2',
|
||||||
|
'webextension-polyfill': '^0.10.0',
|
||||||
},
|
},
|
||||||
dependencies: {
|
dependencies: {
|
||||||
colorsea: '^1.2.1',
|
colorsea: '^1.2.1',
|
||||||
|
@ -22,6 +22,9 @@ devDependencies:
|
|||||||
'@types/jquery':
|
'@types/jquery':
|
||||||
specifier: ^3.5.22
|
specifier: ^3.5.22
|
||||||
version: 3.5.22
|
version: 3.5.22
|
||||||
|
'@webcomponents/custom-elements':
|
||||||
|
specifier: ^1.6.0
|
||||||
|
version: 1.6.0
|
||||||
http-server:
|
http-server:
|
||||||
specifier: ^14.1.1
|
specifier: ^14.1.1
|
||||||
version: 14.1.1
|
version: 14.1.1
|
||||||
@ -31,6 +34,9 @@ devDependencies:
|
|||||||
typescript:
|
typescript:
|
||||||
specifier: ^5.2.2
|
specifier: ^5.2.2
|
||||||
version: 5.2.2
|
version: 5.2.2
|
||||||
|
webextension-polyfill:
|
||||||
|
specifier: ^0.10.0
|
||||||
|
version: 0.10.0
|
||||||
|
|
||||||
packages:
|
packages:
|
||||||
|
|
||||||
@ -190,6 +196,10 @@ packages:
|
|||||||
- supports-color
|
- supports-color
|
||||||
dev: true
|
dev: true
|
||||||
|
|
||||||
|
/@webcomponents/custom-elements@1.6.0:
|
||||||
|
resolution: {integrity: sha512-CqTpxOlUCPWRNUPZDxT5v2NnHXA4oox612iUGnmTUGQFhZ1Gkj8kirtl/2wcF6MqX7+PqqicZzOCBKKfIn0dww==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
/acorn@8.10.0:
|
/acorn@8.10.0:
|
||||||
resolution: {integrity: sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==}
|
resolution: {integrity: sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==}
|
||||||
engines: {node: '>=0.4.0'}
|
engines: {node: '>=0.4.0'}
|
||||||
@ -619,6 +629,10 @@ packages:
|
|||||||
hasBin: true
|
hasBin: true
|
||||||
dev: false
|
dev: false
|
||||||
|
|
||||||
|
/webextension-polyfill@0.10.0:
|
||||||
|
resolution: {integrity: sha512-c5s35LgVa5tFaHhrZDnr3FpQpjj1BB+RXhLTYUxGqBVN460HkbM8TBtEqdXWbpTKfzwCcjAZVF7zXCYSKtcp9g==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
/webpack-sources@3.2.3:
|
/webpack-sources@3.2.3:
|
||||||
resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
|
resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
|
||||||
engines: {node: '>=10.13.0'}
|
engines: {node: '>=10.13.0'}
|
||||||
|
@ -29,12 +29,13 @@ config := childList: true, subtree: true
|
|||||||
|
|
||||||
obs.observe document.documentElement, config
|
obs.observe document.documentElement, config
|
||||||
|
|
||||||
function addScriptTag(url: string, module = false)
|
function addScriptTag(url: string, params = '', module = false)
|
||||||
return new Promise (resolve, reject) =>
|
return new Promise (resolve, reject) =>
|
||||||
script := document.createElement 'script'
|
script := document.createElement 'script'
|
||||||
script.addEventListener 'load', resolve
|
script.addEventListener 'load', resolve
|
||||||
script.addEventListener 'error', reject
|
script.addEventListener 'error', reject
|
||||||
script.src = url
|
script.src = url
|
||||||
|
if params then script.dataset.params = params
|
||||||
if module then script.type = 'module'
|
if module then script.type = 'module'
|
||||||
document.head.appendChild script
|
document.head.appendChild script
|
||||||
|
|
||||||
@ -65,7 +66,6 @@ document.addEventListener "DOMContentLoaded", async =>
|
|||||||
codebase .= browser.runtime.getURL 'deps/GeoGebra/HTML5/5.0/'
|
codebase .= browser.runtime.getURL 'deps/GeoGebra/HTML5/5.0/'
|
||||||
codebase += use3d ? 'web3d' : 'webSimple'
|
codebase += use3d ? 'web3d' : 'webSimple'
|
||||||
adapParams: AdapParams := {codebase, config, joyceApplets }
|
adapParams: AdapParams := {codebase, config, joyceApplets }
|
||||||
// @ts-ignore
|
apars := JSON.stringify(adapParams)
|
||||||
window.wrappedJSObject.adapParams = cloneInto(adapParams, window)
|
|
||||||
addScriptTag(browser.runtime.getURL 'deps/GeoGebra/deployggb.js').then =>
|
addScriptTag(browser.runtime.getURL 'deps/GeoGebra/deployggb.js').then =>
|
||||||
addScriptTag browser.runtime.getURL('adapptlet.js'), true
|
addScriptTag browser.runtime.getURL('adapptlet.js'), apars, true
|
||||||
|
@ -78,10 +78,21 @@ function postApplets(jApplets: AppletDescription[], codebase = '')
|
|||||||
if codebase then geoApp.setHTML5Codebase codebase
|
if codebase then geoApp.setHTML5Codebase codebase
|
||||||
geoApp.inject jApp.id
|
geoApp.inject jApp.id
|
||||||
|
|
||||||
|
adapptScript := findAdappt() as HTMLScriptElement
|
||||||
|
|
||||||
|
function findAdappt()
|
||||||
|
scripts := document.querySelectorAll 'script'
|
||||||
|
for scrip of scripts
|
||||||
|
src := scrip.getAttribute 'src'
|
||||||
|
if src and src.includes 'adapptlet'
|
||||||
|
return scrip
|
||||||
|
|
||||||
|
console.log 'In script', document.currentScript, adapptScript
|
||||||
|
|
||||||
adapParams: AdapParams :=
|
adapParams: AdapParams :=
|
||||||
typeof GGBApplet is 'undefined'
|
typeof GGBApplet is 'undefined'
|
||||||
? {loader: 'https://www.geogebra.org/apps/deployggb.js', joyceApplets: []}
|
? {loader: 'https://www.geogebra.org/apps/deployggb.js', joyceApplets: []}
|
||||||
: ((window as any).adapParams as AdapParams)
|
: JSON.parse(adapptScript.dataset.params ?? '') as AdapParams
|
||||||
|
|
||||||
// Always use the final joyceApplets if there are any:
|
// Always use the final joyceApplets if there are any:
|
||||||
if joyceApplets.length
|
if joyceApplets.length
|
||||||
|
@ -18,7 +18,10 @@ do
|
|||||||
cp -r etc/$trimspec $1/$dest
|
cp -r etc/$trimspec $1/$dest
|
||||||
done
|
done
|
||||||
|
|
||||||
npx rollup public/js/giveAwrl.js --dir extension
|
npx rollup public/js/giveAwrl.js --dir $1
|
||||||
npx rollup public/js/adapptlet.js --file extension/adapptlet.js
|
npx rollup public/js/adapptlet.js --file $1/adapptlet.js
|
||||||
npx rollup public/js/adapptext.js --file extension/adapptext.js
|
npx rollup public/js/adapptext.js --file $1/adapptext.js
|
||||||
cp public/js/options.js public/js/adapptypes.js extension
|
cp public/js/options.js public/js/adapptypes.js $1
|
||||||
|
cp node_modules/webextension-polyfill/dist/browser-polyfill.js $1
|
||||||
|
cp node_modules/@webcomponents/custom-elements/custom-elements.min.js $1
|
||||||
|
zip -r $1 $1
|
||||||
|
Loading…
Reference in New Issue
Block a user