From 13957d740bad5094e2e8c6bbffaa3a836d2f43dd Mon Sep 17 00:00:00 2001 From: XtoMHA96 Date: Sun, 8 Oct 2023 12:05:57 +0100 Subject: [PATCH 1/4] Add icons and bugfixes - Added icons to window titles - Fix for when the primary language is not in the translation - Obtaining data when it is necessary to work with it - Added more buttons to the topbar - Added close button description --- core/client.js | 9 ++++++-- core/index.html | 13 ++++++++++++ core/template/cdown/control/blank.html | 5 +++++ core/template/cdown/control/control.js | 8 ++++++-- core/template/cdown/control/index.html | 5 +++++ core/template/cdown/view/client.js | 4 +++- core/template/cdown/view/index.html | 5 +++++ core/template/cdowntime/control/blank.html | 5 +++++ core/template/cdowntime/control/control.js | 8 ++++++-- core/template/cdowntime/control/index.html | 5 +++++ core/template/cdowntime/view/client.js | 4 +++- core/template/cdowntime/view/index.html | 5 +++++ core/template/crono/control/blank.html | 5 +++++ core/template/crono/control/control.js | 8 ++++++-- core/template/crono/control/index.html | 5 +++++ core/template/crono/view/client.js | 4 +++- core/template/crono/view/index.html | 5 +++++ core/template/time/control/blank.html | 5 +++++ core/template/time/control/control.js | 8 ++++++-- core/template/time/control/index.html | 5 +++++ core/template/time/view/client.js | 4 +++- core/template/time/view/index.html | 5 +++++ core/topbar.css | 24 +++++++++++++++++++++- core/translates/en.yaml | 1 + core/translates/es.yaml | 1 + server.js | 6 ++++++ 26 files changed, 147 insertions(+), 15 deletions(-) diff --git a/core/client.js b/core/client.js index a6baf07..4d3b258 100644 --- a/core/client.js +++ b/core/client.js @@ -35,6 +35,7 @@ socket.addEventListener('message', (event) => { // Configuration and translation switchTheme.checked = message.config.themedark + buttonClose.title = translateElements.home.close if (message.config.themedark) { document.body.classList.remove('light-theme') document.body.classList.add('dark-theme') @@ -50,8 +51,12 @@ socket.addEventListener('message', (event) => { option.textContent = message.formats.langs[format] languageSelector.appendChild(option) }) - languageSelector.value = message.config.lang - document.documentElement.lang = message.config.lang + languageSelector.value = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' titleCrono.textContent = translateElements.home.cronoTitle titleCdown.textContent = translateElements.home.cdownTitle diff --git a/core/index.html b/core/index.html index 5f4f5da..73cd91b 100644 --- a/core/index.html +++ b/core/index.html @@ -10,6 +10,11 @@ href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css" /> Inicio +
@@ -17,6 +22,14 @@ + diff --git a/core/template/cdown/control/blank.html b/core/template/cdown/control/blank.html index b0c1366..1e32f96 100644 --- a/core/template/cdown/control/blank.html +++ b/core/template/cdown/control/blank.html @@ -4,6 +4,11 @@ URL Action + diff --git a/core/template/cdown/control/control.js b/core/template/cdown/control/control.js index af96642..3af8b38 100644 --- a/core/template/cdown/control/control.js +++ b/core/template/cdown/control/control.js @@ -75,8 +75,12 @@ socket.addEventListener('message', (event) => { option.textContent = message.formats.langs[format] selectorLang.appendChild(option) }) - selectorLang.value = message.config.lang - document.documentElement.lang = message.config.lang + selectorLang.value = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' controlButton.textContent = translateElements.crono.buttons.start resetButton.textContent = translateElements.crono.buttons.reset diff --git a/core/template/cdown/control/index.html b/core/template/cdown/control/index.html index c3a5b2d..60cda1c 100644 --- a/core/template/cdown/control/index.html +++ b/core/template/cdown/control/index.html @@ -14,6 +14,11 @@ crossorigin="anonymous" > +
diff --git a/core/template/cdown/view/client.js b/core/template/cdown/view/client.js index df4c040..492550e 100644 --- a/core/template/cdown/view/client.js +++ b/core/template/cdown/view/client.js @@ -27,7 +27,9 @@ socket.addEventListener('message', (event) => { } if (message.action === 'sendVariables' && message.classElement === classElement && message.config) { - document.documentElement.lang = message.config.lang + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' } if (message[classElement].milliseconds !== undefined) { diff --git a/core/template/cdown/view/index.html b/core/template/cdown/view/index.html index e18f7dd..240ceab 100644 --- a/core/template/cdown/view/index.html +++ b/core/template/cdown/view/index.html @@ -9,6 +9,11 @@ crossorigin="anonymous" > + diff --git a/core/template/cdowntime/control/blank.html b/core/template/cdowntime/control/blank.html index b0c1366..1e32f96 100644 --- a/core/template/cdowntime/control/blank.html +++ b/core/template/cdowntime/control/blank.html @@ -4,6 +4,11 @@ URL Action + diff --git a/core/template/cdowntime/control/control.js b/core/template/cdowntime/control/control.js index 37df142..5e9506d 100644 --- a/core/template/cdowntime/control/control.js +++ b/core/template/cdowntime/control/control.js @@ -74,8 +74,12 @@ socket.addEventListener('message', (event) => { option.textContent = message.formats.langs[format] selectorLang.appendChild(option) }) - selectorLang.value = message.config.lang - document.documentElement.lang = message.config.lang + selectorLang.value = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' if (elementVariables && typeof elementVariables === 'object') { checkHexColor = elementVariables.colorText diff --git a/core/template/cdowntime/control/index.html b/core/template/cdowntime/control/index.html index 9f78624..57f46a6 100644 --- a/core/template/cdowntime/control/index.html +++ b/core/template/cdowntime/control/index.html @@ -14,6 +14,11 @@ crossorigin="anonymous" > +
diff --git a/core/template/cdowntime/view/client.js b/core/template/cdowntime/view/client.js index 8a92051..df5c846 100644 --- a/core/template/cdowntime/view/client.js +++ b/core/template/cdowntime/view/client.js @@ -26,7 +26,9 @@ socket.addEventListener('message', (event) => { } if (message.action === 'sendVariables' && message.classElement === classElement && message.config) { - document.documentElement.lang = message.config.lang + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' } if (message[classElement].endDatetime !== undefined) { diff --git a/core/template/cdowntime/view/index.html b/core/template/cdowntime/view/index.html index e18f7dd..240ceab 100644 --- a/core/template/cdowntime/view/index.html +++ b/core/template/cdowntime/view/index.html @@ -9,6 +9,11 @@ crossorigin="anonymous" > + diff --git a/core/template/crono/control/blank.html b/core/template/crono/control/blank.html index b0c1366..1e32f96 100644 --- a/core/template/crono/control/blank.html +++ b/core/template/crono/control/blank.html @@ -4,6 +4,11 @@ URL Action + diff --git a/core/template/crono/control/control.js b/core/template/crono/control/control.js index 7875383..689bdf2 100644 --- a/core/template/crono/control/control.js +++ b/core/template/crono/control/control.js @@ -73,8 +73,12 @@ socket.addEventListener('message', (event) => { option.textContent = message.formats.langs[format] languageSelector.appendChild(option) }) - languageSelector.value = message.config.lang - document.documentElement.lang = message.config.lang + languageSelector.value = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' controlButton.textContent = translateElements.crono.buttons.start resetButton.textContent = translateElements.crono.buttons.reset diff --git a/core/template/crono/control/index.html b/core/template/crono/control/index.html index c72a80b..542db62 100644 --- a/core/template/crono/control/index.html +++ b/core/template/crono/control/index.html @@ -10,6 +10,11 @@ href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css" /> +
diff --git a/core/template/crono/view/client.js b/core/template/crono/view/client.js index f935f08..d070a88 100644 --- a/core/template/crono/view/client.js +++ b/core/template/crono/view/client.js @@ -25,7 +25,9 @@ socket.addEventListener('message', (event) => { } if (message.action === 'sendVariables' && message.classElement === classElement && message.config) { - document.documentElement.lang = message.config.lang + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' } if (message[classElement].milliseconds !== undefined) { diff --git a/core/template/crono/view/index.html b/core/template/crono/view/index.html index 43079ed..6009ce0 100644 --- a/core/template/crono/view/index.html +++ b/core/template/crono/view/index.html @@ -6,6 +6,11 @@ + diff --git a/core/template/time/control/blank.html b/core/template/time/control/blank.html index b0c1366..1e32f96 100644 --- a/core/template/time/control/blank.html +++ b/core/template/time/control/blank.html @@ -4,6 +4,11 @@ URL Action + diff --git a/core/template/time/control/control.js b/core/template/time/control/control.js index 90a591a..4c8f059 100644 --- a/core/template/time/control/control.js +++ b/core/template/time/control/control.js @@ -71,8 +71,12 @@ socket.addEventListener('message', (event) => { option.textContent = message.formats.langs[format] langSelector.appendChild(option) }) - langSelector.value = message.config.lang - document.documentElement.lang = message.config.lang + langSelector.value = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' if (elementVariables && typeof elementVariables === 'object') { checkHexColor = elementVariables.colorText diff --git a/core/template/time/control/index.html b/core/template/time/control/index.html index 9209539..ace01e9 100644 --- a/core/template/time/control/index.html +++ b/core/template/time/control/index.html @@ -14,6 +14,11 @@ crossorigin="anonymous" > +
diff --git a/core/template/time/view/client.js b/core/template/time/view/client.js index de9872c..011990f 100644 --- a/core/template/time/view/client.js +++ b/core/template/time/view/client.js @@ -26,7 +26,9 @@ socket.addEventListener('message', (event) => { } if (message.action === 'sendVariables' && message.classElement === classElement && message.config) { - document.documentElement.lang = message.config.lang + document.documentElement.lang = Object.keys(message.formats.langs).includes(message.config.lang) + ? message.config.lang + : 'en' } if (message[classElement].timezone !== undefined) { diff --git a/core/template/time/view/index.html b/core/template/time/view/index.html index e18f7dd..240ceab 100644 --- a/core/template/time/view/index.html +++ b/core/template/time/view/index.html @@ -9,6 +9,11 @@ crossorigin="anonymous" > + diff --git a/core/topbar.css b/core/topbar.css index af5283a..cd88969 100644 --- a/core/topbar.css +++ b/core/topbar.css @@ -16,7 +16,7 @@ border: 2px solid #f44336; border-radius: 5px; color: white; - vertical-align: top; + vertical-align: bottom; margin-top: 3.5px; cursor: pointer; flex-grow: 1; @@ -27,6 +27,28 @@ border: 2px solid #d9362e; } +.link-button { + font-size: 15px; + background-color: #000; + border: 2px solid #000; + border-radius: 5px; + color: white; + vertical-align: bottom; + margin-top: 3.5px; + cursor: pointer; + flex-grow: 1; +} + +.link-button:hover { + background-color: #444; /* Fondo gris más oscuro al pasar el ratón */ + border: 2px solid #444; +} + +#github-button { + font-size: 15px; + color: white; +} + .language-span { font-size: 30px; /* Tamaño de fuente */ margin-right: 10px; diff --git a/core/translates/en.yaml b/core/translates/en.yaml index 1d4250d..53af065 100644 --- a/core/translates/en.yaml +++ b/core/translates/en.yaml @@ -1,4 +1,5 @@ home: + close: Close the window and stop the code cronoTitle: TIMERS cdownTitle: COUNTDOWNS cdowntimeTitle: TIME UNTIL... diff --git a/core/translates/es.yaml b/core/translates/es.yaml index 29ad6d2..0b88dce 100644 --- a/core/translates/es.yaml +++ b/core/translates/es.yaml @@ -1,4 +1,5 @@ home: + close: Cierra la ventana y detiene el código cronoTitle: CRONÓMETROS cdownTitle: TEMPORIZADORES cdowntimeTitle: TIEMPO HASTA... diff --git a/server.js b/server.js index 01529e4..9e92bde 100644 --- a/server.js +++ b/server.js @@ -15,6 +15,9 @@ if (argsv[0] !== 'test') { process.chdir(executablePath) } +// The icons for the web page titles are obtained from: +// https://www.iconfinder.com/search?q=&designer=kmgdesignid&price=free + const { loadDataFromYAML, saveVariablesToYAML, @@ -68,6 +71,8 @@ wss.on('connection', (ws) => { ws.on('message', (message) => { const data = JSON.parse(message) + GlobalVariables = loadDataFromYAML((argsv[0] === 'test') ? './core/db.yaml' : './resources/app/core/db.yaml') + if (data.action === 'reloadPage') { wss.clients.forEach((client) => { if (client.readyState === WebSocket.OPEN) { @@ -317,6 +322,7 @@ app.get('/:classElement/control', (req, res) => { app.get('/:classElement/control&:request', (req, res) => { const classElement = req.params.classElement const request = req.params.request + GlobalVariables = loadDataFromYAML((argsv[0] === 'test') ? './core/db.yaml' : './resources/app/core/db.yaml') // Here you can check the value of 'request' and perform the corresponding action if (request === 'start' && !classElement.startsWith('cdowntime') && !classElement.startsWith('time')) { From 8d4d5e4cda576698897ecf680ca067ba0b18865a Mon Sep 17 00:00:00 2001 From: XtoMHA96 Date: Sun, 8 Oct 2023 12:48:43 +0100 Subject: [PATCH 2/4] Start of README - Translation fix --- README.md | 4 +++- core/translates/en.yaml | 8 ++++---- 2 files changed, 7 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index b595649..8b74196 100644 --- a/README.md +++ b/README.md @@ -1 +1,3 @@ -# obs-timer-controller \ No newline at end of file +# obs-timer-controller + +

This repository is used for creating dynamic browser sources related to timers, ideal for use in OBS (Open Broadcaster Software).

\ No newline at end of file diff --git a/core/translates/en.yaml b/core/translates/en.yaml index 53af065..0c31e22 100644 --- a/core/translates/en.yaml +++ b/core/translates/en.yaml @@ -1,13 +1,13 @@ home: close: Close the window and stop the code - cronoTitle: TIMERS - cdownTitle: COUNTDOWNS + cronoTitle: CLOCKS + cdownTitle: TIMERS cdowntimeTitle: TIME UNTIL... - twitchextTitle: TWITCH EXTENSIBLE + twitchextTitle: EXTENSIBLE TWITCH timeTitle: CURRENT TIME notycopycrono: URL copied to clipboard crono: buttons: start: Start pause: Pause - reset: Reset \ No newline at end of file + reset: Reset From 14bc4c858a4e4e7ae0b9b93435cd3386fa10e429 Mon Sep 17 00:00:00 2001 From: XtoMHA96 Date: Sun, 8 Oct 2023 15:40:35 +0100 Subject: [PATCH 3/4] Update README.md --- README.md | 41 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 40 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 8b74196..f2e989e 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,42 @@ # obs-timer-controller -

This repository is used for creating dynamic browser sources related to timers, ideal for use in OBS (Open Broadcaster Software).

\ No newline at end of file +

This repository is used for creating dynamic browser sources related to timers, ideal for use in OBS (Open Broadcaster Software).

+ +
+GitHub package.json version +GitHub last commit (by committer) +GitHub release (latest by SemVer including pre-releases) +GitHub watchers +GitHub forks +GitHub Repo stars +
+Made with NodeJS +Made with HTML +Made with CSS +
+NodeJS version +npm version +
+ +## Collaborators + + + + +___ + +### Description + +This code allows you to create timers, countdowns, countdowns to a specific time, and display the current time. Each of these features comes with a browser source for OBS, which you can preview in your browser and configure to your needs. + +One of the additional functions of this repository is the ability to modify the timers through events sent from a StreamDeck or a similar tool using websockets. + +### About the Code + +I have chosen to publish this code to make it accessible for free, openly, and as open-source. These codes I have developed have helped me continue learning, and since it doesn't entail any financial cost for me, there will also be no paid features created. It will be open to anyone who wants to use it and collaborate in improving the code. + +The codes have been created with my current knowledge and may contain errors or areas that need improvement. I have worked on this code in my free time. + +### Documentation + +~~WIKI~~ (In construction) \ No newline at end of file From 1125235ad58bcd785dec7b14eae0003bbe3228e8 Mon Sep 17 00:00:00 2001 From: XtoMHA96 Date: Sun, 8 Oct 2023 15:43:40 +0100 Subject: [PATCH 4/4] Version 1.0.1 --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 9e10c11..5d8215a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "obs-timer-controller", - "version": "1.0.0", + "version": "1.0.1", "description": "Handling browser fonts for OBS related to timers and countdowns.", "main": "server.js", "repository": { @@ -22,7 +22,7 @@ "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "node": "node . test", - "pkg": "electron-packager . OBS-Timer-Controller --platform=win32 --arch=x64 --out=dist --overwrite --icon=icon.ico --app-version=1.0.0 --author=\"XtoManuel\" --description=\"Handling browser fonts for OBS related to timers and countdowns.\"" + "pkg": "electron-packager . OBS-Timer-Controller --platform=win32 --arch=x64 --out=dist --overwrite --icon=icon.ico --app-version=1.0.1 --author=\"XtoManuel\" --description=\"Handling browser fonts for OBS related to timers and countdowns.\"" }, "author": "XtoManuel", "license": "ISC",