mirror of
https://github.com/FranP-code/wii-shop-extension.git
synced 2025-10-12 23:52:52 +00:00
Switch popup UI to Bootstrap, update notification
This commit is contained in:
Corbin Davenport
7
css/bootstrap.min.css
vendored
Normal file
7
css/bootstrap.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -16,12 +16,12 @@ themeAudio.loop = true
|
||||
// Get stored settings
|
||||
chrome.storage.local.get({
|
||||
music: 'wii-shop-theme'
|
||||
}, function (data) {
|
||||
currentMusic = chrome.extension.getURL('music/' + data.music + '.ogg')
|
||||
}, function (data) {
|
||||
currentMusic = chrome.extension.getURL('music/' + data.music + '.ogg')
|
||||
})
|
||||
|
||||
// Change music after settings change
|
||||
chrome.storage.onChanged.addListener(function(changes, area) {
|
||||
chrome.storage.onChanged.addListener(function (changes, area) {
|
||||
if (changes.music) {
|
||||
currentMusic = chrome.extension.getURL('music/' + changes.music.newValue + '.ogg')
|
||||
themeAudio.src = chrome.extension.getURL('music/' + changes.music.newValue + '.ogg')
|
||||
@@ -59,34 +59,51 @@ chrome.tabs.onActivated.addListener(function (activeInfo) {
|
||||
|
||||
// Show notification on extension install
|
||||
chrome.runtime.onInstalled.addListener(function () {
|
||||
// Firefox doesn't support buttons in notifications
|
||||
// Set most options
|
||||
var data = {
|
||||
'type': 'basic',
|
||||
'iconUrl': chrome.extension.getURL('img/icon128.png'),
|
||||
'title': 'Wii Shop Music extension installed!',
|
||||
}
|
||||
// Set message and handlers for notification
|
||||
if (navigator.userAgent.includes("Firefox")) {
|
||||
chrome.notifications.create({
|
||||
'type': 'basic',
|
||||
'iconUrl': chrome.extension.getURL('img/icon128.png'),
|
||||
'title': 'Wii Shop Music extension installed!',
|
||||
'message': 'The Wii Shop theme will now play when you visit shopping websites, and you can use the toolbar button to change settings. Click here to join the Discord server.'
|
||||
}, function (id) {
|
||||
browser.notifications.onClicked.addListener(function(id) {
|
||||
chrome.tabs.create({ url: 'https://discord.com/invite/59wfy5cNHw' })
|
||||
// Firefox supports does not support buttons in notifications
|
||||
data.message = 'The Wii Shop theme will now play when you visit shopping websites. Click the toolbar button to change settings, or click this notification.'
|
||||
handleNotif = function (id) {
|
||||
chrome.notifications.onClicked.addListener(function (id) {
|
||||
chrome.windows.create({
|
||||
'url': chrome.extension.getURL('popup.html'),
|
||||
'width': 300,
|
||||
'height': 500,
|
||||
'type': 'popup'
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
} else {
|
||||
// Chromium browsers support buttons in notifications
|
||||
chrome.notifications.create({
|
||||
'type': 'basic',
|
||||
'iconUrl': chrome.extension.getURL('img/icon128.png'),
|
||||
'title': 'Wii Shop Music extension installed!',
|
||||
'message': 'The Wii Shop theme will now play when you visit shopping websites, and you can use the toolbar button to change settings.',
|
||||
buttons: [{
|
||||
title: 'Join Discord server'
|
||||
}]
|
||||
}, function (id) {
|
||||
chrome.notifications.onButtonClicked.addListener(function (id, btnIdx) {
|
||||
if (btnIdx === 0) {
|
||||
// Chromium browsers don't support openPopup(), but do support a button
|
||||
data.message = 'The Wii Shop theme will now play when you visit shopping websites. Click the toolbar button to change settings at any time.'
|
||||
data.buttons = [{
|
||||
title: 'Open settings'
|
||||
},
|
||||
{
|
||||
title: 'Join Discord'
|
||||
}
|
||||
]
|
||||
handleNotif = function (id) {
|
||||
chrome.notifications.onButtonClicked.addListener(function (id, i) {
|
||||
if (i === 0) {
|
||||
chrome.windows.create({
|
||||
'url': chrome.extension.getURL('popup.html'),
|
||||
'width': 300,
|
||||
'height': 500,
|
||||
'type': 'popup'
|
||||
})
|
||||
} else if (i === 1) {
|
||||
chrome.tabs.create({ url: 'https://discord.com/invite/59wfy5cNHw' })
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
// Display the notification
|
||||
chrome.notifications.create(data, handleNotif)
|
||||
})
|
||||
|
||||
7
js/bootstrap.min.js
vendored
Normal file
7
js/bootstrap.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -117,5 +117,4 @@ const siteList = [
|
||||
'u-mall.com.tw',
|
||||
'tw.bid.yahoo.com',
|
||||
'tw.mail.yahoo.com'
|
||||
|
||||
]
|
||||
|
||||
68
popup.html
68
popup.html
@@ -5,65 +5,41 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="css/bootstrap.min.css" rel="stylesheet">
|
||||
<style>
|
||||
html, body {
|
||||
html,
|
||||
body {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
body, input, select, button {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.picker {
|
||||
width: calc(100% - 10px);
|
||||
select {
|
||||
overflow: auto;
|
||||
border: 5px solid #34bfed;
|
||||
/* background: linear-gradient(to bottom, #afe7f6 0%, #b0e4f9 1%, #b9e8f8 14%, #dbf3fd 43%, #e8f7fe 53%, #f7ffff 71%, #f2fdff 88%, #f0fbff 89%, #ebf7fa 90%, #e5f3f6 92%, #e5f2fa 94%, #e0f1f5 95%, #dff1f3 96%, #e4eff3 97%, #e1f0f3 98%, #e0edf6 99%, #ddeff2 100%); */
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.picker option:active {
|
||||
color: red;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-top: 10px;
|
||||
height: 40px;
|
||||
width: calc(100% - 10px);
|
||||
border: 1px solid #34bfed;
|
||||
border-radius: 10px;
|
||||
.btn-wii {
|
||||
background: linear-gradient(to bottom, #f5fafe 0%,#fdfdfe 7%,#f2fdff 81%,#e8f3f8 86%,#e7f2f6 89%,#e4f0f3 93%,#ddeff0 100%);
|
||||
border: 1px solid #34bfed;
|
||||
}
|
||||
|
||||
button:active {
|
||||
.btn-wii:active {
|
||||
background: linear-gradient(to top, #f5fafe 0%,#fdfdfe 7%,#f2fdff 81%,#e8f3f8 86%,#e7f2f6 89%,#e4f0f3 93%,#ddeff0 100%);
|
||||
}
|
||||
|
||||
header {
|
||||
font-weight: bold;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>Music Picker</header>
|
||||
<select id="music-picker" multiple size="5" class="picker">
|
||||
<option value="wii-shop-theme">Wii Shop Channel</option>
|
||||
<option value="wii-shop-banner-theme">Wii Shop Channel (Menu)</option>
|
||||
<option value="wii-u-eshop-theme">Wii U eShop</option>
|
||||
<option value="3ds-eshop-theme">3DS eShop</option>
|
||||
<option value="dsi-shop-theme">DSi Shop</option>
|
||||
<option value="coconut-mall">Coconut Mall</option>
|
||||
</select>
|
||||
|
||||
<button data-link="https://discord.com/invite/59wfy5cNHw">Join Discord server</button>
|
||||
<div class="container-fluid">
|
||||
<label for="music-picker" class="mt-2 form-label">Music Picker</label>
|
||||
<select id="music-picker" multiple size="6" class="form-select w-100" multiple>
|
||||
<option value="wii-shop-theme">Wii Shop Channel</option>
|
||||
<option value="wii-shop-banner-theme">Wii Shop Channel (Menu)</option>
|
||||
<option value="wii-u-eshop-theme">Wii U eShop</option>
|
||||
<option value="3ds-eshop-theme">3DS eShop</option>
|
||||
<option value="dsi-shop-theme">DSi Shop</option>
|
||||
<option value="coconut-mall">Coconut Mall</option>
|
||||
</select>
|
||||
|
||||
<button class="btn btn-sm btn-wii mt-2 mb-2 w-100" data-link="https://discord.com/invite/59wfy5cNHw">Join Discord server</button>
|
||||
</div>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
<script src="js/popup.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user