Skip to content

Commit b09e493

Browse files
authored
Fix ticket timer, to initialise on reload and after tab sleeping
When the tab was reloaded, the timer was not initialized again. When the tab was in background and the tab was sleeping, the timer showed the wrong time
1 parent 0d5bfda commit b09e493

File tree

1 file changed

+91
-48
lines changed

1 file changed

+91
-48
lines changed

agent/js/ticket_time_tracking.js

Lines changed: 91 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
(function() {
22
document.addEventListener("DOMContentLoaded", function() {
3-
// Initialize variables
43
var timerInterval = null;
54
var ticketID = getCurrentTicketID();
65
var elapsedSecs = getElapsedSeconds();
@@ -22,24 +21,32 @@
2221
return pausedTime + timeSinceStart;
2322
}
2423

24+
function pad(val) {
25+
return val < 10 ? "0" + val : val;
26+
}
27+
2528
function displayTime() {
2629
let totalSeconds = elapsedSecs;
2730
let hours = Math.floor(totalSeconds / 3600);
2831
totalSeconds %= 3600;
2932
let minutes = Math.floor(totalSeconds / 60);
3033
let seconds = totalSeconds % 60;
3134

32-
document.getElementById("hours").value = pad(hours);
33-
document.getElementById("minutes").value = pad(minutes);
34-
document.getElementById("seconds").value = pad(seconds);
35-
}
35+
let hoursEl = document.getElementById("hours");
36+
let minutesEl = document.getElementById("minutes");
37+
let secondsEl = document.getElementById("seconds");
3638

37-
function pad(val) {
38-
return val < 10 ? "0" + val : val;
39+
if (hoursEl && minutesEl && secondsEl) {
40+
hoursEl.value = pad(hours);
41+
minutesEl.value = pad(minutes);
42+
secondsEl.value = pad(seconds);
43+
} else {
44+
console.warn("Timer input elements not found");
45+
}
3946
}
4047

4148
function countTime() {
42-
elapsedSecs++;
49+
elapsedSecs = getElapsedSeconds();
4350
displayTime();
4451
}
4552

@@ -48,7 +55,8 @@
4855
localStorage.setItem(getLocalStorageKey("startTime"), Date.now().toString());
4956
}
5057
timerInterval = setInterval(countTime, 1000);
51-
document.getElementById("startStopTimer").innerHTML = "<i class='fas fa-pause'></i>";
58+
let btn = document.getElementById("startStopTimer");
59+
if (btn) btn.innerHTML = "<i class='fas fa-pause'></i>";
5260
localStorage.setItem("ticket-timer-running-" + ticketID, "true");
5361
}
5462

@@ -60,7 +68,8 @@
6068
let currentElapsed = getElapsedSeconds();
6169
localStorage.setItem(getLocalStorageKey("pausedTime"), currentElapsed.toString());
6270
localStorage.removeItem(getLocalStorageKey("startTime"));
63-
document.getElementById("startStopTimer").innerHTML = "<i class='fas fa-play'></i>";
71+
let btn = document.getElementById("startStopTimer");
72+
if (btn) btn.innerHTML = "<i class='fas fa-play'></i>";
6473
localStorage.setItem("ticket-timer-running-" + ticketID, "false");
6574
}
6675

@@ -77,7 +86,8 @@
7786
elapsedSecs = 0;
7887
clearTimeStorage();
7988
displayTime();
80-
document.getElementById("startStopTimer").innerHTML = "<i class='fas fa-play'></i>";
89+
let btn = document.getElementById("startStopTimer");
90+
if (btn) btn.innerHTML = "<i class='fas fa-play'></i>";
8191
}
8292
localStorage.setItem("ticket-timer-running-" + ticketID, "false");
8393
}
@@ -88,17 +98,18 @@
8898
elapsedSecs = 0;
8999
clearTimeStorage();
90100
displayTime();
91-
document.getElementById("startStopTimer").innerHTML = "<i class='fas fa-play'></i>";
101+
let btn = document.getElementById("startStopTimer");
102+
if (btn) btn.innerHTML = "<i class='fas fa-play'></i>";
92103
}
93104

94105
function handleInputFocus() {
95106
pauseTimer();
96107
}
97108

