-
Notifications
You must be signed in to change notification settings - Fork 0
/
dnd.jsx
60 lines (51 loc) · 1.93 KB
/
dnd.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
import { run } from 'uebersicht';
import { clickEffect } from './lib/js/utils.js';
// Refresh once every 10 seconds (mainly due to DND being garbage on Big Sur).
const refreshFrequency = 10000;
const initialState = false;
// Currently using calm-notifications (https://github.com/vitorgalvao/tiny-scripts).
const command = 'calm-notifications status';
const updateState = (event, previousState) => {
if (!event.output) {
return previousState;
}
return event.output.trim() === 'on';
};
const render = output => {
const onClick = e => {
clickEffect(e);
run(`calm-notifications ${output ? 'off' : 'on'}`);
};
return (
<section onClick={onClick}>
{output ? '' : ''}
<div className='outer'>
<div className='inner' style={{width: `${output ? '100' : '0'}%`}}></div>
</div>
</section>
);
};
const className = {
top: '0px', // Absolute position.
right: '219px',
borderLeft: '1px solid #1c1c1c', // Black separator.
padding: '6px 12px 6px 12px', // Roughly center the widget contents.
fontFamily: 'CozetteVector', // Font family and sizing.
fontSize: '13px',
lineHeight: '10px', // Line height to keep border and centering consistent.
color: '#b6b6b6', // Text color.
'& .outer': {
display: 'inline-block', // Display the outer box in-line rather than below.
boxSizing: 'border-box', // Include the padding and border in the total width/height of the outer box.
marginLeft: '8px', // Spacing between the outer box and the text.
width: '7px', // Static width and height of the outer box.
height: '7px',
border: '1px solid #565656', // Thin grey border to mark outer box.
padding: '1px', // Pad to place the inner bar directly inside.
'& .inner': {
height: '3px', // 3px fills the outer box without clipping.
backgroundColor: '#b6b6b6' // Inner box color.
}
}
};
export { refreshFrequency, initialState, command, updateState, render, className };