refactor an lots of changes
This commit is contained in:
Khyretos
parent
7e733233ab
commit
039a16711f
29 changed files with 1802 additions and 1627 deletions
27
package-lock.json
generated
27
package-lock.json
generated
|
|
@ -1,12 +1,12 @@
|
||||||
{
|
{
|
||||||
"name": "loquendo-bot",
|
"name": "loquendo-bot",
|
||||||
"version": "2.0.0",
|
"version": "2.1.0",
|
||||||
"lockfileVersion": 3,
|
"lockfileVersion": 3,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "loquendo-bot",
|
"name": "loquendo-bot",
|
||||||
"version": "2.0.0",
|
"version": "2.1.0",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"axios": "^1.4.0",
|
"axios": "^1.4.0",
|
||||||
|
|
@ -15,6 +15,7 @@
|
||||||
"franc": "^6.1.0",
|
"franc": "^6.1.0",
|
||||||
"i18next-electron-language-detector": "^0.0.10",
|
"i18next-electron-language-detector": "^0.0.10",
|
||||||
"ini": "^2.0.0",
|
"ini": "^2.0.0",
|
||||||
|
"kill-port": "^2.0.1",
|
||||||
"langdetect": "^0.2.1",
|
"langdetect": "^0.2.1",
|
||||||
"node-google-tts-api": "^1.1.1",
|
"node-google-tts-api": "^1.1.1",
|
||||||
"querystring": "^0.2.1",
|
"querystring": "^0.2.1",
|
||||||
|
|
@ -3331,6 +3332,11 @@
|
||||||
"url": "https://github.com/sponsors/sindresorhus"
|
"url": "https://github.com/sponsors/sindresorhus"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/get-them-args": {
|
||||||
|
"version": "1.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/get-them-args/-/get-them-args-1.3.2.tgz",
|
||||||
|
"integrity": "sha512-LRn8Jlk+DwZE4GTlDbT3Hikd1wSHgLMme/+7ddlqKd7ldwR6LjJgTVWzBnR01wnYGe4KgrXjg287RaI22UHmAw=="
|
||||||
|
},
|
||||||
"node_modules/getpass": {
|
"node_modules/getpass": {
|
||||||
"version": "0.1.7",
|
"version": "0.1.7",
|
||||||
"resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
|
"resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
|
||||||
|
|
@ -4013,6 +4019,18 @@
|
||||||
"json-buffer": "3.0.1"
|
"json-buffer": "3.0.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/kill-port": {
|
||||||
|
"version": "2.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/kill-port/-/kill-port-2.0.1.tgz",
|
||||||
|
"integrity": "sha512-e0SVOV5jFo0mx8r7bS29maVWp17qGqLBZ5ricNSajON6//kmb7qqqNnml4twNE8Dtj97UQD+gNFOaipS/q1zzQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"get-them-args": "1.3.2",
|
||||||
|
"shell-exec": "1.0.2"
|
||||||
|
},
|
||||||
|
"bin": {
|
||||||
|
"kill-port": "cli.js"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/kuler": {
|
"node_modules/kuler": {
|
||||||
"version": "2.0.0",
|
"version": "2.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/kuler/-/kuler-2.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/kuler/-/kuler-2.0.0.tgz",
|
||||||
|
|
@ -5899,6 +5917,11 @@
|
||||||
"node": ">=8"
|
"node": ">=8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/shell-exec": {
|
||||||
|
"version": "1.0.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/shell-exec/-/shell-exec-1.0.2.tgz",
|
||||||
|
"integrity": "sha512-jyVd+kU2X+mWKMmGhx4fpWbPsjvD53k9ivqetutVW/BQ+WIZoDoP4d8vUMGezV6saZsiNoW2f9GIhg9Dondohg=="
|
||||||
|
},
|
||||||
"node_modules/side-channel": {
|
"node_modules/side-channel": {
|
||||||
"version": "1.0.4",
|
"version": "1.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
|
||||||
|
|
|
||||||
|
|
@ -23,6 +23,7 @@
|
||||||
"franc": "^6.1.0",
|
"franc": "^6.1.0",
|
||||||
"i18next-electron-language-detector": "^0.0.10",
|
"i18next-electron-language-detector": "^0.0.10",
|
||||||
"ini": "^2.0.0",
|
"ini": "^2.0.0",
|
||||||
|
"kill-port": "^2.0.1",
|
||||||
"langdetect": "^0.2.1",
|
"langdetect": "^0.2.1",
|
||||||
"node-google-tts-api": "^1.1.1",
|
"node-google-tts-api": "^1.1.1",
|
||||||
"querystring": "^0.2.1",
|
"querystring": "^0.2.1",
|
||||||
|
|
|
||||||
|
|
@ -369,7 +369,7 @@ select {
|
||||||
.AdvancedMenu {
|
.AdvancedMenu {
|
||||||
border: 1px var(--main-color2) solid;
|
border: 1px var(--main-color2) solid;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
width: 300px;
|
min-width: 555px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
|
|
@ -377,6 +377,8 @@ select {
|
||||||
.legendStyle {
|
.legendStyle {
|
||||||
margin-left: 1em;
|
margin-left: 1em;
|
||||||
padding: 0.2em 0.8em;
|
padding: 0.2em 0.8em;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.AdvancedMenuRow {
|
.AdvancedMenuRow {
|
||||||
|
|
|
||||||
|
|
@ -14,15 +14,15 @@ td {
|
||||||
}
|
}
|
||||||
|
|
||||||
.info {
|
.info {
|
||||||
background-color: lightblue;
|
background-color: lightblue !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.warn {
|
.warn {
|
||||||
background-color: yellow;
|
background-color: #f39c12 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.error {
|
.error {
|
||||||
background-color: lightcoral;
|
background-color: #e74c3c !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
#logTable {
|
#logTable {
|
||||||
|
|
|
||||||
|
|
@ -28,6 +28,7 @@
|
||||||
|
|
||||||
.OptionPanel.show {
|
.OptionPanel.show {
|
||||||
display: block;
|
display: block;
|
||||||
|
overflow: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menu {
|
.menu {
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
/*generated with Input range slider CSS style generator (version 20211225)
|
/*generated with Input range slider CSS style generator (version 20211225)
|
||||||
https://toughengineer.github.io/demo/slider-styler*/
|
https://toughengineer.github.io/demo/slider-styler*/
|
||||||
input[type=range].styled-slider {
|
input[type='range'].styled-slider {
|
||||||
/* height: 500px; */
|
/* height: 500px; */
|
||||||
background: transparent;
|
background: transparent;
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
|
|
@ -8,43 +8,43 @@ input[type=range].styled-slider {
|
||||||
}
|
}
|
||||||
|
|
||||||
/*progress support*/
|
/*progress support*/
|
||||||
input[type=range].styled-slider.slider-progress1 {
|
input[type='range'].styled-slider.slider-progress1 {
|
||||||
--range: calc(var(--max) - var(--min));
|
|
||||||
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
|
||||||
--sx: calc(0.5* 2em + var(--ratio) * (100% - 2em));
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress2 {
|
|
||||||
--range: calc(var(--max) - var(--min));
|
--range: calc(var(--max) - var(--min));
|
||||||
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
||||||
--sx: calc(0.5 * 2em + var(--ratio) * (100% - 2em));
|
--sx: calc(0.5 * 2em + var(--ratio) * (100% - 2em));
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress3 {
|
input[type='range'].styled-slider.slider-progress2 {
|
||||||
--range: calc(var(--max) - var(--min));
|
--range: calc(var(--max) - var(--min));
|
||||||
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
||||||
--sx: calc(0.5 * 2em + var(--ratio) * (100% - 2em));
|
--sx: calc(0.5 * 2em + var(--ratio) * (100% - 2em));
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress4 {
|
input[type='range'].styled-slider.slider-progress3 {
|
||||||
|
--range: calc(var(--max) - var(--min));
|
||||||
|
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
||||||
|
--sx: calc(0.5 * 2em + var(--ratio) * (100% - 2em));
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type='range'].styled-slider.slider-progress4 {
|
||||||
--range: calc(var(--max) - var(--min));
|
--range: calc(var(--max) - var(--min));
|
||||||
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
--ratio: calc((var(--tiempotemporal) - var(--min)) / var(--range));
|
||||||
--sx: calc(0.5 * 2em + var(--ratio) * (100% - 2em));
|
--sx: calc(0.5 * 2em + var(--ratio) * (100% - 2em));
|
||||||
}
|
}
|
||||||
|
|
||||||
/*webkit*/
|
/*webkit*/
|
||||||
input[type=range].styled-slider::-webkit-slider-thumb {
|
input[type='range'].styled-slider::-webkit-slider-thumb {
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
width: 2em;
|
width: 2em;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
background: #FFFFFF;
|
background: #ffffff;
|
||||||
border: none;
|
border: none;
|
||||||
box-shadow: 0 0 2px black;
|
box-shadow: 0 0 2px black;
|
||||||
margin-top: calc(2em * 0.5 - 2em * 0.5);
|
margin-top: calc(2em * 0.5 - 2em * 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider::-webkit-slider-runnable-track {
|
input[type='range'].styled-slider::-webkit-slider-runnable-track {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
|
|
@ -52,37 +52,33 @@ input[type=range].styled-slider::-webkit-slider-runnable-track {
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress1::-webkit-slider-runnable-track {
|
input[type='range'].styled-slider.slider-progress1::-webkit-slider-runnable-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #1a1a1a;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #1a1a1a;
|
||||||
;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress2::-webkit-slider-runnable-track {
|
input[type='range'].styled-slider.slider-progress2::-webkit-slider-runnable-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #1a1a1a;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #1a1a1a;
|
||||||
;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress3::-webkit-slider-runnable-track {
|
input[type='range'].styled-slider.slider-progress3::-webkit-slider-runnable-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #1a1a1a;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #1a1a1a;
|
||||||
;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress4::-webkit-slider-runnable-track {
|
input[type='range'].styled-slider.slider-progress4::-webkit-slider-runnable-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #1a1a1a;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #1a1a1a;
|
||||||
;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/*mozilla*/
|
/*mozilla*/
|
||||||
input[type=range].styled-slider::-moz-range-thumb {
|
input[type='range'].styled-slider::-moz-range-thumb {
|
||||||
width: 2em;
|
width: 2em;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
background: #FFFFFF;
|
background: #ffffff;
|
||||||
border: none;
|
border: none;
|
||||||
box-shadow: 0 0 2px black;
|
box-shadow: 0 0 2px black;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider::-moz-range-track {
|
input[type='range'].styled-slider::-moz-range-track {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
|
|
@ -90,45 +86,45 @@ input[type=range].styled-slider::-moz-range-track {
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress1::-moz-range-track {
|
input[type='range'].styled-slider.slider-progress1::-moz-range-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #464646;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #464646;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress2::-moz-range-track {
|
input[type='range'].styled-slider.slider-progress2::-moz-range-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #464646;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #464646;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress3::-moz-range-track {
|
input[type='range'].styled-slider.slider-progress3::-moz-range-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #464646;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #464646;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress4::-moz-range-track {
|
input[type='range'].styled-slider.slider-progress4::-moz-range-track {
|
||||||
background: linear-gradient(#7b2cbf, #7b2cbf) 0/var(--sx) 100% no-repeat, #464646;
|
background: linear-gradient(#7b2cbf, #7b2cbf) 0 / var(--sx) 100% no-repeat, #464646;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*ms*/
|
/*ms*/
|
||||||
input[type=range].styled-slider::-ms-fill-upper {
|
input[type='range'].styled-slider::-ms-fill-upper {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider::-ms-fill-lower {
|
input[type='range'].styled-slider::-ms-fill-lower {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider::-ms-thumb {
|
input[type='range'].styled-slider::-ms-thumb {
|
||||||
width: 2em;
|
width: 2em;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
background: #FFFFFF;
|
background: #ffffff;
|
||||||
border: none;
|
border: none;
|
||||||
box-shadow: 0 0 2px black;
|
box-shadow: 0 0 2px black;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider::-ms-track {
|
input[type='range'].styled-slider::-ms-track {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
background: #1a1a1a;
|
background: #1a1a1a;
|
||||||
|
|
@ -137,7 +133,7 @@ input[type=range].styled-slider::-ms-track {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress1::-ms-fill-lower {
|
input[type='range'].styled-slider.slider-progress1::-ms-fill-lower {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 1em 0 0 1em;
|
border-radius: 1em 0 0 1em;
|
||||||
margin: -undefined 0 -undefined -undefined;
|
margin: -undefined 0 -undefined -undefined;
|
||||||
|
|
@ -146,7 +142,7 @@ input[type=range].styled-slider.slider-progress1::-ms-fill-lower {
|
||||||
border-right-width: 0;
|
border-right-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress2::-ms-fill-lower {
|
input[type='range'].styled-slider.slider-progress2::-ms-fill-lower {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 1em 0 0 1em;
|
border-radius: 1em 0 0 1em;
|
||||||
margin: -undefined 0 -undefined -undefined;
|
margin: -undefined 0 -undefined -undefined;
|
||||||
|
|
@ -155,7 +151,7 @@ input[type=range].styled-slider.slider-progress2::-ms-fill-lower {
|
||||||
border-right-width: 0;
|
border-right-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress3::-ms-fill-lower {
|
input[type='range'].styled-slider.slider-progress3::-ms-fill-lower {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 1em 0 0 1em;
|
border-radius: 1em 0 0 1em;
|
||||||
margin: -undefined 0 -undefined -undefined;
|
margin: -undefined 0 -undefined -undefined;
|
||||||
|
|
@ -164,7 +160,7 @@ input[type=range].styled-slider.slider-progress3::-ms-fill-lower {
|
||||||
border-right-width: 0;
|
border-right-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=range].styled-slider.slider-progress4::-ms-fill-lower {
|
input[type='range'].styled-slider.slider-progress4::-ms-fill-lower {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 1em 0 0 1em;
|
border-radius: 1em 0 0 1em;
|
||||||
margin: -undefined 0 -undefined -undefined;
|
margin: -undefined 0 -undefined -undefined;
|
||||||
|
|
@ -175,10 +171,9 @@ input[type=range].styled-slider.slider-progress4::-ms-fill-lower {
|
||||||
|
|
||||||
.inputBox {
|
.inputBox {
|
||||||
border: none;
|
border: none;
|
||||||
width: 50px;
|
width: 38px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 14pt;
|
font-size: 14pt;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin-left: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
@ -73,7 +73,7 @@ section {
|
||||||
.scale {
|
.scale {
|
||||||
height: 2em;
|
height: 2em;
|
||||||
width: 2em;
|
width: 2em;
|
||||||
vertical-align: bottom
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tab {
|
.tab {
|
||||||
|
|
@ -83,15 +83,14 @@ section {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
input:checked+label {
|
input:checked + label {
|
||||||
border-top-color: #FFB03D;
|
border-top-color: #ffb03d;
|
||||||
border-right-color: #DDD;
|
border-right-color: #ddd;
|
||||||
border-left-color: #DDD;
|
border-left-color: #ddd;
|
||||||
border-bottom-color: transparent;
|
border-bottom-color: transparent;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* --------------------------------- */
|
/* --------------------------------- */
|
||||||
|
|
||||||
.radius {
|
.radius {
|
||||||
|
|
@ -129,13 +128,13 @@ input:checked+label {
|
||||||
|
|
||||||
.tabx-bar .tabx::before {
|
.tabx-bar .tabx::before {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
content: "";
|
content: '';
|
||||||
width: 26%;
|
width: 26%;
|
||||||
height: 13%;
|
height: 13%;
|
||||||
border-top-left-radius: 200px;
|
border-top-left-radius: 200px;
|
||||||
border-top-right-radius: 200px;
|
border-top-right-radius: 200px;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
background-color: #607D8B;
|
background-color: #607d8b;
|
||||||
/* bottom: -8px; */
|
/* bottom: -8px; */
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: all 0.3s ease-in-out;
|
transition: all 0.3s ease-in-out;
|
||||||
|
|
@ -153,7 +152,8 @@ input:checked+label {
|
||||||
bottom: 0px;
|
bottom: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tabx-bar .tabx::after {}
|
.tabx-bar .tabx::after {
|
||||||
|
}
|
||||||
|
|
||||||
.tabx-bar .tabx:hover {
|
.tabx-bar .tabx:hover {
|
||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
|
|
@ -192,7 +192,7 @@ input:checked+label {
|
||||||
}
|
}
|
||||||
|
|
||||||
select {
|
select {
|
||||||
font-size: .9rem;
|
font-size: 0.9rem;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
background-color: var(--main-color3);
|
background-color: var(--main-color3);
|
||||||
|
|
@ -258,7 +258,7 @@ select {
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type="password"] {
|
input[type='password'] {
|
||||||
background: var(--main-color3);
|
background: var(--main-color3);
|
||||||
border: none;
|
border: none;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
|
@ -272,7 +272,19 @@ input[type="password"] {
|
||||||
/* To make space for the reveal button */
|
/* To make space for the reveal button */
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type="lol"] {
|
input[type='url'] {
|
||||||
|
background: var(--main-color3);
|
||||||
|
border: none;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 40px;
|
||||||
|
width: 260px;
|
||||||
|
outline: none;
|
||||||
|
color: var(--main-color2);
|
||||||
|
font-size: 10pt;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type='lol'] {
|
||||||
background: var(--main-color3);
|
background: var(--main-color3);
|
||||||
border: none;
|
border: none;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
|
@ -292,7 +304,7 @@ input[type="lol"] {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
left: 450px;
|
left: 425px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Hide the default appearance of the button */
|
/* Hide the default appearance of the button */
|
||||||
|
|
@ -331,20 +343,20 @@ input[type="lol"] {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Apply different colors based on the toast type */
|
/* Apply different colors based on the toast type */
|
||||||
.toast.info {
|
.info {
|
||||||
background-color: #3498db;
|
background-color: lightblue !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toast.success {
|
.success {
|
||||||
background-color: #2ecc71;
|
background-color: #2ecc71 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toast.warning {
|
.warning {
|
||||||
background-color: #f39c12;
|
background-color: #f39c12 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.toast.error {
|
.error {
|
||||||
background-color: #e74c3c;
|
background-color: #e74c3c !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* CSS animation for the toast appearance */
|
/* CSS animation for the toast appearance */
|
||||||
|
|
@ -413,19 +425,30 @@ input[type="lol"] {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
} */
|
} */
|
||||||
|
|
||||||
input[type=text]:disabled {
|
div[type='text']:disabled {
|
||||||
background: #dddddd;
|
background: #4b4b4b;
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type2=text]:disabled {
|
input[type='text']:disabled {
|
||||||
background: #dddddd;
|
background: #4b4b4b;
|
||||||
}
|
}
|
||||||
|
|
||||||
button[type=text]:disabled {
|
button[type='text']:disabled {
|
||||||
background: #dddddd;
|
background: #4b4b4b;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type2='text']:disabled {
|
||||||
|
background: #4b4b4b;
|
||||||
}
|
}
|
||||||
|
|
||||||
div:disabled {
|
div:disabled {
|
||||||
background: #dddddd;
|
background: #4b4b4b;
|
||||||
|
filter: brightness(200%);
|
||||||
|
}
|
||||||
|
|
||||||
|
div:disabled {
|
||||||
|
background: #4b4b4b;
|
||||||
filter: brightness(200%);
|
filter: brightness(200%);
|
||||||
}
|
}
|
||||||
|
|
@ -22,9 +22,10 @@
|
||||||
|
|
||||||
#volume-icon {
|
#volume-icon {
|
||||||
color: var(--main-color2);
|
color: var(--main-color2);
|
||||||
width: 50px;
|
scale: 0.75;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
align-self: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#image {
|
#image {
|
||||||
|
|
|
||||||
|
|
@ -67,11 +67,14 @@
|
||||||
box-shadow: 0 0 0 3px rgba(255, 255, 255, 1);
|
box-shadow: 0 0 0 3px rgba(255, 255, 255, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
.volume-icon-container {
|
.option-icon-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
/* justify-content: center; */
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
/* width: 78px; */
|
||||||
|
/* float: right; */
|
||||||
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.brush-icon-container {
|
.brush-icon-container {
|
||||||
|
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 136 KiB After Width: | Height: | Size: 79 KiB |
3
src/images/note.svg
Normal file
3
src/images/note.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||||
|
<svg width="24px" height="24px" viewBox="0 0 1024 1024" class="icon" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M703.90625 865.90625l-39.9375-15.65625 148.6875-380.0625c6.84375-17.53125-2.4375-37.3125-20.34375-43.125l-260.0625-84.9375c-16.6875-5.4375-34.6875 3.1875-40.875 19.59375L361.8125 704.46875l-61.40625-23.15625 181.875-481.125c6.09375-16.21875 23.8125-24.84375 40.40625-19.78125l389.0625 120.1875c18.1875 5.625 27.84375 25.5 20.90625 43.3125l-199.125 509.0625c-4.6875 11.71875-17.90625 17.53125-29.625 12.9375z" fill="#360682" /><path d="M241.0625 658.15625m-129.375 0a129.375 129.375 0 1 0 258.75 0 129.375 129.375 0 1 0-258.75 0Z" fill="#360682" /><path d="M614.375 802.90625m-129.375 0a129.375 129.375 0 1 0 258.75 0 129.375 129.375 0 1 0-258.75 0Z" fill="#360682" /><path d="M246.53333333 379.36666667L142.43333333 118.66666667c-6.8-16.9 2.4-36 19.8-41.3l107.9-32.9c14.4-4.4 29.7 2.5 36 16.2l13.2 28.8c7.5 16.3-0.9 35.4-17.9 41l-73.7 24.3c-6.9 2.3-10.5 9.9-7.8 16.6L290.33333333 350.96666667c2.1 5.4-0.5 11.4-5.9 13.6l-37.9 14.8z" fill="#E51C5A" /><path d="M211.53333333 379.36666667m-84.8 0a84.8 84.8 0 1 0 169.6 0 84.8 84.8 0 1 0-169.6 0Z" fill="#E51C5A" /></svg>
|
||||||
|
After Width: | Height: | Size: 1.3 KiB |
48
src/images/stt.svg
Normal file
48
src/images/stt.svg
Normal file
|
|
@ -0,0 +1,48 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
|
||||||
|
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||||
|
<svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
|
||||||
|
<style>.cls-1{fill:#4285f4;}.cls-2{fill:none;}.cls-3{fill:#669df6;}</style>
|
||||||
|
|
||||||
|
</defs>
|
||||||
|
|
||||||
|
<title>Icon_24px_SpeechtoText_Color</title>
|
||||||
|
|
||||||
|
<g data-name="Product Icons">
|
||||||
|
|
||||||
|
<g data-name="colored-32/speech">
|
||||||
|
|
||||||
|
<rect class="cls-1" x="11" y="2" width="2" height="20"/>
|
||||||
|
|
||||||
|
<rect class="cls-2" width="24" height="24"/>
|
||||||
|
|
||||||
|
<g >
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-2" data-name="Rectangle-path" class="cls-1" x="7" y="8" width="2" height="8"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-3" data-name="Rectangle-path" class="cls-1" x="15" y="8" width="2" height="8"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-4" data-name="Rectangle-path" class="cls-1" x="3" y="5" width="2" height="14"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-5" data-name="Rectangle-path" class="cls-1" x="19" y="5" width="2" height="14"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-6" data-name="Rectangle-path" class="cls-3" x="11" y="2" width="2" height="10"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-7" data-name="Rectangle-path" class="cls-3" x="7" y="8" width="2" height="4"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-8" data-name="Rectangle-path" class="cls-3" x="15" y="8" width="2" height="4"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-9" data-name="Rectangle-path" class="cls-3" x="3" y="5" width="2" height="7"/>
|
||||||
|
|
||||||
|
<rect id="Rectangle-path-10" data-name="Rectangle-path" class="cls-3" x="19" y="5" width="2" height="7"/>
|
||||||
|
|
||||||
|
</g>
|
||||||
|
|
||||||
|
</g>
|
||||||
|
|
||||||
|
</g>
|
||||||
|
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.5 KiB |
28
src/images/theme.svg
Normal file
28
src/images/theme.svg
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||||
|
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||||
|
<svg height="24px" width="24px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
viewBox="0 0 512 512" xml:space="preserve">
|
||||||
|
<path style="fill:#FFC033;" d="M491.09,328.459c-10.239-17.809-28.826-27.937-51.199-27.937c-28.737,0-47.726-21.359-48.085-44.522
|
||||||
|
c-0.111-9.906,3.228-20.035,10.685-28.828c8.459-10.017,20.815-15.694,33.837-15.694c24.598,0,44.522-10.351,54.872-28.271
|
||||||
|
c9.796-17.03,9.685-38.4-0.333-55.652C445.122,48.863,360.307,0,269.373,0C146.938,0,41.421,86.15,18.381,204.911
|
||||||
|
c-3.338,17.03-5.009,34.059-4.896,51.089v0.668c0.223,58.991,20.48,116.313,58.435,162.282C120.671,478.052,192.685,512,269.374,512
|
||||||
|
c91.157,0,176.085-49.085,221.717-128C500.997,366.859,500.997,345.6,491.09,328.459z M292.745,104.181
|
||||||
|
c13.803-23.93,44.3-32.278,68.452-18.365c23.93,13.803,32.167,44.412,18.365,68.452c-13.803,23.819-44.412,32.167-68.452,18.254
|
||||||
|
C287.18,158.72,278.945,128.223,292.745,104.181z"/>
|
||||||
|
<path style="fill:#F9A926;" d="M71.919,418.95C120.67,478.052,192.684,512,269.373,512c91.157,0,176.085-49.085,221.717-128
|
||||||
|
c9.907-17.141,9.907-38.4,0-55.541c-10.239-17.809-28.826-27.937-51.199-27.937c-28.737,0-47.726-21.359-48.085-44.522H13.483v0.668
|
||||||
|
C13.707,315.659,33.963,372.981,71.919,418.95z"/>
|
||||||
|
<path style="fill:#88CC2A;" d="M124.677,306.087c-27.619,0-50.087-22.468-50.087-50.087s22.468-50.087,50.087-50.087
|
||||||
|
s50.087,22.468,50.087,50.087S152.296,306.087,124.677,306.087z"/>
|
||||||
|
<path style="fill:#736056;" d="M171.981,420.609c-23.923-13.802-32.21-44.397-18.326-68.424
|
||||||
|
c13.695-23.726,44.21-32.294,68.413-18.321c23.922,13.801,32.21,44.392,18.326,68.419
|
||||||
|
C226.622,426.154,196.056,434.511,171.981,420.609z"/>
|
||||||
|
<path style="fill:#37AFCC;" d="M323.198,431.18c-26.712-7.156-42.599-34.587-35.424-61.342c7.175-26.741,34.59-42.578,61.336-35.413
|
||||||
|
c12.924,3.456,23.728,11.745,30.413,23.326l0,0c6.696,11.587,8.478,25.087,5.011,38.016
|
||||||
|
C377.349,422.55,349.888,438.339,323.198,431.18z"/>
|
||||||
|
<path style="fill:#E6563A;" d="M153.655,159.81c-13.855-23.966-5.651-54.579,18.326-68.424
|
||||||
|
c24.013-13.841,54.599-5.613,68.413,18.332l0,0c13.877,24.016,5.607,54.605-18.326,68.424
|
||||||
|
C197.941,192.057,167.398,183.631,153.655,159.81z"/>
|
||||||
|
<path style="fill:#7FB335;" d="M124.677,306.087c27.619,0,50.087-22.468,50.087-50.087H74.59
|
||||||
|
C74.59,283.619,97.057,306.087,124.677,306.087z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.4 KiB |
26
src/images/tts.svg
Normal file
26
src/images/tts.svg
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
|
||||||
|
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||||
|
<svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
|
||||||
|
<style>.cls-1{fill:#669df6;}.cls-2{fill:#4285f4;}</style>
|
||||||
|
|
||||||
|
</defs>
|
||||||
|
|
||||||
|
<title>Icon_24px_TexttoSpeech_Color</title>
|
||||||
|
|
||||||
|
<g data-name="Product Icons">
|
||||||
|
|
||||||
|
<rect class="cls-1" x="2.01" y="6.99" width="6.64" height="1.67"/>
|
||||||
|
|
||||||
|
<polygon class="cls-1" points="11.17 15.32 2 15.32 2 16.99 2 16.99 11.17 16.99 11.17 15.32"/>
|
||||||
|
|
||||||
|
<polygon class="cls-1" points="4.51 11.16 2 11.16 2 12.82 6.18 12.82 12 12.82 10.33 11.16 4.51 11.16"/>
|
||||||
|
|
||||||
|
<path class="cls-2" d="M12,9.07a.42.42,0,0,1,.42-.36.41.41,0,0,1,.41.36v9.18a2.09,2.09,0,0,0,2.61,2A2.16,2.16,0,0,0,17,18.14V5.75a.4.4,0,0,1,.19-.4.41.41,0,0,1,.45,0,.4.4,0,0,1,.19.4v9.16a2.07,2.07,0,0,0,.81,1.64,2,2,0,0,0,1.8.37A2.16,2.16,0,0,0,22,14.8V12H20.33v2.92a.4.4,0,0,1-.19.4.41.41,0,0,1-.45,0,.4.4,0,0,1-.19-.4V5.75a2.09,2.09,0,0,0-2.61-2,2.16,2.16,0,0,0-1.56,2.13V18.25a.4.4,0,0,1-.19.4.41.41,0,0,1-.45,0,.4.4,0,0,1-.19-.4V9.08a2.07,2.07,0,0,0-4.11-.36,2.4,2.4,0,0,0-.05.46v2L12,12.82V9.07Z"/>
|
||||||
|
|
||||||
|
</g>
|
||||||
|
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
693
src/index.html
693
src/index.html
|
|
@ -1,47 +1,44 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>LoquendoBot</title>
|
<title>LoquendoBot</title>
|
||||||
|
|
||||||
<!--#region css styles -->
|
<!--#region css styles -->
|
||||||
<link rel="stylesheet" href="./fonts/FRAMCDN/font.css" />
|
<link rel="stylesheet" href="./fonts/FRAMCDN/font.css" />
|
||||||
<link rel="stylesheet" href="./fonts/Aven/stylesheet.css">
|
<link rel="stylesheet" href="./fonts/Aven/stylesheet.css" />
|
||||||
<link rel="stylesheet" href="./css/checkbox.css">
|
<link rel="stylesheet" href="./css/checkbox.css" />
|
||||||
<link rel="stylesheet" href="./css/chat.css">
|
<link rel="stylesheet" href="./css/chat.css" />
|
||||||
<link rel="stylesheet" href="./css/home.css">
|
<link rel="stylesheet" href="./css/home.css" />
|
||||||
<link rel="stylesheet" href="./css/menu.css">
|
<link rel="stylesheet" href="./css/menu.css" />
|
||||||
<link rel="stylesheet" href="./css/tabs.css">
|
<link rel="stylesheet" href="./css/tabs.css" />
|
||||||
<link rel="stylesheet" href="./css/tts-menu.css">
|
<link rel="stylesheet" href="./css/tts-menu.css" />
|
||||||
<link rel="stylesheet" href="./css/volume-slider.css">
|
<link rel="stylesheet" href="./css/volume-slider.css" />
|
||||||
<link rel="stylesheet" href="./css/sliders.css">
|
<link rel="stylesheet" href="./css/sliders.css" />
|
||||||
<link rel="stylesheet"
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
|
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
|
||||||
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
|
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
|
||||||
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
crossorigin="anonymous"
|
||||||
<link rel="stylesheet" href="./css/logger.css">
|
referrerpolicy="no-referrer"
|
||||||
|
/>
|
||||||
|
<link rel="stylesheet" href="./css/logger.css" />
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<!--#region title bar -->
|
<!--#region title bar -->
|
||||||
<header id="titlebar">
|
<header id="titlebar">
|
||||||
|
|
||||||
<div id="drag-region">
|
<div id="drag-region">
|
||||||
<div class="language-selector">
|
<div class="language-selector">
|
||||||
<span class="flag-icon" id="selected-flag">🇬🇧</span>
|
<span class="flag-icon" id="selected-flag">🇬🇧</span>
|
||||||
<span id="selected-language">EN</span>
|
<span id="selected-language">EN</span>
|
||||||
<div class="language-dropdown" id="languageDropdown">
|
<div class="language-dropdown" id="languageDropdown">
|
||||||
<div class="language-item" language="NL" flag="🇳🇱">🇳🇱
|
<div class="language-item" language="NL" flag="🇳🇱">🇳🇱 NL</div>
|
||||||
NL</div>
|
<div class="language-item" language="ES" flag="🇪🇸">🇪🇸 ES</div>
|
||||||
<div class="language-item" language="ES" flag="🇪🇸">🇪🇸
|
<div class="language-item" language="EN" flag="🇬🇧">🇬🇧 EN</div>
|
||||||
ES</div>
|
|
||||||
<div class="language-item" language="EN" flag="🇬🇧">🇬🇧
|
|
||||||
EN</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="window-controls">
|
<div id="window-controls">
|
||||||
|
|
@ -60,7 +57,6 @@
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
||||||
<!-- #region Notifications -->
|
<!-- #region Notifications -->
|
||||||
<div id="toasts"></div>
|
<div id="toasts"></div>
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
@ -72,22 +68,16 @@
|
||||||
<li class="item item-active" tip="Chat" id="btnChat">
|
<li class="item item-active" tip="Chat" id="btnChat">
|
||||||
<i class="fa fa-comments"></i>
|
<i class="fa fa-comments"></i>
|
||||||
</li>
|
</li>
|
||||||
<li class="item" tip="TTS Settings" id="btnTTS">
|
|
||||||
<i class="fa fa-microphone menu-icon"></i>
|
|
||||||
</li>
|
|
||||||
<li class="item" tip="Logs" id="btnLogs">
|
<li class="item" tip="Logs" id="btnLogs">
|
||||||
<i class="fa fa-clipboard menu-icon"></i>
|
<i class="fa fa-clipboard menu-icon"></i>
|
||||||
</li>
|
</li>
|
||||||
<li class="item" tip="BrowserSource ChatBubble"
|
<li class="item" tip="BrowserSource ChatBubble" id="btnBrowsersourceChat">
|
||||||
id="btnBrowsersourceChat">
|
|
||||||
<i class="fa fa-history menu-icon"></i>
|
<i class="fa fa-history menu-icon"></i>
|
||||||
</li>
|
</li>
|
||||||
<li class="item" tip="Vtuber"
|
<li class="item" tip="Vtuber" id="btnBrowsersourceVtuber">
|
||||||
id="btnBrowsersourceVtuber">
|
|
||||||
<i class="fa fa-user menu-icon"></i>
|
<i class="fa fa-user menu-icon"></i>
|
||||||
</li>
|
</li>
|
||||||
<li class="item" tip="Configuration"
|
<li class="item" tip="Configuration" id="btnConfiguration">
|
||||||
id="btnConfiguration">
|
|
||||||
<i class="fa fa-cogs menu-icon"></i>
|
<i class="fa fa-cogs menu-icon"></i>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
@ -102,74 +92,6 @@
|
||||||
|
|
||||||
<!-- #region Chat, middle section-->
|
<!-- #region Chat, middle section-->
|
||||||
<div class="mid">
|
<div class="mid">
|
||||||
|
|
||||||
<!-- #region TTS Screen-->
|
|
||||||
<div class="OptionPanel" id="TTS">
|
|
||||||
<div id="tstx">
|
|
||||||
<div>
|
|
||||||
<div id="TTSSelector">
|
|
||||||
<h3 class="LabelText">Primary TTS Voice</h3>
|
|
||||||
<div class="optionrow">
|
|
||||||
<select name="primaryVoice"
|
|
||||||
id="primaryVoice"></select>
|
|
||||||
<select name="language" class="language"
|
|
||||||
id="primaryLanguage"
|
|
||||||
tip="Primary language to detect in chat"></select>
|
|
||||||
<!-- </label> -->
|
|
||||||
</div>
|
|
||||||
<h3 class="LabelText">Secondary TTS Voice</h3>
|
|
||||||
<div class="optionrow">
|
|
||||||
<select name="secondaryVoice"
|
|
||||||
id="secondaryVoice"></select>
|
|
||||||
<select name="language" class="language"
|
|
||||||
id="secondaryLanguage"
|
|
||||||
tip="Secondary language to detect in chat"></select>
|
|
||||||
<!-- </label> -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h3 class="LabelText">TTS Volume</h3>
|
|
||||||
<div class="optionrow">
|
|
||||||
<div class="middle">
|
|
||||||
<div class="slider-container">
|
|
||||||
<!-- <span class="bar"><span class="fill"></span></span> -->
|
|
||||||
<input
|
|
||||||
id="ttsVolumeSlider"
|
|
||||||
class="styled-slider slider-progress1"
|
|
||||||
type="range" />
|
|
||||||
<!-- <input type="text" id="timetext1"
|
|
||||||
class="inputBox" /> -->
|
|
||||||
</div>
|
|
||||||
<div class="volume-icon-container">
|
|
||||||
<i class="fa fa-volume-up fa-2x"
|
|
||||||
id="volume-icon"></i>
|
|
||||||
<!-- <label class="TTSVolume Basiclabel" id="timetext1">50%</label> -->
|
|
||||||
<input type="text" id="ttsVolume"
|
|
||||||
class="inputBox" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<h3 class="LabelText">Test TTS</h3>
|
|
||||||
<div class="optionrow">
|
|
||||||
<textarea id="TTSTest">Hi, This is a test</textarea>
|
|
||||||
<div class="volume-icon-container"
|
|
||||||
tip="Test TTS">
|
|
||||||
<i
|
|
||||||
class="fa fa-play-circle fa-2x SmallButton"
|
|
||||||
id="TTSTestButton"></i>
|
|
||||||
<label class="testLabel Basiclabel"></label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<h3 class="LabelText">TTS Output Device</h3>
|
|
||||||
<div class="optionrow">
|
|
||||||
<select name="ttsAudioDevice"
|
|
||||||
id="ttsAudioDevice"></select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--#endregion -->
|
|
||||||
|
|
||||||
<!-- #region Commands Screen-->
|
<!-- #region Commands Screen-->
|
||||||
<div class="OptionPanel" id="Logs">
|
<div class="OptionPanel" id="Logs">
|
||||||
<table id="logTable">
|
<table id="logTable">
|
||||||
|
|
@ -187,335 +109,263 @@
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
||||||
<!-- #region Commands Screen-->
|
<!-- #region Commands Screen-->
|
||||||
<div class="OptionPanel" id="BrowsersourceChat">
|
<div class="OptionPanel" id="BrowsersourceChat"></div>
|
||||||
</div>
|
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
||||||
<!-- #region Commands Screen-->
|
<!-- #region Commands Screen-->
|
||||||
<div class="OptionPanel" id="BrowsersourceVtuber">
|
<div class="OptionPanel" id="BrowsersourceVtuber"></div>
|
||||||
</div>
|
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
||||||
<!-- #region Configuration Screen-->
|
<!-- #region Configuration Screen-->
|
||||||
<div class="OptionPanel" id="Configuration">
|
<div class="OptionPanel" id="Configuration">
|
||||||
<div id="tstx">
|
<div id="tstx">
|
||||||
<div>
|
<div>
|
||||||
<h3 class="LabelText">Theme</h3>
|
|
||||||
<div class="optionrow">
|
<div class="optionrow">
|
||||||
<button class="AdvancedMenuButton"
|
<button class="AdvancedMenuButton" id="ShowThemeCreator">Open Theme Creator</button>
|
||||||
id="ShowThemeCreator">Theme Creator</button>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h3 class="LabelText">Notification Sound</h3>
|
|
||||||
<div class="optionrow">
|
|
||||||
<select name="notification" id="notification"></select>
|
|
||||||
<div class="volume-icon-container">
|
|
||||||
<i
|
|
||||||
class="fa fa-play-circle fa-2x SmallButton"
|
|
||||||
id="SoundTestButton" tip="Test Sound"></i>
|
|
||||||
<label class="testLabel Basiclabel">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h3 class="LabelText">Notification Volume</h3>
|
|
||||||
<div class="optionrow">
|
|
||||||
<div class="middle">
|
|
||||||
<div class="slider-container">
|
|
||||||
<!-- <span class="bar"><span class="fill"></span></span> -->
|
|
||||||
<input
|
|
||||||
id="notificationVolumeSlider"
|
|
||||||
class="styled-slider slider-progress2"
|
|
||||||
type="range" />
|
|
||||||
</div>
|
|
||||||
<div class="volume-icon-container">
|
|
||||||
<i class="fa fa-volume-up fa-2x"
|
|
||||||
id="volume-icon"></i>
|
|
||||||
<!-- <label id="SoundVolume"
|
|
||||||
class="Basiclabel">50%</label> -->
|
|
||||||
<input type="text"
|
|
||||||
id="notificationVolume"
|
|
||||||
class="inputBox" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button class="AdvancedMenuButton"
|
|
||||||
id="ShowAdvancedMenu">Show Advanced</button>
|
|
||||||
<div id="AdvancedMenu_mask">
|
|
||||||
<div class="SaveConfig">
|
<div class="SaveConfig">
|
||||||
<div class="AdvancedMenuRow">
|
<fieldset id="NotificationMenu" class="AdvancedMenu">
|
||||||
<button class="AdvancedMenuButton"
|
<legend class="legendStyle" tip="Enable/Disable notification sounds">
|
||||||
id="HideAdvancedMenu">Close
|
<img class="AdvancedMenuIcon" src="./images/tts.svg" alt=" " />
|
||||||
Advanced Menu</button>
|
<div class="AdvancedMenuLabel">Enable TTS</div>
|
||||||
</div>
|
<input type="checkbox" id="USE_TTS" class="checkbox" />
|
||||||
<fieldset id="AdvancedMenuTwitch"
|
<label for="USE_TTS" class="toggle-small "></label>
|
||||||
class="AdvancedMenu">
|
|
||||||
<legend class="legendStyle"
|
|
||||||
tip="Enable/Disable Twitch">
|
|
||||||
<img
|
|
||||||
class="AdvancedMenuIcon"
|
|
||||||
src="./images/twitch.svg"
|
|
||||||
alt=" ">
|
|
||||||
<input type="checkbox"
|
|
||||||
id="USE_TWITCH"
|
|
||||||
class="checkbox" />
|
|
||||||
<label for="USE_TWITCH"
|
|
||||||
class="toggle-small "></label>
|
|
||||||
</legend>
|
</legend>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputTTS">
|
||||||
<div class="AdvancedMenuLabel">Channel
|
<div class="AdvancedMenuLabel">Primary TTS Voice</div>
|
||||||
Name</div><input type="text"
|
<select name="primaryVoice" id="primaryVoice"></select>
|
||||||
class="fname inputTwitch"
|
<select
|
||||||
id="TWITCH_CHANNEL_NAME">
|
name="language"
|
||||||
|
class="language"
|
||||||
|
id="primaryLanguage"
|
||||||
|
tip="Primary language to detect in chat"
|
||||||
|
></select>
|
||||||
|
</div>
|
||||||
|
<div class="AdvancedMenuRow inputTTS">
|
||||||
|
<div class="AdvancedMenuLabel">Secondary TTS Voice</div>
|
||||||
|
<select name="secondaryVoice" id="secondaryVoice"></select>
|
||||||
|
<select
|
||||||
|
name="language"
|
||||||
|
class="language"
|
||||||
|
id="secondaryLanguage"
|
||||||
|
tip="Secondary language to detect in chat"
|
||||||
|
></select>
|
||||||
|
</div>
|
||||||
|
<div class="AdvancedMenuRow inputTTS">
|
||||||
|
<div class="AdvancedMenuLabel">TTS Volume</div>
|
||||||
|
<div class="slider-container">
|
||||||
|
<input id="ttsVolumeSlider" class="styled-slider slider-progress1" type="range" />
|
||||||
|
</div>
|
||||||
|
<div class="option-icon-container">
|
||||||
|
<i class="fa fa-volume-up fa-2x" id="volume-icon"></i>
|
||||||
|
<input type="text" id="ttsVolume" class="inputBox" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="AdvancedMenuRow inputTTS">
|
||||||
|
<div class="AdvancedMenuLabel">Test TTS</div>
|
||||||
|
<textarea id="TTSTest">Hi, This is a test</textarea>
|
||||||
|
<div class="option-icon-container" tip="Test TTS">
|
||||||
|
<i class="fa fa-play-circle fa-2x SmallButton option-icon-container" id="TTSTestButton"></i>
|
||||||
|
<label class="testLabel Basiclabel"></label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="AdvancedMenuRow inputTTS">
|
||||||
|
<div class="AdvancedMenuLabel">TTS Output Device</div>
|
||||||
|
<select name="ttsAudioDevice" id="ttsAudioDevice"></select>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
<fieldset id="NotificationMenu" class="AdvancedMenu">
|
||||||
|
<legend class="legendStyle" tip="Enable/Disable notification sounds">
|
||||||
|
<img class="AdvancedMenuIcon" src="./images/note.svg" alt=" " />
|
||||||
|
<div class="AdvancedMenuLabel">Enable notification sounds</div>
|
||||||
|
<input type="checkbox" id="USE_NOTIFICATION_SOUNDS" class="checkbox" />
|
||||||
|
<label for="USE_NOTIFICATION_SOUNDS" class="toggle-small "></label>
|
||||||
|
</legend>
|
||||||
|
<div class="AdvancedMenuRow inputNotificationSound">
|
||||||
|
<div class="AdvancedMenuLabel">Notification Volume</div>
|
||||||
|
<div class="slider-container">
|
||||||
|
<input id="notificationVolumeSlider" class="styled-slider slider-progress2" type="range" />
|
||||||
|
</div>
|
||||||
|
<div class="option-icon-container">
|
||||||
|
<i class="fa fa-volume-up fa-2x" id="volume-icon"></i>
|
||||||
|
<input type="text" id="notificationVolume" class="inputBox" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="AdvancedMenuRow inputNotificationSound">
|
||||||
|
<div class="AdvancedMenuLabel">Notification Sound</div>
|
||||||
|
<select name="notification" id="notification"></select>
|
||||||
|
<div class="option-icon-container">
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-play-circle fa-2x SmallButton option-icon-container"
|
||||||
|
id="SoundTestButton"
|
||||||
|
tip="Test Sound"
|
||||||
|
></i>
|
||||||
|
<label class="testLabel Basiclabel"></label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
<fieldset id="TwitchMenu" class="AdvancedMenu">
|
||||||
|
<legend class="legendStyle" tip="Enable/Disable Twitch">
|
||||||
|
<img class="AdvancedMenuIcon" src="./images/twitch.svg" alt=" " />
|
||||||
|
|
||||||
|
<div class="AdvancedMenuLabel">Enable Twitch</div>
|
||||||
|
<input type="checkbox" id="USE_TWITCH" class="checkbox" />
|
||||||
|
<label for="USE_TWITCH" class="toggle-small "></label>
|
||||||
|
</legend>
|
||||||
|
<div class="AdvancedMenuRow inputTwitch">
|
||||||
|
<div class="AdvancedMenuLabel">Channel Name</div>
|
||||||
|
<input type="text" class="fname inputTwitch" id="TWITCH_CHANNEL_NAME" />
|
||||||
|
<i
|
||||||
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_TWITCH_CHANNEL_NAME"
|
id="Info_TWITCH_CHANNEL_NAME"
|
||||||
tip="The channel you want to connect to"></i>
|
tip="The channel you want to connect to"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputTwitch">
|
||||||
<div class="AdvancedMenuLabel">Username</div><input
|
<div class="AdvancedMenuLabel">Oauth Token</div>
|
||||||
type="text"
|
<input type="password" type2="text" class="fname inputTwitch" id="TWITCH_OAUTH_TOKEN" />
|
||||||
class="fname inputTwitch"
|
<button class="password-toggle-btn password-toggle-btn1">
|
||||||
id="TWITCH_USERNAME">
|
<span class="password-toggle-icon">👁️</span>
|
||||||
<i
|
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
|
||||||
id="Info_TWITCH_CHANNEL_NAME"
|
|
||||||
tip="The channel you want to connect to"></i>
|
|
||||||
</div>
|
|
||||||
<div class="AdvancedMenuRow">
|
|
||||||
<div class="AdvancedMenuLabel">Oauth
|
|
||||||
Token</div>
|
|
||||||
<input
|
|
||||||
type="password"
|
|
||||||
type2="text"
|
|
||||||
class="fname inputTwitch"
|
|
||||||
id="TWITCH_OAUTH_TOKEN">
|
|
||||||
<button
|
|
||||||
class="password-toggle-btn password-toggle-btn1">
|
|
||||||
<span
|
|
||||||
class="password-toggle-icon">👁️</span>
|
|
||||||
</button>
|
|
||||||
</input>
|
|
||||||
<i
|
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
|
||||||
id="Info_USERNAME"
|
|
||||||
tip="Your Twitch username"></i>
|
|
||||||
</div>
|
|
||||||
<div class="AdvancedMenuRow">
|
|
||||||
<div class="AdvancedMenuLabel">Client
|
|
||||||
ID</div><input
|
|
||||||
type="password"
|
|
||||||
type2="text"
|
|
||||||
class="fname inputTwitch"
|
|
||||||
id="TWITCH_CLIENT_ID">
|
|
||||||
<button
|
|
||||||
class="password-toggle-btn password-toggle-btn2">
|
|
||||||
<span
|
|
||||||
class="password-toggle-icon">👁️</span>
|
|
||||||
</button>
|
</button>
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_USERNAME"
|
id="Info_USERNAME"
|
||||||
tip="Your Twitch username"></i>
|
tip="Get OAuth Token"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputTwitch">
|
||||||
<div class="AdvancedMenuLabel">Client
|
<div class="AdvancedMenuLabel">Test credentials</div>
|
||||||
Secret</div><input
|
<button type="text" class="AdvancedMenuButton" id="TestTwitchCredentials">Test</button>
|
||||||
type="password"
|
|
||||||
type2="text"
|
|
||||||
class="fname inputTwitch"
|
|
||||||
id="TWITCH_CLIENT_SECRET">
|
|
||||||
<button
|
|
||||||
class="password-toggle-btn password-toggle-btn3">
|
|
||||||
<span
|
|
||||||
class="password-toggle-icon">👁️</span>
|
|
||||||
</button>
|
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_USERNAME"
|
|
||||||
tip="Your Twitch username"></i>
|
|
||||||
</div>
|
|
||||||
<div class="AdvancedMenuRow">
|
|
||||||
<div class="AdvancedMenuLabel">
|
|
||||||
Test credentials</div>
|
|
||||||
<button
|
|
||||||
class="AdvancedMenuButton"
|
|
||||||
id="TestTwitchCredentials">Test</button>
|
|
||||||
<i
|
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
|
||||||
id="Info_TWITCH_TEST_CREDENTIALS"
|
id="Info_TWITCH_TEST_CREDENTIALS"
|
||||||
tip="Test Twitch credentials"></i>
|
tip="Test Twitch credentials"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
<fieldset id="AdvancedMenuServer"
|
<fieldset id="AdvancedMenuServer" class="AdvancedMenu">
|
||||||
class="AdvancedMenu">
|
<legend class="legendStyle" tip="Enable/Disable Server">
|
||||||
<legend class="legendStyle"
|
<img class="AdvancedMenuIcon" src="./images/server.svg" alt />
|
||||||
tip="Enable/Disable Server">
|
<div class="AdvancedMenuLabel">Enable Server</div>
|
||||||
<img
|
<input type="checkbox" id="USE_SERVER" class="checkbox" />
|
||||||
class="AdvancedMenuIcon"
|
<label for="USE_SERVER" class="toggle-small "></label>
|
||||||
src="./images/server.svg"
|
|
||||||
alt>
|
|
||||||
<input type="checkbox"
|
|
||||||
id="USE_SERVER"
|
|
||||||
class="checkbox" />
|
|
||||||
<label for="USE_SERVER"
|
|
||||||
class="toggle-small "></label>
|
|
||||||
</legend>
|
</legend>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputServer">
|
||||||
<div class="AdvancedMenuLabel">Port</div>
|
<div class="AdvancedMenuLabel">Port</div>
|
||||||
<input
|
<input type="text" class="fname inputServer" id="PORT" />
|
||||||
type="text"
|
|
||||||
class="fname inputServer"
|
|
||||||
id="PORT">
|
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_PORT"
|
id="Info_PORT"
|
||||||
tip="Port to use to host additional services"></i>
|
tip="Port to use to host additional services"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputServer">
|
||||||
<div class="AdvancedMenuLabel">Use
|
<div class="AdvancedMenuLabel">Use Vtuber</div>
|
||||||
Vtuber</div>
|
<input type="checkbox" id="USE_VTUBER" class="checkbox" />
|
||||||
<input type="checkbox"
|
<label for="USE_VTUBER" class="toggle-small "></label>
|
||||||
id="USE_VTUBER"
|
<input type="url" type2="text" class="fname inputServer" id="VTUBER_URL" />
|
||||||
class="checkbox" />
|
|
||||||
<label for="USE_VTUBER"
|
|
||||||
class="toggle-small "></label>
|
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_VTUBER"
|
id="Info_VTUBER"
|
||||||
tip="You can use it as a browsersource on http://localhost:PORT/vtuber"></i>
|
tip="You can use it as a browsersource on http://localhost:PORT/vtuber"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputServer">
|
||||||
<div class="AdvancedMenuLabel">Use
|
<div class="AdvancedMenuLabel">Use ChatBubble</div>
|
||||||
ChatBubble</div>
|
<input type="checkbox" id="USE_CHATBUBBLE" class="checkbox" />
|
||||||
<input type="checkbox"
|
<label for="USE_CHATBUBBLE" class="toggle-small "></label>
|
||||||
id="USE_CHATBUBBLE"
|
<input type="url" type2="text" class="fname inputServer" id="CHATBUBBLE_URL" />
|
||||||
class="checkbox" />
|
|
||||||
<label for="USE_CHATBUBBLE"
|
|
||||||
class="toggle-small "></label>
|
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_CHATBUBBLE"
|
id="Info_CHATBUBBLE"
|
||||||
tip="You can use it as a browsersource on http://localhost:PORT/chat"></i>
|
tip="You can use it as a browsersource on http://localhost:PORT/chat"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
<fieldset id="AdvancedMenuAmazon"
|
<fieldset id="AdvancedMenuAmazon" class="AdvancedMenu">
|
||||||
class="AdvancedMenu">
|
<legend class="legendStyle" tip="Enable/Disable Amazon">
|
||||||
<legend class="legendStyle"
|
<img class="AdvancedMenuIcon" src="./images/amazon.svg" alt />
|
||||||
tip="Enable/Disable Amazon">
|
<div class="AdvancedMenuLabel">Enable Amazon TTS</div>
|
||||||
<img
|
<input type="checkbox" id="USE_AMAZON" class="checkbox" />
|
||||||
class="AdvancedMenuIcon"
|
<label for="USE_AMAZON" class="toggle-small "></label>
|
||||||
src="./images/amazon.svg"
|
|
||||||
alt>
|
|
||||||
<input type="checkbox"
|
|
||||||
id="USE_AMAZON"
|
|
||||||
class="checkbox" />
|
|
||||||
<label for="USE_AMAZON"
|
|
||||||
class="toggle-small "></label>
|
|
||||||
</legend>
|
</legend>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputAmazon">
|
||||||
<div class="AdvancedMenuLabel">
|
<div class="AdvancedMenuLabel">Access Key</div>
|
||||||
Access Key</div>
|
<input type="password" type2="text" class="fname inputAmazon" id="AMAZON_ACCESS_KEY" /><button
|
||||||
<input
|
class="password-toggle-btn password-toggle-btn4"
|
||||||
type="password"
|
>
|
||||||
type2="text"
|
<span class="password-toggle-icon">👁️</span>
|
||||||
class="fname inputAmazon"
|
|
||||||
id="AMAZON_ACCESS_KEY"><button
|
|
||||||
class="password-toggle-btn password-toggle-btn4">
|
|
||||||
<span
|
|
||||||
class="password-toggle-icon">👁️</span>
|
|
||||||
</button>
|
</button>
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_AMAZON_ACCESS_KEY"
|
id="Info_AMAZON_ACCESS_KEY"
|
||||||
tip="Amazon Access Key"></i>
|
tip="Amazon Access Key"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputAmazon">
|
||||||
<div class="AdvancedMenuLabel">
|
<div class="AdvancedMenuLabel">Access Secret</div>
|
||||||
Access Secret</div>
|
<input type="password" type2="text" class="fname inputAmazon" id="AMAZON_ACCESS_SECRET" /><button
|
||||||
<input
|
class="password-toggle-btn password-toggle-btn5"
|
||||||
type="password"
|
>
|
||||||
type2="text"
|
<span class="password-toggle-icon">👁️</span>
|
||||||
class="fname inputAmazon"
|
|
||||||
id="AMAZON_ACCESS_SECRET"><button
|
|
||||||
class="password-toggle-btn password-toggle-btn5">
|
|
||||||
<span
|
|
||||||
class="password-toggle-icon">👁️</span>
|
|
||||||
</button>
|
</button>
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_AMAZON_ACCESS_SECRET"
|
id="Info_AMAZON_ACCESS_SECRET"
|
||||||
tip="Amazon Access Secret"></i>
|
tip="Amazon Access Secret"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputAmazon">
|
||||||
<div class="AdvancedMenuLabel">
|
<div class="AdvancedMenuLabel">Test credentials</div>
|
||||||
Test credentials</div>
|
<button type="text" class="AdvancedMenuButton" id="TestAmazonCredentials">Test</button>
|
||||||
<button
|
|
||||||
class="AdvancedMenuButton"
|
|
||||||
id="TestAmazonCredentials">Test</button>
|
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_AMAZON_TEST_CREDENTIALS"
|
id="Info_AMAZON_TEST_CREDENTIALS"
|
||||||
tip="Test Amazon credentials"></i>
|
tip="Test Amazon credentials"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
<fieldset id="AdvancedMenuGoogle"
|
<fieldset id="AdvancedMenuGoogle" class="AdvancedMenu">
|
||||||
class="AdvancedMenu">
|
<legend class="legendStyle" tip="Enable/Disable Google service">
|
||||||
<legend class="legendStyle"
|
<img class="AdvancedMenuIcon" src="./images/google.svg" alt />
|
||||||
tip="Enable/Disable Google service">
|
<div class="AdvancedMenuLabel">Enable Google TTS</div>
|
||||||
<img
|
<input type="checkbox" id="USE_GOOGLE" class="checkbox" />
|
||||||
class="AdvancedMenuIcon"
|
<label for="USE_GOOGLE" class="toggle-small "></label>
|
||||||
src="./images/google.svg"
|
|
||||||
alt>
|
|
||||||
<input type="checkbox"
|
|
||||||
id="USE_GOOGLE"
|
|
||||||
class="checkbox" />
|
|
||||||
<label for="USE_GOOGLE"
|
|
||||||
class="toggle-small "></label>
|
|
||||||
</legend>
|
</legend>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputGoogle">
|
||||||
<div class="AdvancedMenuLabel">
|
<div class="AdvancedMenuLabel">API Key</div>
|
||||||
API Key</div>
|
<input type="password" type2="text" class="fname inputGoogle" id="GOOGLE_API_KEY" /><button
|
||||||
<input
|
class="password-toggle-btn password-toggle-btn6"
|
||||||
type="password"
|
>
|
||||||
type2="text"
|
<span class="password-toggle-icon">👁️</span>
|
||||||
class="fname inputGoogle"
|
|
||||||
id="GOOGLE_API_KEY"><button
|
|
||||||
class="password-toggle-btn password-toggle-btn6">
|
|
||||||
<span
|
|
||||||
class="password-toggle-icon">👁️</span>
|
|
||||||
</button>
|
</button>
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_GOOGLE_APPI_KEY"
|
id="Info_GOOGLE_APPI_KEY"
|
||||||
tip="Google API Key"></i>
|
tip="Google API Key"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow inputGoogle">
|
||||||
<div class="AdvancedMenuLabel">
|
<div class="AdvancedMenuLabel">Test credentials</div>
|
||||||
Test credentials</div>
|
<button type="text" class="AdvancedMenuButton" id="TestGoogleCredentials">Test</button>
|
||||||
<button
|
|
||||||
class="fname inputGoogle AdvancedMenuButton"
|
|
||||||
id="TestGoogleCredentials">Test</button>
|
|
||||||
<i
|
<i
|
||||||
class="fa fa-question-circle fa-2x SmallButton"
|
class="fa fa-question-circle fa-2x SmallButton option-icon-container"
|
||||||
id="Info_GOOGLE_TEST_CREDENTIALS"
|
id="Info_GOOGLE_TEST_CREDENTIALS"
|
||||||
tip="Test Google credentials"></i>
|
tip="Test Google credentials"
|
||||||
|
></i>
|
||||||
</div>
|
</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div id="ThemeCreator_mask">
|
<div id="ThemeCreator_mask">
|
||||||
<div class="SaveConfig">
|
<div class="SaveConfig">
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<button class="AdvancedMenuButton"
|
<button class="AdvancedMenuButton" id="HideThemeCreator">Close Theme Creator</button>
|
||||||
id="HideThemeCreator">Close
|
|
||||||
Theme Creator</button>
|
|
||||||
<label class="testLabel Basiclabel"></label>
|
<label class="testLabel Basiclabel"></label>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="mini-container">
|
<div id="mini-container">
|
||||||
<div id="mini-top-bar">
|
<div id="mini-top-bar"></div>
|
||||||
</div>
|
|
||||||
<div id="mini-main">
|
<div id="mini-main">
|
||||||
<div id="mini-left"></div>
|
<div id="mini-left"></div>
|
||||||
<div id="mini-mid"></div>
|
<div id="mini-mid"></div>
|
||||||
|
|
@ -524,91 +374,49 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<fieldset>
|
<fieldset>
|
||||||
<legend id="legendStyle"
|
<legend class="legendStyle" tip="Enable/Disable Custom Theme">
|
||||||
tip="Enable/Disable Custom Theme">
|
<img class="AdvancedMenuIcon" src="./images/theme.svg" alt />
|
||||||
<svg width="24" height="24"
|
<div class="AdvancedMenuLabel">Enable Custom Theme</div>
|
||||||
viewBox="0 0 24 24"><path
|
<input type="checkbox" id="USE_CUSTOM_THEME" class="checkbox" />
|
||||||
d="M4 21.832c4.587.38 2.944-4.493 7.188-4.538l1.838 1.534c.458 5.538-6.315 6.773-9.026 3.004zm14.065-7.115c1.427-2.239 5.847-9.749 5.847-9.749.352-.623-.43-1.273-.976-.813 0 0-6.572 5.714-8.511 7.525-1.532 1.432-1.539 2.086-2.035 4.447l1.68 1.4c2.227-.915 2.868-1.039 3.995-2.81zm-11.999 3.876c.666-1.134 1.748-2.977 4.447-3.262.434-2.087.607-3.3 2.547-5.112 1.373-1.282 4.938-4.409 7.021-6.229-1-2.208-4.141-4.023-8.178-3.99-6.624.055-11.956 5.465-11.903 12.092.023 2.911 1.081 5.571 2.82 7.635 1.618.429 2.376.348 3.246-1.134zm6.952-15.835c1.102-.006 2.005.881 2.016 1.983.004 1.103-.882 2.009-1.986 2.016-1.105.009-2.008-.88-2.014-1.984-.013-1.106.876-2.006 1.984-2.015zm-5.997 2.001c1.102-.01 2.008.877 2.012 1.983.012 1.106-.88 2.005-1.98 2.016-1.106.007-2.009-.881-2.016-1.988-.009-1.103.877-2.004 1.984-2.011zm-2.003 5.998c1.106-.007 2.01.882 2.016 1.985.01 1.104-.88 2.008-1.986 2.015-1.105.008-2.005-.88-2.011-1.985-.011-1.105.879-2.004 1.981-2.015zm10.031 8.532c.021 2.239-.882 3.718-1.682 4.587l-.046.044c5.255-.591 9.062-4.304 6.266-7.889-1.373 2.047-2.534 2.442-4.538 3.258z" /></svg>
|
<label for="USE_CUSTOM_THEME" class="toggle-small"></label>
|
||||||
<input type="checkbox"
|
|
||||||
id="USE_CUSTOM_THEME"
|
|
||||||
class="checkbox" />
|
|
||||||
<label for="USE_CUSTOM_THEME"
|
|
||||||
class="toggle-small">
|
|
||||||
</legend>
|
</legend>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="MAIN_COLOR_1" value="#0000ff" />
|
||||||
id="MAIN_COLOR_1"
|
<div class="AdvancedMenuLabel2">Main Color 1</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Main
|
|
||||||
Color 1</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="MAIN_COLOR_2" value="#0000ff" />
|
||||||
id="MAIN_COLOR_2"
|
<div class="AdvancedMenuLabel2">Main Color 2</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Main
|
|
||||||
Color 2</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="MAIN_COLOR_3" value="#0000ff" />
|
||||||
id="MAIN_COLOR_3"
|
<div class="AdvancedMenuLabel2">Main Color 3</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Main
|
|
||||||
Color 3</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="MAIN_COLOR_4" value="#0000ff" />
|
||||||
id="MAIN_COLOR_4"
|
<div class="AdvancedMenuLabel2">Main Color 4</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Main
|
|
||||||
Color 4</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="TOP_BAR" value="#0000ff" />
|
||||||
id="TOP_BAR"
|
<div class="AdvancedMenuLabel2">Top Bar</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Top
|
|
||||||
Bar</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="MID_SECTION" value="#0000ff" />
|
||||||
id="MID_SECTION"
|
<div class="AdvancedMenuLabel2">Mid Section</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Mid
|
|
||||||
Section</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="CHAT_BUBBLE_BG" value="#0000ff" />
|
||||||
id="CHAT_BUBBLE_BG"
|
<div class="AdvancedMenuLabel2">Chat Bubble Background</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Chat
|
|
||||||
Bubble Background</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="CHAT_BUBBLE_HEADER" value="#0000ff" />
|
||||||
id="CHAT_BUBBLE_HEADER"
|
<div class="AdvancedMenuLabel2">Chat Bubble Header</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Chat
|
|
||||||
Bubble Header</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="AdvancedMenuRow">
|
<div class="AdvancedMenuRow">
|
||||||
<input type="color"
|
<input type="color" id="CHAT_BUBBLE_MESSAGE" value="#0000ff" />
|
||||||
id="CHAT_BUBBLE_MESSAGE"
|
<div class="AdvancedMenuLabel2">Chat Bubble Message</div>
|
||||||
value="#0000ff">
|
|
||||||
<div
|
|
||||||
class="AdvancedMenuLabel2">Chat
|
|
||||||
Bubble Message</div>
|
|
||||||
</div>
|
</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -618,25 +426,19 @@
|
||||||
|
|
||||||
<!-- #region Main chat box-->
|
<!-- #region Main chat box-->
|
||||||
<div class="OptionPanel show" id="Chat">
|
<div class="OptionPanel show" id="Chat">
|
||||||
<div id="chatBox" class="message-window">
|
<div id="chatBox" class="message-window"></div>
|
||||||
</div>
|
|
||||||
<!-- User input box-->
|
<!-- User input box-->
|
||||||
<div id="userInput" class="chat-input">
|
<div id="userInput" class="chat-input">
|
||||||
|
|
||||||
<!-- User text input-->
|
<!-- User text input-->
|
||||||
<input id="textInput" class="input-box"
|
<input id="textInput" class="input-box" type="text" name="msg" placeholder="Tap 'Enter' to send a message" />
|
||||||
type="text" name="msg"
|
|
||||||
placeholder="Tap 'Enter' to send a message">
|
|
||||||
|
|
||||||
<!-- Send button-->
|
<!-- Send button-->
|
||||||
<button class="SmallButton" id="SendButton">
|
<button class="SmallButton" id="SendButton">
|
||||||
<i class="fa fa-play-circle fa-2x"
|
<i class="fa fa-play-circle fa-2x" aria-hidden="true"></i>
|
||||||
aria-hidden="true"></i>
|
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
|
||||||
|
|
@ -644,19 +446,15 @@
|
||||||
<div class="sidepanel-right">
|
<div class="sidepanel-right">
|
||||||
<div class="viewer-list">
|
<div class="viewer-list">
|
||||||
<div class="tabx-bar">
|
<div class="tabx-bar">
|
||||||
<a class="tabx" href="#"
|
<a class="tabx" href="#" data-text="Twitch">
|
||||||
data-text="Twitch">
|
<img class="tab" src="./images/twitch.svg" alt=" " />
|
||||||
<img class="tab"
|
|
||||||
src="./images/twitch.svg" alt=" ">
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<section id="content1">
|
<section id="content1">
|
||||||
<h1 class="titles">Moderators</h1>
|
<h1 class="titles">Moderators</h1>
|
||||||
<ul class="no-bullets" id="moderators">
|
<ul class="no-bullets" id="moderators"></ul>
|
||||||
</ul>
|
|
||||||
<h1 class="titles">Viewers</h1>
|
<h1 class="titles">Viewers</h1>
|
||||||
<ul class="no-bullets" id="viewers">
|
<ul class="no-bullets" id="viewers"></ul>
|
||||||
</ul>
|
|
||||||
</section>
|
</section>
|
||||||
<section id="content2">
|
<section id="content2">
|
||||||
<ul class="no-bullets">
|
<ul class="no-bullets">
|
||||||
|
|
@ -685,5 +483,4 @@
|
||||||
<!-- #region js scripts -->
|
<!-- #region js scripts -->
|
||||||
<script src="./js/renderer.js"></script>
|
<script src="./js/renderer.js"></script>
|
||||||
<!--#endregion -->
|
<!--#endregion -->
|
||||||
|
</html>
|
||||||
</html>
|
|
||||||
|
|
|
||||||
65
src/js/auth.js
Normal file
65
src/js/auth.js
Normal file
|
|
@ -0,0 +1,65 @@
|
||||||
|
console.log("kees");
|
||||||
|
// const clientId = 'YOUR_TWITCH_CLIENT_ID';
|
||||||
|
// const redirectUri = 'http://localhost:1989/auth';
|
||||||
|
// const scopes = ['chat:edit', 'chat:read'];
|
||||||
|
|
||||||
|
// const express = require('express');
|
||||||
|
// const tempAuthServer = express();
|
||||||
|
// const port = 1989;
|
||||||
|
|
||||||
|
// const { parse: parseQueryString } = require('querystring');
|
||||||
|
|
||||||
|
// tempAuthServer.use(function (req, res, next) {
|
||||||
|
// if (req.url !== "/auth") {
|
||||||
|
// let token = parseQueryString(req.query.auth)
|
||||||
|
// res.json(token["#access_token"]);
|
||||||
|
// // settings.TWITCH.OAUTH_TOKEN = token["#access_token"];
|
||||||
|
// // fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
// // settings = ini.parse(fs.readFileSync(settingsPath, 'utf-8'));
|
||||||
|
// // tempAuthServer.close();
|
||||||
|
// }
|
||||||
|
// next();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// const htmlString = `
|
||||||
|
// <!DOCTYPE html>
|
||||||
|
// <html>
|
||||||
|
// <head>
|
||||||
|
// <title>Authentication</title>
|
||||||
|
// </head>
|
||||||
|
// <body>
|
||||||
|
// <h1>Authentication successful! You can close this window now.</h1>
|
||||||
|
// <form name="auth" "action="auth" method="get" >
|
||||||
|
// <input type="text" id="auth" name="auth"/>
|
||||||
|
// <input type="submit" />
|
||||||
|
// </form>
|
||||||
|
// </body>
|
||||||
|
// </html>
|
||||||
|
// <script>
|
||||||
|
// function onSubmitComplete() {
|
||||||
|
// close();
|
||||||
|
// }
|
||||||
|
// document.querySelector("#auth").value = document.location.hash;
|
||||||
|
// document.auth.submit();
|
||||||
|
// setTimeout(onSubmitComplete, 500);
|
||||||
|
// </script>`;
|
||||||
|
|
||||||
|
// tempAuthServer.get('/auth', (req, res) => {
|
||||||
|
// // res.send(htmlString);
|
||||||
|
// });
|
||||||
|
|
||||||
|
// tempAuthServer.post('/auth', (req, res) => {
|
||||||
|
// res.render('authentication', { name: req.body.name });
|
||||||
|
// });
|
||||||
|
|
||||||
|
// tempAuthServer.listen(port, () => { });
|
||||||
|
|
||||||
|
// const authURL = `https://id.twitch.tv/oauth2/authorize?client_id=${settings.TWITCH.CLIENT_ID}&redirect_uri=${encodeURIComponent(redirectUri)}&response_type=token&scope=${scopes.join(' ')}`;
|
||||||
|
// shell.openExternal(authURL);
|
||||||
|
onsole.log('ExecPath', process.execPath);
|
||||||
|
|
||||||
|
process.on('message', (m) => {
|
||||||
|
console.log('Got message:', m);
|
||||||
|
|
||||||
|
process.send("message", "lol");
|
||||||
|
});
|
||||||
|
|
@ -117,7 +117,6 @@ displayPanel('.OptionPanel', '#Configuration', '#btnConfiguration');
|
||||||
displayPanel('.OptionPanel', '#Logs', '#btnLogs');
|
displayPanel('.OptionPanel', '#Logs', '#btnLogs');
|
||||||
displayPanel('.OptionPanel', '#BrowsersourceChat', '#btnBrowsersourceChat');
|
displayPanel('.OptionPanel', '#BrowsersourceChat', '#btnBrowsersourceChat');
|
||||||
displayPanel('.OptionPanel', '#BrowsersourceVtuber', '#btnBrowsersourceVtuber');
|
displayPanel('.OptionPanel', '#BrowsersourceVtuber', '#btnBrowsersourceVtuber');
|
||||||
displayPanel('.OptionPanel', '#TTS', '#btnTTS');
|
|
||||||
displayPanel('.OptionPanel', '#Chat', '#btnChat');
|
displayPanel('.OptionPanel', '#Chat', '#btnChat');
|
||||||
// #endregion
|
// #endregion
|
||||||
|
|
||||||
|
|
@ -142,25 +141,12 @@ const displayPanelX = (panelSelectorClass, panelSelectorID, btnSelectorID) => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
displayPanelX('.item', '#btnTTS', '#btnTTS');
|
|
||||||
displayPanelX('.item', '#btnChat', '#btnChat');
|
displayPanelX('.item', '#btnChat', '#btnChat');
|
||||||
displayPanelX('.item', '#btnBrowsersourceChat', '#btnBrowsersourceChat');
|
displayPanelX('.item', '#btnBrowsersourceChat', '#btnBrowsersourceChat');
|
||||||
displayPanelX('.item', '#btnBrowsersourceVtuber', '#btnBrowsersourceVtuber');
|
displayPanelX('.item', '#btnBrowsersourceVtuber', '#btnBrowsersourceVtuber');
|
||||||
displayPanelX('.item', '#btnLogs', '#btnLogs');
|
displayPanelX('.item', '#btnLogs', '#btnLogs');
|
||||||
displayPanelX('.item', '#btnConfiguration', '#btnConfiguration');
|
displayPanelX('.item', '#btnConfiguration', '#btnConfiguration');
|
||||||
|
|
||||||
|
|
||||||
// #region Show/Hide Advanced Menu
|
|
||||||
document.body.querySelector('#ShowAdvancedMenu').addEventListener('click', () => {
|
|
||||||
document.getElementById('AdvancedMenu_mask').style.visibility = 'visible';
|
|
||||||
});
|
|
||||||
|
|
||||||
document.body.querySelector('#HideAdvancedMenu').addEventListener('click', () => {
|
|
||||||
document.getElementById('AdvancedMenu_mask').style.visibility = 'hidden';
|
|
||||||
});
|
|
||||||
|
|
||||||
// #endregion
|
|
||||||
|
|
||||||
// #region Show/Hide Theme Creator
|
// #region Show/Hide Theme Creator
|
||||||
document.body.querySelector('#ShowThemeCreator').addEventListener('click', () => {
|
document.body.querySelector('#ShowThemeCreator').addEventListener('click', () => {
|
||||||
document.getElementById('ThemeCreator_mask').style.visibility = 'visible';
|
document.getElementById('ThemeCreator_mask').style.visibility = 'visible';
|
||||||
|
|
|
||||||
|
|
@ -24,11 +24,11 @@ const logger = createLogger({
|
||||||
format: fileFormat,
|
format: fileFormat,
|
||||||
transports: [
|
transports: [
|
||||||
new transports.File({
|
new transports.File({
|
||||||
filename: path.join(__dirname, '../logs/error.log'),
|
filename: path.join(resourcesPath, '../logs/error.log'),
|
||||||
level: 'error',
|
level: 'error',
|
||||||
}),
|
}),
|
||||||
new transports.File({
|
new transports.File({
|
||||||
filename: path.join(__dirname, '../logs/activity.log'),
|
filename: path.join(resourcesPath, '../logs/activity.log'),
|
||||||
maxsize: 5242880,
|
maxsize: 5242880,
|
||||||
maxFiles: 5,
|
maxFiles: 5,
|
||||||
}),
|
}),
|
||||||
|
|
@ -44,7 +44,7 @@ if (process.env.NODE_ENV !== 'production') {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
fetch(path.join(__dirname, '../logs/activity.log'))
|
fetch(path.join(resourcesPath, '../logs/activity.log'))
|
||||||
.then((response) => response.text())
|
.then((response) => response.text())
|
||||||
.then((logData) => {
|
.then((logData) => {
|
||||||
const logLines = logData.trim().split('\n');
|
const logLines = logData.trim().split('\n');
|
||||||
|
|
|
||||||
|
|
@ -1,14 +1,13 @@
|
||||||
|
const fs = require('fs');
|
||||||
|
const ini = require('ini');
|
||||||
const path = require('path'); // get directory path
|
const path = require('path'); // get directory path
|
||||||
const {
|
|
||||||
ipcRenderer,
|
const { ipcRenderer } = require('electron'); // necessary electron libraries to send data to the app
|
||||||
} = require('electron'); // necessary electron libraries to send data to the app
|
|
||||||
const say = require('say');
|
const say = require('say');
|
||||||
const request = require('request');
|
const request = require('request');
|
||||||
const langdetect = require('langdetect');
|
const langdetect = require('langdetect');
|
||||||
const io = require('socket.io-client');
|
const io = require('socket.io-client');
|
||||||
|
|
||||||
const fs = require('fs');
|
|
||||||
|
|
||||||
const util = require('util');
|
const util = require('util');
|
||||||
const exec = util.promisify(require('child_process').exec);
|
const exec = util.promisify(require('child_process').exec);
|
||||||
|
|
||||||
|
|
@ -17,16 +16,18 @@ const GoogleTTS = require('node-google-tts-api');
|
||||||
const tts = new GoogleTTS();
|
const tts = new GoogleTTS();
|
||||||
const { Socket } = require('socket.io-client');
|
const { Socket } = require('socket.io-client');
|
||||||
|
|
||||||
const ini = require('ini');
|
const main = ipcRenderer.sendSync('environment');
|
||||||
|
|
||||||
let envInfo = (ipcRenderer.sendSync('environment'))
|
const resourcesPath = main.resourcesPath;
|
||||||
|
const settingsPath = main.settingsPath.toString();
|
||||||
|
const settings = main.settings;
|
||||||
|
|
||||||
// TODO: remove gooogle voices txt and use api instead
|
// TODO: remove gooogle voices txt and use api instead
|
||||||
const googleVoices = fs.readFileSync(path.join(__dirname, './config/googleVoices.txt')).toString().split('\r\n');
|
const googleVoices = fs.readFileSync(path.join(resourcesPath, './config/googleVoices.txt')).toString().split('\r\n');
|
||||||
// TODO: remove amazon voices txt and use api instead (sakura project has it)
|
// TODO: remove amazon voices txt and use api instead (sakura project has it)
|
||||||
const amazonVoices = fs.readFileSync(path.join(__dirname, './config/amazonVoices.txt')).toString().split('\r\n');
|
const amazonVoices = fs.readFileSync(path.join(resourcesPath, './config/amazonVoices.txt')).toString().split('\r\n');
|
||||||
|
|
||||||
const languagesObject = fs.readFileSync(path.join(__dirname, './config/languages.txt')).toString().split('\r\n');
|
const languagesObject = fs.readFileSync(path.join(resourcesPath, './config/languages.txt')).toString().split('\r\n');
|
||||||
|
|
||||||
// html elements
|
// html elements
|
||||||
const root = document.documentElement;
|
const root = document.documentElement;
|
||||||
|
|
@ -37,46 +38,44 @@ const devicesDropdown = document.querySelector('#devicesDropdown');
|
||||||
const notificationSound = document.querySelector('#notification'); // obtain the html reference of the sound comboBox
|
const notificationSound = document.querySelector('#notification'); // obtain the html reference of the sound comboBox
|
||||||
const ttsAudioDevices = document.querySelector('#ttsAudioDevice'); // obtain the html reference of the installedTTS comboBox
|
const ttsAudioDevices = document.querySelector('#ttsAudioDevice'); // obtain the html reference of the installedTTS comboBox
|
||||||
|
|
||||||
|
|
||||||
// laod local javascript files
|
// laod local javascript files
|
||||||
const chat = require(path.join(__dirname, './js/chat'));
|
const chat = require(path.join(resourcesPath, './js/chat'));
|
||||||
|
|
||||||
const messageTemplates = require(path.join(__dirname, './js/messageTemplates'));
|
const messageTemplates = require(path.join(resourcesPath, './js/messageTemplates'));
|
||||||
const logger = require(path.join(__dirname, './js/logger'));
|
const logger = require(path.join(resourcesPath, './js/logger'));
|
||||||
const sound = require(path.join(__dirname, './js/sound'));
|
const sound = require(path.join(resourcesPath, './js/sound'));
|
||||||
const talk = require(path.join(__dirname, './js/voiceQueue')); // Voice queue system
|
const talk = require(path.join(resourcesPath, './js/voiceQueue')); // Voice queue system
|
||||||
const config = require(path.join(__dirname, './js/settings'));
|
const config = require(path.join(resourcesPath, './js/settings'));
|
||||||
|
|
||||||
let notificationSounds = undefined;
|
let notificationSounds = path.join(resourcesPath, './sounds/notifications');
|
||||||
if (envInfo.env) {
|
|
||||||
notificationSounds = path.join(envInfo.path, './sounds/notifications');
|
let twitch = require(path.join(resourcesPath, './js/twitch'));
|
||||||
} else {
|
|
||||||
notificationSounds = path.join(__dirname, './sounds/notifications');
|
function reset() {
|
||||||
|
ipcRenderer.send('restart');
|
||||||
}
|
}
|
||||||
|
|
||||||
const twitch = config.settings.TWITCH.USE_TWITCH ? require(path.join(__dirname, './js/twitch')) : '';
|
|
||||||
|
|
||||||
let server;
|
let server;
|
||||||
let socket;
|
let socket;
|
||||||
|
|
||||||
if (config.settings.SERVER.USE_SERVER) {
|
function setServer() {
|
||||||
server = require(path.join(__dirname, './js/server'));
|
if (!settings.SERVER.USE_SERVER) {
|
||||||
socket = io(`http://localhost:${config.settings.SERVER.PORT}`); // Connect to your Socket.IO server
|
return;
|
||||||
|
}
|
||||||
|
server = require(path.join(resourcesPath, './js/server'));
|
||||||
|
socket = io(`http://localhost:${settings.SERVER.PORT}`); // Connect to your Socket.IO server
|
||||||
}
|
}
|
||||||
|
|
||||||
const Polly = config.settings.AMAZON.USE_AMAZON ? require(path.join(__dirname, './js/amazon')) : '';
|
setServer();
|
||||||
const google = config.settings.GOOGLE.USE_GOOGLE ? require(path.join(__dirname, './js/amazon')) : '';
|
|
||||||
|
|
||||||
const theme = require(path.join(__dirname, './js/theme'));
|
const Polly = settings.AMAZON.USE_AMAZON ? require(path.join(resourcesPath, './js/amazon')) : '';
|
||||||
|
const google = settings.GOOGLE.USE_GOOGLE ? require(path.join(resourcesPath, './js/amazon')) : '';
|
||||||
|
|
||||||
|
const theme = require(path.join(resourcesPath, './js/theme'));
|
||||||
|
|
||||||
// initialize values
|
// initialize values
|
||||||
config.getGeneralSettings();
|
config.getGeneralSettings();
|
||||||
config.setCustomThemeToggle();
|
|
||||||
|
|
||||||
|
|
||||||
let selectedVoiceIndex;
|
|
||||||
let selectedEncodingIndex;
|
|
||||||
let selectedTtsAudioDeviceIndex;
|
|
||||||
const TTSVolume = 1;
|
const TTSVolume = 1;
|
||||||
|
|
||||||
const notificationSoundVolume = 1;
|
const notificationSoundVolume = 1;
|
||||||
|
|
@ -85,8 +84,8 @@ const StartDateAndTime = Date.now();
|
||||||
const speakButton = document.querySelector('#speakBtn');
|
const speakButton = document.querySelector('#speakBtn');
|
||||||
|
|
||||||
const amazonCredentials = {
|
const amazonCredentials = {
|
||||||
accessKeyId: config.settings.AMAZON.ACCESS_KEY,
|
accessKeyId: settings.AMAZON.ACCESS_KEY,
|
||||||
secretAccessKey: config.settings.AMAZON.ACCESS_SECRET,
|
secretAccessKey: settings.AMAZON.ACCESS_SECRET,
|
||||||
};
|
};
|
||||||
|
|
||||||
// Check for installed sounds
|
// Check for installed sounds
|
||||||
|
|
@ -104,7 +103,7 @@ fs.readdir(notificationSounds, (err, files) => {
|
||||||
});
|
});
|
||||||
|
|
||||||
// set the saved notification sound
|
// set the saved notification sound
|
||||||
notificationSound.selectedIndex = config.settings.AUDIO.NOTIFICATION_SOUND;
|
notificationSound.selectedIndex = settings.AUDIO.NOTIFICATION_SOUND;
|
||||||
});
|
});
|
||||||
|
|
||||||
async function getAudioDevices() {
|
async function getAudioDevices() {
|
||||||
|
|
@ -123,7 +122,7 @@ async function getAudioDevices() {
|
||||||
ttsAudioDevices.appendChild(option);
|
ttsAudioDevices.appendChild(option);
|
||||||
});
|
});
|
||||||
|
|
||||||
ttsAudioDevices.selectedIndex = config.settings.AUDIO.SELECTED_TTS_AUDIO_DEVICE;
|
ttsAudioDevices.selectedIndex = settings.AUDIO.SELECTED_TTS_AUDIO_DEVICE;
|
||||||
}
|
}
|
||||||
|
|
||||||
getAudioDevices();
|
getAudioDevices();
|
||||||
|
|
@ -144,17 +143,16 @@ function setLanguagesinSelect(languageSelector, setting) {
|
||||||
languageSelect.selectedIndex = setting;
|
languageSelect.selectedIndex = setting;
|
||||||
}
|
}
|
||||||
|
|
||||||
setLanguagesinSelect("#primaryLanguage", config.settings.TTS.PRIMARY_TTS_LANGUAGE_INDEX);
|
setLanguagesinSelect('#primaryLanguage', settings.TTS.PRIMARY_TTS_LANGUAGE_INDEX);
|
||||||
setLanguagesinSelect("#secondaryLanguage", config.settings.TTS.SECONDARY_TTS_LANGUAGE_INDEX);
|
setLanguagesinSelect('#secondaryLanguage', settings.TTS.SECONDARY_TTS_LANGUAGE_INDEX);
|
||||||
|
|
||||||
function getInstalledVoices(callback) {
|
function getInstalledVoices(callback) {
|
||||||
say.getInstalledVoices((err, voices) => {
|
say.getInstalledVoices((err, voices) => {
|
||||||
|
|
||||||
function setVoicesinSelect(voiceSelector) {
|
function setVoicesinSelect(voiceSelector) {
|
||||||
let voiceSelect = document.querySelector(voiceSelector); // obtain the html reference of the google voices comboBox
|
let voiceSelect = document.querySelector(voiceSelector); // obtain the html reference of the google voices comboBox
|
||||||
|
|
||||||
const internalTTSHeader = document.createElement('optgroup');
|
const internalTTSHeader = document.createElement('optgroup');
|
||||||
internalTTSHeader.label = "Internal TTS";
|
internalTTSHeader.label = 'Internal TTS';
|
||||||
voiceSelect.appendChild(internalTTSHeader);
|
voiceSelect.appendChild(internalTTSHeader);
|
||||||
|
|
||||||
// const installedTTS = document.querySelector('#installedTTS'); // obtain the html reference of the installedTTS comboBox
|
// const installedTTS = document.querySelector('#installedTTS'); // obtain the html reference of the installedTTS comboBox
|
||||||
|
|
@ -168,15 +166,15 @@ function getInstalledVoices(callback) {
|
||||||
internalTTSHeader.appendChild(option);
|
internalTTSHeader.appendChild(option);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
setVoicesinSelect("#primaryVoice");
|
setVoicesinSelect('#primaryVoice');
|
||||||
setVoicesinSelect("#secondaryVoice");
|
setVoicesinSelect('#secondaryVoice');
|
||||||
|
|
||||||
callback();
|
callback();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function getAmazonVoices(callback) {
|
function getAmazonVoices(callback) {
|
||||||
if (!config.settings.AMAZON.USE_AMAZON) {
|
if (!settings.AMAZON.USE_AMAZON) {
|
||||||
callback();
|
callback();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -185,7 +183,7 @@ function getAmazonVoices(callback) {
|
||||||
let voiceSelect = document.querySelector(voiceSelector); // obtain the html reference of the google voices comboBox
|
let voiceSelect = document.querySelector(voiceSelector); // obtain the html reference of the google voices comboBox
|
||||||
|
|
||||||
const internalTTSHeader = document.createElement('optgroup');
|
const internalTTSHeader = document.createElement('optgroup');
|
||||||
internalTTSHeader.label = "Amazon TTS";
|
internalTTSHeader.label = 'Amazon TTS';
|
||||||
voiceSelect.appendChild(internalTTSHeader);
|
voiceSelect.appendChild(internalTTSHeader);
|
||||||
|
|
||||||
const voices = Object.keys(amazonVoices);
|
const voices = Object.keys(amazonVoices);
|
||||||
|
|
@ -199,14 +197,14 @@ function getAmazonVoices(callback) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
setVoicesinSelect("#primaryVoice");
|
setVoicesinSelect('#primaryVoice');
|
||||||
setVoicesinSelect("#secondaryVoice");
|
setVoicesinSelect('#secondaryVoice');
|
||||||
|
|
||||||
callback();
|
callback();
|
||||||
}
|
}
|
||||||
|
|
||||||
function getGoogleVoices(callback) {
|
function getGoogleVoices(callback) {
|
||||||
if (!config.settings.GOOGLE.USE_GOOGLE) {
|
if (!settings.GOOGLE.USE_GOOGLE) {
|
||||||
callback();
|
callback();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -215,14 +213,14 @@ function getGoogleVoices(callback) {
|
||||||
let voiceSelect = document.querySelector(voiceSelector); // obtain the html reference of the google voices comboBox
|
let voiceSelect = document.querySelector(voiceSelector); // obtain the html reference of the google voices comboBox
|
||||||
|
|
||||||
const internalTTSHeader = document.createElement('optgroup');
|
const internalTTSHeader = document.createElement('optgroup');
|
||||||
internalTTSHeader.label = "Google TTS";
|
internalTTSHeader.label = 'Google TTS';
|
||||||
voiceSelect.appendChild(internalTTSHeader);
|
voiceSelect.appendChild(internalTTSHeader);
|
||||||
|
|
||||||
const googleVoiceSelect = document.querySelector('#googleVoice'); // obtain the html reference of the google voices comboBox
|
const googleVoiceSelect = document.querySelector('#googleVoice'); // obtain the html reference of the google voices comboBox
|
||||||
const voices = Object.keys(googleVoices);
|
const voices = Object.keys(googleVoices);
|
||||||
voices.forEach((voice) => {
|
voices.forEach((voice) => {
|
||||||
const option = document.createElement('option');
|
const option = document.createElement('option');
|
||||||
option.classList.add("option");
|
option.classList.add('option');
|
||||||
|
|
||||||
option.value = voice;
|
option.value = voice;
|
||||||
option.innerHTML = googleVoices[voice];
|
option.innerHTML = googleVoices[voice];
|
||||||
|
|
@ -230,8 +228,8 @@ function getGoogleVoices(callback) {
|
||||||
internalTTSHeader.appendChild(option);
|
internalTTSHeader.appendChild(option);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
setVoicesinSelect("#primaryVoice");
|
setVoicesinSelect('#primaryVoice');
|
||||||
setVoicesinSelect("#secondaryVoice");
|
setVoicesinSelect('#secondaryVoice');
|
||||||
|
|
||||||
callback();
|
callback();
|
||||||
}
|
}
|
||||||
|
|
@ -239,11 +237,11 @@ function getGoogleVoices(callback) {
|
||||||
getGoogleVoices(function () {
|
getGoogleVoices(function () {
|
||||||
getAmazonVoices(function () {
|
getAmazonVoices(function () {
|
||||||
getInstalledVoices(function () {
|
getInstalledVoices(function () {
|
||||||
let primaryVoice = document.querySelector("#primaryVoice");
|
let primaryVoice = document.querySelector('#primaryVoice');
|
||||||
primaryVoice.selectedIndex = config.settings.TTS.PRIMARY_TTS_VOICE;
|
primaryVoice.selectedIndex = settings.TTS.PRIMARY_TTS_VOICE;
|
||||||
|
|
||||||
let secondaryVoice = document.querySelector("#secondaryVoice");
|
let secondaryVoice = document.querySelector('#secondaryVoice');
|
||||||
secondaryVoice.selectedIndex = config.settings.TTS.SECONDARY_TTS_VOICE;
|
secondaryVoice.selectedIndex = settings.TTS.SECONDARY_TTS_VOICE;
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
@ -256,17 +254,18 @@ Array.from(document.body.querySelectorAll('[tip]')).forEach((el) => {
|
||||||
tip.classList.add('tooltip');
|
tip.classList.add('tooltip');
|
||||||
tip.classList.add('tooltiptext');
|
tip.classList.add('tooltiptext');
|
||||||
tip.innerText = el.getAttribute('tip');
|
tip.innerText = el.getAttribute('tip');
|
||||||
tip.style.transform = `translate(${el.hasAttribute('tip-left') ? 'calc(-100% - 5px)' : '15px'}, ${el.hasAttribute('tip-top') ? '-100%' : '15px'
|
tip.style.transform = `translate(${el.hasAttribute('tip-left') ? 'calc(-100% - 5px)' : '15px'}, ${
|
||||||
|
el.hasAttribute('tip-top') ? '-100%' : '15px'
|
||||||
})`;
|
})`;
|
||||||
body.appendChild(tip);
|
body.appendChild(tip);
|
||||||
element.onmousemove = (e) => {
|
element.onmousemove = (e) => {
|
||||||
tip.style.left = `${e.x}px`;
|
tip.style.left = `${e.x}px`;
|
||||||
tip.style.top = `${e.y}px`;
|
tip.style.top = `${e.y}px`;
|
||||||
tip.style.zIndex = 1;
|
tip.style.zIndex = 1;
|
||||||
tip.style.visibility = "visible";
|
tip.style.visibility = 'visible';
|
||||||
};
|
};
|
||||||
element.onmouseleave = (e) => {
|
element.onmouseleave = (e) => {
|
||||||
tip.style.visibility = "hidden";
|
tip.style.visibility = 'hidden';
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -306,15 +305,12 @@ function hideText(button, field) {
|
||||||
passwordInput.type = 'password';
|
passwordInput.type = 'password';
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
hideText('.password-toggle-btn1', "#TWITCH_OAUTH_TOKEN");
|
hideText('.password-toggle-btn1', '#TWITCH_OAUTH_TOKEN');
|
||||||
hideText('.password-toggle-btn2', "#TWITCH_CLIENT_ID");
|
hideText('.password-toggle-btn4', '#AMAZON_ACCESS_KEY');
|
||||||
hideText('.password-toggle-btn3', "#TWITCH_CLIENT_SECRET");
|
hideText('.password-toggle-btn5', '#AMAZON_ACCESS_SECRET');
|
||||||
hideText('.password-toggle-btn4', "#AMAZON_ACCESS_KEY");
|
hideText('.password-toggle-btn6', '#GOOGLE_API_KEY');
|
||||||
hideText('.password-toggle-btn5', "#AMAZON_ACCESS_SECRET");
|
|
||||||
hideText('.password-toggle-btn6', "#GOOGLE_API_KEY");
|
|
||||||
|
|
||||||
// Amazon TTS
|
// Amazon TTS
|
||||||
// const polly = new Polly(amazonCredentials);
|
// const polly = new Polly(amazonCredentials);
|
||||||
|
|
@ -323,7 +319,7 @@ hideText('.password-toggle-btn6', "#GOOGLE_API_KEY");
|
||||||
// voiceId: 'Lotte',
|
// voiceId: 'Lotte',
|
||||||
// };
|
// };
|
||||||
|
|
||||||
// const fileStream = fs.createWriteStream(path.join(__dirname, '/public/sounds/tts/Amazon_audio.mp3'));
|
// const fileStream = fs.createWriteStream(path.join(resourcesPath, '/public/sounds/tts/Amazon_audio.mp3'));
|
||||||
|
|
||||||
// polly.textToSpeech(options, (err, audioStream) => {
|
// polly.textToSpeech(options, (err, audioStream) => {
|
||||||
// if (err) {
|
// if (err) {
|
||||||
|
|
|
||||||
|
|
@ -1,54 +1,81 @@
|
||||||
const express = require('express');
|
const express = require('express');
|
||||||
|
|
||||||
const app = express();
|
const app = express();
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
const http = require('http').createServer(app);
|
const http = require('http').createServer(app);
|
||||||
const io = require('socket.io')(http);
|
const io = require('socket.io')(http);
|
||||||
|
|
||||||
if (!config.settings.SERVER.USE_SERVER) {
|
if (!settings.SERVER.USE_SERVER) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const PORT = config.settings.SERVER.PORT;
|
const PORT = settings.SERVER.PORT;
|
||||||
|
|
||||||
http.listen(PORT, () => {
|
let isVtuberEnabled = true;
|
||||||
if (config.settings.SERVER.USE_VTUBER) {
|
let isChatBubbleEnabled = true;
|
||||||
app.use('/vtuber', express.static(path.join(__dirname, '../modules/vtuber/')));
|
|
||||||
|
function startVtuber() {
|
||||||
|
if (!settings.SERVER.USE_VTUBER) {
|
||||||
|
isVtuberEnabled = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
app.use('/vtuber', express.static(path.join(resourcesPath, './modules/vtuber/')));
|
||||||
|
|
||||||
let vtuber = document.body.querySelector('#BrowsersourceVtuber');
|
let vtuber = document.body.querySelector('#BrowsersourceVtuber');
|
||||||
let vtuberframe = document.createElement('iframe');
|
let vtuberframe = document.createElement('iframe');
|
||||||
vtuberframe.class = "frame";
|
vtuberframe.class = 'frame';
|
||||||
vtuberframe.src = `http://localhost:${PORT}/vtuber`;
|
vtuberframe.src = `http://localhost:${PORT}/vtuber`;
|
||||||
vtuberframe.style.width = "100%";
|
vtuberframe.style.width = '100%';
|
||||||
vtuberframe.style.height = "100%";
|
vtuberframe.style.height = '100%';
|
||||||
vtuberframe.frameBorder = 0;
|
vtuberframe.frameBorder = 0;
|
||||||
vtuber.appendChild(vtuberframe);
|
vtuber.appendChild(vtuberframe);
|
||||||
|
}
|
||||||
|
|
||||||
|
function startChatBubble() {
|
||||||
|
if (!settings.SERVER.USE_CHATBUBBLE) {
|
||||||
|
isChatBubbleEnabled = false;
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (config.settings.SERVER.USE_CHATBUBBLE) {
|
app.use('/chat', express.static(path.join(resourcesPath, './modules/chat')));
|
||||||
app.use('/chat', express.static(path.join(__dirname, '../modules/chat')));
|
|
||||||
|
|
||||||
let chat = document.body.querySelector('#BrowsersourceChat');
|
let chat = document.body.querySelector('#BrowsersourceChat');
|
||||||
let chatframe = document.createElement('iframe');
|
let chatframe = document.createElement('iframe');
|
||||||
chatframe.class = "frame";
|
chatframe.class = 'frame';
|
||||||
chatframe.src = `http://localhost:${PORT}/chat`;
|
chatframe.src = `http://localhost:${PORT}/chat`;
|
||||||
chatframe.style.width = "100%";
|
chatframe.style.width = '100%';
|
||||||
chatframe.style.height = "100%";
|
chatframe.style.height = '100%';
|
||||||
chatframe.frameBorder = 0;
|
chatframe.frameBorder = 0;
|
||||||
chat.appendChild(chatframe);
|
chat.appendChild(chatframe);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Middleware to conditionally serve routes
|
||||||
|
app.use((req, res, next) => {
|
||||||
|
if (!isVtuberEnabled && req.path === '/vtuber') {
|
||||||
|
res.sendStatus(404); // Return a 404 status for /vtuber when it's disabled
|
||||||
|
} else if (!isChatBubbleEnabled && req.path === '/chat') {
|
||||||
|
res.sendStatus(404); // Return a 404 status for /chat when it's disabled
|
||||||
|
} else {
|
||||||
|
next(); // Proceed to the next middleware or route handler
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
http.listen(PORT, () => {
|
||||||
|
startVtuber();
|
||||||
|
startChatBubble();
|
||||||
|
});
|
||||||
|
|
||||||
// Handle socket connections
|
// Handle socket connections
|
||||||
io.on('connection', (socket) => {
|
io.on('connection', (socket) => {
|
||||||
|
|
||||||
// Receive data from the client
|
// Receive data from the client
|
||||||
socket.on('message', (data) => { });
|
socket.on('message', (data) => {});
|
||||||
|
|
||||||
// Receive data from the client
|
// Receive data from the client
|
||||||
socket.on('xxx', (logoUrl, username, message) => {
|
socket.on('xxx', (logoUrl, username, message) => {
|
||||||
socket.broadcast.emit('message', logoUrl, username, message);
|
socket.broadcast.emit('message', logoUrl, username, message);
|
||||||
});
|
});
|
||||||
|
|
||||||
socket.on('disconnect', () => { });
|
socket.on('disconnect', () => {});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
module.exports = { startVtuber, startChatBubble };
|
||||||
|
|
|
||||||
|
|
@ -1,131 +1,117 @@
|
||||||
let resourcesPath = path.join(__dirname, '../config/settings.ini');
|
|
||||||
let settings = ini.parse(fs.readFileSync(resourcesPath, 'utf-8'));
|
|
||||||
|
|
||||||
if (envInfo.env) {
|
|
||||||
resourcesPath = path.join(envInfo.path, './settings.ini');
|
|
||||||
settings = ini.parse(fs.readFileSync(resourcesPath, 'utf-8'));
|
|
||||||
}
|
|
||||||
|
|
||||||
document.body.querySelector('#primaryVoice').addEventListener('change', () => {
|
document.body.querySelector('#primaryVoice').addEventListener('change', () => {
|
||||||
var select = document.querySelector("#primaryVoice");
|
var select = document.querySelector('#primaryVoice');
|
||||||
settings.TTS.PRIMARY_TTS_VOICE = select.selectedIndex;
|
settings.TTS.PRIMARY_TTS_VOICE = select.selectedIndex;
|
||||||
settings.TTS.PRIMARY_TTS_NAME = select.options[select.selectedIndex].text;
|
settings.TTS.PRIMARY_TTS_NAME = select.options[select.selectedIndex].text;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved primary voice!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#primaryLanguage').addEventListener('change', () => {
|
document.body.querySelector('#primaryLanguage').addEventListener('change', () => {
|
||||||
var select = document.querySelector("#primaryLanguage");
|
var select = document.querySelector('#primaryLanguage');
|
||||||
settings.TTS.PRIMARY_TTS_LANGUAGE_INDEX = select.selectedIndex;
|
settings.TTS.PRIMARY_TTS_LANGUAGE_INDEX = select.selectedIndex;
|
||||||
settings.TTS.PRIMARY_TTS_LANGUAGE = select.options[select.selectedIndex].text;
|
settings.TTS.PRIMARY_TTS_LANGUAGE = select.options[select.selectedIndex].text;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved primary language!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#secondaryVoice').addEventListener('change', () => {
|
document.body.querySelector('#secondaryVoice').addEventListener('change', () => {
|
||||||
var select = document.querySelector("#secondaryVoice");
|
var select = document.querySelector('#secondaryVoice');
|
||||||
settings.TTS.SECONDARY_TTS_VOICE = select.selectedIndex;
|
settings.TTS.SECONDARY_TTS_VOICE = select.selectedIndex;
|
||||||
settings.TTS.SECONDARY_TTS_NAME = select.options[select.selectedIndex].text;
|
settings.TTS.SECONDARY_TTS_NAME = select.options[select.selectedIndex].text;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved secondary voice!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#secondaryLanguage').addEventListener('change', () => {
|
document.body.querySelector('#secondaryLanguage').addEventListener('change', () => {
|
||||||
var select = document.querySelector("#secondaryLanguage");
|
var select = document.querySelector('#secondaryLanguage');
|
||||||
settings.TTS.SECONDARY_TTS_LANGUAGE_INDEX = select.selectedIndex;
|
settings.TTS.SECONDARY_TTS_LANGUAGE_INDEX = select.selectedIndex;
|
||||||
settings.TTS.SECONDARY_TTS_LANGUAGE = select.options[select.selectedIndex].text;
|
settings.TTS.SECONDARY_TTS_LANGUAGE = select.options[select.selectedIndex].text;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved secondary language!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#ttsAudioDevice').addEventListener('change', () => {
|
document.body.querySelector('#ttsAudioDevice').addEventListener('change', () => {
|
||||||
settings.AUDIO.TTS_AUDIO_DEVICE = ttsAudioDevices.value;
|
settings.AUDIO.TTS_AUDIO_DEVICE = ttsAudioDevices.value;
|
||||||
settings.AUDIO.SELECTED_TTS_AUDIO_DEVICE = ttsAudioDevices.selectedIndex;
|
settings.AUDIO.SELECTED_TTS_AUDIO_DEVICE = ttsAudioDevices.selectedIndex;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved audio device!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#TWITCH_CHANNEL_NAME').addEventListener('change', () => {
|
document.body.querySelector('#TWITCH_CHANNEL_NAME').addEventListener('change', () => {
|
||||||
settings.TWITCH.CHANNEL_NAME = document.body.querySelector('#TWITCH_CHANNEL_NAME').value;
|
settings.TWITCH.CHANNEL_NAME = document.body.querySelector('#TWITCH_CHANNEL_NAME').value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
});
|
|
||||||
|
|
||||||
document.body.querySelector('#TWITCH_USERNAME').addEventListener('change', () => {
|
let button = document.body.querySelector('#TestTwitchCredentials');
|
||||||
settings.TWITCH.USERNAME = document.body.querySelector('#TWITCH_USERNAME').value;
|
button.className = 'AdvancedMenuButton';
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
createNotification('Saved Channel name, please restart the application to reset twitch service', 'warning');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#TWITCH_OAUTH_TOKEN').addEventListener('change', () => {
|
document.body.querySelector('#TWITCH_OAUTH_TOKEN').addEventListener('change', () => {
|
||||||
settings.TWITCH.OAUTH_TOKEN = document.body.querySelector('#TWITCH_OAUTH_TOKEN').value;
|
settings.TWITCH.OAUTH_TOKEN = document.body.querySelector('#TWITCH_OAUTH_TOKEN').value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
});
|
createNotification('Saved OAuth token!', 'success');
|
||||||
|
|
||||||
document.body.querySelector('#TWITCH_CLIENT_ID').addEventListener('change', () => {
|
let button = document.body.querySelector('#TestTwitchCredentials');
|
||||||
settings.TWITCH.CLIENT_ID = document.body.querySelector('#TWITCH_CLIENT_ID').value;
|
button.className = 'AdvancedMenuButton';
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
createNotification('Saved OAuth token, please restart the application to reset twitch service', 'warning');
|
||||||
});
|
|
||||||
|
|
||||||
document.body.querySelector('#TWITCH_CLIENT_SECRET').addEventListener('change', () => {
|
|
||||||
settings.TWITCH.CLIENT_SECRET = document.body.querySelector('#TWITCH_CLIENT_SECRET').value;
|
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#PORT').addEventListener('change', () => {
|
document.body.querySelector('#PORT').addEventListener('change', () => {
|
||||||
settings.SERVER.PORT = document.body.querySelector('#PORT').value;
|
settings.SERVER.PORT = document.body.querySelector('#PORT').value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved port, please restart the application to reset the port', 'warning');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#AMAZON_ACCESS_KEY').addEventListener('change', () => {
|
document.body.querySelector('#AMAZON_ACCESS_KEY').addEventListener('change', () => {
|
||||||
settings.AMAZON.ACCESS_KEY = document.body.querySelector('#AMAZON_ACCESS_KEY').value;
|
settings.AMAZON.ACCESS_KEY = document.body.querySelector('#AMAZON_ACCESS_KEY').value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved Amazon access key!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#AMAZON_ACCESS_SECRET').addEventListener('change', () => {
|
document.body.querySelector('#AMAZON_ACCESS_SECRET').addEventListener('change', () => {
|
||||||
settings.AMAZON.ACCESS_SECRET = document.body.querySelector('#AMAZON_ACCESS_SECRET').value;
|
settings.AMAZON.ACCESS_SECRET = document.body.querySelector('#AMAZON_ACCESS_SECRET').value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved Amazon access secret!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#GOOGLE_API_KEY').addEventListener('change', () => {
|
document.body.querySelector('#GOOGLE_API_KEY').addEventListener('change', () => {
|
||||||
settings.GOOGLE.API_KEY = document.body.querySelector('#GOOGLE_API_KEY').value;
|
settings.GOOGLE.API_KEY = document.body.querySelector('#GOOGLE_API_KEY').value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved Google api key!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
// document.body.querySelector('#sliderX').addEventListener('change', () => {
|
|
||||||
// // TODO: resolve volume control of TTS
|
|
||||||
// config.SETTINGS.VOICE_VOLUME;
|
|
||||||
// fs.writeFileSync(path.join(__dirname, '/public/config/settings.ini'), ini.stringify(config));
|
|
||||||
// });
|
|
||||||
|
|
||||||
// #region Test/change/Save Configuration
|
|
||||||
document.body.querySelector('#notification').addEventListener('change', () => {
|
document.body.querySelector('#notification').addEventListener('change', () => {
|
||||||
settings.AUDIO.NOTIFICATION_SOUND = notificationSound.selectedIndex;
|
settings.AUDIO.NOTIFICATION_SOUND = notificationSound.selectedIndex;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
createNotification('Saved notification sound!', 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
// document.body.querySelector('#slider').addEventListener('change', () => {
|
|
||||||
// settings.SETTINGS.NOTIFICATION_VOLUME = parseInt(document.getElementById('SoundVolume').
|
|
||||||
// innerText);
|
|
||||||
// fs.writeFileSync(path.join(__dirname, '/public/config/settings.ini'), ini.stringify(settings));
|
|
||||||
// });
|
|
||||||
|
|
||||||
function getGeneralSettings() {
|
function getGeneralSettings() {
|
||||||
// Theme
|
// Theme
|
||||||
document.querySelector('#USE_CUSTOM_THEME').value = settings.THEME.USE_CUSTOM_THEME;
|
document.querySelector('#USE_CUSTOM_THEME').value = settings.THEME.USE_CUSTOM_THEME;
|
||||||
const USE_CUSTOM_THEME = settings.THEME.USE_CUSTOM_THEME;
|
|
||||||
|
|
||||||
document.body.querySelector('#USE_CUSTOM_THEME').checked = settings.THEME.USE_CUSTOM_THEME === true ? 1 : 0;
|
document.body.querySelector('#USE_CUSTOM_THEME').checked = settings.THEME.USE_CUSTOM_THEME === true ? 1 : 0;
|
||||||
theme.setTheme(USE_CUSTOM_THEME);
|
theme.setTheme();
|
||||||
|
|
||||||
|
// TTS
|
||||||
|
document.body.querySelector('#USE_TTS').checked = settings.TTS.USE_TTS;
|
||||||
|
|
||||||
|
// Notification sounds
|
||||||
|
document.body.querySelector('#USE_NOTIFICATION_SOUNDS').checked = settings.AUDIO.USE_NOTIFICATION_SOUNDS;
|
||||||
|
|
||||||
// Twitch
|
// Twitch
|
||||||
document.body.querySelector('#USE_TWITCH').checked = settings.TWITCH.USE_TWITCH;
|
document.body.querySelector('#USE_TWITCH').checked = settings.TWITCH.USE_TWITCH;
|
||||||
document.body.querySelector('#TWITCH_CHANNEL_NAME').value = settings.TWITCH.CHANNEL_NAME;
|
document.body.querySelector('#TWITCH_CHANNEL_NAME').value = settings.TWITCH.CHANNEL_NAME;
|
||||||
document.body.querySelector('#TWITCH_USERNAME').value = settings.TWITCH.USERNAME;
|
|
||||||
document.body.querySelector('#TWITCH_OAUTH_TOKEN').value = settings.TWITCH.OAUTH_TOKEN;
|
document.body.querySelector('#TWITCH_OAUTH_TOKEN').value = settings.TWITCH.OAUTH_TOKEN;
|
||||||
document.body.querySelector('#TWITCH_CLIENT_ID').value = settings.TWITCH.CLIENT_ID;
|
|
||||||
document.body.querySelector('#TWITCH_CLIENT_SECRET').value = settings.TWITCH.CLIENT_SECRET;
|
|
||||||
|
|
||||||
// Server
|
// Server
|
||||||
document.body.querySelector('#USE_SERVER').checked = settings.SERVER.USE_SERVER;
|
document.body.querySelector('#USE_SERVER').checked = settings.SERVER.USE_SERVER;
|
||||||
document.body.querySelector('#PORT').value = settings.SERVER.PORT;
|
document.body.querySelector('#PORT').value = settings.SERVER.PORT;
|
||||||
document.body.querySelector('#USE_VTUBER').checked = settings.SERVER.USE_VTUBER;
|
document.body.querySelector('#USE_VTUBER').checked = settings.SERVER.USE_VTUBER;
|
||||||
showMenuButton("#btnBrowsersourceVtuber", settings.SERVER.USE_VTUBER)
|
document.body.querySelector('#VTUBER_URL').value = `http://localhost:${settings.SERVER.PORT}/vtuber/`;
|
||||||
|
showMenuButton('#btnBrowsersourceVtuber', settings.SERVER.USE_VTUBER);
|
||||||
document.body.querySelector('#USE_CHATBUBBLE').checked = settings.SERVER.USE_CHATBUBBLE;
|
document.body.querySelector('#USE_CHATBUBBLE').checked = settings.SERVER.USE_CHATBUBBLE;
|
||||||
showMenuButton("#btnBrowsersourceChat", settings.SERVER.USE_CHATBUBBLE)
|
document.body.querySelector('#CHATBUBBLE_URL').value = `http://localhost:${settings.SERVER.PORT}/chat/`;
|
||||||
|
showMenuButton('#btnBrowsersourceChat', settings.SERVER.USE_CHATBUBBLE);
|
||||||
|
|
||||||
// Amazon
|
// Amazon
|
||||||
document.body.querySelector('#USE_AMAZON').checked = settings.AMAZON.USE_AMAZON;
|
document.body.querySelector('#USE_AMAZON').checked = settings.AMAZON.USE_AMAZON;
|
||||||
|
|
@ -135,15 +121,14 @@ function getGeneralSettings() {
|
||||||
// Google
|
// Google
|
||||||
document.body.querySelector('#USE_GOOGLE').checked = settings.GOOGLE.USE_GOOGLE;
|
document.body.querySelector('#USE_GOOGLE').checked = settings.GOOGLE.USE_GOOGLE;
|
||||||
document.body.querySelector('#GOOGLE_API_KEY').value = settings.GOOGLE.API_KEY;
|
document.body.querySelector('#GOOGLE_API_KEY').value = settings.GOOGLE.API_KEY;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function showMenuButton(menuButton, toggle) {
|
function showMenuButton(menuButton, toggle) {
|
||||||
let option = document.body.querySelector(menuButton);
|
let option = document.body.querySelector(menuButton);
|
||||||
if (!toggle) {
|
if (!toggle) {
|
||||||
option.style.display = "none";
|
option.style.display = 'none';
|
||||||
} else {
|
} else {
|
||||||
option.style.display = "";
|
option.style.display = '';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -155,18 +140,14 @@ function createNotification(message = null, type = null) {
|
||||||
notification.classList.add(type);
|
notification.classList.add(type);
|
||||||
notification.innerText = message;
|
notification.innerText = message;
|
||||||
notificationToasts.appendChild(notification);
|
notificationToasts.appendChild(notification);
|
||||||
let notfication = undefined;
|
|
||||||
|
|
||||||
let alertSound = "info.mp3";
|
let alertSound = 'info.mp3';
|
||||||
if (type === "error") {
|
if (type === 'error') {
|
||||||
alertSound = "error.mp3";
|
alertSound = 'error.mp3';
|
||||||
}
|
}
|
||||||
|
|
||||||
if (envInfo.env) {
|
let notfication = new Audio(path.join(resourcesPath, `./sounds/notifications/${alertSound}`));
|
||||||
notfication = new Audio(path.join(envInfo.path, `./sounds/notifications/${alertSound}`));
|
notfication.volume = settings.AUDIO.NOTIFICATION_VOLUME / 100;
|
||||||
} else {
|
|
||||||
notfication = new Audio(path.join(__dirname, `../sounds/notifications/${alertSound}`));
|
|
||||||
}
|
|
||||||
notfication.play();
|
notfication.play();
|
||||||
setTimeout(() => notification.remove(), 10000);
|
setTimeout(() => notification.remove(), 10000);
|
||||||
}
|
}
|
||||||
|
|
@ -179,37 +160,37 @@ if (!settings.TWITCH.USE_TWITCH) {
|
||||||
|
|
||||||
if (settings.TWITCH.USE_TWITCH && !settings.TWITCH.CHANNEL_NAME) {
|
if (settings.TWITCH.USE_TWITCH && !settings.TWITCH.CHANNEL_NAME) {
|
||||||
const text = 'No channel name inserted in the Twitch service';
|
const text = 'No channel name inserted in the Twitch service';
|
||||||
createNotification(text, 'alert');
|
createNotification(text, 'warning');
|
||||||
}
|
}
|
||||||
|
|
||||||
if (settings.TWITCH.USE_TWITCH && !settings.TWITCH.USERNAME) {
|
if (settings.TWITCH.USE_TWITCH && !settings.TWITCH.USERNAME) {
|
||||||
const text = 'No username inserted in the Twitch service';
|
const text = 'No username inserted in the Twitch service';
|
||||||
createNotification(text, 'alert');
|
createNotification(text, 'warning');
|
||||||
}
|
}
|
||||||
|
|
||||||
function toggleRadio(toggle, inputs) {
|
function toggleRadio(toggle, inputs) {
|
||||||
const element = inputs;
|
const element = inputs;
|
||||||
if (toggle === true) {
|
if (toggle === true) {
|
||||||
for (let i = 0; i < inputs.length; i += 1) { element[i].disabled = false; }
|
for (let i = 0; i < inputs.length; i += 1) {
|
||||||
} else {
|
element[i].style.display = '';
|
||||||
for (let i = 0; i < inputs.length; i += 1) { element[i].disabled = true; }
|
}
|
||||||
|
} else {
|
||||||
|
for (let i = 0; i < inputs.length; i += 1) {
|
||||||
|
element[i].style.display = 'none';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
function setCustomThemeToggle() {
|
|
||||||
const toggle = document.getElementById('USE_CUSTOM_THEME').checked;
|
|
||||||
const inputs = document.getElementsByClassName('inputTheme');
|
|
||||||
toggleRadio(toggle, inputs);
|
|
||||||
theme.setTheme(toggle);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// #region Use Custom theme toggle logic
|
// #region Use Custom theme toggle logic
|
||||||
document.body.querySelector('#USE_CUSTOM_THEME').addEventListener('click', () => {
|
document.body.querySelector('#USE_CUSTOM_THEME').addEventListener('click', () => {
|
||||||
setCustomThemeToggle();
|
|
||||||
|
|
||||||
const toggle = document.getElementById('USE_CUSTOM_THEME').checked;
|
const toggle = document.getElementById('USE_CUSTOM_THEME').checked;
|
||||||
|
const inputs = document.getElementsByClassName('inputTheme');
|
||||||
|
toggleRadio(toggle, inputs);
|
||||||
|
|
||||||
settings.THEME.USE_CUSTOM_THEME = toggle;
|
settings.THEME.USE_CUSTOM_THEME = toggle;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
theme.setTheme();
|
||||||
|
createNotification(`${toggle ? 'Enabled' : 'Disabled'} custom theme!`, 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
// #region Top bar buttons
|
// #region Top bar buttons
|
||||||
|
|
@ -217,6 +198,22 @@ document.body.querySelector('#min-button').addEventListener('click', () => {
|
||||||
ipcRenderer.send('minimize-window');
|
ipcRenderer.send('minimize-window');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// #region Top bar buttons
|
||||||
|
document.body.querySelector('#Info_USERNAME').addEventListener('click', () => {
|
||||||
|
const key = ipcRenderer.sendSync('twitch');
|
||||||
|
|
||||||
|
let element = document.body.querySelector('#TWITCH_OAUTH_TOKEN');
|
||||||
|
element.value = key;
|
||||||
|
});
|
||||||
|
|
||||||
|
document.body.querySelector('#Info_VTUBER').addEventListener('click', () => {
|
||||||
|
ipcRenderer.send('vtuber');
|
||||||
|
});
|
||||||
|
|
||||||
|
document.body.querySelector('#Info_CHATBUBBLE').addEventListener('click', () => {
|
||||||
|
ipcRenderer.send('chatBubble');
|
||||||
|
});
|
||||||
|
|
||||||
document.body.querySelector('#max-button').addEventListener('click', () => {
|
document.body.querySelector('#max-button').addEventListener('click', () => {
|
||||||
ipcRenderer.send('maximize-window');
|
ipcRenderer.send('maximize-window');
|
||||||
});
|
});
|
||||||
|
|
@ -224,6 +221,7 @@ document.body.querySelector('#max-button').addEventListener('click', () => {
|
||||||
document.body.querySelector('#close-button').addEventListener('click', (event) => {
|
document.body.querySelector('#close-button').addEventListener('click', (event) => {
|
||||||
ipcRenderer.send('close-window');
|
ipcRenderer.send('close-window');
|
||||||
});
|
});
|
||||||
|
|
||||||
// #endregion
|
// #endregion
|
||||||
|
|
||||||
// #region Notification sound test
|
// #region Notification sound test
|
||||||
|
|
@ -231,94 +229,151 @@ document.body.querySelector('#SoundTestButton').addEventListener('click', () =>
|
||||||
sound.playAudio();
|
sound.playAudio();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
document.body.querySelector('#TestTwitchCredentials').addEventListener('click', () => {
|
||||||
|
twitch.ping('#TestTwitchCredentials');
|
||||||
|
// resetTwitch(;
|
||||||
|
});
|
||||||
|
|
||||||
function toggleTwitch() {
|
function toggleTwitch() {
|
||||||
const toggle = settings.TWITCH.USE_TWITCH;
|
const toggle = settings.TWITCH.USE_TWITCH;
|
||||||
const inputs = document.getElementsByClassName('inputTwitch');
|
const inputs = document.getElementsByClassName('inputTwitch');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toggleTwitch();
|
||||||
|
|
||||||
document.body.querySelector('#USE_TWITCH').addEventListener('click', () => {
|
document.body.querySelector('#USE_TWITCH').addEventListener('click', () => {
|
||||||
const toggle = document.getElementById('USE_TWITCH').checked;
|
const toggle = document.getElementById('USE_TWITCH').checked;
|
||||||
settings.TWITCH.USE_TWITCH = toggle;
|
settings.TWITCH.USE_TWITCH = toggle;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
const inputs = document.getElementsByClassName('inputTwitch');
|
const inputs = document.getElementsByClassName('inputTwitch');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
|
twitch = settings.TWITCH.USE_TWITCH ? require(path.join(resourcesPath, './js/twitch')) : null;
|
||||||
|
createNotification(`${toggle ? 'Enabled' : 'Disabled'} Twitch settings!`, 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
toggleTwitch();
|
|
||||||
|
|
||||||
function toggleGoogle() {
|
function toggleGoogle() {
|
||||||
const toggle = settings.GOOGLE.USE_GOOGLE;
|
const toggle = settings.GOOGLE.USE_GOOGLE;
|
||||||
const inputs = document.getElementsByClassName('inputGoogle');
|
const inputs = document.getElementsByClassName('inputGoogle');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toggleGoogle();
|
||||||
|
|
||||||
document.body.querySelector('#USE_GOOGLE').addEventListener('click', () => {
|
document.body.querySelector('#USE_GOOGLE').addEventListener('click', () => {
|
||||||
const toggle = document.getElementById('USE_GOOGLE').checked;
|
const toggle = document.getElementById('USE_GOOGLE').checked;
|
||||||
settings.GOOGLE.USE_GOOGLE = toggle;
|
settings.GOOGLE.USE_GOOGLE = toggle;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
const inputs = document.getElementsByClassName('inputGoogle');
|
const inputs = document.getElementsByClassName('inputGoogle');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
|
createNotification(`${toggle ? 'Enabled' : 'Disabled'} Google settings!`, 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
toggleGoogle();
|
|
||||||
|
|
||||||
function toggleAmazon() {
|
function toggleAmazon() {
|
||||||
const toggle = settings.AMAZON.USE_AMAZON;
|
const toggle = settings.AMAZON.USE_AMAZON;
|
||||||
const inputs = document.getElementsByClassName('inputAmazon');
|
const inputs = document.getElementsByClassName('inputAmazon');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toggleAmazon();
|
||||||
|
|
||||||
document.body.querySelector('#USE_AMAZON').addEventListener('click', () => {
|
document.body.querySelector('#USE_AMAZON').addEventListener('click', () => {
|
||||||
const toggle = document.getElementById('USE_AMAZON').checked;
|
const toggle = document.getElementById('USE_AMAZON').checked;
|
||||||
settings.AMAZON.USE_AMAZON = toggle;
|
settings.AMAZON.USE_AMAZON = toggle;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
const inputs = document.getElementsByClassName('inputAmazon');
|
const inputs = document.getElementsByClassName('inputAmazon');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
|
createNotification(`${toggle ? 'Enabled' : 'Disabled'} Amazon settings!`, 'success');
|
||||||
});
|
});
|
||||||
|
|
||||||
toggleAmazon();
|
|
||||||
|
|
||||||
function toggleServer() {
|
function toggleServer() {
|
||||||
const toggle = settings.SERVER.USE_SERVER;
|
const toggle = settings.SERVER.USE_SERVER;
|
||||||
const inputs = document.getElementsByClassName('inputServer');
|
const inputs = document.getElementsByClassName('inputServer');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toggleServer();
|
||||||
|
|
||||||
document.body.querySelector('#USE_SERVER').addEventListener('click', () => {
|
document.body.querySelector('#USE_SERVER').addEventListener('click', () => {
|
||||||
const toggle = document.getElementById('USE_SERVER').checked;
|
const toggle = document.getElementById('USE_SERVER').checked;
|
||||||
settings.SERVER.USE_SERVER = toggle;
|
settings.SERVER.USE_SERVER = toggle;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
const inputs = document.getElementsByClassName('inputServer');
|
const inputs = document.getElementsByClassName('inputServer');
|
||||||
toggleRadio(toggle, inputs);
|
toggleRadio(toggle, inputs);
|
||||||
|
setServer();
|
||||||
|
createNotification(
|
||||||
|
`${toggle ? 'Enabled' : 'Disabled'} server settings!, the service will stop working after restarting the application`,
|
||||||
|
'success',
|
||||||
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
toggleServer();
|
|
||||||
|
|
||||||
document.body.querySelector('#USE_VTUBER').addEventListener('change', () => {
|
document.body.querySelector('#USE_VTUBER').addEventListener('change', () => {
|
||||||
const toggle = document.getElementById('USE_VTUBER').checked;
|
const toggle = document.getElementById('USE_VTUBER').checked;
|
||||||
settings.SERVER.USE_VTUBER = toggle;
|
settings.SERVER.USE_VTUBER = toggle;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
showMenuButton("#btnBrowsersourceVtuber", toggle);
|
showMenuButton('#btnBrowsersourceVtuber', toggle);
|
||||||
|
createNotification(
|
||||||
|
`${toggle ? 'Enabled' : 'Disabled'} Vtuber setting!, the service will stop working after restarting the application`,
|
||||||
|
'success',
|
||||||
|
);
|
||||||
|
server.startVtuber();
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#USE_CHATBUBBLE').addEventListener('change', () => {
|
document.body.querySelector('#USE_CHATBUBBLE').addEventListener('change', () => {
|
||||||
const toggle = document.getElementById('USE_CHATBUBBLE').checked;
|
const toggle = document.getElementById('USE_CHATBUBBLE').checked;
|
||||||
settings.SERVER.USE_CHATBUBBLE = toggle;
|
settings.SERVER.USE_CHATBUBBLE = toggle;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
showMenuButton("#btnBrowsersourceChat", toggle);
|
showMenuButton('#btnBrowsersourceChat', toggle);
|
||||||
|
createNotification(`${toggle ? 'Enabled' : 'Disabled'} chatbubble setting!`, 'success');
|
||||||
|
server.startChatBubble();
|
||||||
});
|
});
|
||||||
|
|
||||||
// Get the selected TTS
|
function toggleTTS() {
|
||||||
const currentlySelectedTTS = ttsSelector.querySelector(`#${settings.TTS.SELECTED_TTS}`);
|
const toggle = settings.TTS.USE_TTS;
|
||||||
|
const inputs = document.getElementsByClassName('inputTTS');
|
||||||
if (currentlySelectedTTS) {
|
toggleRadio(toggle, inputs);
|
||||||
currentlySelectedTTS.checked = true;
|
|
||||||
|
|
||||||
// Dispatch the event to initialize logic.
|
|
||||||
currentlySelectedTTS.dispatchEvent(new Event('change'));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toggleTTS();
|
||||||
|
|
||||||
|
document.body.querySelector('#USE_TTS').addEventListener('change', () => {
|
||||||
|
const toggle = document.getElementById('USE_TTS').checked;
|
||||||
|
settings.TTS.USE_TTS = toggle;
|
||||||
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
const inputs = document.getElementsByClassName('inputTTS');
|
||||||
|
toggleRadio(toggle, inputs);
|
||||||
|
createNotification(`${toggle ? 'Enabled' : 'Disabled'} text to speech!`, 'success');
|
||||||
|
});
|
||||||
|
|
||||||
|
function toggleNotificationSounds() {
|
||||||
|
const toggle = settings.AUDIO.USE_NOTIFICATION_SOUNDS;
|
||||||
|
const inputs = document.getElementsByClassName('inputNotificationSound');
|
||||||
|
toggleRadio(toggle, inputs);
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleNotificationSounds();
|
||||||
|
|
||||||
|
document.body.querySelector('#USE_NOTIFICATION_SOUNDS').addEventListener('change', () => {
|
||||||
|
const toggle = document.getElementById('USE_NOTIFICATION_SOUNDS').checked;
|
||||||
|
settings.AUDIO.USE_NOTIFICATION_SOUNDS = toggle;
|
||||||
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
const inputs = document.getElementsByClassName('inputNotificationSound');
|
||||||
|
toggleRadio(toggle, inputs);
|
||||||
|
createNotification(`${toggle ? 'Enabled' : 'Disabled'} notification sounds!`, 'success');
|
||||||
|
});
|
||||||
|
|
||||||
|
document.body.querySelector('#notificationVolume').addEventListener('change', () => {
|
||||||
|
let element = document.body.querySelector('#notificationVolume');
|
||||||
|
settings.AUDIO.NOTIFICATION_VOLUME = element.value;
|
||||||
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
|
||||||
|
const slider = document.querySelector('#notificationVolumeSlider');
|
||||||
|
slider.value = settings.AUDIO.NOTIFICATION_VOLUME;
|
||||||
|
slider.style.setProperty('--tiempotemporal', settings.AUDIO.NOTIFICATION_VOLUME);
|
||||||
|
|
||||||
|
createNotification('Saved notification volume!', 'success');
|
||||||
|
});
|
||||||
|
|
||||||
document.body.querySelector('#notificationVolumeSlider').addEventListener('change', () => {
|
document.body.querySelector('#notificationVolumeSlider').addEventListener('change', () => {
|
||||||
const e = document.querySelector('#notificationVolumeSlider');
|
const e = document.querySelector('#notificationVolumeSlider');
|
||||||
e.style.setProperty('--tiempotemporal', e.value);
|
e.style.setProperty('--tiempotemporal', e.value);
|
||||||
|
|
@ -330,10 +385,14 @@ document.body.querySelector('#notificationVolumeSlider').addEventListener('chang
|
||||||
e.style.setProperty('--tiempotemporal', e.value);
|
e.style.setProperty('--tiempotemporal', e.value);
|
||||||
document.querySelector('#notificationVolume').value = e.value;
|
document.querySelector('#notificationVolume').value = e.value;
|
||||||
settings.AUDIO.NOTIFICATION_VOLUME = e.value;
|
settings.AUDIO.NOTIFICATION_VOLUME = e.value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
document.body.querySelector('#notificationVolumeSlider').addEventListener('mouseup', () => {
|
||||||
|
createNotification('Saved notification volume!', 'success');
|
||||||
|
});
|
||||||
|
|
||||||
if (settings.AUDIO.NOTIFICATION_VOLUME) {
|
if (settings.AUDIO.NOTIFICATION_VOLUME) {
|
||||||
document.querySelector('#notificationVolumeSlider').value = settings.AUDIO.NOTIFICATION_VOLUME;
|
document.querySelector('#notificationVolumeSlider').value = settings.AUDIO.NOTIFICATION_VOLUME;
|
||||||
document.querySelector('#notificationVolumeSlider').dispatchEvent(new Event('change'));
|
document.querySelector('#notificationVolumeSlider').dispatchEvent(new Event('change'));
|
||||||
|
|
@ -341,6 +400,18 @@ if (settings.AUDIO.NOTIFICATION_VOLUME) {
|
||||||
document.querySelector('#notificationVolumeSlider').dispatchEvent(new Event('change', { value: 50 }));
|
document.querySelector('#notificationVolumeSlider').dispatchEvent(new Event('change', { value: 50 }));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
document.body.querySelector('#ttsVolume').addEventListener('change', () => {
|
||||||
|
let element = document.body.querySelector('#ttsVolume');
|
||||||
|
settings.TTS.TTS_VOLUME = element.value;
|
||||||
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
|
||||||
|
const slider = document.querySelector('#ttsVolumeSlider');
|
||||||
|
slider.value = settings.TTS.TTS_VOLUME;
|
||||||
|
slider.style.setProperty('--tiempotemporal', settings.TTS.TTS_VOLUME);
|
||||||
|
|
||||||
|
createNotification('Saved TTS volume!', 'success');
|
||||||
|
});
|
||||||
|
|
||||||
document.body.querySelector('#ttsVolumeSlider').addEventListener('change', () => {
|
document.body.querySelector('#ttsVolumeSlider').addEventListener('change', () => {
|
||||||
const e = document.querySelector('#ttsVolumeSlider');
|
const e = document.querySelector('#ttsVolumeSlider');
|
||||||
e.style.setProperty('--tiempotemporal', e.value);
|
e.style.setProperty('--tiempotemporal', e.value);
|
||||||
|
|
@ -351,18 +422,32 @@ document.body.querySelector('#ttsVolumeSlider').addEventListener('change', () =>
|
||||||
e.addEventListener('input', () => {
|
e.addEventListener('input', () => {
|
||||||
e.style.setProperty('--tiempotemporal', e.value);
|
e.style.setProperty('--tiempotemporal', e.value);
|
||||||
document.querySelector('#ttsVolume').value = e.value;
|
document.querySelector('#ttsVolume').value = e.value;
|
||||||
settings.AUDIO.TTS_VOLUME = e.value;
|
settings.TTS.TTS_VOLUME = e.value;
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
if (settings.AUDIO.TTS_VOLUME) {
|
document.body.querySelector('#ttsVolumeSlider').addEventListener('mouseup', () => {
|
||||||
document.querySelector('#ttsVolumeSlider').value = settings.AUDIO.TTS_VOLUME;
|
createNotification('Saved TTS volume!', 'success');
|
||||||
|
});
|
||||||
|
|
||||||
|
if (settings.TTS.TTS_VOLUME) {
|
||||||
|
document.querySelector('#ttsVolumeSlider').value = settings.TTS.TTS_VOLUME;
|
||||||
document.querySelector('#ttsVolumeSlider').dispatchEvent(new Event('change'));
|
document.querySelector('#ttsVolumeSlider').dispatchEvent(new Event('change'));
|
||||||
} else {
|
} else {
|
||||||
document.querySelector('#ttsVolumeSlider').dispatchEvent(new Event('change', { value: 50 }));
|
document.querySelector('#ttsVolumeSlider').dispatchEvent(new Event('change', { value: 50 }));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
document.body.querySelector('#ttsVolume').addEventListener('change', () => {
|
||||||
|
let element = document.body.querySelector('#ttsVolume');
|
||||||
|
settings.TTS.TTS_VOLUME = element.value;
|
||||||
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
|
||||||
|
const slider = document.querySelector('#ttsVolumeSlider');
|
||||||
|
slider.value = settings.TTS.TTS_VOLUME;
|
||||||
|
slider.style.setProperty('--tiempotemporal', settings.TTS.TTS_VOLUME);
|
||||||
|
});
|
||||||
|
|
||||||
document.body.querySelector('.language-selector').addEventListener('click', () => {
|
document.body.querySelector('.language-selector').addEventListener('click', () => {
|
||||||
var dropdown = document.body.querySelector('.language-dropdown');
|
var dropdown = document.body.querySelector('.language-dropdown');
|
||||||
dropdown.style.display = dropdown.style.display === 'block' ? 'none' : 'block';
|
dropdown.style.display = dropdown.style.display === 'block' ? 'none' : 'block';
|
||||||
|
|
@ -372,8 +457,8 @@ document.body.querySelector('.language-dropdown').addEventListener('mouseleave',
|
||||||
hideDropdown();
|
hideDropdown();
|
||||||
});
|
});
|
||||||
|
|
||||||
let languageSelector = document.querySelectorAll(".language-item");
|
let languageSelector = document.querySelectorAll('.language-item');
|
||||||
languageSelector.forEach(item => {
|
languageSelector.forEach((item) => {
|
||||||
item.addEventListener('click', (event) => {
|
item.addEventListener('click', (event) => {
|
||||||
const el = event.target;
|
const el = event.target;
|
||||||
// tip.innerText = el.getAttribute('language');
|
// tip.innerText = el.getAttribute('language');
|
||||||
|
|
@ -388,7 +473,6 @@ function hideDropdown() {
|
||||||
dropdown.style.display = 'none';
|
dropdown.style.display = 'none';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// let primaryTTSSelector = document.body.querySelector(".optgroup");
|
// let primaryTTSSelector = document.body.querySelector(".optgroup");
|
||||||
// primaryTTSSelector.forEach(item => {
|
// primaryTTSSelector.forEach(item => {
|
||||||
// item.addEventListener('hover', (event) => {
|
// item.addEventListener('hover', (event) => {
|
||||||
|
|
@ -398,10 +482,6 @@ function hideDropdown() {
|
||||||
// });
|
// });
|
||||||
// });
|
// });
|
||||||
|
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
ini,
|
|
||||||
settings,
|
|
||||||
getGeneralSettings,
|
getGeneralSettings,
|
||||||
setCustomThemeToggle
|
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,8 @@ let currentUsername = '';
|
||||||
let voiceSoundArray = [];
|
let voiceSoundArray = [];
|
||||||
let status = 0;
|
let status = 0;
|
||||||
|
|
||||||
const playTTS = (ttsData) => new Promise((resolve) => {
|
const playTTS = (ttsData) =>
|
||||||
|
new Promise((resolve) => {
|
||||||
const tts = new Audio(ttsData.path);
|
const tts = new Audio(ttsData.path);
|
||||||
|
|
||||||
tts.addEventListener('ended', () => {
|
tts.addEventListener('ended', () => {
|
||||||
|
|
@ -17,13 +18,19 @@ const playTTS = (ttsData) => new Promise((resolve) => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
tts.setSinkId(config.settings.AUDIO.TTS_AUDIO_DEVICE).then(() => {
|
tts.setSinkId(settings.AUDIO.TTS_AUDIO_DEVICE)
|
||||||
|
.then(() => {
|
||||||
|
tts.volume = settings.TTS.TTS_VOLUME / 100;
|
||||||
tts.play();
|
tts.play();
|
||||||
|
|
||||||
|
if (settings.SERVER.USE_SERVER) {
|
||||||
socket.emit('xxx', currentLogoUrl, currentUsername, ttsData.message);
|
socket.emit('xxx', currentLogoUrl, currentUsername, ttsData.message);
|
||||||
}).catch((error) => {
|
}
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
console.error('Failed to set audio output device:', error);
|
console.error('Failed to set audio output device:', error);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
async function shiftVoice() {
|
async function shiftVoice() {
|
||||||
status = 1;
|
status = 1;
|
||||||
|
|
@ -41,18 +48,19 @@ function add(ttsData) {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Play sound function
|
// Play sound function
|
||||||
function playAudio(ttsData = undefined) {
|
function playAudio(data) {
|
||||||
let audioPath;
|
if (settings.AUDIO.USE_NOTIFICATION_SOUNDS) {
|
||||||
if (!ttsData) {
|
let notfication = new Audio(
|
||||||
let notfication = undefined;
|
path.join(resourcesPath, `../src/sounds/notifications/${notificationSound.options[settings.AUDIO.NOTIFICATION_SOUND].text}`),
|
||||||
if (envInfo.env) {
|
);
|
||||||
notfication = new Audio(path.join(envInfo.path, `./sounds/notifications/${notificationSound.options[config.settings.AUDIO.NOTIFICATION_SOUND].text}`));
|
notfication.volume = settings.AUDIO.NOTIFICATION_VOLUME / 100;
|
||||||
} else {
|
|
||||||
notfication = new Audio(path.join(__dirname, `../sounds/notifications/${notificationSound.options[config.settings.AUDIO.NOTIFICATION_SOUND].text}`));
|
|
||||||
}
|
|
||||||
notfication.play();
|
notfication.play();
|
||||||
} else {
|
}
|
||||||
add(ttsData);
|
|
||||||
|
if (settings.TTS.USE_TTS) {
|
||||||
|
add(data);
|
||||||
|
} else if (settings.SERVER.USE_SERVER) {
|
||||||
|
socket.emit('xxx', currentLogoUrl, currentUsername, data);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -60,19 +68,26 @@ function playVoice(filteredMessage, logoUrl, username, message) {
|
||||||
trueMessage = filteredMessage;
|
trueMessage = filteredMessage;
|
||||||
currentLogoUrl = logoUrl;
|
currentLogoUrl = logoUrl;
|
||||||
currentUsername = username;
|
currentUsername = username;
|
||||||
let textObject = { "filtered": filteredMessage, "formatted": message };
|
let textObject = { filtered: filteredMessage, formatted: message };
|
||||||
let voice;
|
let voice;
|
||||||
const language = langdetect.detect(filteredMessage);
|
const language = langdetect.detect(filteredMessage);
|
||||||
|
|
||||||
if (language[0].lang === config.settings.TTS.SECONDARY_TTS_LANGUAGE.toLowerCase()) {
|
if (
|
||||||
voice = config.settings.TTS.SECONDARY_TTS_NAME;
|
settings.TTS.PRIMARY_TTS_LANGUAGE.toLowerCase() !== settings.TTS.SECONDARY_TTS_LANGUAGE.toLowerCase() ||
|
||||||
|
language[0].lang === settings.TTS.SECONDARY_TTS_LANGUAGE.toLowerCase()
|
||||||
|
) {
|
||||||
|
voice = settings.TTS.SECONDARY_TTS_NAME;
|
||||||
textObject.filtered = `${username}: ${filteredMessage}`;
|
textObject.filtered = `${username}: ${filteredMessage}`;
|
||||||
} else {
|
} else {
|
||||||
voice = config.settings.TTS.PRIMARY_TTS_NAME;
|
voice = settings.TTS.PRIMARY_TTS_NAME;
|
||||||
textObject.filtered = `${username}: ${filteredMessage}`;
|
textObject.filtered = `${username}: ${filteredMessage}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (settings.TTS.USE_TTS) {
|
||||||
talk.add(textObject, voice);
|
talk.add(textObject, voice);
|
||||||
|
} else {
|
||||||
|
playAudio(textObject);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = { playAudio, playVoice };
|
module.exports = { playAudio, playVoice };
|
||||||
|
|
|
||||||
166
src/js/theme.js
166
src/js/theme.js
|
|
@ -1,89 +1,49 @@
|
||||||
function setTheme(USE_CUSTOM_THEME) {
|
function changeColor(section, setting, tempSection) {
|
||||||
document.querySelector('#MAIN_COLOR_1').value = config.settings.THEME.MAIN_COLOR_1;
|
document.querySelector(section).value = setting;
|
||||||
const MAIN_COLOR_1 = document.querySelector('#MAIN_COLOR_1').value;
|
const value = document.querySelector(section).value;
|
||||||
root.style.setProperty('--main-color1-temp', MAIN_COLOR_1);
|
root.style.setProperty(tempSection, value);
|
||||||
|
}
|
||||||
document.querySelector('#MAIN_COLOR_2').value = config.settings.THEME.MAIN_COLOR_2;
|
|
||||||
const MAIN_COLOR_2 = document.querySelector('#MAIN_COLOR_2').value;
|
function setCurrentTheme(adjustTemp = false) {
|
||||||
root.style.setProperty('--main-color2-temp', MAIN_COLOR_2);
|
changeColor("#MAIN_COLOR_1", settings.THEME.MAIN_COLOR_1, adjustTemp ? "--main-color1-temp" : "--main-color1");
|
||||||
|
changeColor("#MAIN_COLOR_2", settings.THEME.MAIN_COLOR_2, adjustTemp ? "--main-color2-temp" : "--main-color2");
|
||||||
document.querySelector('#MAIN_COLOR_3').value = config.settings.THEME.MAIN_COLOR_3;
|
changeColor("#MAIN_COLOR_3", settings.THEME.MAIN_COLOR_3, adjustTemp ? "--main-color3-temp" : "--main-color3");
|
||||||
const MAIN_COLOR_3 = document.querySelector('#MAIN_COLOR_3').value;
|
changeColor("#MAIN_COLOR_4", settings.THEME.MAIN_COLOR_4, adjustTemp ? "--main-color4-temp" : "--main-color4");
|
||||||
root.style.setProperty('--main-color3-temp', MAIN_COLOR_3);
|
changeColor("#TOP_BAR", settings.THEME.TOP_BAR, adjustTemp ? "--top-bar-temp" : "--top-bar");
|
||||||
|
changeColor("#MID_SECTION", settings.THEME.MID_SECTION, adjustTemp ? "--mid-section-temp" : "--mid-section");
|
||||||
document.querySelector('#MAIN_COLOR_4').value = config.settings.THEME.MAIN_COLOR_4;
|
changeColor("#CHAT_BUBBLE_BG", settings.THEME.CHAT_BUBBLE_BG, adjustTemp ? "--chat-bubble-temp" : "--chat-bubble");
|
||||||
const MAIN_COLOR_4 = document.querySelector('#MAIN_COLOR_4').value;
|
changeColor("#CHAT_BUBBLE_HEADER", settings.THEME.CHAT_BUBBLE_HEADER, adjustTemp ? "--chat-bubble-header-temp" : "--chat-bubble-header");
|
||||||
root.style.setProperty('--main-color4-temp', MAIN_COLOR_4);
|
changeColor("#CHAT_BUBBLE_MESSAGE", settings.THEME.CHAT_BUBBLE_MESSAGE, adjustTemp ? "--chat-bubble-message-temp" : "--chat-bubble-message");
|
||||||
|
}
|
||||||
document.querySelector('#TOP_BAR').value = config.settings.THEME.TOP_BAR;
|
|
||||||
const TOP_BAR = document.querySelector('#TOP_BAR').value;
|
setCurrentTheme(true);
|
||||||
root.style.setProperty('--top-bar-temp', TOP_BAR);
|
|
||||||
|
function setTheme() {
|
||||||
document.querySelector('#MID_SECTION').value = config.settings.THEME.MID_SECTION;
|
if (settings.THEME.USE_CUSTOM_THEME) {
|
||||||
const MID_SECTION = document.querySelector('#MID_SECTION').value;
|
setCurrentTheme();
|
||||||
root.style.setProperty('--mid-section-temp', MID_SECTION);
|
} else {
|
||||||
|
root.style.setProperty('--main-color1', '#6e2c8c');
|
||||||
document.querySelector('#CHAT_BUBBLE_BG').value = config.settings.THEME.CHAT_BUBBLE_BG;
|
root.style.setProperty('--main-color2', 'white');
|
||||||
const CHAT_BUBBLE_BG = document.querySelector('#CHAT_BUBBLE_BG').value;
|
root.style.setProperty('--main-color3', '#211E1E');
|
||||||
root.style.setProperty('--chat-bubble-temp', CHAT_BUBBLE_BG);
|
root.style.setProperty('--main-color4', '#2f2c34');
|
||||||
|
root.style.setProperty('--top-bar', '#100B12');
|
||||||
document.querySelector('#CHAT_BUBBLE_HEADER').value = config.settings.THEME.CHAT_BUBBLE_HEADER;
|
root.style.setProperty('--mid-section', '#352d3d');
|
||||||
const CHAT_BUBBLE_HEADER = document.querySelector('#CHAT_BUBBLE_HEADER').value;
|
root.style.setProperty('--chat-bubble', ' #7A6D7F');
|
||||||
root.style.setProperty('--chat-bubble-header-temp', CHAT_BUBBLE_HEADER);
|
root.style.setProperty('--chat-bubble-header', '#141414');
|
||||||
|
root.style.setProperty('--chat-bubble-message', 'white');
|
||||||
document.querySelector('#CHAT_BUBBLE_MESSAGE').value = config.settings.THEME.CHAT_BUBBLE_MESSAGE;
|
};
|
||||||
const CHAT_BUBBLE_MESSAGE = document.querySelector('#CHAT_BUBBLE_MESSAGE').value;
|
|
||||||
root.style.setProperty('--chat-bubble-message-temp', CHAT_BUBBLE_MESSAGE);
|
|
||||||
|
|
||||||
if (USE_CUSTOM_THEME) {
|
|
||||||
root.style.setProperty('--main-color1', MAIN_COLOR_1);
|
|
||||||
|
|
||||||
root.style.setProperty('--main-color2', MAIN_COLOR_2);
|
|
||||||
|
|
||||||
root.style.setProperty('--main-color3', MAIN_COLOR_3);
|
|
||||||
|
|
||||||
root.style.setProperty('--main-color4', MAIN_COLOR_4);
|
|
||||||
|
|
||||||
root.style.setProperty('--top-bar', TOP_BAR);
|
|
||||||
|
|
||||||
root.style.setProperty('--mid-section', MID_SECTION);
|
|
||||||
|
|
||||||
root.style.setProperty('--chat-bubble', CHAT_BUBBLE_BG);
|
|
||||||
|
|
||||||
root.style.setProperty('--chat-bubble-header', CHAT_BUBBLE_HEADER);
|
|
||||||
|
|
||||||
root.style.setProperty('--chat-bubble-message', CHAT_BUBBLE_MESSAGE);
|
|
||||||
} else {
|
|
||||||
root.style.setProperty('--main-color1', '#6e2c8c');
|
|
||||||
|
|
||||||
root.style.setProperty('--main-color2', 'white');
|
|
||||||
|
|
||||||
root.style.setProperty('--main-color3', '#211E1E');
|
|
||||||
|
|
||||||
root.style.setProperty('--main-color4', '#2f2c34');
|
|
||||||
|
|
||||||
root.style.setProperty('--top-bar', '#100B12');
|
|
||||||
|
|
||||||
root.style.setProperty('--mid-section', '#352d3d');
|
|
||||||
|
|
||||||
root.style.setProperty('--chat-bubble', ' #7A6D7F');
|
|
||||||
|
|
||||||
root.style.setProperty('--chat-bubble-header', '#141414');
|
|
||||||
|
|
||||||
root.style.setProperty('--chat-bubble-message', 'white');
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// #region Save Theme
|
|
||||||
document.body.querySelector('#MAIN_COLOR_1').addEventListener('input', () => {
|
document.body.querySelector('#MAIN_COLOR_1').addEventListener('input', () => {
|
||||||
const x = document.getElementById('MAIN_COLOR_1').value;
|
const x = document.getElementById('MAIN_COLOR_1').value;
|
||||||
root.style.setProperty('--main-color1-temp', x);
|
root.style.setProperty('--main-color1-temp', x);
|
||||||
|
console.log(x);
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MAIN_COLOR_1').addEventListener('change', () => {
|
document.body.querySelector('#MAIN_COLOR_1').addEventListener('change', () => {
|
||||||
config.settings.THEME.MAIN_COLOR_1 = document.getElementById('MAIN_COLOR_1').value;
|
settings.THEME.MAIN_COLOR_1 = document.getElementById('MAIN_COLOR_1').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#MAIN_COLOR_1", settings.THEME.MAIN_COLOR_1, "--main-color1");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MAIN_COLOR_2').addEventListener('input', () => {
|
document.body.querySelector('#MAIN_COLOR_2').addEventListener('input', () => {
|
||||||
|
|
@ -92,9 +52,9 @@ document.body.querySelector('#MAIN_COLOR_2').addEventListener('input', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MAIN_COLOR_2').addEventListener('change', () => {
|
document.body.querySelector('#MAIN_COLOR_2').addEventListener('change', () => {
|
||||||
config.settings.THEME.MAIN_COLOR_2 = document.getElementById('MAIN_COLOR_2').value;
|
settings.THEME.MAIN_COLOR_2 = document.getElementById('MAIN_COLOR_2').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#MAIN_COLOR_2", settings.THEME.MAIN_COLOR_2, "--main-color2");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MAIN_COLOR_3').addEventListener('input', () => {
|
document.body.querySelector('#MAIN_COLOR_3').addEventListener('input', () => {
|
||||||
|
|
@ -103,9 +63,9 @@ document.body.querySelector('#MAIN_COLOR_3').addEventListener('input', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MAIN_COLOR_3').addEventListener('change', () => {
|
document.body.querySelector('#MAIN_COLOR_3').addEventListener('change', () => {
|
||||||
config.settings.THEME.MAIN_COLOR_3 = document.getElementById('MAIN_COLOR_3').value;
|
settings.THEME.MAIN_COLOR_3 = document.getElementById('MAIN_COLOR_3').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#MAIN_COLOR_3", settings.THEME.MAIN_COLOR_3, "--main-color3");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MAIN_COLOR_4').addEventListener('input', () => {
|
document.body.querySelector('#MAIN_COLOR_4').addEventListener('input', () => {
|
||||||
|
|
@ -114,9 +74,9 @@ document.body.querySelector('#MAIN_COLOR_4').addEventListener('input', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MAIN_COLOR_4').addEventListener('change', () => {
|
document.body.querySelector('#MAIN_COLOR_4').addEventListener('change', () => {
|
||||||
config.settings.THEME.MAIN_COLOR_4 = document.getElementById('MAIN_COLOR_4').value;
|
settings.THEME.MAIN_COLOR_4 = document.getElementById('MAIN_COLOR_4').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#MAIN_COLOR_4", settings.THEME.MAIN_COLOR_4, "--main-color4");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#TOP_BAR').addEventListener('input', () => {
|
document.body.querySelector('#TOP_BAR').addEventListener('input', () => {
|
||||||
|
|
@ -125,9 +85,9 @@ document.body.querySelector('#TOP_BAR').addEventListener('input', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#TOP_BAR').addEventListener('change', () => {
|
document.body.querySelector('#TOP_BAR').addEventListener('change', () => {
|
||||||
config.settings.THEME.TOP_BAR = document.getElementById('TOP_BAR').value;
|
settings.THEME.TOP_BAR = document.getElementById('TOP_BAR').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#TOP_BAR", settings.THEME.TOP_BAR, "--top-bar");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MID_SECTION').addEventListener('input', () => {
|
document.body.querySelector('#MID_SECTION').addEventListener('input', () => {
|
||||||
|
|
@ -136,9 +96,9 @@ document.body.querySelector('#MID_SECTION').addEventListener('input', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#MID_SECTION').addEventListener('change', () => {
|
document.body.querySelector('#MID_SECTION').addEventListener('change', () => {
|
||||||
config.settings.THEME.MID_SECTION = document.getElementById('MID_SECTION').value;
|
settings.THEME.MID_SECTION = document.getElementById('MID_SECTION').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#MID_SECTION", settings.THEME.MID_SECTION, "--mid-section");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#CHAT_BUBBLE_BG').addEventListener('input', () => {
|
document.body.querySelector('#CHAT_BUBBLE_BG').addEventListener('input', () => {
|
||||||
|
|
@ -147,9 +107,9 @@ document.body.querySelector('#CHAT_BUBBLE_BG').addEventListener('input', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#CHAT_BUBBLE_BG').addEventListener('change', () => {
|
document.body.querySelector('#CHAT_BUBBLE_BG').addEventListener('change', () => {
|
||||||
config.settings.THEME.CHAT_BUBBLE_BG = document.getElementById('CHAT_BUBBLE_BG').value;
|
settings.THEME.CHAT_BUBBLE_BG = document.getElementById('CHAT_BUBBLE_BG').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#CHAT_BUBBLE_BG", settings.THEME.CHAT_BUBBLE_BG, "--chat-bubble");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#CHAT_BUBBLE_HEADER').addEventListener('input', () => {
|
document.body.querySelector('#CHAT_BUBBLE_HEADER').addEventListener('input', () => {
|
||||||
|
|
@ -158,9 +118,9 @@ document.body.querySelector('#CHAT_BUBBLE_HEADER').addEventListener('input', ()
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#CHAT_BUBBLE_HEADER').addEventListener('change', () => {
|
document.body.querySelector('#CHAT_BUBBLE_HEADER').addEventListener('change', () => {
|
||||||
config.settings.THEME.CHAT_BUBBLE_HEADER = document.getElementById('CHAT_BUBBLE_HEADER').value;
|
settings.THEME.CHAT_BUBBLE_HEADER = document.getElementById('CHAT_BUBBLE_HEADER').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#CHAT_BUBBLE_HEADER", settings.THEME.CHAT_BUBBLE_HEADER, "--chat-bubble-header");
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#CHAT_BUBBLE_MESSAGE').addEventListener('input', () => {
|
document.body.querySelector('#CHAT_BUBBLE_MESSAGE').addEventListener('input', () => {
|
||||||
|
|
@ -169,11 +129,9 @@ document.body.querySelector('#CHAT_BUBBLE_MESSAGE').addEventListener('input', ()
|
||||||
});
|
});
|
||||||
|
|
||||||
document.body.querySelector('#CHAT_BUBBLE_MESSAGE').addEventListener('change', () => {
|
document.body.querySelector('#CHAT_BUBBLE_MESSAGE').addEventListener('change', () => {
|
||||||
config.settings.THEME.CHAT_BUBBLE_MESSAGE = document.getElementById('CHAT_BUBBLE_MESSAGE').value;
|
settings.THEME.CHAT_BUBBLE_MESSAGE = document.getElementById('CHAT_BUBBLE_MESSAGE').value;
|
||||||
fs.writeFileSync(path.join(__dirname, '../config/settings.ini'), config.ini.stringify(config.settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
setTheme(config.settings.THEME.USE_CUSTOM_THEME);
|
changeColor("#CHAT_BUBBLE_MESSAGE", settings.THEME.CHAT_BUBBLE_MESSAGE, "--chat-bubble-message");
|
||||||
});
|
});
|
||||||
|
|
||||||
// #endregion
|
|
||||||
|
|
||||||
module.exports = { setTheme };
|
module.exports = { setTheme };
|
||||||
|
|
|
||||||
|
|
@ -1,22 +1,45 @@
|
||||||
const tmi = require('tmi.js');
|
const tmi = require('tmi.js');
|
||||||
const axios = require('axios');
|
const axios = require('axios');
|
||||||
|
|
||||||
const client = new tmi.Client({
|
let client;
|
||||||
|
|
||||||
|
function sendMessage(message) {
|
||||||
|
client.say(settings.TWITCH.CHANNEL_NAME, message).catch(console.error);
|
||||||
|
}
|
||||||
|
|
||||||
|
client = new tmi.Client({
|
||||||
options: {
|
options: {
|
||||||
skipUpdatingEmotesets: true,
|
skipUpdatingEmotesets: true,
|
||||||
},
|
},
|
||||||
identity: {
|
identity: {
|
||||||
username: config.settings.TWITCH.USERNAME,
|
username: settings.TWITCH.USERNAME,
|
||||||
password: config.settings.TWITCH.OAUTH_TOKEN,
|
password: settings.TWITCH.OAUTH_TOKEN,
|
||||||
},
|
},
|
||||||
channels: [config.settings.TWITCH.CHANNEL_NAME],
|
channels: [settings.TWITCH.CHANNEL_NAME],
|
||||||
});
|
});
|
||||||
|
|
||||||
function sendMessage(message) {
|
client
|
||||||
client.say(config.settings.TWITCH.CHANNEL_NAME, message).catch(console.error);
|
.connect()
|
||||||
}
|
.then((data) => {})
|
||||||
|
.catch(console.error);
|
||||||
|
|
||||||
client.connect().catch(console.error);
|
function ping(element) {
|
||||||
|
let value = document.body.querySelector(element);
|
||||||
|
|
||||||
|
client
|
||||||
|
.ping()
|
||||||
|
.then((data) => {
|
||||||
|
console.log(client.readyState());
|
||||||
|
console.log(data);
|
||||||
|
value.classList.add('success');
|
||||||
|
value.innerText = 'Success!';
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
console.log(e);
|
||||||
|
value.classList.add('error');
|
||||||
|
value.innerText = 'Failed!';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function displayTwitchMessage(logoUrl, username, messageObject, fileteredMessage) {
|
function displayTwitchMessage(logoUrl, username, messageObject, fileteredMessage) {
|
||||||
const article = document.createElement('article');
|
const article = document.createElement('article');
|
||||||
|
|
@ -41,12 +64,12 @@ function displayTwitchMessage(logoUrl, username, messageObject, fileteredMessage
|
||||||
|
|
||||||
const msg = article.querySelector('.msg');
|
const msg = article.querySelector('.msg');
|
||||||
if (msg) {
|
if (msg) {
|
||||||
msg.innerHTML = "";
|
msg.innerHTML = '';
|
||||||
|
|
||||||
const messageElement = document.createElement("div");
|
const messageElement = document.createElement('div');
|
||||||
|
|
||||||
messageObject.forEach((entry) => {
|
messageObject.forEach((entry) => {
|
||||||
const messageElement = document.createElement("div");
|
const messageElement = document.createElement('div');
|
||||||
if (entry.text) {
|
if (entry.text) {
|
||||||
messageElement.innerText = entry.text;
|
messageElement.innerText = entry.text;
|
||||||
msg.appendChild(messageElement);
|
msg.appendChild(messageElement);
|
||||||
|
|
@ -54,7 +77,7 @@ function displayTwitchMessage(logoUrl, username, messageObject, fileteredMessage
|
||||||
messageElement.innerHTML = entry.html;
|
messageElement.innerHTML = entry.html;
|
||||||
msg.appendChild(messageElement);
|
msg.appendChild(messageElement);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Appends the message to the main chat box (shows the message)
|
// Appends the message to the main chat box (shows the message)
|
||||||
|
|
@ -68,35 +91,20 @@ function displayTwitchMessage(logoUrl, username, messageObject, fileteredMessage
|
||||||
}
|
}
|
||||||
|
|
||||||
function getProfileImage(userid, username, message, fileteredMessage) {
|
function getProfileImage(userid, username, message, fileteredMessage) {
|
||||||
// Get Access Token
|
|
||||||
let options = {
|
|
||||||
method: 'POST',
|
|
||||||
url: 'https://id.twitch.tv/oauth2/token',
|
|
||||||
data: {
|
|
||||||
grant_type: 'client_credentials',
|
|
||||||
client_Id: config.settings.TWITCH.CLIENT_ID,
|
|
||||||
client_Secret: config.settings.TWITCH.CLIENT_SECRET,
|
|
||||||
audience: 'YOUR_API_IDENTIFIER',
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
axios.request(options).then((responseAccessToken) => {
|
|
||||||
const accessToken = responseAccessToken.data.access_token;
|
|
||||||
|
|
||||||
// Get user Logo with access token
|
// Get user Logo with access token
|
||||||
options = {
|
options = {
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
url: `https://api.twitch.tv/helix/users?id=${userid}`,
|
url: `https://api.twitch.tv/helix/users?id=${userid}`,
|
||||||
headers: { 'Client-ID': config.settings.TWITCH.CLIENT_ID, Authorization: `Bearer ${accessToken}` },
|
headers: { 'Client-ID': settings.TWITCH.CLIENT_ID, Authorization: `Bearer ${settings.TWITCH.OAUTH_TOKEN}` },
|
||||||
};
|
};
|
||||||
|
|
||||||
axios.request(options).then((responseLogoUrl) => {
|
axios
|
||||||
|
.request(options)
|
||||||
|
.then((responseLogoUrl) => {
|
||||||
const logoUrl = responseLogoUrl.data.data[0].profile_image_url;
|
const logoUrl = responseLogoUrl.data.data[0].profile_image_url;
|
||||||
displayTwitchMessage(logoUrl, username, message, fileteredMessage);
|
displayTwitchMessage(logoUrl, username, message, fileteredMessage);
|
||||||
}).catch((error) => {
|
})
|
||||||
console.error(error);
|
.catch((error) => {
|
||||||
});
|
|
||||||
}).catch((error) => {
|
|
||||||
console.error(error);
|
console.error(error);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -108,9 +116,10 @@ function parseString(inputString) {
|
||||||
|
|
||||||
for (let i = 0; i < matches.length; i++) {
|
for (let i = 0; i < matches.length; i++) {
|
||||||
const match = matches[i].trim();
|
const match = matches[i].trim();
|
||||||
if (match.startsWith("<img")) {
|
if (match.startsWith('<img')) {
|
||||||
result.push({ html: match });
|
result.push({ html: match });
|
||||||
} if (match !== '' && !match.startsWith("<img")) {
|
}
|
||||||
|
if (match !== '' && !match.startsWith('<img')) {
|
||||||
result.push({ text: match });
|
result.push({ text: match });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -121,7 +130,6 @@ client.on('message', (channel, tags, message, self) => {
|
||||||
if (self) {
|
if (self) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const emotes = tags.emotes || {};
|
const emotes = tags.emotes || {};
|
||||||
const emoteValues = Object.entries(emotes);
|
const emoteValues = Object.entries(emotes);
|
||||||
let fileteredMessage = message;
|
let fileteredMessage = message;
|
||||||
|
|
@ -133,14 +141,11 @@ client.on('message', (channel, tags, message, self) => {
|
||||||
let emote = `<img src="https://static-cdn.jtvnw.net/emoticons/v2/${entry[0]}/default/dark/1.0"/>`;
|
let emote = `<img src="https://static-cdn.jtvnw.net/emoticons/v2/${entry[0]}/default/dark/1.0"/>`;
|
||||||
emoteMessage = emoteMessage.replaceAll(message.slice(parseInt(start), parseInt(end) + 1), emote);
|
emoteMessage = emoteMessage.replaceAll(message.slice(parseInt(start), parseInt(end) + 1), emote);
|
||||||
fileteredMessage = fileteredMessage.replaceAll(message.slice(parseInt(start), parseInt(end) + 1), '');
|
fileteredMessage = fileteredMessage.replaceAll(message.slice(parseInt(start), parseInt(end) + 1), '');
|
||||||
})
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
let messageObject = parseString(emoteMessage)
|
let messageObject = parseString(emoteMessage);
|
||||||
|
|
||||||
sound.playAudio();
|
|
||||||
getProfileImage(tags['user-id'], tags['display-name'], messageObject, fileteredMessage);
|
getProfileImage(tags['user-id'], tags['display-name'], messageObject, fileteredMessage);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
module.exports = { sendMessage, ping, client };
|
||||||
module.exports = { sendMessage };
|
|
||||||
|
|
|
||||||
|
|
@ -2,26 +2,21 @@ let SelectedVoice = '';
|
||||||
let Encoding = '';
|
let Encoding = '';
|
||||||
let counter = 0;
|
let counter = 0;
|
||||||
// wrap in promise
|
// wrap in promise
|
||||||
const speak = (textObject) => new Promise((resolve) => {
|
const speak = (textObject) =>
|
||||||
|
new Promise((resolve) => {
|
||||||
// say.setEncoding(Encoding);
|
// say.setEncoding(Encoding);
|
||||||
counter += 1;
|
counter += 1;
|
||||||
let savePath = '';
|
let savePath = path.join(resourcesPath, '../src/sounds/tts/internal_audio_' + counter + '.mp3');
|
||||||
|
|
||||||
if (envInfo.env) {
|
|
||||||
savePath = path.join(envInfo.path, './sounds/tts/internal_audio_' + counter + '.mp3')
|
|
||||||
} else {
|
|
||||||
savePath = path.join(__dirname, '../sounds/tts/internal_audio_' + counter + '.mp3')
|
|
||||||
}
|
|
||||||
|
|
||||||
say.export(textObject.filtered, SelectedVoice, 1, savePath, (err) => {
|
say.export(textObject.filtered, SelectedVoice, 1, savePath, (err) => {
|
||||||
if (err) {
|
if (err) {
|
||||||
console.error(err);
|
console.error(err);
|
||||||
} else {
|
} else {
|
||||||
sound.playAudio({ "path": savePath, "message": textObject });
|
sound.playAudio({ path: savePath, message: textObject });
|
||||||
}
|
}
|
||||||
resolve('finished');
|
resolve('finished');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// queue system
|
// queue system
|
||||||
class SayQueue {
|
class SayQueue {
|
||||||
|
|
@ -41,7 +36,9 @@ class SayQueue {
|
||||||
add(message, selectedVoice) {
|
add(message, selectedVoice) {
|
||||||
this.messages.push(message);
|
this.messages.push(message);
|
||||||
SelectedVoice = selectedVoice;
|
SelectedVoice = selectedVoice;
|
||||||
if (this.status === 0) { this.shift(); }
|
if (this.status === 0) {
|
||||||
|
this.shift();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
184
src/main.js
184
src/main.js
|
|
@ -1,18 +1,19 @@
|
||||||
const { app, BrowserWindow, ipcMain } = require('electron');
|
const { app, shell, BrowserWindow, ipcMain } = require('electron');
|
||||||
const { writeIniFile } = require('write-ini-file')
|
const writeIniFile = require('write-ini-file');
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
|
|
||||||
const ini = require('ini');
|
const ini = require('ini');
|
||||||
const fs = require('fs');
|
const fs = require('fs');
|
||||||
|
|
||||||
let resourcesPath;
|
let resourcesPath;
|
||||||
|
let settingsPath;
|
||||||
let settings;
|
let settings;
|
||||||
let window;
|
let window;
|
||||||
|
|
||||||
if (app.isPackaged) {
|
if (app.isPackaged) {
|
||||||
resourcesPath = path.join(process.resourcesPath, './settings.ini');
|
resourcesPath = process.resourcesPath;
|
||||||
} else {
|
} else {
|
||||||
resourcesPath = path.join(__dirname, './config/settings.ini');
|
resourcesPath = __dirname;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Handle creating/removing shortcuts on Windows when installing/uninstalling.
|
// Handle creating/removing shortcuts on Windows when installing/uninstalling.
|
||||||
|
|
@ -22,13 +23,14 @@ if (require('electron-squirrel-startup')) {
|
||||||
|
|
||||||
async function createWindow() {
|
async function createWindow() {
|
||||||
if (!fs.existsSync(resourcesPath)) {
|
if (!fs.existsSync(resourcesPath)) {
|
||||||
await createIniFile(resourcesPath);
|
await createIniFile(path.join(resourcesPath, '../config/settings.ini'));
|
||||||
} else {
|
} else {
|
||||||
settings = ini.parse(fs.readFileSync(resourcesPath, 'utf-8'));
|
settingsPath = path.join(resourcesPath, './config/settings.ini');
|
||||||
|
settings = ini.parse(fs.readFileSync(settingsPath, 'utf-8'));
|
||||||
}
|
}
|
||||||
|
|
||||||
window = new BrowserWindow({
|
window = new BrowserWindow({
|
||||||
icon: path.join(__dirname, '/images/icon.png'),
|
icon: path.join(resourcesPath, '/images/icon.png'),
|
||||||
width: parseInt(settings.SETTINGS.WIDTH),
|
width: parseInt(settings.SETTINGS.WIDTH),
|
||||||
height: parseInt(settings.SETTINGS.HEIGHT),
|
height: parseInt(settings.SETTINGS.HEIGHT),
|
||||||
x: parseInt(settings.SETTINGS.POSITION_X),
|
x: parseInt(settings.SETTINGS.POSITION_X),
|
||||||
|
|
@ -40,16 +42,16 @@ async function createWindow() {
|
||||||
enableRemoteModule: true,
|
enableRemoteModule: true,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
window.loadURL('https://github.com')
|
window.loadURL('https://github.com');
|
||||||
|
|
||||||
window.loadFile(path.join(__dirname, 'index.html'));
|
window.loadFile(path.join(resourcesPath, 'index.html'));
|
||||||
|
|
||||||
if (!app.isPackaged) {
|
if (!app.isPackaged) {
|
||||||
window.webContents.openDevTools();
|
window.webContents.openDevTools();
|
||||||
}
|
}
|
||||||
|
|
||||||
window.on('close', e => {
|
window.on('close', (e) => {
|
||||||
settings = ini.parse(fs.readFileSync(resourcesPath, 'utf-8')); // load newest settings in case anything changed after starting the program
|
settings = ini.parse(fs.readFileSync(settingsPath, 'utf-8')); // load newest settings in case anything changed after starting the program
|
||||||
const bounds = window.getBounds();
|
const bounds = window.getBounds();
|
||||||
|
|
||||||
settings.SETTINGS.WIDTH = bounds.width;
|
settings.SETTINGS.WIDTH = bounds.width;
|
||||||
|
|
@ -57,13 +59,13 @@ async function createWindow() {
|
||||||
settings.SETTINGS.POSITION_X = bounds.x;
|
settings.SETTINGS.POSITION_X = bounds.x;
|
||||||
settings.SETTINGS.POSITION_Y = bounds.y;
|
settings.SETTINGS.POSITION_Y = bounds.y;
|
||||||
|
|
||||||
fs.writeFileSync(resourcesPath, ini.stringify(settings));
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
})
|
});
|
||||||
};
|
}
|
||||||
|
|
||||||
app.whenReady().then(() => {
|
app.whenReady().then(() => {
|
||||||
createWindow();
|
createWindow();
|
||||||
})
|
});
|
||||||
|
|
||||||
app.on('window-all-closed', (event) => {
|
app.on('window-all-closed', (event) => {
|
||||||
if (process.platform !== 'darwin') {
|
if (process.platform !== 'darwin') {
|
||||||
|
|
@ -105,8 +107,99 @@ ipcMain.on('close-window', (event) => {
|
||||||
app.quit();
|
app.quit();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
ipcMain.on('restart', (event) => {
|
||||||
|
app.relaunch();
|
||||||
|
});
|
||||||
|
|
||||||
ipcMain.on('environment', (event) => {
|
ipcMain.on('environment', (event) => {
|
||||||
event.returnValue = { "env": app.isPackaged, "path": process.resourcesPath };
|
event.returnValue = { resourcesPath: resourcesPath, settingsPath: settingsPath, settings: settings };
|
||||||
|
});
|
||||||
|
|
||||||
|
let twitchAuthentication = () =>
|
||||||
|
new Promise((resolve) => {
|
||||||
|
const http = require('http');
|
||||||
|
const redirectUri = 'http://localhost:1989/auth';
|
||||||
|
const scopes = ['chat:edit', 'chat:read'];
|
||||||
|
|
||||||
|
const express = require('express');
|
||||||
|
let tempAuthServer = express();
|
||||||
|
const port = 1989;
|
||||||
|
|
||||||
|
const { parse: parseQueryString } = require('querystring');
|
||||||
|
|
||||||
|
tempAuthServer.use(function (req, res, next) {
|
||||||
|
if (req.url !== '/auth') {
|
||||||
|
let token = parseQueryString(req.query.auth);
|
||||||
|
settings.TWITCH.OAUTH_TOKEN = token['#access_token'];
|
||||||
|
fs.writeFileSync(settingsPath, ini.stringify(settings));
|
||||||
|
settings = ini.parse(fs.readFileSync(settingsPath, 'utf-8'));
|
||||||
|
resolve('finished');
|
||||||
|
stopServer();
|
||||||
|
}
|
||||||
|
next();
|
||||||
|
});
|
||||||
|
|
||||||
|
function stopServer() {
|
||||||
|
tempAuthServer.close();
|
||||||
|
}
|
||||||
|
|
||||||
|
const htmlString = `
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Authentication</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>Authentication successful! You can close this window now.</h1>
|
||||||
|
<form name="auth" "action="auth" method="get" >
|
||||||
|
<input type="text" id="auth" name="auth"/>
|
||||||
|
<input type="submit" />
|
||||||
|
</form>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
<script>
|
||||||
|
function onSubmitComplete() {
|
||||||
|
close();
|
||||||
|
}
|
||||||
|
document.querySelector("#auth").value = document.location.hash;
|
||||||
|
document.auth.submit();
|
||||||
|
setTimeout(onSubmitComplete, 500);
|
||||||
|
</script>
|
||||||
|
`;
|
||||||
|
|
||||||
|
tempAuthServer.get('/auth', (req, res) => {
|
||||||
|
res.send(htmlString);
|
||||||
|
});
|
||||||
|
|
||||||
|
tempAuthServer.post('/auth', (req, res) => {
|
||||||
|
res.render('authentication', { name: req.body.name });
|
||||||
|
});
|
||||||
|
|
||||||
|
const server = http.createServer(tempAuthServer);
|
||||||
|
|
||||||
|
server.listen(port, () => {
|
||||||
|
const authURL = `https://id.twitch.tv/oauth2/authorize?client_id=${settings.TWITCH.CLIENT_ID}&redirect_uri=${encodeURIComponent(
|
||||||
|
redirectUri,
|
||||||
|
)}&response_type=token&scope=${scopes.join(' ')}`;
|
||||||
|
shell.openExternal(authURL);
|
||||||
|
});
|
||||||
|
|
||||||
|
function stopServer() {
|
||||||
|
server.close(() => {});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
ipcMain.on('twitch', async (event) => {
|
||||||
|
await twitchAuthentication();
|
||||||
|
event.returnValue = settings.TWITCH.OAUTH_TOKEN;
|
||||||
|
});
|
||||||
|
|
||||||
|
ipcMain.on('vtuber', async (event) => {
|
||||||
|
shell.openExternal(`http://localhost:${settings.SERVER.PORT}/vtuber/`);
|
||||||
|
});
|
||||||
|
|
||||||
|
ipcMain.on('chatBubble', async (event) => {
|
||||||
|
shell.openExternal(`http://localhost:${settings.SERVER.PORT}/chat/`);
|
||||||
});
|
});
|
||||||
|
|
||||||
async function createIniFile() {
|
async function createIniFile() {
|
||||||
|
|
@ -118,62 +211,63 @@ async function createIniFile() {
|
||||||
POSITION_Y: 0,
|
POSITION_Y: 0,
|
||||||
WIDTH: 1024,
|
WIDTH: 1024,
|
||||||
HEIGHT: 768,
|
HEIGHT: 768,
|
||||||
LANGUAGE: "EN"
|
LANGUAGE: 'EN',
|
||||||
},
|
},
|
||||||
TTS: {
|
TTS: {
|
||||||
|
USE_TTS: true,
|
||||||
PRIMARY_TTS_VOICE: 0,
|
PRIMARY_TTS_VOICE: 0,
|
||||||
PRIMARY_TTS_NAME: "",
|
PRIMARY_TTS_NAME: '',
|
||||||
PRIMARY_TTS_LANGUAGE: "EN",
|
PRIMARY_TTS_LANGUAGE: 'EN',
|
||||||
PRIMARY_TTS_LANGUAGE_INDEX: 0,
|
PRIMARY_TTS_LANGUAGE_INDEX: 0,
|
||||||
SECONDARY_TTS_VOICE: 0,
|
SECONDARY_TTS_VOICE: 0,
|
||||||
SECONDARY_TTS_NAME: "",
|
SECONDARY_TTS_NAME: '',
|
||||||
SECONDARY_TTS_LANGUAGE: "EN",
|
SECONDARY_TTS_LANGUAGE: 'EN',
|
||||||
SECONDARY_TTS_LANGUAGE_INDEX: 0
|
SECONDARY_TTS_LANGUAGE_INDEX: 0,
|
||||||
|
TTS_VOLUME: 50,
|
||||||
},
|
},
|
||||||
AUDIO: {
|
AUDIO: {
|
||||||
|
USE_NOTIFICATION_SOUNDS: true,
|
||||||
NOTIFICATION_AUDIO_DEVICE: 0,
|
NOTIFICATION_AUDIO_DEVICE: 0,
|
||||||
NOTIFICATION_SOUND: 0,
|
NOTIFICATION_SOUND: 0,
|
||||||
NOTIFICATION_VOLUME: 100,
|
NOTIFICATION_VOLUME: 50,
|
||||||
SELECTED_TTS_AUDIO_DEVICE: 0,
|
SELECTED_TTS_AUDIO_DEVICE: 0,
|
||||||
TTS_AUDIO_DEVICE: "default",
|
TTS_AUDIO_DEVICE: 'default',
|
||||||
TTS_VOLUME: 100
|
|
||||||
},
|
},
|
||||||
THEME: {
|
THEME: {
|
||||||
USE_CUSTOM_THEME: false,
|
USE_CUSTOM_THEME: false,
|
||||||
MAIN_COLOR_1: "\#cdc1c1",
|
MAIN_COLOR_1: '#cdc1c1',
|
||||||
MAIN_COLOR_2: "\#b12020",
|
MAIN_COLOR_2: '#b12020',
|
||||||
MAIN_COLOR_3: "\#6c4104",
|
MAIN_COLOR_3: '#6c4104',
|
||||||
MAIN_COLOR_4: "\#532d2d",
|
MAIN_COLOR_4: '#532d2d',
|
||||||
TOP_BAR: "\#c8ff00",
|
TOP_BAR: '#c8ff00',
|
||||||
MID_SECTION: "\#6b8578",
|
MID_SECTION: '#6b8578',
|
||||||
CHAT_BUBBLE_BG: "\#447466",
|
CHAT_BUBBLE_BG: '#447466',
|
||||||
CHAT_BUBBLE_HEADER: "\#ffffff",
|
CHAT_BUBBLE_HEADER: '#ffffff',
|
||||||
CHAT_BUBBLE_MESSAGE: "\#b5b5b5",
|
CHAT_BUBBLE_MESSAGE: '#b5b5b5',
|
||||||
},
|
},
|
||||||
TWITCH: {
|
TWITCH: {
|
||||||
USE_TWITCH: false,
|
USE_TWITCH: false,
|
||||||
CHANNEL_NAME: "khyretos",
|
CHANNEL_NAME: '',
|
||||||
USERNAME: "loquendo",
|
USERNAME: 'loquendo',
|
||||||
OAUTH_TOKEN: "",
|
OAUTH_TOKEN: '',
|
||||||
CLIENT_ID: "",
|
CLIENT_ID: '2t206sj7rvtr1rutob3p627d13jch9',
|
||||||
CLIENT_SECRET: "",
|
|
||||||
},
|
},
|
||||||
SERVER: {
|
SERVER: {
|
||||||
USE_SERVER: false,
|
USE_SERVER: false,
|
||||||
PORT: "9000",
|
PORT: '9000',
|
||||||
USE_VTUBER: false,
|
USE_VTUBER: false,
|
||||||
USE_CHATBUBBLE: false,
|
USE_CHATBUBBLE: false,
|
||||||
},
|
},
|
||||||
AMAZON: {
|
AMAZON: {
|
||||||
USE_TWITCH: false,
|
USE_TWITCH: false,
|
||||||
ACCESS_KEY: "",
|
ACCESS_KEY: '',
|
||||||
ACCESS_SECRET: "",
|
ACCESS_SECRET: '',
|
||||||
},
|
},
|
||||||
GOOGLE: {
|
GOOGLE: {
|
||||||
USE_GOOGLE: false,
|
USE_GOOGLE: false,
|
||||||
API_KEY: "",
|
API_KEY: '',
|
||||||
}
|
},
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
settings = ini.parse(fs.readFileSync(resourcesPath, 'utf-8'));
|
settings = ini.parse(fs.readFileSync(resourcesPath, 'utf-8'));
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -1,3 +1,4 @@
|
||||||
|
|
||||||
// Connect to the Socket.IO server
|
// Connect to the Socket.IO server
|
||||||
const socket = io();
|
const socket = io();
|
||||||
|
|
||||||
|
|
|
||||||
BIN
src/sounds/tts/internal_audio_6.mp3
Normal file
BIN
src/sounds/tts/internal_audio_6.mp3
Normal file
Binary file not shown.
Loading…
Reference in a new issue