-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.coffee
88 lines (71 loc) · 1.59 KB
/
index.coffee
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
stylingOptions =
# background color
background: 'rgba(#fff, 0.0)'
# show fullscreen -> true
fullscreen: false
# display position 'top', 'middle', 'bottom'
vertical: 'top'
dateOptions =
# display not only 'time' also 'date'
showDate: false
# format of 'date'
date: '%d/%m/%Y %a'
format = (->
if dateOptions.showDate
dateOptions.date + '\n' +'%l:%M %p'
else
'%l:%M %p'
)()
command: "date +\"#{format}\""
# the refresh frequency in milliseconds
refreshFrequency: 60000
# for update function
dateOptions: dateOptions
render: (output) -> """
<div id='simpleClock'>#{output}</div>
"""
update: (output) ->
if this.dateOptions.showDate
data = output.split('\n')
html = data[1]
html += '<span class="date">'
html += data[0]
html += '</span>'
else
html = output
$(simpleClock).html(html)
style: (->
fontSize = '0.5em'
width = 'auto'
transform = 'auto'
bottom = '%'
top = 'auto'
if stylingOptions.fullscreen
fontSize = '5em'
width = '94%'
if stylingOptions.vertical is 'middle'
transform = 'translateY(50%)'
bottom = '50%'
else if stylingOptions.vertical is 'top'
bottom = 'auto'
top = '0%'
return """
background: #{stylingOptions.background}
color: #FFFFFF
font-family: Helvetica Neue
right: 0%
top: #{top}
bottom: #{bottom}
transform: #{transform}
width: #{width}
#simpleClock
font-size: #{fontSize}
font-weight: 900
margin: 0
text-align: center
padding: 5px 8px
#simpleClock .date
margin-left: .5em
font-size: .5em
"""
)()