2 <div id="exit-popup"> \
4 <center><div id="exit-popup-container"> \
6 <div id = "exit-title"><h1> Exit App? </h1></div> \
7 <div class = "line"> </div> \
8 <img src = "../../extensions/app_timer/images/exit.png"></img> \
9 <div class = "line"> </div> \
10 <div class="exit-button-group"> \
11 <button id="yes-button" class="exit-button">Yes</button> \
12 <button id="no-button"class="exit-button">No</button> \
21 <div id="main-popup"> \
23 <center><div id="popup-container"> \
25 <div id = "title"><h1> App Timer </h1></div> \
27 <div class = "line"> </div> \
29 <label class = "switch"> \
30 <input type = "checkbox" class = "switch_input" id = "sme_switch" checked> \
31 <span class = "switch_label" data-on = "On" data-off = "Off"></span> \
32 <span class = "switch_handle"><div class = "switch_pix"></div></span> \
35 <div class = "line"> </div> \
37 <div class = "action"> \
39 <div class="timer-group"> \
40 <span id="hours-digit" class="digit editable" >00</span> \
41 <span class="colon">:</span> \
42 <span id="minutes-digit" class="digit editable">00</span> \
43 <span class="colon">:</span> \
44 <span id="seconds-digit" class="digit editable">00</span> \
47 <div class = "line"> </div> \
49 <div class="btn-group"> \
50 <button id="start-button" class="button">start</button> \
51 <button id="reset-button" class="button">reset</button> \
60 var timerStart = false;
61 var defaultDisplayTime = {hours: 0, minutes: 1, seconds: 0};
63 var port = chrome.runtime.connect({name: "contentscript"});
65 port.onMessage.addListener(function(msg) {
66 console.log('from background : ' + msg.background);
67 if (msg.background == "timer-init") {
70 else if (msg.background == "timer-update") {
71 console.log('value, '+msg.value.displayTime.hours+' : '+msg.value.displayTime.minutes+' : '+msg.value.displayTime.seconds);
74 else if (msg.background == "timer-finish") {
79 document.body.insertAdjacentHTML('beforeend', SET_HTML);
82 function exitPopup() {
84 document.body.insertAdjacentHTML('beforeend', EXIT_HTML);
86 document.getElementById('yes-button').onclick= function(event) {
87 console.log('exitPopup: yes');
90 var launcher = require('electron').remote.getCurrentWindow();
94 document.getElementById('no-button').onclick= function(event) {
95 console.log('exitPopup: no');
96 document.body.removeChild(document.getElementById('exit-popup'));
97 document.getElementById('hours-digit').innerHTML = defaultDisplayTime.hours;
98 document.getElementById('minutes-digit').innerHTML = defaultDisplayTime.minutes;
99 document.getElementById('seconds-digit').innerHTML = defaultDisplayTime.seconds;
105 window.onkeydown = function(event) {
106 if (event.keyCode != 112) // F1 key
117 function initialize() {
118 port.postMessage({contentscript: "timer-init"});
127 function showModal() {
128 document.getElementById('main-popup').style.display = 'block';
131 function hideModal() {
132 document.getElementById('main-popup').style.display = 'none';
136 document.getElementById('sme_switch').addEventListener("change", function(event){
137 if(event.srcElement.checked){
138 document.querySelector(".action").style.display = "block";
142 document.querySelector(".action").style.display = "none";
146 document.getElementById('start-button').onclick= function(event) {
147 if (timerStart == false) {
154 document.getElementById('reset-button').onclick= function(event) {
160 document.getElementById('hours-digit').onclick= function(event) {
161 event.stopPropagation();
164 document.getElementById('hours-digit').setAttribute("contenteditable", true);
165 document.getElementById('hours-digit').addEventListener('mouseout', hoursMouseoutHandler );
168 function hoursMouseoutHandler(e){
169 document.getElementById('hours-digit').removeEventListener('mouseout', hoursMouseoutHandler);
170 var value = document.getElementById('hours-digit').innerHTML;
171 if (value.length == 0 || Number(value) == 0) {
172 document.getElementById('hours-digit').innerHTML = '00';
173 } else if (!/^[0-9]{1,2}$/.test(value)) {
174 value = value.replace(/[^0-9]/,'').substr(0,2);
175 document.getElementById('hours-digit').innerHTML = value;
177 value = ((Number(value) < 10) ? '0' : '') + Number(value);
178 document.getElementById('hours-digit').innerHTML = value;
182 document.getElementById('minutes-digit').onclick= function(event) {
183 event.stopPropagation();
186 document.getElementById('minutes-digit').setAttribute("contenteditable", true);
187 document.getElementById('minutes-digit').addEventListener('mouseout', minutesMouseoutHandler );
190 function minutesMouseoutHandler(e){
191 document.getElementById('minutes-digit').removeEventListener('mouseout', minutesMouseoutHandler);
192 var value = document.getElementById('minutes-digit').innerHTML;
193 if (value.length == 0 || Number(value) == 0) {
194 document.getElementById('minutes-digit').innerHTML = '00';
195 } else if (!/^[0-9]{1,2}$/.test(value)) {
196 value = value.replace(/[^0-9]/,'').substr(0,2);
197 document.getElementById('minutes-digit').innerHTML = value;
199 value = ((Number(value) < 10) ? '0' : '') + Number(value);
200 document.getElementById('minutes-digit').innerHTML = value;
204 document.getElementById('seconds-digit').onclick= function(event) {
205 event.stopPropagation();
208 document.getElementById('seconds-digit').setAttribute("contenteditable", true);
209 document.getElementById('seconds-digit').addEventListener('mouseout', secondsMouseoutHandler );
212 function secondsMouseoutHandler(e){
213 document.getElementById('seconds-digit').removeEventListener('mouseout', secondsMouseoutHandler);
214 var value = document.getElementById('seconds-digit').innerHTML;
215 if (value.length == 0 || Number(value) == 0) {
216 document.getElementById('seconds-digit').innerHTML = '00';
217 } else if (!/^[0-9]{1,2}$/.test(value)) {
218 value = value.replace(/[^0-9]/,'').substr(0,2);
219 document.getElementById('seconds-digit').innerHTML = value;
221 value = ((Number(value) < 10) ? '0' : '') + Number(value);
222 document.getElementById('seconds-digit').innerHTML = value;
229 var time = {hours: 0, minutes: 0, seconds: 0};
230 time.hours = Number(document.getElementById('hours-digit').innerHTML);
231 time.minutes = Number(document.getElementById('minutes-digit').innerHTML);
232 time.seconds = Number(document.getElementById('seconds-digit').innerHTML);
233 console.log('start, '+time.hours+' : '+time.minutes+' : '+time.seconds);
234 if (time.hours + time.minutes + time.seconds > 0) {
236 port.postMessage({contentscript: "timer-setTime", value:time});
237 port.postMessage({contentscript: "timer-start"});
242 port.postMessage({contentscript: "timer-reset"});
248 port.postMessage({contentscript: "timer-stop"});
251 function setTime(time) {
252 console.log('setTime, '+time.displayTime.hours+' : '+time.displayTime.minutes+' : '+time.displayTime.seconds);
253 document.getElementById('hours-digit').innerHTML = time.displayTime.hours;
254 document.getElementById('minutes-digit').innerHTML = time.displayTime.minutes;
255 document.getElementById('seconds-digit').innerHTML = time.displayTime.seconds;
256 defaultDisplayTime.hours = time.defaultDisplayTime.hours;
257 defaultDisplayTime.minutes = time.defaultDisplayTime.minutes;
258 defaultDisplayTime.seconds = time.defaultDisplayTime.seconds;
261 function runningMode() {
262 document.getElementById('start-button').innerHTML = 'stop';
265 function pauseMode() {
266 document.getElementById('start-button').innerHTML = 'start';