WIP move to ESM

Author: hovancik

app/break-preload.mjs

@@ -0,0 +1,29 @@
+import { contextBridge, ipcRenderer } from 'electron'
+import humanizeDuration from 'humanize-duration'
+import * as utils from './utils/utils.js'
+import './expose-process.js'
+
+contextBridge.exposeInMainWorld('i18next', {
+  t: (key, options) => ipcRenderer.invoke('i18next-translate', key, options),
+  dir: () => ipcRenderer.invoke('i18next-dir')
+})
+
+contextBridge.exposeInMainWorld('settings', {
+  get: (key) => ipcRenderer.invoke('settings-get', key)
+})
+
+contextBridge.exposeInMainWorld('breaks', {
+  sendBreakData: () => ipcRenderer.invoke('send-break-data'),
+  finishBreak: () => ipcRenderer.send('finish-break', false),
+  postponeBreak: () => ipcRenderer.send('postpone-break'),
+  signalLoaded: () => ipcRenderer.send('long-break-loaded'),
+  formatKeyboardShortcut: utils.formatKeyboardShortcut,
+  formatTimeRemaining: async (milliseconds, locale) => {
+    const i18n = {
+      t: (key, options) => ipcRenderer.invoke('i18next-translate', key, options)
+    }
+    return utils.formatTimeRemaining(milliseconds, locale, i18n, humanizeDuration)
+  },
+  canPostpone: utils.canPostpone,
+  canSkip: utils.canSkip
+})

app/break-renderer.js

@@ -0,0 +1,56 @@
+import HtmlTranslate from './utils/htmlTranslate.js'
+import './platform.js'
+
+window.onload = async (event) => {
+  const [idea, started, duration, strictMode, postpone,
+    postponePercent, backgroundColor] = await window.breaks.sendBreakData()
+
+  new HtmlTranslate(document).translate()
+
+  document.ondragover = event =>
+    event.preventDefault()
+
+  document.ondrop = event =>
+    event.preventDefault()
+
+  document.querySelector('#close').onclick = async event =>
+    await window.breaks.finishBreak()
+
+  document.querySelector('#postpone').onclick = async event =>
+    await window.breaks.postponeBreak()
+
+  document.querySelector('.break-idea').textContent = idea[0]
+  document.querySelector('.break-text').textContent = idea[1]
+
+  const progress = document.querySelector('#progress')
+  const progressTime = document.querySelector('#progress-time')
+  const postponeElement = document.querySelector('#postpone')
+  const closeElement = document.querySelector('#close')
+  const mainColor = await window.settings.get('mainColor')
+  document.body.classList.add(mainColor.substring(1))
+  document.body.style.backgroundColor = backgroundColor
+
+  document.querySelectorAll('.tiptext').forEach(async tt => {
+    const keyboardShortcut = await window.settings.get('endBreakShortcut')
+    tt.innerHTML = await window.breaks.formatKeyboardShortcut(keyboardShortcut)
+  })
+
+  window.setInterval(async () => {
+    if (await window.settings.get('currentTimeInBreaks')) {
+      document.querySelector('.breaks > :last-child').innerHTML =
+      (new Date()).toLocaleTimeString()
+    }
+    if (Date.now() - started < duration) {
+      const passedPercent = (Date.now() - started) / duration * 100
+      await window.breaks.canSkip(strictMode, postpone, passedPercent, postponePercent)
+      postponeElement.style.display =
+        await window.breaks.canPostpone(postpone, passedPercent, postponePercent) ? 'flex' : 'none'
+      closeElement.style.display =
+        await window.breaks.canSkip(strictMode, postpone, passedPercent, postponePercent) ? 'flex' : 'none'
+      progress.value = (100 - passedPercent) * progress.max / 100
+      progressTime.innerHTML = await window.breaks.formatTimeRemaining(Math.trunc(duration - Date.now() + started),
+        await window.settings.get('language'))
+    }
+  }, 100)
+  await window.breaks.signalLoaded()
+}

app/break.html

@@ -34,4 +34,5 @@
       </div>
     </div>
   </body>
+  <script type="module" src="./break-renderer.js"></script>
 </html>

app/break.js

@@ -1,9 +1,9 @@
-const Scheduler = require('./utils/scheduler')
-const EventEmitter = require('events')
-const NaturalBreaksManager = require('./utils/naturalBreaksManager')
-const DndManager = require('./utils/dndManager')
-const AppExclusionsManager = require('./utils/appExclusionsManager')
-const log = require('electron-log/main')
+import Scheduler from './utils/scheduler.js'
+import EventEmitter from 'events'
+import NaturalBreaksManager from './utils/naturalBreaksManager.js'
+import DndManager from './utils/dndManager.js'
+import AppExclusionsManager from './utils/appExclusionsManager.js'
+import log from 'electron-log/main.js'
 
 class BreaksPlanner extends EventEmitter {
   constructor (settings) {
@@ -289,4 +289,4 @@ class BreaksPlanner extends EventEmitter {
   }
 }
 
-module.exports = BreaksPlanner
+export default BreaksPlanner

app/breaksPlanner.js

@@ -1,14 +1,14 @@
-const { ipcRenderer } = require('electron')
-const HtmlTranslate = require('./utils/htmlTranslate')
-const { setSameWidths } = require('./utils/sameWidths')
-const remote = require('@electron/remote')
-const i18next = remote.require('i18next')
+import { ipcRenderer } from 'electron'
+import HtmlTranslate from './utils/htmlTranslate.js'
+import { setSameWidths } from './utils/sameWidths.js'
+import { require as remoteRequire } from '@electron/remote'
+const i18next = remoteRequire('i18next')
 
 const htmlTranslate = new HtmlTranslate(document)
 let eventsAttached = false
 
 window.onload = (event) => {
-  require('./platform')
+  import('./platform')
   ipcRenderer.send('send-settings')
   htmlTranslate.translate()
   setTimeout(() => { eventsAttached = true }, 500)

app/contributor-preferences.js

@@ -1,5 +1,5 @@
-const { ipcRenderer, shell, contextBridge } = require('electron')
-const remote = require('@electron/remote')
+import { ipcRenderer, shell, contextBridge } from 'electron'
+import remote from '@electron/remote'
 
 contextBridge.exposeInMainWorld('ElectronBridge', {
   // helloWorld: () {

app/electron-bridge.js

@@ -0,0 +1,6 @@
+import { contextBridge } from 'electron'
+
+contextBridge.exposeInMainWorld('process', {
+  platform: () => process.platform,
+  windowsStore: () => process.windowsStore
+})