extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2025-06-30 14:40:34 +02:00
Code Issues Packages Projects Releases Wiki Activity

WIP timesheet timer

Browse Source
This commit is contained in:
ralf
2022-09-29 18:04:57 +02:00
parent 918c0324d1
commit 1308b09493
6 changed files with 103 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
api/js/jsapi/egw_timer.js
View File

@ -29,15 +29,20 @@ egw.extend('timer', egw.MODULE_GLOBAL, function()
{ {
timer_start = _state.start ? new Date(_state.start) : undefined; timer_start = _state.start ? new Date(_state.start) : undefined;
timer_offset = _state.offset || 0; timer_offset = _state.offset || 0;
if (timer_offset && timer_start) timer_paused = _state.paused || false
if (timer_paused)
{ {
timer_start.setMilliseconds(timer_start.getMilliseconds()-timer_offset); startTimer(); // to show offset / paused time
stopTimer(true);
} }
if (timer_start || _state.paused) else if (timer_start)
{ {
startTimer(); startTimer(_state.start);
}
if (_state.paused) stopTimer(true); // sets timer_paused else
{
startTimer(); // to show offset / stopped time
stopTimer();
} }
} }
@ -77,31 +82,55 @@ egw.extend('timer', egw.MODULE_GLOBAL, function()
egw.request('timesheet.timesheet_bo.ajax_event', [state]) egw.request('timesheet.timesheet_bo.ajax_event', [state])
} }
function startTimer() /**
* Enable/disable menu items based on timer state
*/
function setMenuState()
{ {
timer_paused = false; const menu = document.querySelector('et2-select#timer_selectbox').menu;
timer_start = new Date(); // disable not matching / available menu-items
menu.getAllItems('et2-selectbox#timer_selecbox sl-menu-item').forEach(item =>
{
// timer running: disable only start, enable pause and stop
if (timer_start)
{
item.disabled = item.value === 'overall-start';
}
// timer paused: disable pause, enable start and stop
else if (timer_paused)
{
item.disabled = item.value === 'overall-pause';
}
// timer stopped: disable stop and pause, enable start
else
{
item.disabled = item.value !== 'overall-start';
}
});
}
function startTimer(_time)
{
if (_time)
{
timer_start = new Date(_time);
}
else
{
timer_start = new Date();
}
if (timer_offset > 0) if (timer_offset > 0)
{ {
timer_start.setMilliseconds(timer_start.getMilliseconds()-timer_offset); timer_start.setMilliseconds(timer_start.getMilliseconds()-timer_offset);
} }
timer_offset = 0; // it's now set in start-time
timer_paused = false;
const update = () => const update = () =>
{ {
if (!timer_start) let diff = Math.round(((new Date()).valueOf() - timer_start.valueOf())/1000.0);
{ const sep = diff % 2 ? ' ' : ':';
timer.textContent = '0:00'; diff = Math.round(diff / 60.0);
} timer.textContent = sprintf('%d%s%02d', Math.round(diff/60), sep, diff % 60);
else if (timer_paused)
{
// do nothing
}
else
{
let diff = Math.round(((new Date()).valueOf() - timer_start.valueOf())/1000.0);
const sep = diff % 2 ? ' ' : ':';
diff = Math.round(diff / 60.0);
timer.textContent = sprintf('%d%s%02d', Math.round(diff/60), sep, diff % 60);
}
} }
timer.classList.add('running'); timer.classList.add('running');
timer.classList.remove('paused'); timer.classList.remove('paused');
@ -123,9 +152,14 @@ egw.extend('timer', egw.MODULE_GLOBAL, function()
timer.classList.add('paused'); timer.classList.add('paused');
timer_paused = true; timer_paused = true;
} }
timer_offset = (new Date()).valueOf() - timer_start.valueOf(); else
if (!_pause)
{ {
timer.classList.remove('paused');
timer_paused = false;
}
if (timer_start)
{
timer_offset = (new Date()).valueOf() - timer_start.valueOf();
timer_start = undefined; timer_start = undefined;
} }
} }
@ -149,7 +183,8 @@ egw.extend('timer', egw.MODULE_GLOBAL, function()
} }
// create selectbox / menu // create selectbox / menu
const select = document.createElement('et2-select', {id: 'timer_selectbox'}); const select = document.createElement('et2-select');
select.id = 'timer_selectbox';
timer_container.append(select); timer_container.append(select);
// bind change handler // bind change handler
@ -175,6 +210,7 @@ egw.extend('timer', egw.MODULE_GLOBAL, function()
} }
else else
{ {
setMenuState();
select.dropdown.show(); select.dropdown.show();
} }
}); });