98109
function updateTimeFromInput() {
99-
const hours = parseInt(document.getElementById("hours").value, 10) || 0;
100-
const minutes = parseInt(document.getElementById("minutes").value, 10) || 0;
101-
const seconds = parseInt(document.getElementById("seconds").value, 10) || 0;
110+
const hours = parseInt(document.getElementById("hours")?.value, 10) || 0;
111+
const minutes = parseInt(document.getElementById("minutes")?.value, 10) || 0;
112+
const seconds = parseInt(document.getElementById("seconds")?.value, 10) || 0;
102113
elapsedSecs = (hours * 3600) + (minutes * 60) + seconds;
103114

104115
if (!timerInterval) {
@@ -111,61 +122,93 @@
111122
}
112123

113124
function checkStatusAndPauseTimer() {
114-
var status = document.querySelector('select[name="status"]').value;
115-
if (status.includes("Pending") || status.includes("Close")) {
116-
pauseTimer();
125+
var statusEl = document.querySelector('select[name="status"]');
126+
if (statusEl) {
127+
var status = statusEl.value;
128+
if (status.includes("Pending") || status.includes("Close")) {
129+
pauseTimer();
130+
}
117131
}
118132
}
119133

120-
// Attach input listeners
121-
document.getElementById("hours").addEventListener('change', updateTimeFromInput);
122-
document.getElementById("minutes").addEventListener('change', updateTimeFromInput);
123-
document.getElementById("seconds").addEventListener('change', updateTimeFromInput);
134+
// Update on tab visibility change to handle background sleep
135+
document.addEventListener('visibilitychange', function() {
136+
if (!document.hidden) {
137+
elapsedSecs = getElapsedSeconds();
138+
displayTime();
139+
}
140+
});
124141

125-
document.getElementById("hours").addEventListener('focus', handleInputFocus);
126-
document.getElementById("minutes").addEventListener('focus', handleInputFocus);
127-
document.getElementById("seconds").addEventListener('focus', handleInputFocus);
142+
// Attach input listeners with null checks
143+
const hoursEl = document.getElementById("hours");
144+
if (hoursEl) {
145+
hoursEl.addEventListener('change', updateTimeFromInput);
146+
hoursEl.addEventListener('focus', handleInputFocus);
147+
}
128148

129-
document.querySelector('select[name="status"]').addEventListener('change', checkStatusAndPauseTimer);
149+
const minutesEl = document.getElementById("minutes");
150+
if (minutesEl) {
151+
minutesEl.addEventListener('change', updateTimeFromInput);
152+
minutesEl.addEventListener('focus', handleInputFocus);
153+
}
130154

131-
document.getElementById("startStopTimer").addEventListener('click', function() {
132-
if (timerInterval === null) {
133-
startTimer();
134-
} else {
135-
pauseTimer();
136-
}
137-
});
155+
const secondsEl = document.getElementById("seconds");
156+
if (secondsEl) {
157+
secondsEl.addEventListener('change', updateTimeFromInput);
158+
secondsEl.addEventListener('focus', handleInputFocus);
159+
}
138160

139-
document.getElementById("resetTimer").addEventListener('click', function() {
140-
resetTimer();
141-
});
161+
const statusEl = document.querySelector('select[name="status"]');
162+
if (statusEl) {
163+
statusEl.addEventListener('change', checkStatusAndPauseTimer);
164+
}
142165

143-
document.getElementById("ticket_add_reply").addEventListener('click', function() {
144-
setTimeout(forceResetTimer, 100);
145-
});
166+
const startStopBtn = document.getElementById("startStopTimer");
167+
if (startStopBtn) {
168+
startStopBtn.addEventListener('click', function() {
169+
if (timerInterval === null) {
170+
startTimer();
171+
} else {
172+
pauseTimer();
173+
}
174+
});
175+
}
146176

147-
document.getElementById("ticket_close").addEventListener('click', function() {
148-
setTimeout(clearTimeStorage, 100);
149-
});
177+
const resetBtn = document.getElementById("resetTimer");
178+
if (resetBtn) {
179+
resetBtn.addEventListener('click', function() {
180+
resetTimer();
181+
});
182+
}
183+
184+
const addReplyBtn = document.getElementById("ticket_add_reply");
185+
if (addReplyBtn) {
186+
addReplyBtn.addEventListener('click', function() {
187+
setTimeout(forceResetTimer, 100);
188+
});
189+
}
190+
191+
const closeBtn = document.getElementById("ticket_close");
192+
if (closeBtn) {
193+
closeBtn.addEventListener('click', function() {
194+
setTimeout(clearTimeStorage, 100);
195+
});
196+
}
150197

151198
// Final initialization logic
152199
try {
153200
displayTime();
154201

155-
// If no timer state, respect ticketAutoStart
156202
if (!localStorage.getItem(getLocalStorageKey("startTime")) && !localStorage.getItem(getLocalStorageKey("pausedTime"))) {
157-
if (ticketAutoStart === 1) {
203+
if (typeof ticketAutoStart !== "undefined" && ticketAutoStart === 1) {
158204
startTimer();
159205
} else {
160206
pauseTimer();
161207
}
162-
}
163-
// If timer already running, resume it
164-
else if (localStorage.getItem(getLocalStorageKey("startTime"))) {
208+
} else if (localStorage.getItem(getLocalStorageKey("startTime"))) {
165209
startTimer();
166210
}
167211

168-
// Check and pause timer if status is pending
169212
checkStatusAndPauseTimer();
170213

171214
} catch (error) {

0 commit comments

Comments
 (0)