AskaEth
9c7081b21d
一个用于演练/演示的桌面时钟工具：两个窗口 —— 控制窗口（普通）与时钟窗口（无边框、 可拖动、可拖边缘改大小，由控制窗口开与关）。 功能 - 两个窗口各自的「始终置顶」开关 - 显示样式：纯数字 / 圆形表盘，切换立即生效 - 实时设定时间（含「填入当前显示时间」） - 倍率：支持正数、负数（倒转）、0（暂停）、小数 - 暂停 / 继续（继续时回到暂停前的倍率，按钮文案会显示是几倍） - 快进五档：+5 秒 / +1 分钟 / +5 分钟 / +10 分钟 / +30 分钟 实现要点 - 走时是「基准时间 + 基准时刻 + 倍率」的锚点式模型（不累加、零漂移）； 倍率、暂停、倒转、快进因此是同一套机制的四个用法，互不打架 - 跳转动画做在「呈现时间」这一层：数字滚动与表盘指针扫动共用同一个中间值， 所以永远同步，也不会跨 12 点倒着转一圈 - 无边框窗口的拖动（CSS app-region + 控件 no-drag）与拖边缘改大小 （自己算几何 + IPC setBounds，因为 frame:false 下系统边缘命中不可靠） 测试 152 例：走时模型 / 改大小几何 / 呈现时间 / 两个渲染进程（DOM 桩）
22 lines
1.2 KiB
JavaScript
22 lines
1.2 KiB
JavaScript
'use strict';
|
|
|
|
const { contextBridge, ipcRenderer } = require('electron');
|
|
|
|
// 只把需要的动作暴露出去，渲染进程拿不到 ipcRenderer 本体，也不开 nodeIntegration
|
|
contextBridge.exposeInMainWorld('clockApi', {
|
|
getState: () => ipcRenderer.invoke('state:get'),
|
|
onState: (cb) => ipcRenderer.on('state', (_event, snapshot) => cb(snapshot)),
|
|
setRate: (rate) => ipcRenderer.invoke('rate:set', rate),
|
|
togglePause: () => ipcRenderer.invoke('pause:toggle'),
|
|
fastForward: (deltaMs) => ipcRenderer.invoke('fast-forward', deltaMs),
|
|
setTime: (h, m, s) => ipcRenderer.invoke('time:set', { h, m, s }),
|
|
setStyle: (style) => ipcRenderer.invoke('style:set', style),
|
|
setAlwaysOnTop: (target, value) => ipcRenderer.invoke('always-on-top:set', { target, value }),
|
|
toggleClockWindow: () => ipcRenderer.invoke('clock-window:toggle'),
|
|
closeClockWindow: () => ipcRenderer.invoke('clock-window:close'),
|
|
closeControlWindow: () => ipcRenderer.invoke('control-window:close'),
|
|
// 调整大小要在 mousedown 那一刻拿到精确的窗口位置，异步往返会让第一条 mousemove 用错基准
|
|
getBoundsSync: () => ipcRenderer.sendSync('bounds:get-sync'),
|
|
setBounds: (bounds) => ipcRenderer.send('bounds:set', bounds)
|
|
});
|