Skip to content

bugzilla
bugzilla
Commit d2827f5d authored by Давид Добряков's avatar Давид Добряков
Browse files
Options

[ref] Refactor js/etersoft/timer.js. #14950

parent 103d7dc8
Show whitespace changes
Inline Side-by-side
Showing with 259 additions and 208 deletions
js/etersoft/timer.js
View file @ d2827f5d
//Номер баги //Номер баги
var bugId = getIdFromUrl() || getBugIdFromField(); let bugId = getIdFromUrl() || getBugIdFromField();
// Если id нет, то мы имеем дело с новой багой // Если id нет, то мы имеем дело с новой багой
if (!bugId) { if (!bugId) {
const currentTime = new Date().getTime()
// Присвоим текущее время, чтобы при создании следующей баги значения не сохранились // Присвоим текущее время, чтобы при создании следующей баги значения не сохранились
bugId = "c" + new Date().getTime(); bugId = `c${currentTime}`;
} }
var protocol = window.location.protocol; // получим протокол
const {
protocol
} = window.location;
//Изменение баги //Изменение баги
var changed_remain = 0; var changed_remain = 0;
//Создание баги // Создание баги
var etersoft_create = window.location.href.search("enter") !== -1 ? 1 : 0; const isBugCreation = window.location.pathname.includes("enter");
// Объект таймера, создается при инициализации function initTimer(config) {
// Подробнее про таймер см. timer_common.js // Показываем время только сотрудникам Etersoft
var timer; if (!isEtersoft()) return;
// Интервал обновления таймера в мс, на точность не влияет // достанем все необходимые параметры
var UPDATE_INTERVAL = 1000; // для конфигурирования таймера
const {
updateInterval,
selector,
protocol,
bugId,
udpateTimerCallback
} = config
function initTimer() { // покажем сам таймер
// Показываем время только сотрудникам Etersoft document.querySelector(selector).style.display = "block";
if (!isetersoft()) return;
const timer = new Timer(`bug:${protocol}${bugId}`, udpateTimerCallback);
timer.setAutoUpdate(updateInterval);
return timer
}
// Конфиг для валидации комментарии
const VALIDATION_CONFIG = {
minLength: 9,
maxTime: 8,
}
document.getElementById("timerblock").style.display = "block"; // Конфиг таймера
timer = new Timer("bug:" + protocol + bugId, updateTimer); const TIMER_CONFIG = {
timer.setAutoUpdate(UPDATE_INTERVAL); // Интервал обновления таймера в мс, на точность не влияет
updateInterval: 1000,
// Селектор элемента, в котором лежит сам таймер
selector: "#timerblock",
// протокол
protocol,
// номер баги
bugId,
// функция updateTimer
udpateTimerCallback: updateTimer
} }
// Объект таймера, создается при инициализации
// Подробнее про таймер см. timer_common.js
const timer = initTimer(TIMER_CONFIG);
// this при вызове - объект таймера // this при вызове - объект таймера
function updateTimer() { function updateTimer() {
setPauseDisplay(this.isPaused()); setPauseDisplay(this.isPaused());
document.querySelector("#timespent").value = this.getFormattedString(); document.querySelector("#timespent").value = this.getFormattedString();
} }
//Установка в поле отработанного времени в минутах // Установка в поле отработанного времени в минутах
function setWorkTime(manualTime) { function setWorkTime(manualTime) {
var minutes = Math.ceil(timer.getElapsedSeconds() / 60); const minutes = Math.ceil(timer.getElapsedSeconds() / 60);
document.querySelector("#realworktime").value = manualTime document.querySelector("#realworktime").value = manualTime ?
? manualTime manualTime :
: minutes; minutes;
} }
function setPauseDisplay(pause) { // переключение видимости по селектору
document.querySelector("#timespent").style.color = pause ? "gray" : "black"; function toggleVisibility(selector, isHidden) {
document.querySelector("#timer_pause").style.visibility = pause document.querySelector(selector).style.visibility = isHidden ?
? "hidden" "hidden" :
: "visible"; "visible"
document.querySelector("#timer_play").style.visibility = pause
? "visible"
: "hidden";
} }
///////////////////////////////////////////////////// // меняем вид таймера при паузе
function showDiv() { function setPauseDisplay(pause) {
document.querySelector("#timeQuestionDiv").style.display = "block"; document.querySelector("#timespent").style.color = pause ? "gray" : "black";
document.querySelector("#realworktime").focus();
}
function closeDiv() { // прячем кнопку для паузы
document.querySelector("#timeQuestionDiv").style.display = "none"; toggleVisibility("#timer_pause", pause);
// показываем кнопку для включения
toggleVisibility("#timer_play", !pause);
} }
/* Получение номера баги из поля */ // Получение номера баги из поля
function getBugIdFromField() { function getBugIdFromField() {
var field = document.querySelector("#changeform input[name=id]"); const field = document.querySelector("#changeform input[name=id]");
if (field) { if (field) {
return parseInt(field.value); return parseInt(field.value);
} }
return false; return false;
} }
//////////////////////////////////////////// // Является ли пользователь сотрудником Etersoft
function isEtersoft() {
const email = document.getElementById("useremail").className;
//Является ли пользователь сотрудником Etersoft
function isetersoft() {
var email = document.getElementById("useremail").className;
if (!email) return false; if (!email) return false;
var domain = email.split("@")[1]; const domain = email.split("@")[1];
return domain === "etersoft.ru"; return domain === "etersoft.ru";
} }
//Является ли пользователь ответственным // Является ли пользователь ответственным
function isworker() { function isWorker() {
var useremail = document.getElementById("useremail"); const email = document.getElementById("useremail").className;
var assigntoemail = document.getElementById("assigntoemail"); const assignemail = document.getElementById("assigntoemail").className;
var email = useremail.className;
var assignemail = assigntoemail.className;
return email == assignemail; return email == assignemail;
} }
window.addEventListener("load", function() { // функция для получения времени с таймера в минутах
function getTimespentValue() {
return Math.round(timer.getElapsedSeconds() / 60);
}
function getTimespentValue() { // лямбда для получения числового значения времени по селектору
let timespent = document.querySelector("#timespent").value; const parseTimeInt = (selector) => parseInt(document.querySelector(selector).value);
let timespentValue = timespent.split(":");
// let's calc how many time is spent in minutes // лямбда для получения числового значения времени из элемента
let hours = parseInt(timespentValue[0]) * 60; const parseTimeIntFromData = (elem) => parseInt(elem.dataset["time"]);
let minutes = parseInt(timespentValue[1]);
let seconds = Math.round(parseInt(timespentValue[2]) / 60);
timespentValue = hours + minutes + seconds; // лямбда для перевода времени из минут в часы
const calcTimeValue = (time) => Math.ceil((time / 60) * 100) / 100;
return timespentValue; // функция для обновления оставшегося времени
} function updateRemainingTime(workTimeValue) {
// получаем estimatedTime
const estimatedTimeElement = document.querySelector('#estimated_time');
const workedTimeElement = document.querySelector('.bz_time_tracking_table > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(3)');
// add listener for comment commit if (estimatedTimeElement && workedTimeElement) {
let openButton = document.querySelector("#commit"); const estimatedTime = Number(estimatedTimeElement.value);
let closeButton = document.querySelectorAll("#timeQuestionDiv .close");
let dialog = document.querySelector("#timeQuestionDiv");
openButton.addEventListener("click", function(event) { // получаем отработанное время
// cancel form submiting const workedTime = Number(workedTimeElement.innerText);
event.preventDefault();
if (!isetersoft()) { // пересчитанное отработанное время
const comment = document.querySelector('#comment').value.length; const updatedWorkedTime = ((workedTime * 100) + (workTimeValue * 100)) / 100;
if (!comment) { // считаем сколько осталось
alert('Поле комментария не может быть пустым!'); const remainingTimeValue = Math.ceil(((estimatedTime * 100) - (updatedWorkedTime * 100))) / 100;
return
// обновляем оставшееся время
document.querySelector("#remaining_time").value = remainingTimeValue > 0 ? remainingTimeValue : 0;
} }
}
const bugForm = etersoft_create === 1 ? "#Create" : "#changeform"; // функция для отправки комментария
document.querySelector(bugForm).submit(); function submitComment(commentData) {
const validatedComment = validateComment(...commentData);
return const { error, text } = validatedComment;
if (error) {
alert(text);
return;
} }
let timespentValue = getTimespentValue(); const bugForm = isBugCreation ? "#Create" : "#changeform";
document.querySelector(bugForm).submit();
timer.clear();
localStorage.removeItem("time");
}
dialog.style.display = "block"; // функция для валидации комментария
focusManager.capture(dialog); function validateComment(comment, workTimeValue, productiveTimeValue, validationConfig = VALIDATION_CONFIG) {
const commentLength = comment.length;
// write work time in input value const isMinLength = commentLength > validationConfig.minLength;
document.querySelector("#realworktime").value =
localStorage.time === undefined ? timespentValue : localStorage.time;
document.querySelector("#saveTime").dataset["time"] = timespentValue;
});
let openButtonTop = document.getElementById("commit_top"); const isMaxWorkTime = workTimeValue > validationConfig.maxTime;
const isMaxProductiveTime = productiveTimeValue > validationConfig.maxTime;
if (openButtonTop) { const isProductiveTimeHigher = productiveTimeValue > workTimeValue;
openButtonTop.addEventListener("click", function(event) { const isNotCommentTooShort = productiveTimeValue > 2 &&
// cancel form submiting comment.length < productiveTimeValue * 60;
const isZeroTime = !comment.length && workTimeValue === 0 && productiveTimeValue === 0;
let error = "";
if (commentLength) {
if (!isMinLength) {
error = "Слишком короткий комментарий";
} else if (isMaxWorkTime || isMaxProductiveTime) {
error = "Недопустимо указывать отработанное/продуктивное время более восьми часов. Правильным следованием рабочему процессу было бы выполнение работы по частям, о каждой из которых будет написано отдельно.";
} else if (isNotCommentTooShort) {
error = "Недопустимо коротко комментировать длительные работы. Мы ожидаем не менее 60 символов на каждый указанный час.";
} else if (isProductiveTimeHigher) {
error = "Продуктивное время не может быть больше отработанного!";
}
} else if (!isZeroTime) {
error = "Поле комментария не может быть пустым!";
}
const errorObj = {
error: false,
text: ""
};
if (error) {
errorObj.error = true;
errorObj.text = error;
}
return errorObj;
}
window.addEventListener("load", function() {
// работа с модальным окном
const openButton = document.querySelector("#commit");
const closeButton = document.querySelector("#timeQuestionDiv .close");
const dialog = document.querySelector("#timeQuestionDiv");
// функция для открытия модального окна для ввода времени
function opetTimeModal(event) {
event.preventDefault(); event.preventDefault();
if (!isetersoft()) { closeButton.addEventListener("click", () => {
dialog.style.display = "none";
})
if (!isEtersoft()) {
const comment = document.querySelector('#comment').value.length; const comment = document.querySelector('#comment').value.length;
if (!comment) { if (!comment) {
...@@ -163,44 +249,47 @@ window.addEventListener("load", function() { ...@@ -163,44 +249,47 @@ window.addEventListener("load", function() {
return return
} }
const bugForm = etersoft_create === 1 ? "#Create" : "#changeform"; const bugForm = isBugCreation ? "#Create" : "#changeform";
document.querySelector(bugForm).submit(); document.querySelector(bugForm).submit();
return return
} }
let timespentValue = getTimespentValue(); const timespentValue = getTimespentValue();
dialog.style.display = "block"; dialog.style.display = "block";
focusManager.capture(dialog); focusManager.capture(dialog);
// write work time in input value // записываем отработанное время
document.querySelector("#realworktime").value = document.querySelector("#realworktime").value =
localStorage.time === undefined ? timespentValue : localStorage.time; !localStorage.time ? timespentValue : localStorage.time;
document.querySelector("#saveTime").dataset["time"] = timespentValue; document.querySelector("#saveTime").dataset["time"] = timespentValue;
}); }
openButton.addEventListener("click", opetTimeModal);
// если кнопка сохранить есть сверху, то добавим то же событие
// и на неё
const openButtonTop = document.getElementById("commit_top");
if (openButtonTop) {
openButtonTop.addEventListener("click", opetTimeModal);
} }
document function updateTimeValue() {
.querySelector("#realworktime")
.addEventListener("change", function() {
document.querySelector("#saveTime").dataset["time"] = this.value; document.querySelector("#saveTime").dataset["time"] = this.value;
localStorage.time = this.value; localStorage.time = this.value;
console.log( }
"time changed:",
document.querySelector("#saveTime").dataset["time"]
);
});
document.querySelector("#realworktime").addEventListener("paste", function() { document
document.querySelector("#saveTime").dataset["time"] = this.value; .querySelector("#realworktime")
localStorage.time = this.value; .addEventListener("change", updateTimeValue);
console.log(
"time changed:", document
document.querySelector("#saveTime").dataset["time"] .querySelector("#realworktime")
); .addEventListener("paste", updateTimeValue);
});
// add listener for enter key down to work time input // add listener for enter key down to work time input
document.querySelector("#realworktime").addEventListener("keyup", (event) => { document.querySelector("#realworktime").addEventListener("keyup", (event) => {
...@@ -218,123 +307,85 @@ window.addEventListener("load", function() { ...@@ -218,123 +307,85 @@ window.addEventListener("load", function() {
}); });
// add listener for time commit // add listener for time commit
let btn = document.querySelector("#saveTime"); const saveTimeButton = document.querySelector("#saveTime");
btn.addEventListener("click", function(event) { saveTimeButton.addEventListener("click", function(event) {
// cancel form submiting // cancel form submiting
event.preventDefault(); event.preventDefault();
// let's calc time for #work_time input // let's calc time for #work_time input
let workTime = parseInt(document.querySelector("#realworktime").value); let workTime = parseTimeInt("#realworktime");
workTime =
workTime === parseInt(btn.dataset["time"])
? parseInt(btn.dataset["time"])
: workTime;
workTime = workTime > 0 ? workTime : 0;
let workTimeValue = Math.ceil((workTime / 60) * 100) / 100;
let productiveTime = parseInt(document.querySelector("#ProductTime").value);
productiveTime = productiveTime > 0 ? productiveTime : workTime;
let productiveTimeValue = Math.ceil((productiveTime / 60) * 100) / 100; const timeFromButton = parseTimeIntFromData(saveTimeButton);
document.querySelector("#work_time").value = workTimeValue;
document.querySelector("#productive_time").value = productiveTimeValue;
// получаем estimatedTime // если время совпадает с тем что ввёл пользователь
const estimatedTimeElement = document.querySelector('#estimated_time'); // будем использовать его
const workedTimeElement = document.querySelector('.bz_time_tracking_table > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(3)'); // иначе будем использовать отработанное
workTime = workTime === timeFromButton
? timeFromButton
: workTime;
if (estimatedTimeElement && workedTimeElement) { // если время не задано, то пусть будет нулём
const estimatedTime = Number(estimatedTimeElement.value); workTime = workTime || 0;
// получаем отработанное время const workTimeValue = calcTimeValue(workTime);
const workedTime = Number(workedTimeElement.innerText);
// пересчитанное отработанное время const productiveTime = parseTimeInt("#ProductTime") || workTime;
const updatedWorkedTime = ((workedTime * 100) + (workTimeValue * 100)) / 100;
// считаем сколько осталось const productiveTimeValue = calcTimeValue(productiveTime);
const remainingTimeValue = Math.ceil(((estimatedTime * 100) - (updatedWorkedTime * 100))) / 100;
// обновляем оставшееся время document.querySelector("#work_time").value = workTimeValue;
document.querySelector("#remaining_time").value = remainingTimeValue > 0 ? remainingTimeValue : 0; document.querySelector("#productive_time").value = productiveTimeValue;
}
// now we ready for submiting all forms // обновим оставшееся время
let mainCommitBtn = document.querySelector("#commit_top"); updateRemainingTime(workTimeValue);
// check comment before submit // check comment before submit
let comment = document.querySelector("#comment").value; const comment = document.querySelector("#comment").value;
if (comment.length !== 0) { const commentData = [
if (comment.length < 9) { comment,
alert("Слишком короткий комментарий"); workTimeValue,
} else if (productiveTimeValue > 8 || workTimeValue > 8) { productiveTimeValue
alert( ];
"Недопустимо указывать отработанное/продуктивное время более восьми часов. Правильным следованием рабочему процессу было бы выполнение работы по частям, о каждой из которых будет написано отдельно."
); submitComment(commentData);
} else if (
productiveTimeValue > 2 &&
comment.length < productiveTimeValue * 60
) {
alert(
"Недопустимо коротко комментировать длительные работы. Мы ожидаем не менее 60 символов на каждый указанный час."
);
} else if (productiveTimeValue > workTimeValue) {
alert("Продуктивное время не может быть больше отработанного!");
} else {
let bugForm = etersoft_create === 1 ? "#Create" : "#changeform";
document.querySelector(bugForm).submit();
timer.clear();
localStorage.removeItem("time");
}
} else if (!comment.length && workTimeValue === 0 && productiveTimeValue === 0) {
let bugForm = etersoft_create === 1 ? "#Create" : "#changeform";
document.querySelector(bugForm).submit();
timer.clear();
localStorage.removeItem("time");
} else {
alert("Поле комментария не может быть пустым!");
}
}); });
}); });
// let's validate! // let's validate!
function validate(evt) { function validate(_event) {
let theEvent = evt || window.event; console.log(_event);
let key = theEvent.keyCode || theEvent.which;
const event = _event || window.event;
console.log(event);
let key = event.keyCode || event.which;
key = String.fromCharCode(key); key = String.fromCharCode(key);
let regex = /[0-9\s]/;
const regex = /[0-9\s]/;
if (!regex.test(key)) { if (!regex.test(key)) {
theEvent.returnValue = false; event.returnValue = false;
if (theEvent.preventDefault) theEvent.preventDefault();
if (event.preventDefault) event.preventDefault();
} }
} }
document.querySelector("#realworktime").onkeypress = function() { function addValidationToElement(selector) {
validate(event); // добавляем слушатель на keypress
}; document
.querySelector(selector)
document.querySelector("#realworktime").onpaste = function() { .addEventListener("keypress", validate);
validate(event);
}; // добавляем слушатель на paste
document
document.querySelector("#ProductTime").onkeypress = function() { .querySelector(selector)
validate(event); .addEventListener("paste", validate);
};
document.querySelector("#ProductTime").onpaste = function() {
validate(event);
};
//////////////////////////////////////////////////////////////
if (typeof window.addEventListener != "undefined") {
//gecko, safari, konqueror and standard
window.addEventListener("load", initTimer, false);
} else if (typeof document.addEventListener != "undefined") {
//opera 7
document.addEventListener("load", initTimer, false);
} else if (typeof window.attachEvent != "undefined") {
//win/ie
window.attachEvent("onload", initTimer);
} }
addValidationToElement("#realworktime");
addValidationToElement("#ProductTime");
template/en/default/etersoft/timersplash.html.tmpl
View file @ d2827f5d
...@@ -39,11 +39,11 @@ ...@@ -39,11 +39,11 @@
<fieldset> <fieldset>
<button class="workTime__button--save" id="saveTime" tabindex="11">Сохранить</button> <button class="workTime__button--save" id="saveTime" tabindex="11">Сохранить</button>
</fieldset> </fieldset>
<button onclick="closeDiv();" class="close" tabindex="12">&times;</button> <button class="close" tabindex="12">&times;</button>
</div> </div>
</div> </div>
</div> </div>
<script language="javascript" type="text/javascript" src="js/etersoft/focusManager.js"></script> <script language="javascript" type="text/javascript" src="js/etersoft/focusManager.js"></script>
<script language="javascript" type="text/javascript" src="js/etersoft/timer_common.js?25_10_2017"></script> <script language="javascript" type="text/javascript" src="js/etersoft/timer_common.js?25_10_2017"></script>
<script language="javascript" type="text/javascript" src="js/etersoft/timer.js?24_02_2021"></script> <script language="javascript" type="text/javascript" src="js/etersoft/timer.js?22_04_2021"></script>
template/ru/default/etersoft/timersplash.html.tmpl
View file @ d2827f5d
...@@ -39,11 +39,11 @@ ...@@ -39,11 +39,11 @@
<fieldset> <fieldset>
<button class="workTime__button--save" id="saveTime" tabindex="11">Сохранить</button> <button class="workTime__button--save" id="saveTime" tabindex="11">Сохранить</button>
</fieldset> </fieldset>
<button onclick="closeDiv();" class="close" tabindex="12">&times;</button> <button class="close" tabindex="12">&times;</button>
</div> </div>
</div> </div>
</div> </div>
<script language="javascript" type="text/javascript" src="js/etersoft/focusManager.js"></script> <script language="javascript" type="text/javascript" src="js/etersoft/focusManager.js"></script>
<script language="javascript" type="text/javascript" src="js/etersoft/timer_common.js?25_10_2017"></script> <script language="javascript" type="text/javascript" src="js/etersoft/timer_common.js?25_10_2017"></script>
<script language="javascript" type="text/javascript" src="js/etersoft/timer.js?24_02_2021"></script> <script language="javascript" type="text/javascript" src="js/etersoft/timer.js?22_04_2021"></script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment