From 8a24f9fd9f2826732e1567aa242048231704121d Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Tue, 18 Aug 2015 17:36:12 +0100
Subject: [PATCH] Extra tile for displaying heart rate data for demo
---
skins/base/css/molecules/HealthDemoTile.css | 38 ++++++++++++++
skins/base/views/molecules/HealthDemoTile.js | 53 ++++++++++++++++++++
src/ComponentBroker.js | 1 +
src/controllers/molecules/HealthDemoTile.js | 21 ++++++++
src/controllers/organisms/RoomView.js | 1 +
5 files changed, 114 insertions(+)
create mode 100644 skins/base/css/molecules/HealthDemoTile.css
create mode 100644 skins/base/views/molecules/HealthDemoTile.js
create mode 100644 src/controllers/molecules/HealthDemoTile.js
diff --git a/skins/base/css/molecules/HealthDemoTile.css b/skins/base/css/molecules/HealthDemoTile.css
new file mode 100644
index 0000000000..8e11459e6a
--- /dev/null
+++ b/skins/base/css/molecules/HealthDemoTile.css
@@ -0,0 +1,38 @@
+/*
+Copyright 2015 OpenMarket Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+.mx_HealthDemoTile {
+ border: 1px solid black;
+ width: 200px;
+ height: 70px;
+ margin: 5px;
+ background-color: #ddd;
+ padding: 5px;
+ margin-top: 20px;
+}
+
+.mx_HealthDemoTile .mx_HealthDemoTile_ts {
+ display: block;
+ text-align: right;
+ font-size: 85%;
+}
+
+.mx_HealthDemoTile_content {
+ text-align: right;
+ font-size: 200%;
+ font-weight: bold;
+}
+
diff --git a/skins/base/views/molecules/HealthDemoTile.js b/skins/base/views/molecules/HealthDemoTile.js
new file mode 100644
index 0000000000..509aa61179
--- /dev/null
+++ b/skins/base/views/molecules/HealthDemoTile.js
@@ -0,0 +1,53 @@
+/*
+Copyright 2015 OpenMarket Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+'use strict';
+
+var React = require('react');
+
+var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
+var HealthDemoTileController = require("../../../../src/controllers/molecules/HealthDemoTile");
+var ComponentBroker = require('../../../../src/ComponentBroker');
+var MessageTimestamp = ComponentBroker.get('atoms/MessageTimestamp');
+var MemberAvatar = ComponentBroker.get('atoms/MemberAvatar');
+var TextForEvent = require("../../../../src/TextForEvent");
+
+module.exports = React.createClass({
+ displayName: 'HealthDemoTile',
+ mixins: [HealthDemoTileController],
+
+ render: function() {
+ var ts = this.props.mxEvent.getContent().ts;
+ var date = new Date(ts*1000);
+ var timeStr = date.toLocaleDateString() + ' ' + date.toLocaleTimeString();
+ //var timestamp = <MessageTimestamp ts={this.props.mxEvent.getContent().ts} />;
+
+ var imgStyle = { float: 'left' };
+
+ return (
+ <div className="mx_HealthDemoTile">
+ <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wgSDys3IE3P1AAAA2lJREFUWMPNmMuLFUcUxn+n03ONzkRNxOhERQQfgxhXBhNiFB+ICxdZCSJkJbVS0LUIbgyBgLMQRAr8N1xIRCVmsogSETQZBYOPGZPAEIcRR8c7HjenoWyqr/dO9SX3QN/ue+r19VffOVXVkGBepC1fikkNAAX4BpgPXHOqL+sEmKU0dqoAB4BLwEXgZN0sZjX0cRCYZ30doWbLatDf2sC90IssNWb/X4ABiHWloq97RoNe5EOgUXJv6xmApekt7Ks6AyUV4PqIb0NJAj3HYJ8X2VhX4k4FuC7iawCbCnAFkwXQTgFniSkmBrAP2BzUHfAiV4EXXuSYU+0IZJaYYtZEij8otBmsNDtsKRz2Iis7AZmSqHNgoKL4My/ysT3vKpWd7SSIUjS4ytiK2TJgeQXAvV7ky3b1mAJwZQngX0DTnpcDS71IPzBYarcAONoui6kAc3ueBa4DM/Z/APg0wl5hO73IF+0EY5YQwSsCBqcM4OtSjtxT0c2gBc97gzH3ImJpYSfwpsUmVoCfnerNCINTwAjwElhkviFga9D+jrUpyg97kbWBLEJrWjCN5Bb+PwD7SgxUMbjFqd42FiQA+BT40wIEYHcQKAC/AneBM/Z/MfBti6EmgBuZ6fCTIMm+7/ouGKCwSeCFTXNMowCjTnUYGGtTTXnx0zT6hyIMFi/QHwy2y4s0gIUhQKc67UV+aTHgqN0PAT/aLrxVGF8Fmrnp5gRwIdIgs7X1OLDffKuBjcBHQb3/7D5SMdi4XTjVa15kr2mxCuAM8I9T1dxy0VO7qnT3eQCwYfoqACrwtw0+6UUmgCWlLt7p36k+A57VmWZGg2hrWH7rDyLucVA3Ns1jTnV8Lmt+uwDHA3H32bljIEjSofDL0/ym0N9c9obtAhwLQIjpZ17A4JOg7vWInm51dcPqVCeARxXFsyWA9yIAf5/rMSBrR6hmt1pk/XCKXwUpBWDaqf7RNQaDt75pg5dtyqnOlgCG03wp5WySd1D3twoGH4TnD6f6yot8b6lnBjifcsrLOgj5SeBhpOheGYBTfQCcAk471X9TTnZ5h/WvhAcis/sVL9SMyKTrx86fIr77dNE6BXi5pwE61ekIoJ5isDzNz53qbN3fpVOCBOAcsN3W4uE6PxQlW/B9ZdCLDNX5ma3roLtlbwGzvhTlwr9lXgAAAABJRU5ErkJggg==" style={imgStyle} />
+ <div>
+ <span className="mx_HealthDemoTile_ts">{timeStr}</span>
+ <span className="mx_HealthDemoTile_content">
+ {this.props.mxEvent.getContent().bpm} bpm
+ </span>
+ </div>
+ </div>
+ );
+ },
+});
+
diff --git a/src/ComponentBroker.js b/src/ComponentBroker.js
index 61499defc7..205b622da5 100644
--- a/src/ComponentBroker.js
+++ b/src/ComponentBroker.js
@@ -109,6 +109,7 @@ require('../skins/base/views/molecules/voip/VideoView');
require('../skins/base/views/molecules/voip/CallView');
require('../skins/base/views/molecules/voip/IncomingCallBox');
require('../skins/base/views/molecules/EventAsTextTile');
+require('../skins/base/views/molecules/HealthDemoTile');
require('../skins/base/views/molecules/MemberInfo');
require('../skins/base/views/organisms/ErrorDialog');
require('../skins/base/views/organisms/QuestionDialog');
diff --git a/src/controllers/molecules/HealthDemoTile.js b/src/controllers/molecules/HealthDemoTile.js
new file mode 100644
index 0000000000..8aa688b21e
--- /dev/null
+++ b/src/controllers/molecules/HealthDemoTile.js
@@ -0,0 +1,21 @@
+/*
+Copyright 2015 OpenMarket Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+'use strict';
+
+module.exports = {
+};
+
diff --git a/src/controllers/organisms/RoomView.js b/src/controllers/organisms/RoomView.js
index d3feff69f6..b134117f24 100644
--- a/src/controllers/organisms/RoomView.js
+++ b/src/controllers/organisms/RoomView.js
@@ -41,6 +41,7 @@ var tileTypes = {
'm.call.answer' : ComponentBroker.get('molecules/EventAsTextTile'),
'm.call.hangup' : ComponentBroker.get('molecules/EventAsTextTile'),
'm.room.topic' : ComponentBroker.get('molecules/EventAsTextTile'),
+ 'org.matrix.demo.health' : ComponentBroker.get('molecules/HealthDemoTile'),
};
var DateSeparator = ComponentBroker.get('molecules/DateSeparator');
--
GitLab