summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/clockView.js14
-rw-r--r--www/js/bundle.js130
-rw-r--r--www/js/clock.js (renamed from src/clock.js)18
-rw-r--r--www/weeks.html9
4 files changed, 23 insertions, 148 deletions
diff --git a/src/clockView.js b/src/clockView.js
new file mode 100644
index 0000000..61a13f4
--- /dev/null
+++ b/src/clockView.js
@@ -0,0 +1,14 @@
+var ClockView = React.createClass({
+ render: function() {
+ return (
+ <p>
+ Hello, <input type="text" placeholder="Your name here" />!
+ It is {this.props.date.toTimeString()}
+ </p>
+ );
+ }
+});
+
+setInterval(function() {
+ ReactDOM.render(<ClockView date={new Date()} />, document.getElementById('clock'));
+}, 500);
diff --git a/www/js/bundle.js b/www/js/bundle.js
index 02b7f7c..72bc450 100644
--- a/www/js/bundle.js
+++ b/www/js/bundle.js
@@ -1,134 +1,14 @@
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
-/*
- * rhrdweb
- *
- * Copyright (C) 2016 Christian Pointner <equinox@helsinki.at>
- *
- * This file is part of rhrdweb.
- *
- * rhrdweb is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * any later version.
- *
- * rhrdweb is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with rhrdweb. If not, see <http://www.gnu.org/licenses/>.
- */
-
-'use strict';
-
-function Clock() {
- this.draw_callbacks = $.Callbacks('unique');
-
- this.last_message = { t1: 0, t2: 0, t3: 0, t4: 0, tz_offset: 3600 };
- this.clock_offset = 0;
- this.clock_rtt = 0;
- this.state = 'NEW';
-
- this.now = function () {
- return new Date(this.getRDTimeMS());
- };
-
- this.getRDTimeMS = function () {
- return +new Date() + this.last_message.tz_offset * 1000 + this.clock_offset;
- };
-
- this.redraw = function () {
- var rdtime_ms = this.getRDTimeMS();
-
- var rdtime = new Date(rdtime_ms);
- var date_str = weekday_short[rdtime.getUTCDay()] + ', ';
- date_str += rdtime.getUTCDate() + '.' + (rdtime.getUTCMonth() + 1) + '.' + rdtime.getUTCFullYear();
-
- var time_str = (rdtime.getUTCHours() > 9 ? ' ' : ' 0') + rdtime.getUTCHours();
- time_str += (rdtime.getUTCMinutes() > 9 ? ':' : ':0') + rdtime.getUTCMinutes();
- time_str += (rdtime.getUTCSeconds() > 9 ? ':' : ':0') + rdtime.getUTCSeconds();
-
- this.draw_callbacks.fireWith(window, [date_str, time_str, get_rd_week(rdtime_ms)]);
- };
-
- this.addCallback = function (cb) {
- this.draw_callbacks.add(cb);
- };
-
- this.ntp_update = function (event) {
- var t4 = +new Date();
-
- var msg = JSON.parse(event.data);
- msg.t4 = t4;
- this.last_message = msg;
- this.clock_offset = (msg.t2 - msg.t1 + (msg.t3 - msg.t4)) / 2;
- this.clock_rtt = msg.t4 - msg.t1 - (msg.t3 - msg.t2);
- // console.log('got new ntp message from rhrdtime (rtt=' + this.clock_rtt + ' ms): new offset = ' + this.clock_offset + ' ms');
- };
-
- this.ntp_request = function () {
- this.sock.send(JSON.stringify({ t1: +new Date(), t2: 0, t3: 0, t4: 0, tz_offset: 0, week: 0 }));
- };
-
- this.sock_onopen = function () {
- // console.log('clock websocket connection established');
- this.state = 'CONNECTED';
- this.ntp_request();
- this.interval_request = setInterval(this.ntp_request.bind(this), 2000);
- };
-
- this.sock_onclose = function (event) {
- if (this.state == 'STOPPED') {
- delete this.sock;
- } else {
- // console.log('clock websocket closed with code ' + event.code + ', trying reconnect...');
- clearInterval(this.interval_request);
- delete this.interval_request;
- this.sock.close();
- delete this.sock;
- setTimeout(this.connect.bind(this), 1000);
- this.state = 'RECONNECTING';
- }
- };
-
- this.connect = function () {
- this.sock = new WebSocket('wss://' + window.location.host + '/ntp');
- this.sock.onmessage = this.ntp_update.bind(this);
- this.sock.onopen = this.sock_onopen.bind(this);
- this.sock.onclose = this.sock_onclose.bind(this);
- this.state = 'CONNECTING';
- };
-
- this.start = function () {
- this.connect();
- this.interval_redraw = setInterval(this.redraw.bind(this), 200);
- };
-
- this.stop = function () {
- this.state = 'STOPPED';
- clearInterval(this.interval_redraw);
- delete this.interval_redraw;
- clearInterval(this.interval_request);
- delete this.interval_request;
- this.sock.close();
- };
-}
-
-var clock = new Clock();
-clock.start();
-
var ClockView = React.createClass({
- displayName: 'ClockView',
-
+ displayName: "ClockView",
render: function () {
return React.createElement(
- 'p',
+ "p",
null,
- 'Hello, ',
- React.createElement('input', { type: 'text', placeholder: 'Your name here' }),
- '! It is ',
+ "Hello, ",
+ React.createElement("input", { type: "text", placeholder: "Your name here" }),
+ "! It is ",
this.props.date.toTimeString()
);
}
diff --git a/src/clock.js b/www/js/clock.js
index 163f464..a4cba2d 100644
--- a/src/clock.js
+++ b/www/js/clock.js
@@ -116,21 +116,3 @@ function Clock() {
var clock = new Clock();
clock.start();
-
-
-
-var ClockView = React.createClass({
-
- render: function() {
- return (
- <p>
- Hello, <input type="text" placeholder="Your name here" />!
- It is {this.props.date.toTimeString()}
- </p>
- );
- }
-});
-
-setInterval(function() {
- ReactDOM.render(<ClockView date={new Date()} />, document.getElementById('clock'));
-}, 500);
diff --git a/www/weeks.html b/www/weeks.html
index 8ca1e7c..1b3f90c 100644
--- a/www/weeks.html
+++ b/www/weeks.html
@@ -9,6 +9,9 @@
<link href="/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="/styles/common.css" rel="stylesheet">
<link href="/styles/weeks.css" rel="stylesheet">
+
+ <script src="/javascript/react/react.min.js"></script>
+ <script src="/javascript/react/react-dom.min.js"></script>
<script src="/javascript/jquery/jquery.min.js"></script>
<script src="/js/utils.js"></script>
<script src="/js/clock.js"></script>
@@ -20,13 +23,10 @@
<div class="col-md-4 col-md-offset-1">
<div id="title">
<h1>Rivendell Wochenplan</h1>
+ <h2>aktuelle Woche:</h2>
</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="buttons">
@@ -57,7 +57,6 @@
</div>
<script type="text/javascript">
- clock_init();
calendar_init();
</script>