Compare commits
59 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
b42d73f86f | ||
|
|
54a6068f0e | ||
|
|
74b7090dba | ||
|
|
d14e2f9412 | ||
|
|
1d5d117e5f | ||
|
|
ce2e4541da | ||
|
|
1826dce523 | ||
|
|
fb13e2f056 | ||
|
|
43c25e103e | ||
|
|
cfd75d69ed | ||
|
|
c8fda4aac9 | ||
|
|
badd13acb1 | ||
|
|
c87e566cc2 | ||
|
|
67d9446202 | ||
|
|
07c4a238c9 | ||
|
|
a67d057764 | ||
|
|
8ded4f44ed | ||
|
|
85f4f15b01 | ||
|
|
d2bbbc277e | ||
|
|
f470c61558 | ||
|
|
64ab22c205 | ||
|
|
cacfca6b9b | ||
|
|
51f6a1fc59 | ||
|
|
dd2c56a5dc | ||
|
|
8cfd1a37f2 | ||
|
|
ba26b46004 | ||
|
|
0bd6fac0d9 | ||
|
|
9963fa96a2 | ||
|
|
3d995c5564 | ||
|
|
d5e8d51f93 | ||
|
|
ffb55757b9 | ||
|
|
7ac05b2686 | ||
|
|
1ac2703e52 | ||
|
|
55b8ffd9c5 | ||
|
|
3a7827649e | ||
|
|
f35c3c3ad1 | ||
|
|
81bc8481b3 | ||
|
|
ee1c9aed99 | ||
|
|
457ddfdce6 | ||
|
|
3f00a4c046 | ||
|
|
c8bc9241d2 | ||
|
|
f87efcc978 | ||
|
|
c964607672 | ||
|
|
17b8d52d6c | ||
|
|
e704136ebd | ||
|
|
e1f96f7647 | ||
|
|
066a98ea00 | ||
|
|
c6eab86651 | ||
|
|
54a8939e9f | ||
|
|
1e7d39071c | ||
|
|
daaf8714ae | ||
|
|
f9b3f40d1e | ||
|
|
3d6743adf8 | ||
|
|
76e3da6021 | ||
|
|
8f41b04cb7 | ||
|
|
69b8b10a76 | ||
|
|
44a60f5227 | ||
|
|
6f319ba942 | ||
|
|
9618890ed6 |
5
.gitignore
vendored
5
.gitignore
vendored
@@ -1,3 +1,8 @@
|
||||
dev-build
|
||||
node_modules
|
||||
build
|
||||
*.psd
|
||||
*.ai
|
||||
cdn/
|
||||
artwork/
|
||||
.jshintrc
|
||||
21
LICENSE.md
Normal file
21
LICENSE.md
Normal file
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2020 wompmacho
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
@@ -1,2 +1,8 @@
|
||||
# live-chat
|
||||
<p align="center">
|
||||
<img width="443" height="592" src="https://storage.googleapis.com/womp-website_cloudbuild/cdn/wompchat/gif/emotesMenu.gif">
|
||||
</p>
|
||||
|
||||
# wompchat
|
||||
[](https://discord.gg/pVNnTDA) [](https://storage.googleapis.com/womp-website_cloudbuild/cdn/wompchat/img/btc.JPG)
|
||||
|
||||
A Chrome Extension To Improve YouTube Livestream Chat
|
||||
|
||||
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 281 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.6 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 59 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 41 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 607 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 608 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 533 KiB |
@@ -1,165 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
font-family: sans-serif;
|
||||
padding: 10px;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.hideDiv {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<meta charset="UTF-8">
|
||||
<title>Options</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<span style="display:inline-block;vertical-align: middle; margin-right: 2%;">
|
||||
<img src="../assets/icons/icon128.png" alt="🔴" style="height: 2.5em;">
|
||||
</span>
|
||||
<span style="display:inline-block;vertical-align: middle;">
|
||||
<h1>Live Chat Options</h1>
|
||||
</span>
|
||||
<span class="">
|
||||
<button class="info_button" id="infoButton" >Info</button>
|
||||
</span>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<div id="optionsMenu" class="tabcontent active">
|
||||
<div class="section">
|
||||
<h2 class="options-heading">Emote Options</h2>
|
||||
<div class="options-description"></div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="enableBTTVEmotes">Enable BTTV - Top, Trending and Global Emotes (200+)</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="enableBTTVEmotes" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="enableFrankerEmotes">Enable FrankerFacez - Top 100 emotes</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="enableFrankerEmotes" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="enableTwitchEmotes">Enable Twitch - Global emotes</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="enableTwitchEmotes" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hr"></div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="kappaFix">Kappa Fix</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="kappaFix" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="hr"></div>
|
||||
|
||||
<div class="section">
|
||||
<h2 class="options-heading">Chat Options</h2>
|
||||
<div class="options-description"></div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="setLiveChat">Make LIVE CHAT Default</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="setLiveChat" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="theaterModeFix">Improved Theater Mode</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="theaterModeFix" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="setTwitchColors">Twitch Styling</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="setTwitchColors" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="hideAuthorIcons">Hide Author Icons</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="hideAuthorIcons" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="showTimeStamp">Show TimeStamp</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="showTimeStamp" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="hideWelcomBanner">Hide Welcome Banner</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="hideWelcomBanner" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="alternateLineColor">Alternate Line Colors</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="alternateLineColor" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="setAuthorColor">Colorful User Names</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="setAuthorColor" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="hr"></div>
|
||||
<h2 class="options-heading">Font Size</h2>
|
||||
<span>
|
||||
|
||||
</span>
|
||||
|
||||
<span>
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="slidecontainer">
|
||||
<input disabled type="range" min="1" max="50" value="13" class="slider option-input" id="textSizeSlider">
|
||||
</div>
|
||||
<div class="option-cell">
|
||||
<label for="allowTextSlider"></label>
|
||||
</div>
|
||||
<div class="option-cell">
|
||||
<input disabled type="checkbox" id="allowTextSlider" class="option-input">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</span>
|
||||
<div id="save-status"> </div>
|
||||
|
||||
<div class="omega"></div>
|
||||
|
||||
</div>
|
||||
|
||||
<script src="../options.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,92 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Welcome Page</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="success-overlay">
|
||||
|
||||
<div class="icon-container">
|
||||
<i class="material-icons">done</i>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="logo">
|
||||
<img src="../assets/icons/icon512.png" alt="Live Chat Logo">
|
||||
</div>
|
||||
|
||||
<h1><span class="fw-light">Welcome to the </span><span class="fw-bold">Chat</span></h1>
|
||||
|
||||
<p class="heading-note">This is still very beta</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="links_div">
|
||||
<a class="links_bottom" href="https://discord.gg/pVNnTDA" title="Join our Discord Community">Join our Discord Community</a>
|
||||
<a class="links_bottom" href="https://streamelements.com/wompmacho-5882/tip" title="Donations">Donations</a>
|
||||
<a class="links_bottom" href="https://www.youtube.com/wompmacho" title="Youtube">Youtube</a>
|
||||
<a class="links_bottom" href="mailto:wompmacho@gmail.com">Contact Me</a>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<h2>
|
||||
Soon to come:
|
||||
</h2>
|
||||
|
||||
<ul>
|
||||
<li>Specific channel Emotes</li>
|
||||
<li>Search for Emote Panel</li>
|
||||
<li>Autocomplete for emote Selection</li>
|
||||
<li>Theater Mode Fix for that quality Stream and Chat time</li>
|
||||
<li>Moderation Options Popup</li>
|
||||
<li>User Profile Info Popup</li>
|
||||
<li>Other Styling Options</li>
|
||||
</ul>
|
||||
|
||||
<hr>
|
||||
|
||||
<h2>How To:</h2>
|
||||
|
||||
<p>
|
||||
There is still a lot of stuff I am working on. This is very Beta at the moment so
|
||||
</p>
|
||||
<h2>Use At Your Own Risk</h2>
|
||||
<p>
|
||||
This is a Chrome Extension for Youtube Live Streams, adding some Quality of Life improvements for the Chat.
|
||||
Adds Top, Trending and Global (500ish) Emotes from popular sites. These Update with what is Trending.
|
||||
</p>
|
||||
<p>
|
||||
Don't forget to pin this extension for easy access.
|
||||
</p>
|
||||
<img src="../assets/gif/pinYourExtension.gif" alt="pinYourExtension.gif">
|
||||
<p>
|
||||
Youtube Live is slow to load its pages currently.
|
||||
Give the extension a moment while the page's iframes are loading.
|
||||
Once you see the Emote Panel Icon you can open the Emote Selection Panel.
|
||||
</p>
|
||||
<img src="../assets/gif/emotesMenu.gif" alt="pinYourExtension.gif">
|
||||
<p>
|
||||
Over around 500 Top and Trending Emotes are loaded from popular sites.
|
||||
You can Enable/Disable them in the Options Menu.
|
||||
</p>
|
||||
<img src="../assets/gif/optionsMenu.gif" alt="pinYourExtension.gif">
|
||||
<p>
|
||||
Can Also Click on UserNames To Autofill an @ Notification
|
||||
</p>
|
||||
<img src="../assets/gif/clickUserNamesToAtThem.gif" alt="pinYourExtension.gif">
|
||||
|
||||
<h2>Use At Your Own Risk</h2>
|
||||
|
||||
<h1>Enjoy!</h1>
|
||||
</div>
|
||||
|
||||
<script src="../welcomePage.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
29
package-lock.json
generated
29
package-lock.json
generated
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "LiveChat",
|
||||
"version": "1.0.2",
|
||||
"name": "WompChat",
|
||||
"version": "1.0.4",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
@@ -674,14 +674,6 @@
|
||||
"integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
|
||||
"dev": true
|
||||
},
|
||||
"axios": {
|
||||
"version": "0.19.2",
|
||||
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
|
||||
"integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
|
||||
"requires": {
|
||||
"follow-redirects": "1.5.10"
|
||||
}
|
||||
},
|
||||
"babel-code-frame": {
|
||||
"version": "6.26.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
|
||||
@@ -1398,15 +1390,11 @@
|
||||
"resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
|
||||
"integrity": "sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk="
|
||||
},
|
||||
"date-fns": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz",
|
||||
"integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw=="
|
||||
},
|
||||
"debug": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
|
||||
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ms": "2.0.0"
|
||||
}
|
||||
@@ -1883,14 +1871,6 @@
|
||||
"readable-stream": "^2.3.6"
|
||||
}
|
||||
},
|
||||
"follow-redirects": {
|
||||
"version": "1.5.10",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
|
||||
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
|
||||
"requires": {
|
||||
"debug": "=3.1.0"
|
||||
}
|
||||
},
|
||||
"for-in": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
|
||||
@@ -2681,7 +2661,8 @@
|
||||
"ms": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
|
||||
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
|
||||
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
|
||||
"dev": true
|
||||
},
|
||||
"nanomatch": {
|
||||
"version": "1.2.13",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "LiveChat",
|
||||
"version": "1.0.2",
|
||||
"name": "WompChat",
|
||||
"version": "1.0.5",
|
||||
"description": "Enhances the YouTube Live Streaming experience with Emotes, Custom Styling and quality of life improvements.",
|
||||
"scripts": {
|
||||
"start": "webpack --progress --watch",
|
||||
@@ -14,8 +14,6 @@
|
||||
"url": "git://github.com/wompmacho/live-chat.git"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.0",
|
||||
"date-fns": "^1.29.0",
|
||||
"lodash": "^4.17.15",
|
||||
"preact": "^8.2.7",
|
||||
"uglifyjs-webpack-plugin": "^1.3.0"
|
||||
|
||||
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 281 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.6 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 59 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 61 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 97 KiB |
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 41 KiB |
BIN
src/assets/icons/logo128.png
Normal file
BIN
src/assets/icons/logo128.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
1
src/assets/icons/logo_icon.svg
Normal file
1
src/assets/icons/logo_icon.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 59 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 607 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 608 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 533 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 533 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 573 KiB |
@@ -29,9 +29,9 @@ const ensure = () => {
|
||||
return true;
|
||||
};
|
||||
|
||||
chrome.tabs.create({ url: './html/welcome.html' });
|
||||
chrome.tabs.create({ url: 'html/welcome.html' });
|
||||
chrome.runtime.onMessage.addListener(onSetupComplete);
|
||||
console.log('Setup Complete');
|
||||
console.log('Storage Setup Complete, Linking User To Welcome Page.');
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
@@ -1,7 +1,5 @@
|
||||
import PersistentSyncStorage from 'src/helpers/PersistentSyncStorage';
|
||||
|
||||
import Setup from './Setup';
|
||||
|
||||
import CONFIG from 'src/config';
|
||||
|
||||
class Main {
|
||||
|
||||
50
src/chat_overlay.js
Normal file
50
src/chat_overlay.js
Normal file
@@ -0,0 +1,50 @@
|
||||
import './stylus/content.styl';
|
||||
import './stylus/chat_overlay.styl';
|
||||
|
||||
|
||||
const message_container = document.getElementById("message_container");
|
||||
|
||||
chrome.runtime.onMessage.addListener(
|
||||
function(request, sender, sendResponse) {
|
||||
|
||||
if(sender.origin == "https://www.youtube.com"){
|
||||
|
||||
if (request.message == "preloadMessages"){
|
||||
message_container.prepend(convertToHTMLElm(request.node));
|
||||
message_container.scrollIntoView({block: 'end'});
|
||||
}
|
||||
|
||||
if (request.message == "newMessage"){
|
||||
message_container.append(convertToHTMLElm(request.node));
|
||||
message_container.scrollIntoView({block: 'end'});
|
||||
}
|
||||
|
||||
if (request.message == "removeMessage"){
|
||||
destroyMessage(convertToHTMLElm(request.node));
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
function convertToHTMLElm(node){
|
||||
|
||||
//var node = new DOMParser().parseFromString(node, 'text/html').documentElement;
|
||||
var temp = document.createElement('div');
|
||||
temp.innerHTML = node;
|
||||
node = temp.firstChild;
|
||||
|
||||
return node;
|
||||
}
|
||||
|
||||
function destroyMessage(node){
|
||||
|
||||
const messageId = node.getAttribute('message-id');
|
||||
|
||||
console.log(messageId);
|
||||
console.log(message);
|
||||
|
||||
const message = document.querySelectorAll(`[message-id=${messageId}]`);
|
||||
if(message != undefined){
|
||||
message.destroy();
|
||||
}
|
||||
}
|
||||
@@ -1,4 +1,3 @@
|
||||
|
||||
const CONFIG = {
|
||||
defaultOptions: {
|
||||
|
||||
@@ -6,9 +5,9 @@ const CONFIG = {
|
||||
enableBTTVEmotes: true,
|
||||
enableFrankerEmotes: true,
|
||||
enableTwitchEmotes: true,
|
||||
kappaFix: true,
|
||||
|
||||
// Chat Options
|
||||
kappaFix: true,
|
||||
theaterModeFix: false,
|
||||
setAuthorColor: false,
|
||||
showTimeStamp: false,
|
||||
@@ -16,9 +15,12 @@ const CONFIG = {
|
||||
hideAuthorIcons: false,
|
||||
hideWelcomBanner: false,
|
||||
setTwitchColors: false,
|
||||
textSizeSlider: 'inherit',
|
||||
setLiveChat: true,
|
||||
allowTextSlider: false,
|
||||
setGreenScreen: false,
|
||||
|
||||
// Var
|
||||
textSizeSlider: 'inherit',
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -29,7 +29,7 @@ class ChatScroller {
|
||||
}
|
||||
|
||||
scroll() {
|
||||
this.scroller.scrollTop = 9999;
|
||||
this.scroller.scrollTo(0, 9999);
|
||||
}
|
||||
|
||||
getScroller() {
|
||||
|
||||
@@ -2,8 +2,6 @@ import Emotes from './Emotes';
|
||||
import Message from './Message';
|
||||
import PersistentSyncStorage from 'src/helpers/PersistentSyncStorage';
|
||||
|
||||
|
||||
|
||||
class ChatWatcher {
|
||||
|
||||
constructor() {
|
||||
@@ -14,7 +12,6 @@ class ChatWatcher {
|
||||
}
|
||||
|
||||
init() {
|
||||
|
||||
return new Promise((res, rej) => {
|
||||
this.getChatContainer().then(Emotes.init).then(() => {
|
||||
this.addEmotePopup();
|
||||
@@ -44,6 +41,10 @@ class ChatWatcher {
|
||||
const node = messages[i];
|
||||
if(this.isMessageNode(node)) {
|
||||
const message = new Message(node);
|
||||
|
||||
// chrome.runtime.sendMessage({message: "preloadMessages", node: node.outerHTML}, function(response) {
|
||||
// // dont need to do anything
|
||||
// });
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -54,8 +55,6 @@ class ChatWatcher {
|
||||
|
||||
mutations.forEach(mutation => {
|
||||
|
||||
|
||||
|
||||
const { addedNodes, removedNodes } = mutation;
|
||||
|
||||
// Added nodes
|
||||
@@ -64,6 +63,11 @@ class ChatWatcher {
|
||||
const node = addedNodes[i];
|
||||
if(this.isMessageNode(node)) {
|
||||
this.onNewMessage(node);
|
||||
|
||||
// send message
|
||||
// chrome.runtime.sendMessage({message: "newMessage", node: node.outerHTML}, function(response) {
|
||||
// // dont need to do anything
|
||||
// });
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -186,8 +190,6 @@ class ChatWatcher {
|
||||
emoteAppend(keysITer);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// add div to doc
|
||||
chatButtonSelectionList.appendChild(popUpDiv);
|
||||
|
||||
@@ -197,6 +199,14 @@ class ChatWatcher {
|
||||
console.log('emote popup button clicked');
|
||||
});
|
||||
|
||||
// escape for popup div
|
||||
document.onkeydown = function(evt) {
|
||||
if (evt.key === "Escape" && !popUpDiv.classList.contains('hideElement')) {
|
||||
popUpDiv.classList.toggle('hideElement');
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
// get input area
|
||||
var inputArea = document.querySelector('#input.yt-live-chat-text-input-field-renderer');
|
||||
var inputAreaLabel = document.querySelector('#label.yt-live-chat-text-input-field-renderer');
|
||||
@@ -218,6 +228,7 @@ class ChatWatcher {
|
||||
}
|
||||
|
||||
console.log((keysITer.length+1) + " Emotes Added");
|
||||
|
||||
}// end addEmotePopup
|
||||
|
||||
///////////////////////////////////////////////////////////////////
|
||||
|
||||
@@ -69,24 +69,29 @@ class Emotes {
|
||||
// loadEmote is where we collect an object array of emotes from bttv api
|
||||
async loadBTTVEmote(){
|
||||
|
||||
// top 100 emotes query = ?limit=100&offset=100
|
||||
const bttv_top_api_url = "https://api.betterttv.net/3/emotes/shared/top?limit=100";
|
||||
const bttv_top_api_response = await fetch(bttv_top_api_url);
|
||||
var top_Json = await bttv_top_api_response.json();
|
||||
try {
|
||||
// top 100 emotes query = ?limit=100&offset=100
|
||||
const bttv_top_api_url = "https://api.betterttv.net/3/emotes/shared/top?limit=100";
|
||||
const bttv_top_api_response = await fetch(bttv_top_api_url);
|
||||
var top_Json = await bttv_top_api_response.json();
|
||||
|
||||
// tredning emotes
|
||||
const bttv_trending_api_url = "https://api.betterttv.net/3/emotes/shared/trending?limit=100";
|
||||
const bttv_trending_api_response = await fetch(bttv_trending_api_url);
|
||||
var trending_Json = await bttv_trending_api_response.json();
|
||||
// tredning emotes
|
||||
const bttv_trending_api_url = "https://api.betterttv.net/3/emotes/shared/trending?limit=100";
|
||||
const bttv_trending_api_response = await fetch(bttv_trending_api_url);
|
||||
var trending_Json = await bttv_trending_api_response.json();
|
||||
|
||||
// global emotes are weird, stored in seperate cache and do not give all the normal attributes
|
||||
const bttv_global_api_url = "https://api.betterttv.net/3/cached/emotes/global";
|
||||
const bttv_global_api_response = await fetch(bttv_global_api_url);
|
||||
var global_Json = await bttv_global_api_response.json();
|
||||
// global emotes are weird, stored in seperate cache and do not give all the normal attributes
|
||||
const bttv_global_api_url = "https://api.betterttv.net/3/cached/emotes/global";
|
||||
const bttv_global_api_response = await fetch(bttv_global_api_url);
|
||||
var global_Json = await bttv_global_api_response.json();
|
||||
|
||||
this.bbtv_ToDict(top_Json);
|
||||
this.bbtv_ToDict(trending_Json);
|
||||
this.bbtv_cached_ToDict(global_Json);
|
||||
this.bbtv_ToDict(top_Json);
|
||||
this.bbtv_ToDict(trending_Json);
|
||||
this.bbtv_cached_ToDict(global_Json);
|
||||
|
||||
} catch (error) {
|
||||
console.log('Could Not loadBTTVEmote:' + error);
|
||||
}
|
||||
}
|
||||
|
||||
////////////////////////////////////////////////////////////////
|
||||
@@ -105,6 +110,10 @@ class Emotes {
|
||||
url = urls[1];
|
||||
}
|
||||
|
||||
// fix for overlay, remove "//" at start of url
|
||||
var protocol = "https:";
|
||||
url = protocol.concat(url);
|
||||
|
||||
this.dictionary.set(name, new Emote({ code: name, url }));
|
||||
this.franker_Dictionary.set(name, new Emote({ code: name, url }));
|
||||
}
|
||||
@@ -113,17 +122,34 @@ class Emotes {
|
||||
// loadFrankerEmotes is where we collect an object array of emotes from franker api
|
||||
async loadFrankerEmotes(){
|
||||
|
||||
const franker_top_api_url = "https://api.frankerfacez.com/v1/emoticons?sort=count-desc";
|
||||
// https://api.frankerfacez.com/v1/emoticons?sort=count-desc&page=2
|
||||
|
||||
const first50Response = await fetch(franker_top_api_url);
|
||||
var first50json = await first50Response.json();
|
||||
var next50Link = first50json._links.next;
|
||||
const second50Response = await fetch(next50Link);
|
||||
var second50json = await second50Response.json();
|
||||
try {
|
||||
var page = 1;
|
||||
var franker_top_api_url = `https://api.frankerfacez.com/v1/emoticons?sort=count-desc&page=${page}`;
|
||||
|
||||
// Top 100
|
||||
this.frankerToDict(first50json);
|
||||
this.frankerToDict(second50json);
|
||||
const first50Response = await fetch(franker_top_api_url);
|
||||
var first50json = await first50Response.json();
|
||||
//var next50Link = first50json._links.next; // api change fix
|
||||
|
||||
// Top 100
|
||||
this.frankerToDict(first50json);
|
||||
} catch (error) {
|
||||
console.log('Could Not loadFrankerEmotes:' + error);
|
||||
}
|
||||
|
||||
try {
|
||||
|
||||
var page = 2;
|
||||
var next50Link = `https://api.frankerfacez.com/v1/emoticons?sort=count-desc&page=${page}`;
|
||||
|
||||
const second50Response = await fetch(next50Link);
|
||||
var second50json = await second50Response.json();
|
||||
|
||||
this.frankerToDict(second50json);
|
||||
} catch (error) {
|
||||
console.log('Could Not loadFrankerEmotes (second):' + error);
|
||||
}
|
||||
}
|
||||
|
||||
////////////////////////////////////////////////////////////////
|
||||
@@ -148,10 +174,14 @@ class Emotes {
|
||||
|
||||
// Global
|
||||
const twitch_global_api_url = "https://api.twitchemotes.com/api/v4/channels/0";
|
||||
const twitch_global_api_response = await fetch(twitch_global_api_url);
|
||||
var twitch_global_Json = await twitch_global_api_response.json();
|
||||
|
||||
this.twitchToDict(twitch_global_Json);
|
||||
try {
|
||||
const twitch_global_api_response = await fetch(twitch_global_api_url);
|
||||
var twitch_global_Json = await twitch_global_api_response.json();
|
||||
this.twitchToDict(twitch_global_Json);
|
||||
} catch (error) {
|
||||
console.log('Could Not load loadTwitchEmotes:' + error);
|
||||
}
|
||||
}
|
||||
|
||||
// ♥
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
import Emotes from './Emotes';
|
||||
import PersistentSyncStorage from 'src/helpers/PersistentSyncStorage';
|
||||
|
||||
var colorNumberIndex = 0;
|
||||
|
||||
class Message {
|
||||
constructor(messageNode) {
|
||||
this.node = messageNode;
|
||||
@@ -178,11 +176,6 @@ class Message {
|
||||
|
||||
///////////////////////////////////////////////////////////////////
|
||||
|
||||
// Set Alternate message Colors
|
||||
if (PersistentSyncStorage.data.options.alternateLineColor) {
|
||||
this.alternateLineColor();
|
||||
}
|
||||
|
||||
}// end setDefaultSelections
|
||||
|
||||
setAuthorColor() {
|
||||
@@ -209,29 +202,7 @@ class Message {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
///////////////////////////////////////////////////////////////////
|
||||
|
||||
// changes color every line
|
||||
alternateLineColor(){
|
||||
|
||||
if(colorNumberIndex % 2 == 0){
|
||||
this.node.classList.add("set-background-color-one");
|
||||
}
|
||||
if(colorNumberIndex % 2 !== 0){
|
||||
this.node.classList.add("set-background-color-two");
|
||||
}
|
||||
colorNumberIndex++;
|
||||
}
|
||||
|
||||
///////////////////////////////////////////////////////////////////
|
||||
|
||||
// removes color attr
|
||||
removelternateLineColor(){
|
||||
this.node.classList.remove("set-background-color-one");
|
||||
this.node.classList.remove("set-background-color-two");
|
||||
}
|
||||
|
||||
}// end Message
|
||||
|
||||
export default Message;
|
||||
@@ -17,7 +17,6 @@ document.body.appendChild(theater_wrapper);
|
||||
var alreadyTheater = false;
|
||||
|
||||
// ---
|
||||
|
||||
class Main {
|
||||
constructor() {
|
||||
this.chatWatcher = null;
|
||||
@@ -26,14 +25,6 @@ class Main {
|
||||
this.onRouteChange = this.onRouteChange.bind(this);
|
||||
this.load();
|
||||
|
||||
|
||||
// button class - ytp-size-button ytp-button
|
||||
// right player controls - ytp-right-controls
|
||||
// player div id - ytd-player
|
||||
// chatframe id - chatframe
|
||||
// movieframe id - movie_player_fix
|
||||
// dono ticker id - ticker
|
||||
// player-theater-container
|
||||
}
|
||||
|
||||
load() {
|
||||
@@ -58,6 +49,11 @@ class Main {
|
||||
|
||||
setDefaults() {
|
||||
|
||||
// Set Hide Welcome Banner
|
||||
if (PersistentSyncStorage.data.options.alternateLineColor) {
|
||||
document.querySelector('#items.style-scope.yt-live-chat-item-list-renderer').classList.add('alternateLineColor');
|
||||
}
|
||||
|
||||
///////////////////////////////////////////////////////////////////
|
||||
|
||||
// Welcome Banner
|
||||
@@ -78,6 +74,14 @@ class Main {
|
||||
}
|
||||
|
||||
///////////////////////////////////////////////////////////////////
|
||||
|
||||
//Live Chat Default Option
|
||||
if (PersistentSyncStorage.data.options.setGreenScreen) {
|
||||
var chat = document.querySelector('yt-live-chat-item-list-renderer');
|
||||
chat.classList.add('green_sceen');
|
||||
} else {
|
||||
// do nothing, let user pick option if not set as default in options menu
|
||||
}
|
||||
}
|
||||
|
||||
init() {
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
|
||||
|
||||
/* Open new tab if tab is not already open, otherwise focus that tab */
|
||||
export default url => {
|
||||
const matchUrl = url.replace(/^(https|http)/i, '*');
|
||||
@@ -11,10 +10,4 @@ export default url => {
|
||||
chrome.tabs.create({ url });
|
||||
}
|
||||
});
|
||||
|
||||
// for(let i = 0, tab; tab = tabs[i]; i++) {
|
||||
// if(tab.url && tab.url === url) {
|
||||
// return;
|
||||
// }
|
||||
// }
|
||||
};
|
||||
|
||||
14
src/html/chat_overlay.html
Normal file
14
src/html/chat_overlay.html
Normal file
@@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Chat Overlay</title>
|
||||
<link rel="stylesheet" href="./youtube.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="message_container"></div>
|
||||
<script src="../chat_overlay.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,31 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
font-family: sans-serif;
|
||||
padding: 10px;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.hideDiv {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<meta charset="UTF-8">
|
||||
<title>Options</title>
|
||||
<title>WompChat Options</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<span style="display:inline-block;vertical-align: middle; margin-right: 2%;">
|
||||
<img src="../assets/icons/icon128.png" alt="🔴" style="height: 2.5em;">
|
||||
</span>
|
||||
<span style="display:inline-block;vertical-align: middle;">
|
||||
<h1>Live Chat Options</h1>
|
||||
</span>
|
||||
<span class="">
|
||||
<div class="container">
|
||||
<img src="../assets/icons/logo128.png" alt="🔴">
|
||||
<h1>WompChat Options</h1>
|
||||
<button class="info_button" id="infoButton" >Info</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
@@ -56,7 +42,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hr"></div>
|
||||
<hr>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
@@ -67,8 +53,7 @@
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="hr"></div>
|
||||
<hr>
|
||||
|
||||
<div class="section">
|
||||
<h2 class="options-heading">Chat Options</h2>
|
||||
@@ -130,13 +115,18 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options-table">
|
||||
<div class="option-row">
|
||||
<div class="option-cell"><label for="setGreenScreen">Green Screen Chat</label></div>
|
||||
<div class="option-cell"><input disabled type="checkbox" id="setGreenScreen" class="option-input"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="hr"></div>
|
||||
<h2 class="options-heading">Font Size</h2>
|
||||
<span>
|
||||
<hr>
|
||||
|
||||
</span>
|
||||
<h2 class="options-heading">Font Size</h2>
|
||||
|
||||
<span>
|
||||
<div class="options-table">
|
||||
@@ -153,10 +143,12 @@
|
||||
</div>
|
||||
</div>
|
||||
</span>
|
||||
|
||||
<hr>
|
||||
|
||||
<!-- <button class="chat_overlay" id="chat_overlay" >Chat Overlay</button> -->
|
||||
|
||||
<div id="save-status"> </div>
|
||||
|
||||
<div class="omega"></div>
|
||||
|
||||
</div>
|
||||
|
||||
<script src="../options.js"></script>
|
||||
|
||||
@@ -5,92 +5,9 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Welcome Page</title>
|
||||
<meta http-equiv="refresh" content="0; URL='https://wompmacho.com/wompchat'" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="success-overlay">
|
||||
|
||||
<div class="icon-container">
|
||||
<i class="material-icons">done</i>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="logo">
|
||||
<img src="../assets/icons/icon512.png" alt="Live Chat Logo">
|
||||
</div>
|
||||
|
||||
<h1><span class="fw-light">Welcome to the </span><span class="fw-bold">Chat</span></h1>
|
||||
|
||||
<p class="heading-note">This is still very beta</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="links_div">
|
||||
<a class="links_bottom" href="https://discord.gg/pVNnTDA" title="Join our Discord Community">Join our Discord Community</a>
|
||||
<a class="links_bottom" href="https://streamelements.com/wompmacho-5882/tip" title="Donations">Donations</a>
|
||||
<a class="links_bottom" href="https://www.youtube.com/wompmacho" title="Youtube">Youtube</a>
|
||||
<a class="links_bottom" href="mailto:wompmacho@gmail.com">Contact Me</a>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<h2>
|
||||
Soon to come:
|
||||
</h2>
|
||||
|
||||
<ul>
|
||||
<li>Specific channel Emotes</li>
|
||||
<li>Search for Emote Panel</li>
|
||||
<li>Autocomplete for emote Selection</li>
|
||||
<li><s>Theater Mode Fix for that quality Stream and Chat time</s></li>
|
||||
<li>Moderation Options</li>
|
||||
<li>User Profile Info</li>
|
||||
<li>Other Styling Options</li>
|
||||
</ul>
|
||||
|
||||
<hr>
|
||||
|
||||
<h2>How To:</h2>
|
||||
|
||||
<p>
|
||||
There is still a lot of stuff I am working on. This is very Beta at the moment so
|
||||
</p>
|
||||
<h2>Use At Your Own Risk</h2>
|
||||
<p>
|
||||
This is a Chrome Extension for Youtube Live Streams, adding some Quality of Life improvements for the Chat.
|
||||
Adds Top, Trending and Global (500ish) Emotes from popular sites. These Update with what is Trending.
|
||||
</p>
|
||||
<p>
|
||||
Don't forget to pin this extension for easy access.
|
||||
</p>
|
||||
<img src="../assets/gif/pinYourExtension.gif" alt="pinYourExtension.gif">
|
||||
<p>
|
||||
Youtube Live is slow to load its pages currently.
|
||||
Give the extension a moment while the page's iframes are loading.
|
||||
Once you see the Emote Panel Icon you can open the Emote Selection Panel.
|
||||
</p>
|
||||
<img src="../assets/gif/emotesMenu.gif" alt="emotesMenu.gif">
|
||||
<p>
|
||||
Enhanced Theater Mode Is Now Available. Just click the check in the option panel and refresh your page.
|
||||
</p>
|
||||
<img style="height: 540px; width: 960px;" src="../assets/gif/theaterMode.gif" alt="theaterMode.gif">
|
||||
<p>
|
||||
Over around 500 Top and Trending Emotes are loaded from popular sites.
|
||||
You can Enable/Disable them in the Options Menu.
|
||||
</p>
|
||||
<img src="../assets/gif/optionsMenu.gif" alt="optionsMenu.gif">
|
||||
<p>
|
||||
Can Also Click on UserNames To Autofill an @ Notification
|
||||
</p>
|
||||
<img src="../assets/gif/clickUserNamesToAtThem.gif" alt="clickUserNamesToAtThem.gif">
|
||||
|
||||
<h2>Use At Your Own Risk</h2>
|
||||
|
||||
<h1>Enjoy!</h1>
|
||||
</div>
|
||||
|
||||
<script src="../welcomePage.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
59488
src/html/youtube.css
Normal file
59488
src/html/youtube.css
Normal file
File diff suppressed because it is too large
Load Diff
@@ -1,13 +1,11 @@
|
||||
{
|
||||
"manifest_version": 2,
|
||||
|
||||
"name": "🔴 LIVE CHAT",
|
||||
"version": "1.0.2",
|
||||
"name": "WompChat",
|
||||
"version": "1.0.4",
|
||||
"description": "Enhances the YouTube Live Streaming experience with Emotes, Custom Styling and quality of life improvements.",
|
||||
"icons": {
|
||||
"48": "assets/icons/icon48.png",
|
||||
"128": "assets/icons/icon128.png",
|
||||
"512": "assets/icons/icon512.png"
|
||||
"128": "assets/icons/logo128.png"
|
||||
},
|
||||
|
||||
"permissions": [
|
||||
|
||||
@@ -1,11 +1,8 @@
|
||||
|
||||
import './stylus/options.styl';
|
||||
import dateFormat from 'date-fns/format';
|
||||
import { debounce } from 'lodash';
|
||||
import PersistentSyncStorage from './helpers/PersistentSyncStorage';
|
||||
|
||||
|
||||
|
||||
// hides element after short timeout
|
||||
const hideDebounce = debounce(ele => {
|
||||
ele.classList.remove('show');
|
||||
@@ -30,7 +27,6 @@ const SaveStatusEle = document.getElementById('save-status');
|
||||
SaveStatusEle.classList.add('show');
|
||||
};
|
||||
|
||||
|
||||
///////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
var textSizeSlider = document.getElementById("textSizeSlider");
|
||||
@@ -51,7 +47,6 @@ allowTextSlider.oninput = function(){
|
||||
|
||||
};
|
||||
|
||||
|
||||
const optionOnChange = (input) => {
|
||||
|
||||
var inputValueKey;
|
||||
@@ -108,7 +103,6 @@ const optionOnChange = (input) => {
|
||||
return onChange;
|
||||
};
|
||||
|
||||
|
||||
// Executed code
|
||||
const OptionInputs = document.querySelectorAll('.option-input');
|
||||
|
||||
@@ -118,30 +112,70 @@ PersistentSyncStorage.on('ready', () => {
|
||||
const inputOnChange = optionOnChange(input);
|
||||
input.addEventListener('change', inputOnChange);
|
||||
|
||||
|
||||
switch (input.id) {
|
||||
case 'enableBTTVEmotes':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'enableFrankerEmotes':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'enableTwitchEmotes':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'kappaFix':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'theaterModeFix':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'setAuthorColor':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'showTimeStamp':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'alternateLineColor' :
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'hideAuthorIcons' :
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'hideWelcomBanner' :
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'setTwitchColors' :
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'setLiveChat' :
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'allowTextSlider':
|
||||
input.removeAttribute('disabled');
|
||||
|
||||
|
||||
if(PersistentSyncStorage.data.options.allowTextSlider == true){
|
||||
textSizeSlider.disabled = false;
|
||||
}else{
|
||||
}else if(PersistentSyncStorage.data.options.allowTextSlider == false){
|
||||
textSizeSlider.disabled = true;
|
||||
}
|
||||
break;
|
||||
|
||||
case 'theaterModeFix':
|
||||
// do nothing, stay disabled
|
||||
case 'setGreenScreen':
|
||||
input.removeAttribute('disabled');
|
||||
break;
|
||||
|
||||
case 'textSizeSlider' :
|
||||
// do nothing
|
||||
break;
|
||||
|
||||
default:
|
||||
input.removeAttribute('disabled');
|
||||
// shouldn't get hete if handled
|
||||
break;
|
||||
}
|
||||
});
|
||||
@@ -149,7 +183,10 @@ PersistentSyncStorage.on('ready', () => {
|
||||
|
||||
var infoButton = document.getElementById('infoButton');
|
||||
infoButton.addEventListener('click', function(){
|
||||
chrome.tabs.create({ url: './html/welcome.html' });
|
||||
chrome.tabs.create({ url: 'https://wompmacho.com/wompchat' });
|
||||
});
|
||||
|
||||
|
||||
// var chat_overlay = document.getElementById('chat_overlay');
|
||||
// chat_overlay.addEventListener('click', function(){
|
||||
// chrome.tabs.create({ url: 'html/chat_overlay.html' });
|
||||
// });
|
||||
@@ -70,4 +70,3 @@ colors = {
|
||||
for id, col in colors
|
||||
.chat-color-{id} #content #author-name
|
||||
color: col !important
|
||||
|
||||
|
||||
40
src/stylus/chat_overlay.styl
Normal file
40
src/stylus/chat_overlay.styl
Normal file
@@ -0,0 +1,40 @@
|
||||
html
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
background-color:#00ff00 !important
|
||||
|
||||
::-webkit-scrollbar
|
||||
width: 0px;
|
||||
background: transparent;
|
||||
|
||||
::-webkit-scrollbar-thumb
|
||||
background: #FF0000;
|
||||
|
||||
yt-live-chat-text-message-renderer
|
||||
font-family: Impact, Charcoal, sans-serif !important
|
||||
background-color: transparent !important
|
||||
#timestamp
|
||||
font-size: 1.5em !important
|
||||
vertical-align: middle !important
|
||||
color: white !important
|
||||
font-weight: 700 !important
|
||||
img
|
||||
vertical-align: middle !important
|
||||
height: 2em !important;
|
||||
width: auto !important;
|
||||
#author-name
|
||||
font-size: 1.5em !important
|
||||
vertical-align: middle !important
|
||||
color: white !important
|
||||
font-weight: 700 !important
|
||||
#message
|
||||
font-size: 2em !important
|
||||
color: white !important
|
||||
#Emote
|
||||
vertical-align: middle
|
||||
|
||||
|
||||
|
||||
.message_container
|
||||
overflow-y: scroll !important;
|
||||
scroll-behavior: smooth
|
||||
@@ -12,8 +12,6 @@
|
||||
//display: initial;
|
||||
//border-radius: inherit;
|
||||
|
||||
|
||||
|
||||
// Owner chat messages
|
||||
.yt-live-chat-item-list-renderer[author-type="owner"]
|
||||
//background: rgba(#fff, 0.1);
|
||||
@@ -26,14 +24,12 @@
|
||||
//width: 28px !important
|
||||
//height: 28px !important
|
||||
|
||||
|
||||
// Chat user name
|
||||
#author-name.yt-live-chat-text-message-renderer
|
||||
&:after
|
||||
//content: ' :'
|
||||
//color: #fff
|
||||
|
||||
|
||||
.AuthorFix
|
||||
#author-photo.yt-live-chat-text-message-renderer
|
||||
img.yt-img-shadow
|
||||
@@ -46,36 +42,33 @@
|
||||
#content
|
||||
display: inline-block
|
||||
vertical-align: middle
|
||||
#timestamp.yt-live-chat-text-message-renderer
|
||||
font-size: 1em
|
||||
display: inline-block
|
||||
vertical-align: middle
|
||||
|
||||
.showTimeStamp
|
||||
#timestamp.yt-live-chat-text-message-renderer
|
||||
display: inline-block
|
||||
vertical-align: middle
|
||||
|
||||
|
||||
.Emote
|
||||
height: 100%;
|
||||
vertical-align: bottom;
|
||||
|
||||
img
|
||||
height: 1.75em
|
||||
align-self: center
|
||||
vertical-align: sub;
|
||||
display:inline-block
|
||||
vertical-align: middle
|
||||
vertical-align: middle !important
|
||||
|
||||
emote_div:hover
|
||||
background-size: 100% //100%
|
||||
background-color: rgba(255, 255, 255, .6)
|
||||
background-color: var(--divider-color)
|
||||
|
||||
.hideElement
|
||||
display: none !important
|
||||
|
||||
.set-background-color-one
|
||||
background-color: #303030 !important
|
||||
|
||||
.set-background-color-two
|
||||
background-color: transparent !important
|
||||
.alternateLineColor
|
||||
yt-live-chat-text-message-renderer:nth-child(odd)
|
||||
background-color: rgba(255, 255, 255, 0.1) !important;
|
||||
|
||||
.setTwitchColors
|
||||
text-shadow: 0 0 1px #000, 0 0 2px #000 !important
|
||||
@@ -93,20 +86,20 @@ emote_div:hover
|
||||
background-color: transparent
|
||||
|
||||
.emoteDivider
|
||||
width: 60vw
|
||||
border: 2px solid #d3d3d3;
|
||||
width: 20vw
|
||||
border: 1px solid red;
|
||||
border-radius: 5px;
|
||||
margin-top: 2%;
|
||||
margin-bottom: 2%;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
margin-left: auto
|
||||
margin-right: auto
|
||||
|
||||
.emotePopUpText
|
||||
margin-bottom: 2%;
|
||||
|
||||
|
||||
.popup
|
||||
background-color: #202020
|
||||
background-color: var(--yt-app-background)
|
||||
color: var(--yt-live-chat-primary-text-color)
|
||||
position: absolute;
|
||||
top: 15%
|
||||
left: 0
|
||||
@@ -114,7 +107,7 @@ emote_div:hover
|
||||
margin-left: auto
|
||||
margin-right: auto
|
||||
height 70%
|
||||
width: 75%
|
||||
width: 100%
|
||||
z-index: 999
|
||||
text-align: center
|
||||
border-radius: 5px
|
||||
@@ -139,7 +132,7 @@ emote_div:hover
|
||||
cursor: pointer
|
||||
|
||||
.emoteButton:hover
|
||||
background-color:rgba(255, 255, 255, .8)
|
||||
background-color: #4e4e4e;
|
||||
|
||||
.emoteButton:focus
|
||||
outline:0
|
||||
@@ -221,3 +214,9 @@ emote_div:hover
|
||||
top: 0px !important
|
||||
border: 1px solid #4e4e4e
|
||||
|
||||
.green_sceen
|
||||
background-color: #00ff00 !important
|
||||
font-weight: 700 !important
|
||||
-webkit-text-stroke: 1px #000000
|
||||
yt-live-chat-text-message-renderer:nth-child(odd)
|
||||
background-color: #00ff00 !important
|
||||
|
||||
@@ -1,6 +1,33 @@
|
||||
body
|
||||
background-color: #1e1e1e
|
||||
color: #ffffff
|
||||
font-family: sans-serif;
|
||||
padding: 10px;
|
||||
width: 400px;
|
||||
|
||||
h1{
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.hideDiv {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.container{
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
height: 3.5em;
|
||||
}
|
||||
|
||||
img{
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
hr
|
||||
border-color: #f00;
|
||||
margin: auto;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
|
||||
.section
|
||||
&:nth-child(1)
|
||||
@@ -26,11 +53,6 @@ table
|
||||
width: 20%
|
||||
text-align: right
|
||||
|
||||
.hr
|
||||
background-color: #d1d1d1
|
||||
height: 1px
|
||||
margin: 10px 0
|
||||
|
||||
#save-status
|
||||
text-align: center
|
||||
opacity: 0
|
||||
@@ -59,18 +81,9 @@ input[type=checkbox][disabled]
|
||||
opacity: .9
|
||||
|
||||
.info_button
|
||||
display:inline-block
|
||||
padding:0.3em 1.2em
|
||||
margin:0 0.3em 0.3em 0
|
||||
border-radius:2em
|
||||
box-sizing: border-box
|
||||
text-decoration:none
|
||||
font-weight:300
|
||||
color:#1e1e1e
|
||||
text-align:center
|
||||
margin-left: 150px
|
||||
margin-left: 135px;
|
||||
transition: all 0.2s
|
||||
|
||||
.info_button:hover
|
||||
color: red
|
||||
|
||||
|
||||
@@ -1,146 +0,0 @@
|
||||
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,700|Material+Icons")
|
||||
|
||||
body
|
||||
font-family: 'Roboto', Arial, sans-serif
|
||||
font-size: 16px
|
||||
background: #222
|
||||
color: #fff
|
||||
margin: 25px
|
||||
|
||||
font-weights = {
|
||||
light: 300,
|
||||
regular: 400,
|
||||
bold: 700
|
||||
}
|
||||
for fw, w in font-weights
|
||||
.fw-{fw}
|
||||
font-weight: w
|
||||
|
||||
.success-overlay
|
||||
visibility: hidden
|
||||
opacity: 0
|
||||
position: fixed
|
||||
top: 0
|
||||
left: 0
|
||||
z-index: 10
|
||||
background: rgba(#191919, 0.95)
|
||||
display: flex
|
||||
flex-direction: column
|
||||
align-items: center
|
||||
justify-content: center
|
||||
height: 100%
|
||||
width: 100%
|
||||
transition: visibility 0s, opacity 200ms ease
|
||||
&.show
|
||||
visibility: visible
|
||||
opacity: 1
|
||||
.material-icons
|
||||
font-size: 20em
|
||||
opacity: 0
|
||||
&.show
|
||||
opacity: 1
|
||||
animation: jackInTheBox 700ms 1
|
||||
.success-message
|
||||
font-size: 3em
|
||||
.close-message
|
||||
font-size: 0.7em
|
||||
opacity: 0.7
|
||||
|
||||
.container
|
||||
display: flex
|
||||
flex-direction: column
|
||||
align-items: center
|
||||
h1
|
||||
margin: 0
|
||||
font-size: 3em
|
||||
letter-spacing: 3px
|
||||
.heading-note
|
||||
font-size: 18px
|
||||
color: #bbb
|
||||
.option
|
||||
text-align: center
|
||||
.option-note
|
||||
font-size: 12px
|
||||
font-style: italic
|
||||
color: #999
|
||||
.complete-setup-button
|
||||
background: #333
|
||||
display: flex
|
||||
justify-content: center
|
||||
align-items: center
|
||||
padding: 10px
|
||||
cursor: pointer
|
||||
text-transform: uppercase
|
||||
border-radius: 3px
|
||||
box-shadow: 0 2px 5px 0 rgba(#000, 0.7)
|
||||
transition: background 50ms ease
|
||||
&:hover
|
||||
background: #404040
|
||||
.material-icons
|
||||
margin-right: 7px
|
||||
|
||||
|
||||
.links_bottom
|
||||
display: inline-block;
|
||||
margin: 1%
|
||||
|
||||
|
||||
a
|
||||
background-color: #252526;
|
||||
color: white;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
border-collapse: collapse;
|
||||
text-align: center
|
||||
border: 1px solid #4e4e4e
|
||||
|
||||
a:hover
|
||||
background-color: #d3d3d3;
|
||||
color: black
|
||||
|
||||
|
||||
a:active
|
||||
box-shadow: none;
|
||||
top: 5px;
|
||||
|
||||
.links_div
|
||||
width: 20vw
|
||||
|
||||
p
|
||||
margin: 2%
|
||||
max-width: 30vw
|
||||
|
||||
h2
|
||||
margin: 2%
|
||||
|
||||
hr {
|
||||
margin: 2%
|
||||
width: 60vw
|
||||
border: 3px solid #d3d3d3;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// jackInTheBox from animate.css https://github.com/daneden/animate.css
|
||||
@keyframes jackInTheBox
|
||||
from
|
||||
opacity: 0
|
||||
transform: scale(0.1) rotate(60deg)
|
||||
transform-origin: center center
|
||||
|
||||
50%
|
||||
transform: rotate(-20deg)
|
||||
|
||||
70%
|
||||
opacity: 1
|
||||
transform: rotate(6deg)
|
||||
|
||||
to
|
||||
transform: scale(1)
|
||||
|
||||
@@ -1,28 +1,3 @@
|
||||
/**
|
||||
* MIT License
|
||||
*
|
||||
* Copyright (c) 2020 wompmacho
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in all
|
||||
* copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
* SOFTWARE.
|
||||
*/
|
||||
|
||||
|
||||
import Storage from './Storage';
|
||||
|
||||
class LocalStorage extends Storage {
|
||||
|
||||
@@ -1,28 +1,3 @@
|
||||
/**
|
||||
* MIT License
|
||||
*
|
||||
* Copyright (c) 2020 wompmacho
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in all
|
||||
* copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
* SOFTWARE.
|
||||
*/
|
||||
|
||||
|
||||
class Notifications {
|
||||
|
||||
create(notificationId = null, options) {
|
||||
|
||||
@@ -1,28 +1,3 @@
|
||||
/**
|
||||
* MIT License
|
||||
*
|
||||
* Copyright (c) 2020 wompmacho
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in all
|
||||
* copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
* SOFTWARE.
|
||||
*/
|
||||
|
||||
|
||||
class Storage {
|
||||
|
||||
get(keys = null) {
|
||||
|
||||
@@ -1,28 +1,3 @@
|
||||
/**
|
||||
* MIT License
|
||||
*
|
||||
* Copyright (c) 2020 wompmacho
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in all
|
||||
* copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
* SOFTWARE.
|
||||
*/
|
||||
|
||||
|
||||
import Storage from './Storage';
|
||||
|
||||
class SyncStorage extends Storage {
|
||||
|
||||
@@ -1,37 +1,7 @@
|
||||
/**
|
||||
* MIT License
|
||||
*
|
||||
* Copyright (c) 2020 wompmacho
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to deal
|
||||
* in the Software without restriction, including without limitation the rights
|
||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
* copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in all
|
||||
* copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
* SOFTWARE.
|
||||
*/
|
||||
|
||||
import _LocalStorage from './LocalStorage';
|
||||
import _SyncStorage from './SyncStorage';
|
||||
import _Notifications from './Notifications';
|
||||
|
||||
// export default {
|
||||
// LocalStorage: new _LocalStorage,
|
||||
// SyncStorage: new _SyncStorage,
|
||||
// Notifications: new _Notifications
|
||||
// }
|
||||
|
||||
export const LocalStorage = new _LocalStorage;
|
||||
export const SyncStorage = new _SyncStorage;
|
||||
export const Notifications = new _Notifications;
|
||||
@@ -1,48 +1,10 @@
|
||||
|
||||
import './stylus/setupPage.styl';
|
||||
import PersistentSyncStorage from './helpers/PersistentSyncStorage';
|
||||
|
||||
|
||||
// THIS IS A JS PAGE FOR SETUP.HTML
|
||||
|
||||
|
||||
// --- Definitions ---
|
||||
const completeButton = document.querySelector('.complete-setup-button');
|
||||
const successOverlay = document.querySelector('.success-overlay');
|
||||
const successIcon = successOverlay.querySelector('.material-icons');
|
||||
const successCloseMessageCountdown = successOverlay.querySelector('.countdown');
|
||||
|
||||
const setupComplete = () => {
|
||||
|
||||
// successOverlay.classList.add('show');
|
||||
|
||||
// setTimeout(() => {
|
||||
// successIcon.classList.add('show');
|
||||
// }, 100);
|
||||
|
||||
|
||||
//////////////////////////////////// Neat if I ever want to close a window
|
||||
// let closeCountdown = 5; // seconds
|
||||
// const closeTimeout = () => {
|
||||
// successCloseMessageCountdown.innerHTML = closeCountdown;
|
||||
// setTimeout(() => {
|
||||
// if(closeCountdown > 1) {
|
||||
// closeCountdown -= 1;
|
||||
// closeTimeout();
|
||||
// } else {
|
||||
// chrome.tabs.getCurrent((tab) => {
|
||||
// chrome.tabs.remove(tab.id);
|
||||
// });
|
||||
// }
|
||||
// }, 1000);
|
||||
// }
|
||||
|
||||
// successCloseMessageCountdown.innerHTML = closeCountdown;
|
||||
// closeTimeout();
|
||||
};
|
||||
|
||||
// --- Main ---
|
||||
|
||||
const main = () => {
|
||||
|
||||
PersistentSyncStorage.on('ready', () => {
|
||||
@@ -58,14 +20,8 @@ const main = () => {
|
||||
}, setupComplete);
|
||||
|
||||
console.log('Competed setup, sent message');
|
||||
|
||||
});
|
||||
|
||||
|
||||
};
|
||||
|
||||
// --- Executed ---
|
||||
|
||||
main();
|
||||
|
||||
|
||||
|
||||
@@ -23,7 +23,8 @@ module.exports = {
|
||||
content: './content/',
|
||||
background: './background/',
|
||||
options: './options.js',
|
||||
welcomePage: './welcomePage.js'
|
||||
welcomePage: './welcomePage.js',
|
||||
chat_overlay: './chat_overlay.js'
|
||||
|
||||
},
|
||||
output: {
|
||||
|
||||
@@ -24,7 +24,8 @@ module.exports = {
|
||||
content: './content/',
|
||||
background: './background/',
|
||||
options: './options.js',
|
||||
welcomePage: './welcomePage.js'
|
||||
welcomePage: './welcomePage.js',
|
||||
chat_overlay: './chat_overlay.js'
|
||||
},
|
||||
output: {
|
||||
path: distPath,
|
||||
|
||||
Reference in New Issue
Block a user