pomodoro/GoTomato
3
0
Fork 0
Code Issues Pull requests Releases 15 Activity

break: add updateSettings command to modify Pomodoro settings

Browse source 
- add `updateSettings` command to modify Pomodoro configuration
- remove ability to set Pomodoro configuration in `start` command
- update demo client
- update README

🤖
This commit is contained in:
Sebastian Mark 2024-10-22 08:51:22 +02:00
parent a0dba673a2
commit cb6616f400
5 changed files with 75 additions and 59 deletions
Download patch file Download diff file Expand all files Collapse all files

60
index.html
View file

@ -20,6 +20,13 @@
input {
width: 75px;
}
.settings {
border: 2px solid black;
background: #e7e7e7;
padding: 10px;
display: inline-block;
}
</style>
</head>
@ -27,23 +34,27 @@
<h1>Pomodoro Timer</h1>
<!-- Input fields for custom Pomodoro config and control password -->
<p>
<label for="password">Control Password:</label>
<input type="text" id="password" placeholder="Password" />
</p>
<p>
<label for="workDuration">Work Duration (seconds):</label>
<input type="number" id="workDuration" placeholder="Work time in seconds" value="900" />
<br />
<label for="shortBreakDuration">Short Break Duration (seconds):</label>
<input type="number" id="shortBreakDuration" placeholder="Short break in seconds" value="300" />
<br />
<label for="longBreakDuration">Long Break Duration (seconds):</label>
<input type="number" id="longBreakDuration" placeholder="Long break in seconds" value="600" />
<br />
<label for="sessions">Number of Sessions:</label>
<input type="number" id="sessions" placeholder="Number of sessions" value="4" />
</p>
<div class="settings">
<p>
<label for="password">Control Password:</label>
<input type="text" id="password" placeholder="Password" />
</p>
<p>
<label for="workDuration">Work Duration (seconds):</label>
<input type="number" id="workDuration" placeholder="Work time in seconds" value="900" />
<br />
<label for="shortBreakDuration">Short Break Duration (seconds):</label>
<input type="number" id="shortBreakDuration" placeholder="Short break in seconds" value="300" />
<br />
<label for="longBreakDuration">Long Break Duration (seconds):</label>
<input type="number" id="longBreakDuration" placeholder="Long break in seconds" value="600" />
<br />
<label for="sessions">Number of Sessions:</label>
<input type="number" id="sessions" placeholder="Number of sessions" value="4" />
<br />
<button id="saveButton">Save Settings</button>
</p>
</div>
<div id="timer">Connting to server...</div>
@ -83,8 +94,8 @@
return minutes.toString().padStart(2, '0') + ":" + remainingSeconds.toString().padStart(2, '0');
}
// Start Button Click Event
document.getElementById("startButton").addEventListener("click", function () {
// saveButton Click Event
document.getElementById("saveButton").addEventListener("click", function () {
// Get the values from the input fields
var password = document.getElementById("password").value;
var work = parseInt(document.getElementById("workDuration").value);
@ -94,15 +105,22 @@
// Send the start command with the custom config and password
ws.send(JSON.stringify({
command: "start",
command: "updateSettings",
password: password,
config: {
settings: {
work: work,
shortBreak: shortBreak,
longBreak: longBreak,
sessions: sessions
}
}));
});
// Start Button Click Event
document.getElementById("startButton").addEventListener("click", function () {
var password = document.getElementById("password").value;
// Send the start command with the custom config and password
ws.send(JSON.stringify({command: "start", password: password}));
// Hide start button and show pause/resume and reset buttons
document.getElementById("startButton").style.display = "none";