<!DOCTYPE html>
<html>
<head>
<title><%= process.env.npm_package_productName %></title>
<meta charset="utf-8">
<style>
<%= __GLOBAL_STYLES__ %>
#preload {
-webkit-app-region: drag;
align-items: center;
background: white;
bottom: 0;
display: none;
flex-direction: column;
justify-content: center;
left: 0;
opacity: 1;
position: fixed;
right: 0;
top: 0;
transition: opacity 0.4s ease-in-out;
z-index: 100;
}
#preload video {
height: 144px;
width: 256px;
}
</style>
<script>
<% if (htmlWebpackPlugin.options.nodeModules) { %>
require('module').globalPaths.push(
'<%= htmlWebpackPlugin.options.nodeModules %>'.replace(/\\/g, '\\\\'),
)
<% } %>
require('source-map-support/source-map-support.js').install()
</script>
</head>
<body>
<div id="preload">
<video autoplay loop muted src="<%= __DEV__ ? '.' : '../static' %>/videos/loader.mp4" />
</div>
<div id="app"></div>
<script>
const { remote } = require('electron')
const { name } = remote.getCurrentWindow()
const preloadEl = document.getElementById('preload')
const appEl = document.getElementById('app')
const initApp = (options = {}) => {
const { force = false } = options
if (force) {
preloadEl.remove()
} else {
preloadEl.style.opacity = 0
preloadEl.addEventListener('transitionend', () => preloadEl.remove())
}
}
if (name === 'MainWindow') {
preloadEl.style.display = 'flex'
let waitTime = 0
const PRELOAD_WAIT_TIME_MIN = 2e3
const interval = setInterval(() => (waitTime += 250), 250)
window.onAppReady = () => {
const delay = PRELOAD_WAIT_TIME_MIN - waitTime
clearInterval(interval)
setTimeout(initApp, delay > 0 ? delay : 1)
}
} else {
initApp({ force: true })
}
</script>
</body>
</html>