Skip to content

Commit e1e31dd

Browse files
XtoManuelXtoManuel
authored
Merge pull request #4 from BrowserSourcesForOBS/dev
v1.0.2
2 parents 6827952 + c578a73 commit e1e31dd

File tree

17 files changed

+103
-54
lines changed

17 files changed

+103
-54
lines changed

‎README.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,17 +33,17 @@
3333
<a href="https://nodejs.org/en">
3434
<img src="https://img.shields.io/badge/MADE%20WITH-NodeJS-yellow?style=for-the-badge&logo=javascript" alt="Made with NodeJS" style="vertical-align:middle">
3535
</a>
36-
<a>
36+
<a href="https://github.com/BrowserSourcesForOBS/obs-timer-controller">
3737
<img src="https://img.shields.io/badge/MADE%20WITH-HTML-orange?style=for-the-badge&logo=html5" alt="Made with HTML" style="vertical-align:middle">
3838
</a>
39-
<a>
39+
<a href="https://github.com/BrowserSourcesForOBS/obs-timer-controller">
4040
<img src="https://img.shields.io/badge/MADE%20WITH-CSS-blue?style=for-the-badge&logo=css3" alt="Made with CSS" style="vertical-align:middle">
4141
</a>
4242
<br>
4343
<a href="https://nodejs.org/en/download">
4444
<img src="https://img.shields.io/badge/VERSION-18.18.0%20LTS-yellow?style=for-the-badge&logo=javascript" alt="NodeJS version" style="vertical-align:middle">
4545
</a>
46-
<a href="https://nodejs.org/en/download">
46+
<a href="https://www.npmjs.com/">
4747
<img src="https://img.shields.io/badge/VERSION-10.2.0-red?style=for-the-badge&logo=npm" alt="npm version" style="vertical-align:middle">
4848
</a>
4949
</div>
@@ -69,4 +69,4 @@ The codes have been created with my current knowledge and may contain errors or
6969

7070
### :book: Documentation
7171

72-
~~WIKI~~ (In construction)
72+
#### [WIKI](https://github.com/BrowserSourcesForOBS/obs-timer-controller/wiki 'WIKI')

