summaryrefslogtreecommitdiff
path: root/www
diff options
context:
space:
mode:
Diffstat (limited to 'www')
-rw-r--r--www/js/calendar.js22
-rw-r--r--www/styles/main.css1
-rw-r--r--www/styles/week.css26
-rw-r--r--www/weeks.html55
4 files changed, 77 insertions, 27 deletions
diff --git a/www/js/calendar.js b/www/js/calendar.js
index 8bdf033..c6b4f61 100644
--- a/www/js/calendar.js
+++ b/www/js/calendar.js
@@ -21,6 +21,8 @@
'use strict';
+var current_week_offset = -4;
+
function getLastMonday() {
var d = new Date();
d.setHours(0, 0, 0, 0);
@@ -55,13 +57,13 @@ function addWeekClass(row, week) {
}
}
-function calendar_redraw() {
+function calendar_redraw(weekstart) {
var cal = $('#calendar');
cal.find("tr:gt(0)").remove();
var date = getLastMonday();
- date = addDeltaDays(date, -28);
- for(var w = 0; w < 42; w++) {
+ date = addDeltaDays(date, weekstart * 7);
+ for(var w = 0; w < 20; w++) {
var week = get_rd_week(date.valueOf());
var row = $('<tr>');
addWeekClass(row, week);
@@ -82,5 +84,17 @@ function calendar_redraw() {
}
function calendar_init() {
- calendar_redraw()
+ $('#btn-earlier').click(calendar_prev);
+ $('#btn-later').click(calendar_next);
+ calendar_redraw(current_week_offset)
+}
+
+function calendar_prev() {
+ current_week_offset--;
+ calendar_redraw(current_week_offset)
+}
+
+function calendar_next() {
+ current_week_offset++;
+ calendar_redraw(current_week_offset)
}
diff --git a/www/styles/main.css b/www/styles/main.css
index 65b04de..638f4d2 100644
--- a/www/styles/main.css
+++ b/www/styles/main.css
@@ -21,6 +21,7 @@
body {
background-color: #eee;
+ font-family: Sans-Serif;
}
#container {
diff --git a/www/styles/week.css b/www/styles/week.css
index 5ff75cd..211f1ad 100644
--- a/www/styles/week.css
+++ b/www/styles/week.css
@@ -19,7 +19,32 @@
* along with rhrdweb. If not, see <http://www.gnu.org/licenses/>.
*/
+#leftcol {
+ float: left;
+ width: 42%;
+ min-width: 25em;
+ margin-top: 5em;
+ margin-bottom: 5em;
+}
+
+#buttons {
+ margin-top: 3em;
+}
+
+#buttons input[type=button] {
+ font-size: 1.3em;
+ font-weight: bold;
+ padding: 0.3em 3em;
+}
+
+#rightcol {
+ float: left;
+ width: 58%;
+ min-width: 25em;
+}
+
#calendar {
+ margin-top: 2em;
border-collapse: collapse;
}
@@ -47,4 +72,3 @@
border-left: 2px solid white;
border-right: 2px solid white;
}
-
diff --git a/www/weeks.html b/www/weeks.html
index 13ee0e5..42c8e29 100644
--- a/www/weeks.html
+++ b/www/weeks.html
@@ -15,33 +15,44 @@
</head>
<body>
<div id="container">
- <div id="clock">
- <span class="current-week"></span>
- <span class="clock-date"></span>
- <span class="clock-time"></span>
- </div>
+ <div id="leftcol">
+ <div id="title">
+ <h1>Rivendell Wochenplan</h1>
+ </div>
- </div>
+ <div id="clock">
+ <h2>aktuelle Woche:</h2>
+ <span class="current-week"></span>
+ <span class="clock-date"></span>
+ <span class="clock-time"></span>
+ </div>
- <div id="weeks">
- <table id="calendar">
- <tr>
- <th></th>
- <th></th>
- <th>Mo</th>
- <th>Di</th>
- <th>Mi</th>
- <th>Do</th>
- <th>Fr</th>
- <th>Sa</th>
- <th>So</th>
- <th></th>
- </tr>
- </table>
+ <div id="buttons">
+ <input id="btn-earlier" type="button" value="Früher"></input>
+ <input id="btn-later" type="button" value="Später"></input>
+ </div>
+ </div>
+
+ <div id="rightcol">
+ <table id="calendar">
+ <tr>
+ <th></th>
+ <th></th>
+ <th>Mo</th>
+ <th>Di</th>
+ <th>Mi</th>
+ <th>Do</th>
+ <th>Fr</th>
+ <th>Sa</th>
+ <th>So</th>
+ <th></th>
+ </tr>
+ </table>
+ </div>
</div>
<script type="text/javascript">
- <!-- clock_init(); -->
+ clock_init();
calendar_init();
</script>