From 1cfd28d50da853ba0718da0682b21f1eb94f99d2 Mon Sep 17 00:00:00 2001 From: Shreya Date: Mon, 12 Feb 2018 15:27:28 +0530 Subject: [PATCH] timer in timesheet --- .../projects/doctype/timesheet/timesheet.css | 122 ++++++++++++++++++ .../projects/doctype/timesheet/timesheet.html | 13 ++ .../projects/doctype/timesheet/timesheet.js | 115 +++++++++++++++++ 3 files changed, 250 insertions(+) create mode 100644 erpnext/projects/doctype/timesheet/timesheet.css create mode 100644 erpnext/projects/doctype/timesheet/timesheet.html diff --git a/erpnext/projects/doctype/timesheet/timesheet.css b/erpnext/projects/doctype/timesheet/timesheet.css new file mode 100644 index 00000000000..9cce5f4ac62 --- /dev/null +++ b/erpnext/projects/doctype/timesheet/timesheet.css @@ -0,0 +1,122 @@ +@import 'https://fonts.googleapis.com/css?family=Open+Sans:300,600,800'; +/*html, +body { + background-color: #000; + color: #fff; + height: 100%; + width: 100%; + margin: 0; + box-sizing: border-box; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + -webkit-tap-highlight-color: transparent; +}*/ + +.stopwatch { + height: 50%; + width: 100%; + display: inline-flex; + transition: all .5s ease; + -moz-transition: all .5s ease; + -ms-transition: all .5s ease; + -webkit-transition: all .5s ease; + -o-transition: all .5s ease; +} + +.stopwatch span { + display: table-cell; + width: 33%; + font-size: 5em; + font-family: 'Open Sans', sans serif; + text-align: center; + vertical-align: middle; + transition: all .5s ease; + -moz-transition: all .5s ease; + -ms-transition: all .5s ease; + -webkit-transition: all .5s ease; + -o-transition: all .5s ease; +} + +.stopwatch .hours { + font-weight: 800; +} + +.stopwatch .minutes { + font-weight: 600; +} + +.stopwatch .seconds { + font-weight: 300; +} + +.stopcontrols { + height: 50%; + width: 100%; + display: table; + transition: all .5s ease; + -moz-transition: all .5s ease; + -ms-transition: all .5s ease; + -webkit-transition: all .5s ease; + -o-transition: all .5s ease; +} + +.stopcontrols div { + display: table-cell; + width: 50%; + text-align: center; + vertical-align: middle; + cursor: pointer; +} + +.playpause { + border-right: 1px dashed #fff; + border-bottom: 1px dashed #fff; +} + +.playpause .play { + display: inline-block; + border-top: 28px solid transparent; + border-left: 37px solid #000; + border-bottom: 28px solid transparent; +} + +.playpause .pause { + border-right: 5px solid #000; + border-left: 5px solid #000; + padding: 20px 10px; +} + +.stop { + border-bottom: 1px dashed #fff; +} + +.stop span { + display: inline-block; + background-color: #e74c3c; + width: 45px; + height: 45px; +} + +@media screen and (max-width: 500px) { + .stopwatch span { + font-size: 6em; + } +} + +@media screen and (max-width: 390px) { + .stopwatch { + height: 75%; + display: block; + } + .stopcontrols { + height: 25%; + } + .stopwatch span { + width: 100%; + height: 33%; + display: block; + } +} diff --git a/erpnext/projects/doctype/timesheet/timesheet.html b/erpnext/projects/doctype/timesheet/timesheet.html new file mode 100644 index 00000000000..3414fc1883d --- /dev/null +++ b/erpnext/projects/doctype/timesheet/timesheet.html @@ -0,0 +1,13 @@ +
+
+ +
+
+ +
+
+
+ 00 + 00 + 00 +
\ No newline at end of file diff --git a/erpnext/projects/doctype/timesheet/timesheet.js b/erpnext/projects/doctype/timesheet/timesheet.js index 99ee2a2c5e6..ed8bbb6702d 100644 --- a/erpnext/projects/doctype/timesheet/timesheet.js +++ b/erpnext/projects/doctype/timesheet/timesheet.js @@ -50,12 +50,127 @@ frappe.ui.form.on("Timesheet", { } } + if (frm.doc.total_hours) { + frm.add_custom_button(__('Start Timer'), function() { + frm.trigger("timer") + }).addClass("btn-primary"); + } + if(frm.doc.per_billed > 0) { frm.fields_dict["time_logs"].grid.toggle_enable("billing_hours", false); frm.fields_dict["time_logs"].grid.toggle_enable("billable", false); } }, + timer: function(frm) { + let dialog = new frappe.ui.Dialog({ + title: __("Timer"), + fields: [ + {"fieldtype": "Select", "label": __("Activity"), + "fieldname": "activity", + "options": frm.doc.time_logs.map(d => d.activity_type), + "reqd": 1 }, + {"fieldtype": "Select", "label": __("Project"), + "fieldname": "project", + "options": frm.doc.time_logs.map(d => d.project)}, + {"fieldtype": "Select", "label": __("Hours"), + "fieldname": "hours", + "options": frm.doc.time_logs.map(d => d.hours)} + ] + }); + + dialog.wrapper.append(frappe.render_template("timesheet")); + frm.trigger("control_timer"); + dialog.show(); + }, + + control_timer: function() { + var interval = null; + var currentIncrement = 0; + var isPaused = false; + var initialised = false; + var clicked = false; + var paused_time = 0; + + $(".playpause").click(function(e) { + if (clicked) { + e.preventDefault(); + return false; + } + + if (!initialised) { + initialised = true; + isPaused = false; + $(".playpause span").removeClass(); + $(".playpause span").addClass("pause"); + initialiseTimer(); + } + else { + $(".playpause span").removeClass(); + if (isPaused) { + isPaused = false; + $(".playpause span").addClass("pause"); + } + else { + isPaused = true; + $(".playpause span").addClass("play"); + paused_time = currentIncrement; + } + } + }); + + $(".stop").click(function() { + reset(); + }); + + function initialiseTimer() { + interval = setInterval(function() { + if (isPaused) return; + var current = setCurrentIncrement(); + updateStopwatch(current); + }, 1000); + } + + function updateStopwatch(increment) { + var hours = Math.floor(increment / 3600); + var minutes = Math.floor((increment - (hours * 3600)) / 60); + var seconds = increment - (hours * 3600) - (minutes * 60); + // if(!$('modal-open:visible')){ + // reset(); + // } + if (!$('.modal-dialog').is(':visible')) { + reset(); + } + if(hours > 99) + reset(); + if(cur_dialog && cur_dialog.get_value('hours') == hours) { + isPaused = true; + initialised = false; + frappe.msgprint(__("Timer exceeded the given hours")); + } + $(".hours").text(hours < 10 ? ("0" + hours.toString()) : hours.toString()); + $(".minutes").text(minutes < 10 ? ("0" + minutes.toString()) : minutes.toString()); + $(".seconds").text(seconds < 10 ? ("0" + seconds.toString()) : seconds.toString()); + } + + function setCurrentIncrement() { + currentIncrement += 1; + return currentIncrement; + } + + function reset() { + currentIncrement = 0; + isPaused = true; + initialised = false; + clearInterval(interval); + $(".hours").text("00"); + $(".minutes").text("00"); + $(".seconds").text("00"); + $(".playpause span").removeClass(); + $(".playpause span").addClass("play"); + } + }, + make_invoice: function(frm) { let dialog = new frappe.ui.Dialog({ title: __("Select Item (optional)"),