Merge pull request #420 from vector-im/kegan/controller-merging

Phase 1 controller merging (general structure)

src/components/structures/login/Login.js

@@ -20,9 +20,9 @@ var React = require('react');
 var ReactDOM = require('react-dom');
 var sdk = require('matrix-react-sdk');
 var Signup = require("matrix-react-sdk/lib/Signup");
-var PasswordLogin = require("matrix-react-sdk/lib/components/login/PasswordLogin");
+var PasswordLogin = require("matrix-react-sdk/lib/components/views/login/PasswordLogin");
-var CasLogin = require("matrix-react-sdk/lib/components/login/CasLogin");
+var CasLogin = require("matrix-react-sdk/lib/components/views/login/CasLogin");
-var ServerConfig = require("./ServerConfig");
+var ServerConfig = require("../../views/login/ServerConfig");
 
 /**
  * A wire component which glues together login UI components and Signup logic

src/components/structures/login/Registration.js

@@ -21,9 +21,9 @@ var React = require('react');
 var sdk = require('matrix-react-sdk');
 var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
 var dis = require('matrix-react-sdk/lib/dispatcher');
-var ServerConfig = require("./ServerConfig");
+var ServerConfig = require("../../views/login/ServerConfig");
-var RegistrationForm = require("./RegistrationForm");
+var RegistrationForm = require("../../views/login/RegistrationForm");
-var CaptchaForm = require("matrix-react-sdk/lib/components/login/CaptchaForm");
+var CaptchaForm = require("matrix-react-sdk/lib/components/views/login/CaptchaForm");
 var Signup = require("matrix-react-sdk/lib/Signup");
 var MIN_PASSWORD_LENGTH = 6;
 

src/skins/vector/skindex.js

@@ -23,13 +23,15 @@ limitations under the License.
 
 var skin = {};
 
+// TODO: Fix this so matrix-react-sdk stuff is in react SDK.
+skin['avatars.RoomAvatar'] = require('matrix-react-sdk/lib/components/views/avatars/RoomAvatar');
+skin['avatars.MemberAvatar'] = require('matrix-react-sdk/lib/components/views/avatars/MemberAvatar');
+
 skin['atoms.EditableText'] = require('./views/atoms/EditableText');
 skin['atoms.EnableNotificationsButton'] = require('./views/atoms/EnableNotificationsButton');
 skin['atoms.ImageView'] = require('./views/atoms/ImageView');
 skin['atoms.LogoutButton'] = require('./views/atoms/LogoutButton');
-skin['atoms.MemberAvatar'] = require('./views/atoms/MemberAvatar');
 skin['atoms.MessageTimestamp'] = require('./views/atoms/MessageTimestamp');
-skin['atoms.RoomAvatar'] = require('./views/atoms/RoomAvatar');
 skin['atoms.Spinner'] = require('./views/atoms/Spinner');
 skin['atoms.create_room.CreateRoomButton'] = require('./views/atoms/create_room/CreateRoomButton');
 skin['atoms.create_room.Presets'] = require('./views/atoms/create_room/Presets');

src/skins/vector/views/atoms/MemberAvatar.js

@@ -1,71 +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');
-var Avatar = require('../../../../Avatar');
-
-var MemberAvatarController = require('matrix-react-sdk/lib/controllers/atoms/MemberAvatar')
-
-module.exports = React.createClass({
-    displayName: 'MemberAvatar',
-    mixins: [MemberAvatarController],
-
-    avatarUrlForMember: function(member) {
-        return Avatar.avatarUrlForMember(
-            member,
-            this.props.member,
-            this.props.width,
-            this.props.height,
-            this.props.resizeMethod
-        );
-    },
-
-    skinnedDefaultAvatarUrl: function(member, width, height, resizeMethod) {
-        return Avatar.defaultAvatarUrlForString(member.userId);
-    },
-
-    render: function() {
-        // XXX: recalculates default avatar url constantly
-        if (this.state.imageUrl === this.defaultAvatarUrl(this.props.member)) {
-            var initial;
-            if (this.props.member.name[0])
-                initial = this.props.member.name[0].toUpperCase();
-            if (initial === '@' && this.props.member.name[1])
-                initial = this.props.member.name[1].toUpperCase();
-         
-            return (
-                <span className="mx_MemberAvatar" {...this.props}>
-                    <span className="mx_MemberAvatar_initial" aria-hidden="true"
-                          style={{ fontSize: (this.props.width * 0.75) + "px",
-                                   width: this.props.width + "px",
-                                   lineHeight: this.props.height*1.2 + "px" }}>{ initial }</span>
-                    <img className="mx_MemberAvatar_image" src={this.state.imageUrl} title={this.props.member.name}
-                         onError={this.onError} width={this.props.width} height={this.props.height} />
-                </span>
-            );            
-        }
-        return (
-            <img className="mx_MemberAvatar mx_MemberAvatar_image" src={this.state.imageUrl}
-                onError={this.onError}
-                width={this.props.width} height={this.props.height}
-                title={this.props.member.name}
-                {...this.props}
-            />
-        );
-    }
-});

src/skins/vector/views/atoms/RoomAvatar.js

@@ -1,75 +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');
-
-var RoomAvatarController = require('matrix-react-sdk/lib/controllers/atoms/RoomAvatar')
-
-module.exports = React.createClass({
-    displayName: 'RoomAvatar',
-    mixins: [RoomAvatarController],
-
-    getUrlList: function() {
-        return [
-            this.roomAvatarUrl(),
-            this.getOneToOneAvatar(),
-            this.getFallbackAvatar()
-        ];
-    },
-
-    getFallbackAvatar: function() {
-        var images = [ '76cfa6', '50e2c2', 'f4c371' ];
-        var total = 0;
-        for (var i = 0; i < this.props.room.roomId.length; ++i) {
-            total += this.props.room.roomId.charCodeAt(i);
-        }
-        return 'img/' + images[total % images.length] + '.png';
-    },
-
-    render: function() {
-        var style = {
-            width: this.props.width,
-            height: this.props.height,
-        };
-
-        // XXX: recalculates fallback avatar constantly
-        if (this.state.imageUrl === this.getFallbackAvatar()) {
-            var initial;
-            if (this.props.room.name[0])
-                initial = this.props.room.name[0].toUpperCase();
-            if ((initial === '@' || initial === '#') && this.props.room.name[1])
-                initial = this.props.room.name[1].toUpperCase();
-         
-            return (
-                <span>
-                    <span className="mx_RoomAvatar_initial" aria-hidden="true"
-                          style={{ fontSize: (this.props.width * 0.75) + "px",
-                                   width: this.props.width + "px",
-                                   lineHeight: this.props.height*1.2 + "px" }}>{ initial }</span>
-                    <img className="mx_RoomAvatar" src={this.state.imageUrl}
-                            onError={this.onError} style={style} />
-                </span>
-            );
-        }
-        else {
-            return <img className="mx_RoomAvatar" src={this.state.imageUrl}
-                        onError={this.onError} style={style} />
-        }
-
-    }
-});

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

@@ -37,7 +37,7 @@ module.exports = React.createClass({
     },
 
     render: function() {
-        var RoomAvatar = sdk.getComponent('atoms.RoomAvatar');
+        var RoomAvatar = sdk.getComponent('avatars.RoomAvatar');
         var avatarImg;
         // Having just set an avatar we just display that since it will take a little
         // time to propagate through to the RoomAvatar.

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

@@ -109,7 +109,7 @@ module.exports = React.createClass({
             return r2.data.ts - r1.data.ts;
         });
 
-        var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
+        var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
 
         var left = 0;
 
@@ -211,7 +211,7 @@ module.exports = React.createClass({
     render: function() {
         var MessageTimestamp = sdk.getComponent('atoms.MessageTimestamp');
         var SenderProfile = sdk.getComponent('molecules.SenderProfile');
-        var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
+        var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
 
         var content = this.props.mxEvent.getContent();
         var msgtype = content.msgtype;

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

@@ -34,7 +34,7 @@ module.exports = React.createClass({
         var text = this.getMemberEventText();
         if (!text) return <div/>;
         var MessageTimestamp = sdk.getComponent('atoms.MessageTimestamp');
-        var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
+        var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
         return (
             <div className="mx_MessageTile mx_MessageTile_notice">
                 <div className="mx_MessageTile_avatar">

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

@@ -73,7 +73,7 @@ module.exports = React.createClass({
             </div>
         }
 
-        var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
+        var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
         return (
             <div className="mx_MemberInfo">
                 <img className="mx_MemberInfo_cancel" src="img/cancel-black.png" width="18" height="18" onClick={this.onCancel}/>

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

@@ -166,7 +166,7 @@ module.exports = React.createClass({
                 </div>
         }
 
-        var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
+        var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
         return (
             <div className={mainClassName} title={ this.getPowerLabel() } onClick={ this.onClick } onMouseEnter={ this.mouseEnter } onMouseLeave={ this.mouseLeave }>
                 <div className="mx_MemberTile_avatar">

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

@@ -64,7 +64,7 @@ module.exports = React.createClass({
     render: function() {
         var me = this.props.room.getMember(MatrixClientPeg.get().credentials.userId);
         var uploadInputStyle = {display: 'none'};
-        var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
+        var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
         return (
             <div className="mx_MessageComposer">
                 <div className="mx_MessageComposer_wrapper">

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

@@ -44,7 +44,7 @@ module.exports = React.createClass({
     
     render: function() {
         var EditableText = sdk.getComponent("atoms.EditableText");
-        var RoomAvatar = sdk.getComponent('atoms.RoomAvatar');
+        var RoomAvatar = sdk.getComponent('avatars.RoomAvatar');
 
         var header;
         if (this.props.simpleHeader) {

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

@@ -274,7 +274,7 @@ var RoomTile = React.createClass({
             label = <RoomTooltip room={this.props.room}/>;
         }
 
-        var RoomAvatar = sdk.getComponent('atoms.RoomAvatar');
+        var RoomAvatar = sdk.getComponent('avatars.RoomAvatar');
 
         // These props are injected by React DnD,
         // as defined by your `collect` function above:

src/skins/vector/views/pages/MatrixChat.js

@@ -25,9 +25,9 @@ var dis = require('matrix-react-sdk/lib/dispatcher');
 var Matrix = require("matrix-js-sdk");
 
 var ContextualMenu = require("../../../../ContextualMenu");
-var Login = require("../../../../components/login/Login");
+var Login = require("../../../../components/structures/login/Login");
-var Registration = require("../../../../components/login/Registration");
+var Registration = require("../../../../components/structures/login/Registration");
-var PostRegistration = require("../../../../components/login/PostRegistration");
+var PostRegistration = require("../../../../components/structures/login/PostRegistration");
 var config = require("../../../../../config.json");
 
 module.exports = React.createClass({