15
pixelegg/css/mobile.css
View File

@ -4509,6 +4509,8 @@ span.overlayContainer img.overlay {
background-repeat: repeat-x; background-repeat: repeat-x;
background-color: transparent; background-color: transparent;
height: 39px; height: 39px;
display: flex;
align-items: baseline;
/*active Tabs*/ /*active Tabs*/
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 {
@ -4560,8 +4562,11 @@ span.overlayContainer img.overlay {
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover {
background-color: rgba(153, 204, 255, 0.4); background-color: rgba(153, 204, 255, 0.4);
padding-bottom: 0px; padding-bottom: 0px;
padding-top: 8px; padding-top: 7px;
transition: none; transition: none;
width: -webkit-fill-available;
width: -moz-available;
max-width: fit-content !important;
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover .egw_fw_ui_tab_close_button { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover .egw_fw_ui_tab_close_button {
background-image: url(../../api/templates/default/images/close.svg); background-image: url(../../api/templates/default/images/close.svg);
@ -4674,7 +4679,6 @@ span.overlayContainer img.overlay {
overflow: hidden; overflow: hidden;
z-index: 0; z-index: 0;
font-size: 0.9em; font-size: 0.9em;
border-right: 1px solid #bfbfbf;
} }
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv { #egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv {
background-color: #fafafa; background-color: #fafafa;
@ -5019,7 +5023,7 @@ span.overlayContainer img.overlay {
background-image: url(../../api/templates/default/images/splitter_vert.png); background-image: url(../../api/templates/default/images/splitter_vert.png);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-color: transparent; background-color: #E6E6E6;
position: absolute; position: absolute;
width: 4px; width: 4px;
height: 100%; height: 100%;
@ -5487,10 +5491,15 @@ span.overlayContainer img.overlay {
display: block; display: block;
white-space: nowrap; white-space: nowrap;
color: #606060; color: #606060;
height: 45px;
width: 45px;
} }
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running { #egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running {
color: black; color: black;
} }
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.paused {
color: orange;
}
#egw_fw_topmenu_info_items #topmenu_info_timer:hover { #egw_fw_topmenu_info_items #topmenu_info_timer:hover {
cursor: pointer; cursor: pointer;
} }

15
pixelegg/css/monochrome.css
View File

@ -4489,6 +4489,8 @@ span.overlayContainer img.overlay {
background-repeat: repeat-x; background-repeat: repeat-x;
background-color: transparent; background-color: transparent;
height: 39px; height: 39px;
display: flex;
align-items: baseline;
/*active Tabs*/ /*active Tabs*/
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 {
@ -4540,8 +4542,11 @@ span.overlayContainer img.overlay {
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover {
background-color: rgba(153, 204, 255, 0.4); background-color: rgba(153, 204, 255, 0.4);
padding-bottom: 0px; padding-bottom: 0px;
padding-top: 8px; padding-top: 7px;
transition: none; transition: none;
width: -webkit-fill-available;
width: -moz-available;
max-width: fit-content !important;
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover .egw_fw_ui_tab_close_button { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover .egw_fw_ui_tab_close_button {
background-image: url(../../api/templates/default/images/close.svg); background-image: url(../../api/templates/default/images/close.svg);
@ -4654,7 +4659,6 @@ span.overlayContainer img.overlay {
overflow: hidden; overflow: hidden;
z-index: 0; z-index: 0;
font-size: 0.9em; font-size: 0.9em;
border-right: 1px solid #bfbfbf;
} }
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv { #egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv {
background-color: #fafafa; background-color: #fafafa;
@ -4999,7 +5003,7 @@ span.overlayContainer img.overlay {
background-image: url(../../api/templates/default/images/splitter_vert.png); background-image: url(../../api/templates/default/images/splitter_vert.png);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-color: transparent; background-color: #E6E6E6;
position: absolute; position: absolute;
width: 4px; width: 4px;
height: 100%; height: 100%;
@ -5467,10 +5471,15 @@ span.overlayContainer img.overlay {
display: block; display: block;
white-space: nowrap; white-space: nowrap;
color: #606060; color: #606060;
height: 45px;
width: 45px;
} }
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running { #egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running {
color: black; color: black;
} }
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.paused {
color: orange;
}
#egw_fw_topmenu_info_items #topmenu_info_timer:hover { #egw_fw_topmenu_info_items #topmenu_info_timer:hover {
cursor: pointer; cursor: pointer;
} }

3
pixelegg/css/pixelegg.css
View File

@ -5487,6 +5487,9 @@ span.overlayContainer img.overlay {
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running { #egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running {
color: black; color: black;
} }
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.paused {
color: orange;
}
#egw_fw_topmenu_info_items #topmenu_info_timer:hover { #egw_fw_topmenu_info_items #topmenu_info_timer:hover {
cursor: pointer; cursor: pointer;
} }

3
pixelegg/less/layout_raster_buttons.less
View File

@ -250,6 +250,9 @@
#topmenu_timer.running { #topmenu_timer.running {
color: black; color: black;
} }
#topmenu_timer.paused {
color: orange;
}
&:hover { &:hover {
cursor: pointer; cursor: pointer;
} }

13
pixelegg/mobile/fw_mobile.css
View File

@ -4520,6 +4520,8 @@ span.overlayContainer img.overlay {
background-repeat: repeat-x; background-repeat: repeat-x;
background-color: transparent; background-color: transparent;
height: 39px; height: 39px;
display: flex;
align-items: baseline;
/*active Tabs*/ /*active Tabs*/
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 {
@ -4571,8 +4573,11 @@ span.overlayContainer img.overlay {
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover {
background-color: rgba(153, 204, 255, 0.4); background-color: rgba(153, 204, 255, 0.4);
padding-bottom: 0px; padding-bottom: 0px;
padding-top: 8px; padding-top: 7px;
transition: none; transition: none;
width: -webkit-fill-available;
width: -moz-available;
max-width: fit-content !important;
} }
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover .egw_fw_ui_tab_close_button { #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover .egw_fw_ui_tab_close_button {
background-image: url(../../api/templates/default/images/close.svg); background-image: url(../../api/templates/default/images/close.svg);
@ -4685,7 +4690,6 @@ span.overlayContainer img.overlay {
overflow: hidden; overflow: hidden;
z-index: 0; z-index: 0;
font-size: 0.9em; font-size: 0.9em;
border-right: 1px solid #bfbfbf;
} }
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv { #egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv {
background-color: #fafafa; background-color: #fafafa;
@ -5030,7 +5034,7 @@ span.overlayContainer img.overlay {
background-image: url(../../api/templates/default/images/splitter_vert.png); background-image: url(../../api/templates/default/images/splitter_vert.png);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-color: transparent; background-color: #E6E6E6;
position: absolute; position: absolute;
width: 4px; width: 4px;
height: 100%; height: 100%;
@ -5504,6 +5508,9 @@ span.overlayContainer img.overlay {
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running { #egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.running {
color: black; color: black;
} }
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer.paused {
color: orange;
}
#egw_fw_topmenu_info_items #topmenu_info_timer:hover { #egw_fw_topmenu_info_items #topmenu_info_timer:hover {
cursor: pointer; cursor: pointer;
} }