cupcakearmy/volta
1
0
Fork 0
mirror of https://github.com/cupcakearmy/volta.git synced 2024-12-22 16:06:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

Panel

Browse Source
This commit is contained in:
nicco 2018-05-22 18:56:33 +02:00
parent 01db723768
commit 068f0a15a6
3 changed files with 259 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

139
src/index.css Executable file
View File

@ -0,0 +1,139 @@
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 400;
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url('./vendor/Source\ Sans\ Pro.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url('./vendor/Source\ Sans\ Pro\ Bold.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
* {
box-sizing: border-box;
}
html,
body,
#app {
color: #3B252C;
font-family: 'Source Sans Pro', sans-serif;
height: 100%;
width: 100%;
padding: 0;
margin: 0;
background: #F7FFF7;
}
hr {
border: 1px solid #E9F1F7;
}
#app {
padding: 1em;
}
#app .title {
font-size: 1.5em;
font-weight: bold;
}
#app .link {
color: #3F8EFC;
/* color: inherit; */
font-size: 1em;
/* font-weight: normal; */
cursor: pointer;
}
#app .link:hover {
text-decoration: underline;
}
#currentBattery {
font-weight: normal;
}
#settings #values {
display: flex;
width: 100%;
justify-content: space-between;
}
#settings #slider {
padding: 1em .6em;
}
#settings #slider-cont {
padding: 1em 0;
}
#settings .noUi-target {
border: none;
}
#settings .noUi-horizontal {
height: .3em;
}
#settings .noUi-connect {
background: #3F8EFC;
}
#settings .noUi-connects {
background: #E9F1F7;
}
#settings .noUi-horizontal .noUi-handle {
cursor: pointer;
width: 1.25em;
border-radius: 2em;
height: 1.25em;
background: #3F8EFC;
box-shadow: none;
border: none;
top: -.5em;
right: -.6em !important;
}
#settings .noUi-horizontal .noUi-handle:focus {
outline: none;
border: none;
}
#settings .noUi-origin .noUi-handle::before {
display: none;
}
#settings .noUi-origin .noUi-handle::after {
display: none;
}
input[type="checkbox"] {
cursor: pointer;
-webkit-appearance: none;
background-color: transparent;
border: 2px solid #3F8EFC;
padding: .75em;
border-radius: 2em;
height: 1.5em;
width: 1.5em;
display: inline-block;
position: relative;
top: .5em;
transition: all ease .25s;
}
input[type="checkbox"]:focus {
outline: none;
}
input[type="checkbox"]:checked {
background-color: #3F8EFC;
border-color: #3473CC;
}

59
src/index.html Executable file
View File

@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Weather</title>
<link rel="stylesheet" href="./index.css" charset="utf-8">
<link rel="stylesheet" href="./vendor/nouislider.min.css" charset="utf-8">
<script charset="utf-8" src="./vendor/nouislider.min.js">
</script>
<script charset="utf-8">
require('./index')
</script>
</head>
<body>
<div id="app">
<div class="title">Current:
<span id="currentBattery"></span>
</div>
<small>Note: Due to limits in the implementation the actual battery value may differ from the one given by the OS</small>
<hr/>
<div id="settings">
<div class="title">Limits</div>
<div id="slider">
<div id="slider-range"></div>
</div>
<div id="values">
<div id="min">
<strong>Min:</strong>
<span id="min-value"></span>
</div>
<div id="max">
<strong>Max:</strong>
<span id="max-value"></span>
</div>
</div>
<br/>
<small>Set at which battery level Volta should notify you</small>
</div>
<hr/>
<div class="title">Start on boot
<input type="checkbox" id="launch">
</div>
<hr/>
<div class="title link" id="close">Close Window</div>
<div class="title link" id="quit">Quit App</div>
</div>
<script>
</script>
</body>
</html>

61
src/index.js Executable file
View File

@ -0,0 +1,61 @@
const {
ipcRenderer,
shell,
remote
} = require('electron')
let rangeSlider
let autoLaunch
document.addEventListener('DOMContentLoaded', () => {
document.getElementById('quit').addEventListener('click', () => {
ipcRenderer.send('quit')
})
document.getElementById('close').addEventListener('click', () => {
remote.getCurrentWindow().hide()
})
})
function iniSlider() {
rangeSlider = document.getElementById('slider-range')
noUiSlider.create(rangeSlider, {
start: [0, 100],
step: 0.01,
range: {
min: [0],
max: [100]
},
connect: true
})
rangeSlider.noUiSlider.on('update', function (values, handle) {
const min = parseInt(values[0])
const max = parseInt(values[1])
document.getElementById('min-value').innerHTML = min
document.getElementById('max-value').innerHTML = max
ipcRenderer.send('values', {
max,
min
})
})
}
function iniLaunch() {
autoLaunch = document.getElementById('launch')
autoLaunch.addEventListener('change', () => ipcRenderer.send('launch', autoLaunch.checked))
}
ipcRenderer.on('values', (event, values) => {
if (rangeSlider === undefined) iniSlider()
rangeSlider.noUiSlider.set([values.min, values.max]);
})
ipcRenderer.on('launch', (event, checked) => {
if (autoLaunch === undefined) iniLaunch()
autoLaunch.checked = checked
})
ipcRenderer.on('battery', (event, value) => {
document.getElementById('currentBattery').innerText = `${value}%`
})