he4et/browser-milje-2077
1
0
Fork 0
mirror of https://github.com/He4eT/browser-milje-2077.git synced 2026-05-04 17:07:24 +00:00
Code Issues Projects Releases Packages Wiki Activity

milje.js: toggle milje

Browse source
This commit is contained in:
He4eT 2024-08-15 18:44:31 +02:00
commit 31fcd6ced2
5 changed files with 60 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

31
content_scripts/milje.js
View file

@ -1,3 +1,7 @@
const browser = (globalThis.browser ?? globalThis.chrome)
/* */
start() start()
/* */ /* */
@ -12,18 +16,13 @@ function start () {
}) })
.then(assureParams) .then(assureParams)
.then(run) .then(run)
.then(setMessageListener)
} }
/* Params */ /* Params */
function getParamsFromStorage () { function getParamsFromStorage () {
/** return browser.storage.local.get(['params'])
* Sorry, you are not allowed to use import in the content_script :c
* Copy'n'paste of storage here!
*/
const storage = (globalThis.browser ?? globalThis.chrome)['storage']
return storage.local.get(['params'])
.then(({params}) => params) .then(({params}) => params)
} }
@ -56,6 +55,24 @@ function run({ randomSeed, halfPatternSize, scaleFactor, gridSize }) {
const miljeCanvas = matrixToCanvas(pattern, halfPatternSize, scaleFactor) const miljeCanvas = matrixToCanvas(pattern, halfPatternSize, scaleFactor)
document.body.appendChild(miljeCanvas) document.body.appendChild(miljeCanvas)
return miljeCanvas
}
function setMessageListener (miljeCanvas) {
if (!('runtime' in browser)) {
console.log('Milje 2077 extension cannot set up listener.')
return
}
browser.runtime.onMessage.addListener((message) => {
switch (message.command) {
case 'toggleMilje':
miljeCanvas.hidden = !miljeCanvas.hidden
break
default:
console.log('Milje 2077 extension recieved unsupported message.')
}
})
} }
/* Parts */ /* Parts */

24
pages/popup/popup.html
View file

@ -3,9 +3,31 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Milje-2077</title> <title>Milje-2077</title>
<style>
html, body {
text-align: center;
font-family: sans;
}
main {
width: 200px;
}
button {
display: block;
box-sizing: border-box;
width: 100%;
margin: 8px 0;
}
</style>
</head> </head>
<body> <body>
test <main>
<h1>Milje 2077</h1>
<button id="toggleMiljeButton">Toggle the Milje</button>
<button id="openSettingsButton">Open Settings</button>
</main>
<script type="module" src="./popup.js"></script> <script type="module" src="./popup.js"></script>
</body> </body>
</html> </html>

14
pages/popup/popup.js
View file

@ -1,3 +1,13 @@
import { storage } from '../../scripts/storage.js' import { browser } from '../../scripts/browser.js'
storage.local.set({'params': {scaleFactor: 128}}) document.getElementById('toggleMiljeButton').onclick = () => {
browser.tabs.query({active: true, currentWindow: true})
.then(([tab]) => browser.tabs.sendMessage(tab.id, {
command: 'toggleMilje',
}))
}
document.getElementById('openSettingsButton').onclick = () => {
browser.storage.local.set({'params': {scaleFactor: 16}})
console.log('openSettingsButton')
}

1
scripts/browser.js Normal file
View file

@ -0,0 +1 @@
export const browser = (globalThis.browser ?? globalThis.chrome)

1
scripts/storage.js
View file

@ -1 +0,0 @@
export const storage = (window.browser ?? window.chrome)['storage']