Skip to content

Instantly share code, notes, and snippets.

@kanreisa
Created April 13, 2016 07:33
Show Gist options
  • Save kanreisa/60c46fd45054eecb7bc3a02be689233f to your computer and use it in GitHub Desktop.
Save kanreisa/60c46fd45054eecb7bc3a02be689233f to your computer and use it in GitHub Desktop.
Electron を光らせる
div#container {
-webkit-user-select: none;
-webkit-app-region: drag;
position: absolute;
top: 10px;
right: 10px;
bottom: 10px;
left: 10px;
background: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.15);
border: 1px solid #777;
}
div#container.active {
box-shadow: 0 0 10px #9c4b7d;
border: 1px solid #9c4b7d;
}
div#container * {
-webkit-app-region: no-drag;
}
'use strict';
window.addEventListener('DOMContentLoaded', () => {
const container = flagrate.Element.extend(document.getElementById('container'));
window.addEventListener('blur', updateWindowState);
window.addEventListener('focus', updateWindowState);
function updateWindowState() {
setImmediate(() => {
if (document.hasFocus() === true) {
container.addClassName('active');
} else {
container.removeClassName('active');
}
});
}
updateWindowState();
});
'use strict';
const electron = require('electron');
const app = electron.app;
let window;
app.on('ready', show);
function show() {
window = new electron.BrowserWindow({
width: 400,
height: 480,
frame: false,
transparent: true
});
window.loadURL(`file://${ __dirname }/window.html`);
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Window</title>
<link rel="stylesheet" href="basic.css">
<script src="basic.js"></script>
</head>
<body>
<div id="container"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment