From aba103b8e08ba20d3d1dfa39cc6bd546ec619d5a Mon Sep 17 00:00:00 2001 From: Kegan Dougal <kegan@matrix.org> Date: Wed, 15 Jul 2015 13:09:15 +0100 Subject: [PATCH] Add VideoFeed atom and VideoView organism. --- skins/base/views/atoms/VideoFeed.js | 34 +++++++++++++++++ skins/base/views/organisms/VideoView.js | 49 +++++++++++++++++++++++++ skins/base/views/pages/MatrixChat.js | 2 + src/ComponentBroker.js | 2 + src/controllers/atoms/VideoFeed.js | 21 +++++++++++ 5 files changed, 108 insertions(+) create mode 100644 skins/base/views/atoms/VideoFeed.js create mode 100644 skins/base/views/organisms/VideoView.js create mode 100644 src/controllers/atoms/VideoFeed.js diff --git a/skins/base/views/atoms/VideoFeed.js b/skins/base/views/atoms/VideoFeed.js new file mode 100644 index 00000000..71681b99 --- /dev/null +++ b/skins/base/views/atoms/VideoFeed.js @@ -0,0 +1,34 @@ +/* +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 VideoFeedController = require("../../../../src/controllers/atoms/VideoFeed"); + +module.exports = React.createClass({ + displayName: 'VideoFeed', + mixins: [VideoFeedController], + + render: function() { + return ( + <video> + </video> + ); + }, +}); + diff --git a/skins/base/views/organisms/VideoView.js b/skins/base/views/organisms/VideoView.js new file mode 100644 index 00000000..813740fb --- /dev/null +++ b/skins/base/views/organisms/VideoView.js @@ -0,0 +1,49 @@ +/* +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 ComponentBroker = require('../../../../src/ComponentBroker'); + +var VideoFeed = ComponentBroker.get('atoms/VideoFeed'); + +module.exports = React.createClass({ + displayName: 'VideoView', + + getRemoteVideoElement: function() { + return this.refs.remote.getDOMNode(); + }, + + getLocalVideoElement: function() { + return this.refs.local.getDOMNode(); + }, + + render: function() { + return ( + <div> + <div> + <VideoFeed ref="remote"/> + </div> + <div> + <VideoFeed ref="local"/> + </div> + </div> + ); + }, +}); \ No newline at end of file diff --git a/skins/base/views/pages/MatrixChat.js b/skins/base/views/pages/MatrixChat.js index 11e2be9c..fcc1d274 100644 --- a/skins/base/views/pages/MatrixChat.js +++ b/skins/base/views/pages/MatrixChat.js @@ -22,6 +22,7 @@ var ComponentBroker = require('../../../../src/ComponentBroker'); var LeftPanel = ComponentBroker.get('organisms/LeftPanel'); var RoomView = ComponentBroker.get('organisms/RoomView'); var RightPanel = ComponentBroker.get('organisms/RightPanel'); +var VideoView = ComponentBroker.get('organisms/VideoView'); var Login = ComponentBroker.get('templates/Login'); var MatrixChatController = require("../../../../src/controllers/pages/MatrixChat"); @@ -40,6 +41,7 @@ module.exports = React.createClass({ <div className="mx_MatrixChat"> <LeftPanel selectedRoom={this.state.currentRoom} /> <RoomView roomId={this.state.currentRoom} key={this.state.currentRoom} /> + <VideoView /> <RightPanel roomId={this.state.currentRoom} /> </div> ); diff --git a/src/ComponentBroker.js b/src/ComponentBroker.js index e00ef242..e717ebb9 100644 --- a/src/ComponentBroker.js +++ b/src/ComponentBroker.js @@ -61,6 +61,7 @@ if (0) { require('../skins/base/views/atoms/LogoutButton'); require('../skins/base/views/atoms/EnableNotificationsButton'); require('../skins/base/views/atoms/MessageTimestamp'); +require('../skins/base/views/atoms/VideoFeed'); require('../skins/base/views/molecules/MatrixToolbar'); require('../skins/base/views/molecules/RoomTile'); require('../skins/base/views/molecules/MessageTile'); @@ -88,5 +89,6 @@ require('../skins/base/views/organisms/RightPanel'); require('../skins/base/views/molecules/RoomCreate'); require('../skins/base/views/molecules/RoomDropTarget'); require('../skins/base/views/molecules/DirectoryMenu'); +require('../skins/base/views/organisms/VideoView'); } diff --git a/src/controllers/atoms/VideoFeed.js b/src/controllers/atoms/VideoFeed.js new file mode 100644 index 00000000..8aa688b2 --- /dev/null +++ b/src/controllers/atoms/VideoFeed.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 = { +}; +