Merge pull request #450 from vector-im/kegan/vector-components

Move remaining Vector-only components to src/components

src/components/structures/BottomLeftMenu.js

@@ -40,13 +40,13 @@ module.exports = React.createClass({
             return <div className="mx_RoomTile_name">{name}</div>
         }
         else if (this.state.hover) {
-            var RoomTooltip = sdk.getComponent("molecules.RoomTooltip");
+            var RoomTooltip = sdk.getComponent("rooms.RoomTooltip");
             return <RoomTooltip name={name}/>;
         }
     },
 
     render: function() {
-        var BottomLeftMenuTile = sdk.getComponent('molecules.BottomLeftMenuTile');
+        var BottomLeftMenuTile = sdk.getComponent('rooms.BottomLeftMenuTile');
         return (
             <div className="mx_BottomLeftMenu">
                 <div className="mx_BottomLeftMenu_options">

src/components/structures/LeftPanel.js

@@ -22,7 +22,7 @@ var HTML5Backend = require('react-dnd-html5-backend');
 var sdk = require('matrix-react-sdk')
 var dis = require('matrix-react-sdk/lib/dispatcher');
 
-var VectorConferenceHandler = require('../../../../VectorConferenceHandler');
+var VectorConferenceHandler = require('../../VectorConferenceHandler');
 var CallHandler = require("matrix-react-sdk/lib/CallHandler");
 
 var LeftPanel = React.createClass({
@@ -86,7 +86,7 @@ var LeftPanel = React.createClass({
 
     render: function() {
         var RoomList = sdk.getComponent('rooms.RoomList');
-        var BottomLeftMenu = sdk.getComponent('molecules.BottomLeftMenu');
+        var BottomLeftMenu = sdk.getComponent('structures.BottomLeftMenu');
         var IncomingCallBox = sdk.getComponent('voip.IncomingCallBox');
 
         var collapseButton;

src/components/structures/RoomSubList.js

@@ -235,7 +235,7 @@ var RoomSubList = React.createClass({
 
     render: function() {
         var connectDropTarget = this.props.connectDropTarget;
-        var RoomDropTarget = sdk.getComponent('molecules.RoomDropTarget');
+        var RoomDropTarget = sdk.getComponent('rooms.RoomDropTarget');
 
         var label = this.props.collapsed ? null : this.props.label;
 

src/components/views/rooms/BottomLeftMenuTile.js

@@ -41,7 +41,7 @@ module.exports = React.createClass({
             label = <div className="mx_RoomTile_name">{ this.props.label }</div>;
         }
         else if (this.state.hover) {
-            var RoomTooltip = sdk.getComponent("molecules.RoomTooltip");
+            var RoomTooltip = sdk.getComponent("rooms.RoomTooltip");
             label = <RoomTooltip bottom={ true } label={ this.props.label }/>;
         }
 

src/components/views/rooms/MessageContextMenu.js

@@ -33,7 +33,7 @@ module.exports = React.createClass({
     },
 
     onViewSourceClick: function() {
-        var ViewSource = sdk.getComponent('organisms.ViewSource');
+        var ViewSource = sdk.getComponent('structures.ViewSource');
         Modal.createDialog(ViewSource, {
             mxEvent: this.props.mxEvent
         });

src/skins/vector/skindex.js

@@ -27,8 +27,22 @@ var skin = {};
 skin['elements.Spinner'] = require('../../components/views/elements/Spinner');
 skin['elements.ImageView'] = require('../../components/views/elements/ImageView');
 skin['messages.MessageTimestamp'] = require('../../components/views/messages/MessageTimestamp');
+skin['messages.DateSeparator'] = require('../../components/views/messages/DateSeparator');
+skin['messages.SenderProfile'] = require('../../components/views//messages/SenderProfile');
 skin['rooms.RoomTile'] = require('../../components/views/rooms/RoomDNDView');
-
+skin['rooms.BottomLeftMenuTile'] = require('../../components/views/rooms/BottomLeftMenuTile');
+skin['rooms.MessageContextMenu'] = require('../../components/views/rooms/MessageContextMenu');
+skin['rooms.RoomDropTarget'] = require('../../components/views/rooms/RoomDropTarget');
+skin['rooms.RoomTooltip'] = require('../../components/views/rooms/RoomTooltip');
+skin['rooms.SearchBar'] = require('../../components/views/rooms/SearchBar');
+skin['globals.MatrixToolbar'] = require('../../components/views/globals/MatrixToolbar');
+skin['structures.BottomLeftMenu'] = require('../../components/structures/BottomLeftMenu');
+skin['structures.LeftPanel'] = require('../../components/structures/LeftPanel');
+skin['structures.RightPanel'] = require('../../components/structures/RightPanel');
+skin['structures.RoomDirectory'] = require('../../components/structures/RoomDirectory');
+skin['structures.RoomSubList'] = require('../../components/structures/RoomSubList');
+skin['structures.ViewSource'] = require('../../components/structures/ViewSource');
+skin['structures.CompatibilityPage'] = require('../../components/structures/CompatibilityPage');
 
 // TODO: Fix this so matrix-react-sdk stuff is in react SDK skindex?
 skin['avatars.RoomAvatar'] = require('matrix-react-sdk/lib/components/views/avatars/RoomAvatar');
@@ -78,22 +92,4 @@ skin['structures.UserSettings'] = require('matrix-react-sdk/lib/components/struc
 skin['structures.RoomView'] = require('matrix-react-sdk/lib/components/structures/RoomView');
 skin['structures.MatrixChat'] = require('matrix-react-sdk/lib/components/structures/MatrixChat');
 
-// Old style stuff - this stuff only exists in VECTOR
-skin['molecules.BottomLeftMenu'] = require('./views/molecules/BottomLeftMenu');
-skin['molecules.BottomLeftMenuTile'] = require('./views/molecules/BottomLeftMenuTile');
-skin['molecules.DateSeparator'] = require('./views/molecules/DateSeparator');
-skin['molecules.MatrixToolbar'] = require('./views/molecules/MatrixToolbar');
-skin['molecules.MessageContextMenu'] = require('./views/molecules/MessageContextMenu');
-skin['molecules.RoomCreate'] = require('./views/molecules/RoomCreate');
-skin['molecules.RoomDropTarget'] = require('./views/molecules/RoomDropTarget');
-skin['molecules.RoomTooltip'] = require('./views/molecules/RoomTooltip');
-skin['molecules.SearchBar'] = require('./views/molecules/SearchBar');
-skin['molecules.SenderProfile'] = require('./views/molecules/SenderProfile');
-skin['organisms.LeftPanel'] = require('./views/organisms/LeftPanel');
-skin['organisms.RightPanel'] = require('./views/organisms/RightPanel');
-skin['organisms.RoomDirectory'] = require('./views/organisms/RoomDirectory');
-skin['organisms.RoomSubList'] = require('./views/organisms/RoomSubList');
-skin['organisms.ViewSource'] = require('./views/organisms/ViewSource');
-skin['pages.CompatibilityPage'] = require('./views/pages/CompatibilityPage');
-
 module.exports = skin;

src/skins/vector/views/molecules/RoomCreate.js

@@ -1,38 +0,0 @@
-/*
-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');
-
-module.exports = React.createClass({
-    displayName: 'RoomCreate',
-
-    render: function() {
-        return (
-            <div className="mx_RoomCreate">
-                <div className="mx_RoomCreate_table">
-                    <div className="mx_RoomTile">
-                        <div className="mx_RoomTile_avatar">
-                            <img src="img/create.png" width="32" height="32"/>
-                        </div>
-                        <div className="mx_RoomTile_name">Create new room</div>
-                    </div>
-                </div>
-            </div>
-        );
-    }
-});

src/skins/vector/views/organisms/Notifier.js

@@ -1,98 +0,0 @@
-/*
-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 NotifierController = require('matrix-react-sdk/lib/controllers/organisms/Notifier')
-
-var TextForEvent = require('matrix-react-sdk/lib/TextForEvent');
-var extend = require('matrix-react-sdk/lib/extend');
-var dis = require('matrix-react-sdk/lib/dispatcher');
-var Avatar = require('matrix-react-sdk/lib/Avatar');
-
-var NotifierView = {
-    notificationMessageForEvent: function(ev) {
-        return TextForEvent.textForEvent(ev);
-    },
-
-    displayNotification: function(ev, room) {
-        if (!global.Notification || global.Notification.permission != 'granted') {
-            return;
-        }
-        if (global.document.hasFocus()) {
-            return;
-        }
-
-        var msg = this.notificationMessageForEvent(ev);
-        if (!msg) return;
-
-        var title;
-        if (!ev.sender ||  room.name == ev.sender.name) {
-            title = room.name;
-            // notificationMessageForEvent includes sender,
-            // but we already have the sender here
-            if (ev.getContent().body) msg = ev.getContent().body;
-        } else if (ev.getType() == 'm.room.member') {
-            // context is all in the message here, we don't need
-            // to display sender info
-            title = room.name;
-        } else if (ev.sender) {
-            title = ev.sender.name + " (" + room.name + ")";
-            // notificationMessageForEvent includes sender,
-            // but we've just out sender in the title
-            if (ev.getContent().body) msg = ev.getContent().body;
-        }
-
-        var avatarUrl = ev.sender ? Avatar.avatarUrlForMember(
-            ev.sender, 40, 40, 'crop'
-        ) : null;
-
-        var notification = new global.Notification(
-            title,
-            {
-                "body": msg,
-                "icon": avatarUrl,
-                "tag": "vector"
-            }
-        );
-
-        notification.onclick = function() {
-            dis.dispatch({
-                action: 'view_room',
-                room_id: room.roomId
-            });
-            global.focus();
-        };
-        
-        /*var audioClip;
-        
-        if (audioNotification) {
-            audioClip = playAudio(audioNotification);
-        }*/
-
-        global.setTimeout(function() {
-            notification.close();
-        }, 5 * 1000);
-        
-    }
-};
-
-var NotifierClass = function() {};
-extend(NotifierClass.prototype, NotifierController);
-extend(NotifierClass.prototype, NotifierView);
-
-module.exports = new NotifierClass();
-

src/vector/index.js

@@ -153,7 +153,7 @@ function loadApp() {
     else {
         console.error("Browser is missing required features.");
         // take to a different landing page to AWOOOOOGA at the user
-        var CompatibilityPage = require("../skins/vector/views/pages/CompatibilityPage");
+        var CompatibilityPage = sdk.getComponent("structures.CompatibilityPage");
         window.matrixChat = ReactDOM.render(
             <CompatibilityPage onAccept={function() {
                 validBrowser = true;