electron实现定时关机和提醒

electron实现定时关机和提醒

做个定时关机和提醒的小练习。

  1. html部分
html 复制代码
<body>
    <form id="myForm">
      <label for="shutdowntime">设置定时关机时间:</label>
      <input type="time" id="shutdowntime" value="18:00" name="shutdowntime">
      <input type="button" id="myButton" click="startTime()" value="开始生效">
    </form>
    <p id="remainTime"></p>
    <script src="renderer.js"></script>
  </body>
  1. main.js里引入提醒和主进程,在ready中进行监听。
javascript 复制代码
const { app, BrowserWindow,ipcMain,Notification } = require('electron')
const NOTIFICATION_TITLE = '提醒'
const NOTIFICATION_BODY = '还有10分钟即将关闭电脑,请保存数据。'
app.whenReady().then(() => {
  //其他方法省略
  ipcMain.on('shutdown', () => {
    exec('shutdown -s', (err, stdout, stderr) => {
      if (err) {
        console.error(`执行出错: ${err}`);
        return;
      }
      console.log(`标准输出: ${stdout}`);
      console.error(`标准错误: ${stderr}`);
    });
  });

  ipcMain.on('notice', () => {
    new Notification({ title: NOTIFICATION_TITLE, body: NOTIFICATION_BODY 				  }).show()
  });
})
  1. renderer.js引入ipcRenderer进程,通过ipcRenderer.send()调用主进程方法。
javascript 复制代码
const { ipcRenderer } = require('electron');

var shutdowntime;
//计时,并处理提醒和关机
function displayTime() {
  const now = new Date();
  let startTime =now.getHours() + ':' + now.getMinutes() + ':' + now.getSeconds()
  let endTime = shutdowntime+':00';
  let remainingTime = calculateTimeDifference(startTime, endTime);
  var remainTime = "距离关机时间: " + remainingTime;
  document.getElementById("remainTime").innerHTML = remainTime;

  //到时间提醒
  if(remainingTime==='00:10:00'){
    ipcRenderer.send('notice'); 
  }
  //到时间关机
  if(remainingTime==='00:01:00'){
    ipcRenderer.send('shutdown'); 
  }
}

//监听设置的事件
document.addEventListener('DOMContentLoaded', function() {
  var button = document.getElementById('myButton');
  button.addEventListener('click', function() {
    // 设置定时器,每秒调用一次displayTime函数
    var form = document.getElementById('myForm');
    shutdowntime = form.elements['shutdowntime'].value;
    setInterval(displayTime, 1000);
  });
});

//计算时间差
function calculateTimeDifference(startTime, endTime) {
  function toMilliseconds(timeString) {
    let parts = timeString.split(':');
    let milliseconds = Number(parts[0]) * 3600000 + 
                       Number(parts[1]) * 60000 + 
                       Number(parts[2]) * 1000; 
    return milliseconds;
  }

  function toTimeString(milliseconds) {
    let hours = Math.floor(milliseconds / 3600000);
    let minutes = Math.floor((milliseconds % 3600000) / 60000);
    let seconds = Math.floor((milliseconds % 60000) / 1000);
    return hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0') + ':' + seconds.toString().padStart(2, '0');
  }

  let startMillis = toMilliseconds(startTime);
  let endMillis = toMilliseconds(endTime);
  let differenceMillis = Math.abs(endMillis - startMillis); 

  return toTimeString(differenceMillis);
}
相关推荐
费曼学习法23 分钟前
React Hooks 源码级揭秘:为什么必须按顺序调用?
javascript·react.js
之歆1 小时前
DAY_20JavaScript 条件语句与循环结构深度学习(二)
前端·javascript
布局呆星1 小时前
Vue3 路由守卫详解:全局守卫、路由独享守卫、组件内守卫
前端·javascript·vue.js
小李子呢02111 小时前
前端八股Vue---ref操作 DOM 元素或组件,调用子组件方法
前端·javascript·vue.js
yqcoder2 小时前
深入理解 JavaScript:什么是可迭代对象 (Iterable)?
开发语言·javascript·网络
kyriewen112 小时前
我开发的 Chrome 扒图浏览器插件又更新了❗
前端·javascript·chrome·科技·ai
晓得迷路了3 小时前
栗子前端技术周刊第 128 期 - Rolldown 1.0、Vitest、Node.js 26.0.0...
前端·javascript·css
qingy_20463 小时前
浏览器页面出现竖向滚动条的解决方案
前端·javascript·vue.js
之歆3 小时前
DAY_17深度博客:CSS 响应式布局 · BFC · JavaScript 完全指南(下)
前端·javascript·css
光影少年3 小时前
React18 函数组件执行顺序、严格模式下重复执行问题
前端·javascript·react.js