| 1 | import { contextBridge, ipcRenderer } from 'electron'; |
| 2 | import { exposeUIKit } from '@electron-uikit/core/preload'; |
| 3 | |
| 4 | try { |
| 5 | exposeUIKit(); |
| 6 | } catch (e) { |
| 7 | console.error(e); |
| 8 | } |
| 9 | |
| 10 | // --------- Expose some API to the Renderer process --------- |
| 11 | contextBridge.exposeInMainWorld('ipcRenderer', { |
| 12 | on(...args: Parameters<typeof ipcRenderer.on>) { |
| 13 | const [channel, listener] = args; |
| 14 | return ipcRenderer.on(channel, (event, ...args) => |
| 15 | listener(event, ...args), |
| 16 | ); |
| 17 | }, |
| 18 | off(...args: Parameters<typeof ipcRenderer.off>) { |
| 19 | const [channel, ...omit] = args; |
| 20 | return ipcRenderer.off(channel, ...omit); |
| 21 | }, |
| 22 | send(...args: Parameters<typeof ipcRenderer.send>) { |
| 23 | const [channel, ...omit] = args; |
| 24 | return ipcRenderer.send(channel, ...omit); |
| 25 | }, |
| 26 | invoke(...args: Parameters<typeof ipcRenderer.invoke>) { |
| 27 | const [channel, ...omit] = args; |
| 28 | return ipcRenderer.invoke(channel, ...omit); |
| 29 | }, |
| 30 | |
| 31 | // electron-store ------------------------------ |
| 32 | setStoreValue: (key: string, value: any) => { |
| 33 | ipcRenderer.invoke('setStore', key, value); |
| 34 | }, |
| 35 | getStoreValue(key: string) { |
| 36 | return ipcRenderer.invoke('getStore', key); |
| 37 | }, |
| 38 | }); |
| 39 | |
| 40 | // --------- Preload scripts loading --------- |
| 41 | function domReady( |
| 42 | condition: DocumentReadyState[] = ['complete', 'interactive'], |
| 43 | ) { |
| 44 | return new Promise((resolve) => { |
| 45 | if (condition.includes(document.readyState)) { |
| 46 | resolve(true); |
| 47 | } else { |
| 48 | document.addEventListener('readystatechange', () => { |
| 49 | if (condition.includes(document.readyState)) { |
| 50 | resolve(true); |
| 51 | } |
| 52 | }); |
| 53 | } |
| 54 | }); |
| 55 | } |
| 56 | |
| 57 | const safeDOM = { |
| 58 | append(parent: HTMLElement, child: HTMLElement) { |
| 59 | if (!Array.from(parent.children).find((e) => e === child)) { |
| 60 | return parent.appendChild(child); |
| 61 | } |
| 62 | }, |
| 63 | remove(parent: HTMLElement, child: HTMLElement) { |
| 64 | if (Array.from(parent.children).find((e) => e === child)) { |
| 65 | return parent.removeChild(child); |
| 66 | } |
| 67 | }, |
| 68 | }; |
| 69 | |
| 70 | /** |
| 71 | * https://tobiasahlin.com/spinkit |
| 72 | * https://connoratherton.com/loaders |
| 73 | * https://projects.lukehaas.me/css-loaders |
| 74 | * https://matejkustec.github.io/SpinThatShit |
| 75 | */ |
| 76 | function useLoading() { |
| 77 | const className = `loaders-css__square-spin`; |
| 78 | const styleContent = ` |
| 79 | @keyframes square-spin { |
| 80 | 25% { transform: perspective(100px) rotateX(180deg) rotateY(0); } |
| 81 | 50% { transform: perspective(100px) rotateX(180deg) rotateY(180deg); } |
| 82 | 75% { transform: perspective(100px) rotateX(0) rotateY(180deg); } |
| 83 | 100% { transform: perspective(100px) rotateX(0) rotateY(0); } |
| 84 | } |
| 85 | .${className} > div { |
| 86 | animation-fill-mode: both; |
| 87 | width: 50px; |
| 88 | height: 50px; |
| 89 | background: #fff; |
| 90 | animation: square-spin 3s 0s cubic-bezier(0.09, 0.57, 0.49, 0.9) infinite; |
| 91 | } |
| 92 | .app-loading-wrap { |
| 93 | position: fixed; |
| 94 | top: 0; |
| 95 | left: 0; |
| 96 | width: 100vw; |
| 97 | height: 100vh; |
| 98 | display: flex; |
| 99 | align-items: center; |
| 100 | justify-content: center; |
| 101 | background: #282c34; |
| 102 | z-index: 9; |
| 103 | } |
| 104 | `; |
| 105 | const oStyle = document.createElement('style'); |
| 106 | const oDiv = document.createElement('div'); |
| 107 | |
| 108 | oStyle.id = 'app-loading-style'; |
| 109 | oStyle.innerHTML = styleContent; |
| 110 | oDiv.className = 'app-loading-wrap'; |
| 111 | oDiv.innerHTML = `<div class="${className}"><div></div></div>`; |
| 112 | |
| 113 | return { |
| 114 | appendLoading() { |
| 115 | safeDOM.append(document.head, oStyle); |
| 116 | safeDOM.append(document.body, oDiv); |
| 117 | }, |
| 118 | removeLoading() { |
| 119 | safeDOM.remove(document.head, oStyle); |
| 120 | safeDOM.remove(document.body, oDiv); |
| 121 | }, |
| 122 | }; |
| 123 | } |
| 124 | |
| 125 | // ---------------------------------------------------------------------- |
| 126 | |
| 127 | const { appendLoading, removeLoading } = useLoading(); |
| 128 | domReady().then(appendLoading); |
| 129 | |
| 130 | window.onmessage = (ev) => { |
| 131 | // eslint-disable-next-line @typescript-eslint/no-unused-expressions |
| 132 | ev.data.payload === 'removeLoading' && removeLoading(); |
| 133 | }; |
| 134 | |
| 135 | setTimeout(removeLoading, 4999); |
| 136 |