forked from Freetz/freetz
/
skin.sh
108 lines (95 loc) · 2.76 KB
/
skin.sh
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
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
skin_head() {
local title=$1 id=$2
cat << EOF
<title>Freetz @$(hostname -s|html) – $title</title>
<link rel="stylesheet" type="text/css" href="/style/newfreetz/base.css">
<link rel="stylesheet" type="text/css" href="/style/newfreetz/colorscheme.css">
EOF
_cgi_print_extra_styles
# If there is no menu, we make the space available to the content.
[ -z "$id" ] && let _cgi_width+=180
# The width of the whole cgi: There are 20px border, 20 px space
# and 180px for the menu area.
let _cgi_content_width=_cgi_width+30
let _cgi_border_width=_cgi_content_width-20
let _cgi_total_width=_cgi_content_width+20
[ -z "$id" ] || let _cgi_total_width+=180
export _cgi_content_width
}
skin_body_begin() {
local title=$1 id=$2
local help=""
if [ -n "$_CGI_HELP" ]; then
help=" <span class='help'>(<a href='$(html "$_CGI_HELP")' target='_blank'>Hilfe</a>)</span>"
fi
cat << EOF
<div id="wrapper">
<div id="title-box">
<div id="title-box-left"></div>
<div id="title-box-mid"></div>
<div id="title-box-right"></div>
<div id="title-box-logo"><a href="https://freetz.github.io/" target="_blank" class="logo"><img src="/images/newfreetz/freetz_logo.gif"></a></div>
<div id="title-box-fun">the fun has just begun ...</div>
<div id="title-box-version">$(html < /etc/.freetz-version)</div>
</div>
<div id="contentwrapper" style="width:${_cgi_total_width}px">
EOF
if [ -n "$id" ]; then
cat << EOF
<div id="menu">
<div style>
<div id="menu-top-left"></div>
<div id="menu-top"></div>
<div id="menu-top-right"></div>
</div>
<div id="menu-back">
<div id="menucontainer">
EOF
_cgi_print_menu "$id"
cat << EOF
</div>
</div>
<div style>
<div id="edge-bot-left"></div>
<div id="menu-bot"></div>
<div id="edge-bot-right"></div>
</div>
</div>
EOF
fi
cat << EOF
<div id="edge" style="width:${_cgi_content_width}px">
<div id="top">
<div id="edge-top-left"></div>
<div id="edge-top" style="width:${_cgi_border_width}px"></div>
<div id="edge-top-right"></div>
<div id="titlebar"><span class="title">$title</span>$help</div>
</div>
<div id="container">
EOF
}
skin_body_end() {
cat << EOF
</div>
<div style>
<div id="edge-bot-left"></div>
<div id="edge-bot"style="width:${_cgi_border_width}px"></div>
<div id="edge-bot-right"></div>
</div>
<div id="footer">
<span class="datetime" title="Systemzeit des Routers">$(date +'%d.%m.%Y %H:%M')</span> –
<span class="uptime" title="Uptime">$(uptime | sed -r 's/.*(up.*), *load.*/\1/')</span> –
<span class="opt">optimiert für Mozilla Firefox</span>
</div>
</div>
</div>
</div>
EOF
}
skin_sec_begin() {
echo "<h1>$1</h1>"
}
skin_sec_end() {
let _cgi_breakline_width=_cgi_content_width-2
echo "<div id='breakline' style='width:${_cgi_breakline_width}px'></div>"
}