‎core/client.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ const buttonCdownContainer = document.getElementById('button-container-cdown')
55
const buttonCdowntimeContainer = document.getElementById('button-container-cdowntime')
66
const buttonTimeContainer = document.getElementById('button-container-time')
77
const buttonClose = document.getElementById('stop-code')
8+
const buttonWiki = document.getElementById('button-wiki')
89
const languageSelector = document.getElementById('language-selector')
910
const switchTheme = document.getElementById('switch-theme')
1011
const titleCrono = document.getElementById('crono-title')
@@ -36,6 +37,7 @@ socket.addEventListener('message', (event) => {
3637
// Configuration and translation
3738
switchTheme.checked = message.config.themedark
3839
buttonClose.title = translateElements.home.close
40+
buttonWiki.title = translateElements.home.wiki
3941
if (message.config.themedark) {
4042
document.body.classList.remove('light-theme')
4143
document.body.classList.add('dark-theme')

‎core/index.html‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<link rel="stylesheet" href="topbar.css" />
88
<link
99
rel="stylesheet"
10-
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css"
10+
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
1111
/>
1212
<title>Inicio</title>
1313
<link
@@ -30,6 +30,14 @@
3030
><i class="fa-brands fa-github"></i
3131
></a>
3232
</button>
33+
<button class="link-button" id="button-wiki">
34+
<a
35+
href="https://github.com/BrowserSourcesForOBS/obs-timer-controller/wiki"
36+
target="_blank"
37+
id="wiki-button"
38+
><i class="fas fa-book-open"></i
39+
></a>
40+
</button>
3341
</span>
3442
<span class="language-span"
3543
><i class="fas fa-language"></i>

‎core/template/cdown/control/control.js‎

Lines changed: 40 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ socket.addEventListener('message', (event) => {
5555

5656
if (message.action === 'sendVariables' && message.classElement === classElement) {
5757
// If the message contains variable data
58-
const ElementVariables = message.variables
58+
const elementVariables = message.variables
5959
translateElements = message.translateElements
6060

6161
// Config and translates
@@ -82,12 +82,12 @@ socket.addEventListener('message', (event) => {
8282
? message.config.lang
8383
: 'en'
8484

85-
controlButton.textContent = translateElements.crono.buttons.start
86-
resetButton.textContent = translateElements.crono.buttons.reset
85+
controlButton.textContent = translateElements.timer.buttons.start
86+
resetButton.textContent = translateElements.timer.buttons.reset
8787

88-
if (ElementVariables && typeof ElementVariables === 'object') {
89-
checkTextTime = MsToText(ElementVariables.textmilliseconds)
90-
checkHexColor = ElementVariables.colorText
88+
if (elementVariables && typeof elementVariables === 'object') {
89+
checkTextTime = MsToText(elementVariables.textmilliseconds)
90+
checkHexColor = elementVariables.colorText
9191

9292
// Format selector options
9393
formatSelector.innerHTML = ''
@@ -99,24 +99,32 @@ socket.addEventListener('message', (event) => {
9999
})
100100

101101
// Perform necessary actions with the variables here
102-
textMsg.textContent = ElementVariables.msgEnd
103-
timeText.value = MsToText(ElementVariables.textmilliseconds)
104-
formatSelector.value = ElementVariables.formatTime
105-
fontSelect.value = ElementVariables.font
106-
fontSize.value = ElementVariables.size
107-
textFormat(ElementVariables)
108-
formatAlign(ElementVariables.align)
109-
colorPicker.value = ElementVariables.colorText
110-
colorHex.value = ElementVariables.colorText
102+
textMsg.textContent = elementVariables.msgEnd
103+
if (elementVariables.msgEnd === '') {
104+
textMsg.textContent = translateElements.timer.ph_msgend
105+
textMsg.style.color = '#555'
106+
} else { textMsg.style.color = '#000' }
107+
timeText.value = MsToText(elementVariables.textmilliseconds)
108+
formatSelector.value = elementVariables.formatTime
109+
fontSelect.value = elementVariables.font
110+
fontSize.value = elementVariables.size
111+
textFormat(elementVariables)
112+
formatAlign(elementVariables.align)
113+
colorPicker.value = elementVariables.colorText
114+
colorHex.value = elementVariables.colorText
111115
if (translateElements) {
112-
updateControlButton(ElementVariables.status)
116+
updateControlButton(elementVariables.status)
113117
}
114118
} else {
115119
console.log('The server did not return valid data.')
116120
}
117121
} else {
118122
if (message[classElement].status !== 'started') {
119123
textMsg.textContent = message[classElement].msgEnd
124+
if (message[classElement].msgEnd === '') {
125+
textMsg.textContent = translateElements.timer.ph_msgend
126+
textMsg.style.color = '#555'
127+
} else { textMsg.style.color = '#000' }
120128
timeText.value = MsToText(message[classElement].textmilliseconds)
121129
formatSelector.value = message[classElement].formatTime
122130
fontSelect.value = message[classElement].font
@@ -149,7 +157,7 @@ selectorLang.addEventListener('change', () => {
149157
})
150158

151159
controlButton.addEventListener('click', () => {
152-
if (controlButton.textContent === translateElements.crono.buttons.start) {
160+
if (controlButton.textContent === translateElements.timer.buttons.start) {
153161
socket.send(JSON.stringify({ action: 'startCdown', classElement }))
154162
} else {
155163
socket.send(JSON.stringify({ action: 'pauseCdown', classElement }))
@@ -209,8 +217,19 @@ subContainer.addEventListener('click', (event) => {
209217
}
210218
})
211219

220+
textMsg.addEventListener('focus', () => {
221+
if (textMsg.textContent === translateElements.timer.ph_msgend) {
222+
textMsg.textContent = ''
223+
textMsg.style.color = '#000'
224+
}
225+
})
226+
212227
textMsg.addEventListener('blur', () => {
213228
socket.send(JSON.stringify({ action: 'editMsgCdown', msg: textMsg.textContent, classElement }))
229+
if (textMsg.textContent === '') {
230+
textMsg.textContent = translateElements.timer.ph_msgend
231+
textMsg.style.color = '#555'
232+
} else { textMsg.style.color = '#000' }
214233
})
215234

216235
formatSelector.addEventListener('change', () => {
@@ -309,17 +328,17 @@ function updateControlButton (status) {
309328
controlButton.style.width = maxWidth
310329

311330
if (status === 'started') {
312-
controlButton.textContent = translateElements.crono.buttons.pause
331+
controlButton.textContent = translateElements.timer.buttons.pause
313332
} else {
314-
controlButton.textContent = translateElements.crono.buttons.start
333+
controlButton.textContent = translateElements.timer.buttons.start
315334
}
316335
}
317336

318337
function getMaxButtonWidth () {
319338
const widths = []
320339

321-
Object.keys(translateElements.crono.buttons).forEach((value) => {
322-
controlButton.textContent = translateElements.crono.buttons[value]
340+
Object.keys(translateElements.timer.buttons).forEach((value) => {
341+
controlButton.textContent = translateElements.timer.buttons[value]
323342
widths.push(parseFloat(window.getComputedStyle(controlButton).getPropertyValue('width')))
324343
})
325344
// Get the maximum of the two widths

‎core/template/cdown/control/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<link rel="stylesheet" href="topbar.css" />
88
<link
99
rel="stylesheet"
10-
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css"
10+
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
1111
/>
1212
<script
1313
src="https://unpkg.com/twemoji@latest/dist/twemoji.min.js"

‎core/template/cdowntime/control/control.js‎

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const socket = new WebSocket('ws://localhost:3000')
2323

2424
const classElement = window.location.href.split('/')[3]
2525
titlePage.textContent = classElement + ' - Control'
26-
// let translateElements
26+
let translateElements
2727

2828
let checkHexColor
2929

@@ -55,7 +55,7 @@ socket.addEventListener('message', (event) => {
5555
if (message.action === 'sendVariables' && message.classElement === classElement) {
5656
// If the message contains variable data
5757
const elementVariables = message.variables
58-
// translateElements = message.translateElements;
58+
translateElements = message.translateElements
5959

6060
// Config and translates
6161
switchTheme.checked = message.config.themedark
@@ -81,6 +81,8 @@ socket.addEventListener('message', (event) => {
8181
? message.config.lang
8282
: 'en'
8383

84+
textMsg.innerHTML = 'Hola'
85+
8486
if (elementVariables && typeof elementVariables === 'object') {
8587
checkHexColor = elementVariables.colorText
8688

@@ -104,6 +106,10 @@ socket.addEventListener('message', (event) => {
104106

105107
// Perform necessary actions with the variables here
106108
textMsg.textContent = elementVariables.msgEnd
109+
if (elementVariables.msgEnd === '') {
110+
textMsg.textContent = translateElements.timer.ph_msgend
111+
textMsg.style.color = '#555'
112+
} else { textMsg.style.color = '#000' }
107113
timeData.value = new Date(elementVariables.endDatetime).toLocaleString('en-CA', { timeZone: elementVariables.timezone, hour12: false }).replace(/,\s/, 'T')
108114
timezoneSelector.value = elementVariables.timezone
109115
formatSelector.value = elementVariables.formatTime
@@ -182,8 +188,19 @@ subContainer.addEventListener('click', (event) => {
182188
}
183189
})
184190

191+
textMsg.addEventListener('focus', () => {
192+
if (textMsg.textContent === translateElements.timer.ph_msgend) {
193+
textMsg.textContent = ''
194+
textMsg.style.color = '#000'
195+
}
196+
})
197+
185198
textMsg.addEventListener('blur', () => {
186199
socket.send(JSON.stringify({ action: 'editMsgCdownTime', msg: textMsg.textContent, classElement }))
200+
if (textMsg.textContent === '') {
201+
textMsg.textContent = translateElements.timer.ph_msgend
202+
textMsg.style.color = '#555'
203+
} else { textMsg.style.color = '#000' }
187204
})
188205

189206
formatSelector.addEventListener('change', () => {

‎core/template/cdowntime/control/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<link rel="stylesheet" href="topbar.css" />
88
<link
99
rel="stylesheet"
10-
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css"
10+
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
1111
/>
1212
<script
1313
src="https://unpkg.com/twemoji@latest/dist/twemoji.min.js"

‎core/template/cdowntime/control/styles.css‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,6 @@ body {
6767
font-family: Arial, sans-serif;
6868
text-align: left;
6969
padding: 10px 20px; /* Espaciado interno */
70-
text-align: right;
7170
border: 2px solid #cccccc88; /* Borde */
7271
border-radius: 5px; /* Borde redondeado */
7372
margin-right: 10px;

‎core/template/crono/control/control.js‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -80,8 +80,8 @@ socket.addEventListener('message', (event) => {
8080
? message.config.lang
8181
: 'en'
8282

83-
controlButton.textContent = translateElements.crono.buttons.start
84-
resetButton.textContent = translateElements.crono.buttons.reset
83+
controlButton.textContent = translateElements.timer.buttons.start
84+
resetButton.textContent = translateElements.timer.buttons.reset
8585

8686
if (elementVariables && typeof elementVariables === 'object') {
8787
checkHexColor = elementVariables.colorText
@@ -139,7 +139,7 @@ languageSelector.addEventListener('change', () => {
139139
})
140140

141141
controlButton.addEventListener('click', () => {
142-
if (controlButton.textContent === translateElements.crono.buttons.start) {
142+
if (controlButton.textContent === translateElements.timer.buttons.start) {
143143
socket.send(JSON.stringify({ action: 'startCrono', classElement }))
144144
} else {
145145
socket.send(JSON.stringify({ action: 'pauseCrono', classElement }))
@@ -265,17 +265,17 @@ function updateControlButton (status) {
265265
controlButton.style.width = maxWidth
266266

267267
if (status === 'started') {
268-
controlButton.textContent = translateElements.crono.buttons.pause
268+
controlButton.textContent = translateElements.timer.buttons.pause
269269
} else {
270-
controlButton.textContent = translateElements.crono.buttons.start
270+
controlButton.textContent = translateElements.timer.buttons.start
271271
}
272272
}
273273

274274
function getMaxButtonWidth () {
275275
const widths = []
276276

277-
Object.keys(translateElements.crono.buttons).forEach((value) => {
278-
controlButton.textContent = translateElements.crono.buttons[value]
277+
Object.keys(translateElements.timer.buttons).forEach((value) => {
278+
controlButton.textContent = translateElements.timer.buttons[value]
279279
widths.push(parseFloat(window.getComputedStyle(controlButton).getPropertyValue('width')))
280280
})
281281

‎core/template/crono/control/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<link rel="stylesheet" href="topbar.css" />
88
<link
99
rel="stylesheet"
10-
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css"
10+
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
1111
/>
1212
<title id="titlePage"></title>
1313
<link

0 commit comments

Comments
 (0)