optimized

RoderickQiu · Jan 23, 2019 · eeecdc9 · eeecdc9
1 parent 4264b2c
commit eeecdc9
Show file tree

Hide file tree

Showing 9 changed files with 95 additions and 34 deletions.
diff --git a/about.html b/about.html
@@ -24,10 +24,10 @@
                 <script>document.write("v" + require("./package.json").version)</script>
             </p>
             <p class="small">
-                <a href="javascript:require('electron').shell.openExternal(require('./package.json').homepage)">Homepage</a>&nbsp;|&nbsp;
-                <a href="javascript:require('electron').shell.openExternal('https://github.com/RoderickQiu/wnr/')">GitHub</a>&nbsp;|&nbsp;
-                <a href="javascript:require('electron').shell.openExternal('https://github.com/RoderickQiu/wnr/issues/')">Issues</a>&nbsp;|&nbsp;
-                <a href="javascript:require('electron').shell.openExternal(require('./package.json').helppage)">Help</a>
+                <a class="rest" href="javascript:require('electron').shell.openExternal(require('./package.json').homepage)">Homepage</a>&nbsp;|&nbsp;
+                <a class="rest" href="javascript:require('electron').shell.openExternal('https://github.com/RoderickQiu/wnr/')">GitHub</a>&nbsp;|&nbsp;
+                <a class="rest" href="javascript:require('electron').shell.openExternal('https://github.com/RoderickQiu/wnr/issues/')">Issues</a>&nbsp;|&nbsp;
+                <a class="rest" href="javascript:require('electron').shell.openExternal(require('./package.json').helppage)">Help</a>
             </p>
             <hr />
             <p class="small">

diff --git a/main.js b/main.js
@@ -8,7 +8,18 @@ app.commandLine.appendSwitch('autoplay-policy', 'no-user-gesture-required');//
 
 function createWindow() {
     // 创建浏览器窗口。
-    win = new BrowserWindow({ width: 324, height: 233, frame: false, resizable: true, show: false, hasShadow: true, webPreferences: { nodeIntegration: true } })
+    win = new BrowserWindow({
+        width: 324,
+        height: 233,
+        frame: false,
+        resizable: true,
+        show: false,
+        hasShadow: true,
+        webPreferences: { nodeIntegration: true },
+        title: "wnr",
+        icon: "./res/icons/wnrIcon.png",
+        backgroundColor: "#fefefe"
+    })// 为跨平台优化
 
     // 然后加载应用的 index.html。
     win.loadFile('index.html')
@@ -55,6 +66,50 @@ app.on('ready', () => {
     tray.on('click', () => {
         win.isVisible() ? win.hide() : win.show()
     })//托盘菜单
+
+    if (process.platform === 'darwin') {
+        var template = [{
+            label: 'wnr',
+            submenu: [{
+                label: 'Quit',
+                accelerator: 'CmdOrCtrl+Q',
+                click: function () {
+                    app.quit();
+                }
+            }]
+        }, {
+            label: 'Edit',
+            submenu: [{
+                label: 'Undo',
+                accelerator: 'CmdOrCtrl+Z',
+                selector: 'undo:'
+            }, {
+                label: 'Redo',
+                accelerator: 'Shift+CmdOrCtrl+Z',
+                selector: 'redo:'
+            }, {
+                type: 'separator'
+            }, {
+                label: 'Cut',
+                accelerator: 'CmdOrCtrl+X',
+                selector: 'cut:'
+            }, {
+                label: 'Copy',
+                accelerator: 'CmdOrCtrl+C',
+                selector: 'copy:'
+            }, {
+                label: 'Paste',
+                accelerator: 'CmdOrCtrl+V',
+                selector: 'paste:'
+            }, {
+                label: 'Select All',
+                accelerator: 'CmdOrCtrl+A',
+                selector: 'selectAll:'
+            }]
+        }];
+        var osxMenu = menu.buildFromTemplate(template);
+        menu.setApplicationMenu(osxMenu);
+    }// 应付macOS的顶栏空缺
 })
 
 app.on('activate', () => {
@@ -73,4 +128,9 @@ ipcMain.on('warninggiver', function () {
         win.once('focus', () => win.flashFrame(false));
         win.flashFrame(true);// 在Windows平台上闪烁任务栏按钮
     }
-})
+})
+
+/* 参考：
+- https://blog.avocode.com/4-must-know-tips-for-building-cross-platform-electron-apps-f3ae9c2bffff [need proxy]
+- https://electronjs.org/docs
+*/
diff --git a/package.json b/package.json
@@ -1,11 +1,13 @@
 {
   "name": "wnr",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "description": "The name is a abbr of \"Work & Rest\". It's a timer app with strong expansibility for computers.",
   "main": "main.js",
   "scripts": {
     "start": "electron .",
-    "winx64": "electron-builder --win --x64"
+    "win": "electron-builder --win --x64",
+    "mac": "electron-builder --mac --x64",
+    "linux": "electron-builder --linux --x64"
   },
   "repository": {
     "type": "git",
@@ -31,6 +33,18 @@
         "zip"
       ],
       "icon": "res/icons/iconWin.ico"
+    },
+    "mac": {
+      "target": [
+        "zip"
+      ],
+      "icon": "res/icons/iconMac.icns"
+    },
+    "linux": {
+      "target": [
+        "zip"
+      ],
+      "icon": "res/icons/wnrIcon.png"
     }
   }
 }
diff --git a/res/icons/iconMac.icns b/res/icons/iconMac.icns
diff --git a/res/sound/allend.wav b/res/sound/allend.wav
diff --git a/res/sound/beep.wav b/res/sound/beep.wav
diff --git a/res/sound/timeend.wav b/res/sound/timeend.wav
diff --git a/style.css b/style.css
@@ -10,19 +10,6 @@ html, body{
     -webkit-app-region: drag;/* let the app draggable */
 }
 
-a{
-    color: #222222;
-}
-a:hover{
-    color: #222222;
-}
-a:active{
-    color: #333333;
-}
-a:visited{
-    color: #222222;
-}
-
 input{
     outline: none;
     border: none;
@@ -47,5 +34,5 @@ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{
     top: 5px;
     right: 8px;
     -webkit-app-region: no-drag;/* let it clickable */
-    -webkit-user-select: text;
+    -webkit-user-select: none;
 }
diff --git a/timer.html b/timer.html
@@ -26,9 +26,8 @@
             <div class="text-center small"><a id="stopper" href="javascript:stopper()" class="text-black-50">Stop</a></div>
         </div>
     </div><!-- for things with 'work' mark, when it's resting, the color should be changed -->
-    <audio id="beeper">
-        <source src="res/sound/beep.wav" />
-    </audio>
+    <audio id="allend" src="res/sound/allend.wav"></audio>
+    <audio id="timeend" src="res/sound/timeend.wav"></audio>
     <script>
         var $_GET = (function () {
             var url = window.document.location.href.toString();
@@ -53,30 +52,31 @@
             $("#timer").html("<p class='text-center lead'>The time is too long. Please make your work time and your rest time less than a day.<br/><a href='index.html' class='text-primary'>Back</a></p>");
         } else {
             if (title && title != "undefined") $("#title").html(title);
-            var starttime, int, t, seconds, minutes, hours, method = 1, times = 0, isClockWorking = 1;//method: 1-work / 2-rest, times: time-reset times
+            var starttime, int, t, seconds, minutes, hours, method = 1, times = 0, isclockworking = 1;//method: 1-work / 2-rest, times: time-reset times
             starttime = new Date().getTime();
             if (loop != 0) int = self.setInterval("clock()", 10);
             else ender();
             function stopper() {
-                if (isClockWorking) {
+                if (isclockworking) {
                     window.clearInterval(int);
                     $("#stopper").text("Resume");
-                    isClockWorking = 0;//to stop
+                    isclockworking = 0;//to stop
                 } else {
                     if (method == 1) starttime = new Date().getTime() - (worktime - hours * 3600000 - minutes * 60000 - seconds * 1000);
                     else starttime = new Date().getTime() - (resttime - hours * 3600000 - minutes * 60000 - seconds * 1000);
                     int = self.setInterval("clock()", 10);
                     $("#stopper").text("Stop");
-                    isClockWorking = 1;//to restart
+                    isclockworking = 1;//to restart
                 }
             }
-            function warninggiver() {
+            function warninggiver(isend) {
                 var ipc = require('electron').ipcRenderer;
                 ipc.send('warninggiver');
-                document.getElementById("beeper").play();
+                if (isend) document.getElementById("allend").play();
+                else document.getElementById("timeend").play();//different sound for different circumstances
             }
             function themechanger() {
-                warninggiver();
+                warninggiver(0);
                 if (method == 1) {
                     $(".work").addClass("rest");
                     $(".work").removeClass("work");
@@ -93,8 +93,8 @@
                 window.clearInterval(int);
                 $("#work-rest").text("");
                 $("#now-timing").text("End!");
-                warninggiver();
-                isClockWorking = 0;
+                warninggiver(1);
+                isclockworking = 0;
                 $("#stopper").text("");
             }
             function clock() {