Browse Source

More fixing up of vector skin

pull/190/head
David Baker 7 years ago
parent
commit
7e72ee891a
  1. 6
      package.json
  2. 15
      src/skins/vector/header
  3. 92
      src/skins/vector/skindex.js
  4. 3
      src/skins/vector/skinfo.json
  5. 5
      src/skins/vector/views/molecules/EventAsTextTile.js
  6. 5
      src/skins/vector/views/molecules/MImageTile.js
  7. 6
      src/skins/vector/views/molecules/MRoomMemberTile.js
  8. 8
      src/skins/vector/views/molecules/MatrixToolbar.js
  9. 2
      src/skins/vector/views/molecules/MemberInfo.js
  10. 7
      src/skins/vector/views/molecules/MemberTile.js
  11. 4
      src/skins/vector/views/molecules/MessageComposer.js
  12. 30
      src/skins/vector/views/molecules/MessageTile.js
  13. 6
      src/skins/vector/views/molecules/RoomHeader.js
  14. 4
      src/skins/vector/views/molecules/RoomTile.js
  15. 5
      src/skins/vector/views/molecules/ServerConfig.js
  16. 6
      src/skins/vector/views/molecules/voip/CallView.js
  17. 4
      src/skins/vector/views/molecules/voip/VideoView.js
  18. 15
      src/skins/vector/views/organisms/CreateRoom.js
  19. 12
      src/skins/vector/views/organisms/LeftPanel.js
  20. 8
      src/skins/vector/views/organisms/MemberList.js
  21. 5
      src/skins/vector/views/organisms/RightPanel.js
  22. 6
      src/skins/vector/views/organisms/RoomDirectory.js
  23. 7
      src/skins/vector/views/organisms/RoomList.js
  24. 12
      src/skins/vector/views/organisms/RoomView.js
  25. 12
      src/skins/vector/views/organisms/UserSettings.js
  26. 23
      src/skins/vector/views/pages/MatrixChat.js
  27. 7
      src/skins/vector/views/templates/Login.js
  28. 5
      src/skins/vector/views/templates/Register.js
  29. 11
      vector/index.js

6
package.json

@ -10,9 +10,9 @@
"license": "Apache-2.0",
"style": "bundle.css",
"scripts": {
"reskindex": "reskindex base -h src/skins/base/header",
"build": "NODE_ENV=production browserify --ignore olm -t reactify src/index.js | uglifyjs -c -m -o vector/bundle.js",
"start": "parallelshell 'watchify --ignore olm -v -d -t reactify src/index.js -o vector/bundle.js' 'npm run start:skins:css' 'http-server vector'",
"reskindex": "reskindex vector -h src/skins/vector/header",
"build": "NODE_ENV=production browserify --ignore olm -t reactify vector/index.js | uglifyjs -c -m -o vector/bundle.js",
"start": "parallelshell 'watchify --ignore olm -v -d -t reactify vector/index.js -o vector/bundle.js' 'npm run start:skins:css' 'http-server vector'",
"build:skins:js": "babel src/skins -d lib/skins --source-maps",
"build:skins:css": "catw 'src/skins/base/css/**/*.css' -o vector/bundle.css -c uglifycss --no-watch",
"start:skins:css": "catw 'src/skins/base/css/**/*.css' -o vector/bundle.css",

15
src/skins/vector/header

@ -0,0 +1,15 @@
/*
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.
*/

92
src/skins/vector/skindex.js

@ -0,0 +1,92 @@
/*
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.
*/
/*
* THIS FILE IS AUTO-GENERATED
* You can edit it you like, but your changes will be overwritten,
* so you'd just be trying to swim upstream like a salmon.
* You are not a salmon.
*/
var skin = {
atoms: {},
molecules: {},
organisms: {},
templates: {},
pages: {}
};
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.create_room = {};
skin.atoms.create_room.CreateRoomButton = require('./views/atoms/create_room/CreateRoomButton');
skin.atoms.create_room.Presets = require('./views/atoms/create_room/Presets');
skin.atoms.create_room.RoomAlias = require('./views/atoms/create_room/RoomAlias');
skin.atoms.voip = {};
skin.atoms.voip.VideoFeed = require('./views/atoms/voip/VideoFeed');
skin.molecules.BottomLeftMenu = require('./views/molecules/BottomLeftMenu');
skin.molecules.ChangeAvatar = require('./views/molecules/ChangeAvatar');
skin.molecules.ChangePassword = require('./views/molecules/ChangePassword');
skin.molecules.ContextualMenu = require('./views/molecules/ContextualMenu');
skin.molecules.DateSeparator = require('./views/molecules/DateSeparator');
skin.molecules.EventAsTextTile = require('./views/molecules/EventAsTextTile');
skin.molecules.MEmoteTile = require('./views/molecules/MEmoteTile');
skin.molecules.MFileTile = require('./views/molecules/MFileTile');
skin.molecules.MImageTile = require('./views/molecules/MImageTile');
skin.molecules.MNoticeTile = require('./views/molecules/MNoticeTile');
skin.molecules.MRoomMemberTile = require('./views/molecules/MRoomMemberTile');
skin.molecules.MTextTile = require('./views/molecules/MTextTile');
skin.molecules.MatrixToolbar = require('./views/molecules/MatrixToolbar');
skin.molecules.MemberInfo = require('./views/molecules/MemberInfo');
skin.molecules.MemberTile = require('./views/molecules/MemberTile');
skin.molecules.MessageComposer = require('./views/molecules/MessageComposer');
skin.molecules.MessageTile = require('./views/molecules/MessageTile');
skin.molecules.ProgressBar = require('./views/molecules/ProgressBar');
skin.molecules.RoomCreate = require('./views/molecules/RoomCreate');
skin.molecules.RoomDropTarget = require('./views/molecules/RoomDropTarget');
skin.molecules.RoomHeader = require('./views/molecules/RoomHeader');
skin.molecules.RoomSettings = require('./views/molecules/RoomSettings');
skin.molecules.RoomTile = require('./views/molecules/RoomTile');
skin.molecules.SenderProfile = require('./views/molecules/SenderProfile');
skin.molecules.ServerConfig = require('./views/molecules/ServerConfig');
skin.molecules.UnknownMessageTile = require('./views/molecules/UnknownMessageTile');
skin.molecules.UserSelector = require('./views/molecules/UserSelector');
skin.molecules.voip = {};
skin.molecules.voip.CallView = require('./views/molecules/voip/CallView');
skin.molecules.voip.IncomingCallBox = require('./views/molecules/voip/IncomingCallBox');
skin.molecules.voip.VideoView = require('./views/molecules/voip/VideoView');
skin.organisms.CreateRoom = require('./views/organisms/CreateRoom');
skin.organisms.ErrorDialog = require('./views/organisms/ErrorDialog');
skin.organisms.LeftPanel = require('./views/organisms/LeftPanel');
skin.organisms.LogoutPrompt = require('./views/organisms/LogoutPrompt');
skin.organisms.MemberList = require('./views/organisms/MemberList');
skin.organisms.Notifier = require('./views/organisms/Notifier');
skin.organisms.QuestionDialog = require('./views/organisms/QuestionDialog');
skin.organisms.RightPanel = require('./views/organisms/RightPanel');
skin.organisms.RoomDirectory = require('./views/organisms/RoomDirectory');
skin.organisms.RoomList = require('./views/organisms/RoomList');
skin.organisms.RoomView = require('./views/organisms/RoomView');
skin.organisms.UserSettings = require('./views/organisms/UserSettings');
skin.pages.MatrixChat = require('./views/pages/MatrixChat');
skin.templates.Login = require('./views/templates/Login');
skin.templates.Register = require('./views/templates/Register');
module.exports = skin;

3
src/skins/vector/skinfo.json

@ -0,0 +1,3 @@
{
"baseSkin": ""
}

5
src/skins/vector/views/molecules/EventAsTextTile.js

@ -20,7 +20,7 @@ var React = require('react');
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var EventAsTextTileController = require('matrix-react-sdk/lib/controllers/molecules/EventAsTextTile')
var ComponentBroker = require('../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var MessageTimestamp = ComponentBroker.get('atoms/MessageTimestamp');
var MemberAvatar = ComponentBroker.get('atoms/MemberAvatar');
var TextForEvent = require("../../../../src/TextForEvent");
@ -30,6 +30,9 @@ module.exports = React.createClass({
mixins: [EventAsTextTileController],
render: function() {
var MessageTimestamp = sdk.getComponent('atoms.MessageTimestamp');
var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
var text = TextForEvent.textForEvent(this.props.mxEvent);
if (text == null || text.length == 0) return null;

5
src/skins/vector/views/molecules/MImageTile.js

@ -23,9 +23,7 @@ var MImageTileController = require('matrix-react-sdk/lib/controllers/molecules/M
var MatrixClientPeg = require('../../../../src/MatrixClientPeg');
var Modal = require('../../../../src/Modal');
var ComponentBroker = require('../../../../src/ComponentBroker');
var ImageView = ComponentBroker.get("atoms/ImageView");
var sdk = require('matrix-react-sdk')
module.exports = React.createClass({
displayName: 'MImageTile',
@ -59,6 +57,7 @@ module.exports = React.createClass({
ev.preventDefault();
var content = this.props.mxEvent.getContent();
var httpUrl = MatrixClientPeg.get().mxcUrlToHttp(content.url);
var ImageView = sdk.getComponent("atoms.ImageView");
Modal.createDialog(ImageView, {
src: httpUrl,
width: content.info.w,

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

@ -21,10 +21,8 @@ var React = require('react');
var MRoomMemberTileController = require('matrix-react-sdk/lib/controllers/molecules/MRoomMemberTile')
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var ComponentBroker = require('../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var TextForEvent = require('../../../../src/TextForEvent');
var MessageTimestamp = ComponentBroker.get('atoms/MessageTimestamp');
var MemberAvatar = ComponentBroker.get('atoms/MemberAvatar');
module.exports = React.createClass({
displayName: 'MRoomMemberTile',
@ -39,6 +37,8 @@ module.exports = React.createClass({
var timestamp = this.props.last ? <MessageTimestamp ts={this.props.mxEvent.getTs()} /> : null;
var text = this.getMemberEventText();
if (!text) return <div/>;
var MessageTimestamp = sdk.getComponent('atoms.MessageTimestamp');
var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
return (
<div className="mx_MessageTile mx_MessageTile_notice">
<div className="mx_MessageTile_avatar">

8
src/skins/vector/views/molecules/MatrixToolbar.js

@ -18,23 +18,21 @@ limitations under the License.
var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var LogoutButton = ComponentBroker.get("atoms/LogoutButton");
var EnableNotificationsButton = ComponentBroker.get("atoms/EnableNotificationsButton");
var sdk = require('matrix-react-sdk')
var MatrixToolbarController = require('matrix-react-sdk/lib/controllers/molecules/MatrixToolbar')
var Notifier = ComponentBroker.get('organisms/Notifier');
module.exports = React.createClass({
displayName: 'MatrixToolbar',
mixins: [MatrixToolbarController],
hideToolbar: function() {
var Notifier = sdk.getComponent('organisms.Notifier');
Notifier.setToolbarHidden(true);
},
render: function() {
var EnableNotificationsButton = sdk.getComponent("atoms.EnableNotificationsButton");
return (
<div className="mx_MatrixToolbar">
You are not receiving desktop notifications. <EnableNotificationsButton />

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

@ -20,8 +20,6 @@ var React = require('react');
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var MemberInfoController = require('matrix-react-sdk/lib/controllers/molecules/MemberInfo')
var ComponentBroker = require('../../../../src/ComponentBroker');
var MemberAvatar = ComponentBroker.get('atoms/MemberAvatar');
module.exports = React.createClass({
displayName: 'MemberInfo',

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

@ -19,13 +19,10 @@ limitations under the License.
var React = require('react');
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var ComponentBroker = require('../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var Modal = require("../../../../src/Modal");
var ContextualMenu = require("../../../../src/ContextualMenu");
var MemberTileController = require('matrix-react-sdk/lib/controllers/molecules/MemberTile')
var MemberInfo = ComponentBroker.get('molecules/MemberInfo');
var ErrorDialog = ComponentBroker.get("organisms/ErrorDialog");
var MemberAvatar = ComponentBroker.get('atoms/MemberAvatar');
// The Lato WOFF doesn't include sensible combining diacritics, so Chrome chokes on rendering them.
// Revert to Arial when this happens, which on OSX works at least.
@ -46,6 +43,7 @@ module.exports = React.createClass({
onClick: function(e) {
var self = this;
self.setState({ 'menu': true });
var MemberInfo = sdk.getComponent('molecules.MemberInfo');
ContextualMenu.createMenu(MemberInfo, {
member: self.props.member,
right: window.innerWidth - e.pageX,
@ -153,6 +151,7 @@ module.exports = React.createClass({
</div>
}
var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
return (
<div className={mainClassName} title={ this.getPowerLabel() } onClick={ this.onClick } onMouseEnter={ this.mouseEnter } onMouseLeave={ this.mouseLeave }>
<div className="mx_MemberTile_avatar">

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

@ -22,8 +22,7 @@ var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var MessageComposerController = require('matrix-react-sdk/lib/controllers/molecules/MessageComposer')
var ContentMessages = require("../../../../src/ContentMessages");
var ComponentBroker = require('../../../../src/ComponentBroker');
var MemberAvatar = ComponentBroker.get('atoms/MemberAvatar');
var sdk = require('matrix-react-sdk')
module.exports = React.createClass({
displayName: 'MessageComposer',
@ -45,6 +44,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');
return (
<div className="mx_MessageComposer">
<div className="mx_MessageComposer_wrapper">

30
src/skins/vector/views/molecules/MessageTile.js

@ -21,21 +21,7 @@ var React = require('react');
var classNames = require("classnames");
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var ComponentBroker = require('../../../../src/ComponentBroker');
var MessageTimestamp = ComponentBroker.get('atoms/MessageTimestamp');
var SenderProfile = ComponentBroker.get('molecules/SenderProfile');
var MemberAvatar = ComponentBroker.get('atoms/MemberAvatar');
var UnknownMessageTile = ComponentBroker.get('molecules/UnknownMessageTile');
var tileTypes = {
'm.text': ComponentBroker.get('molecules/MTextTile'),
'm.notice': ComponentBroker.get('molecules/MNoticeTile'),
'm.emote': ComponentBroker.get('molecules/MEmoteTile'),
'm.image': ComponentBroker.get('molecules/MImageTile'),
'm.file': ComponentBroker.get('molecules/MFileTile')
};
var sdk = require('matrix-react-sdk')
var MessageTileController = require('matrix-react-sdk/lib/controllers/molecules/MessageTile')
@ -44,6 +30,20 @@ module.exports = React.createClass({
mixins: [MessageTileController],
render: function() {
var MessageTimestamp = sdk.getComponent('atoms.MessageTimestamp');
var SenderProfile = sdk.getComponent('molecules.SenderProfile');
var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
var UnknownMessageTile = sdk.getComponent('molecules.UnknownMessageTile');
var tileTypes = {
'm.text': sdk.getComponent('molecules.MTextTile'),
'm.notice': sdk.getComponent('molecules.MNoticeTile'),
'm.emote': sdk.getComponent('molecules.MEmoteTile'),
'm.image': sdk.getComponent('molecules.MImageTile'),
'm.file': sdk.getComponent('molecules.MFileTile')
};
var content = this.props.mxEvent.getContent();
var msgtype = content.msgtype;
var TileType = UnknownMessageTile;

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

@ -17,12 +17,10 @@ limitations under the License.
'use strict';
var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var RoomHeaderController = require('matrix-react-sdk/lib/controllers/molecules/RoomHeader')
var EditableText = ComponentBroker.get("atoms/EditableText");
var RoomAvatar = ComponentBroker.get('atoms/RoomAvatar');
module.exports = React.createClass({
displayName: 'RoomHeader',
@ -39,6 +37,8 @@ module.exports = React.createClass({
},
render: function() {
var EditableText = sdk.getComponent("atoms.EditableText");
var RoomAvatar = sdk.getComponent('atoms.RoomAvatar');
var header;
if (this.props.simpleHeader) {

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

@ -23,8 +23,7 @@ var RoomTileController = require('matrix-react-sdk/lib/controllers/molecules/Roo
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var ComponentBroker = require('../../../../src/ComponentBroker');
var RoomAvatar = ComponentBroker.get('atoms/RoomAvatar');
var sdk = require('matrix-react-sdk')
module.exports = React.createClass({
displayName: 'RoomTile',
@ -58,6 +57,7 @@ module.exports = React.createClass({
nameCell = <div className="mx_RoomTile_name">{name}</div>;
}
*/
var RoomAvatar = sdk.getComponent('atoms.RoomAvatar');
return (
<div className={classes} onClick={this.onClick}>
<div className="mx_RoomTile_avatar">

5
src/skins/vector/views/molecules/ServerConfig.js

@ -18,9 +18,7 @@ limitations under the License.
var React = require('react');
var Modal = require('../../../../src/Modal');
var ComponentBroker = require('../../../../src/ComponentBroker');
var ErrorDialog = ComponentBroker.get('organisms/ErrorDialog');
var sdk = require('matrix-react-sdk')
var ServerConfigController = require('matrix-react-sdk/lib/controllers/molecules/ServerConfig')
@ -29,6 +27,7 @@ module.exports = React.createClass({
mixins: [ServerConfigController],
showHelpPopup: function() {
var ErrorDialog = sdk.getComponent('organisms.ErrorDialog');
Modal.createDialog(ErrorDialog, {
title: 'Custom Server Options',
description: "You can use the custom server options to log into other Matrix servers by specifying a different Home server URL. This allows you to use Vector with an existing Matrix account on a different Home server. You can also set a cutom Identity server but this will affect people ability to find you if you use a server in a group other than tha main Matrix.org group.",

6
src/skins/vector/views/molecules/voip/CallView.js

@ -19,11 +19,10 @@ limitations under the License.
var React = require('react');
var MatrixClientPeg = require("../../../../../src/MatrixClientPeg");
var ComponentBroker = require('../../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var CallViewController = require(
"../../../../../src/controllers/molecules/voip/CallView"
"matrix-react-sdk/lib/controllers/molecules/voip/CallView"
);
var VideoView = ComponentBroker.get('molecules/voip/VideoView');
module.exports = React.createClass({
displayName: 'CallView',
@ -34,6 +33,7 @@ module.exports = React.createClass({
},
render: function(){
var VideoView = sdk.getComponent('molecules.voip.VideoView');
return (
<VideoView ref="video"/>
);

4
src/skins/vector/views/molecules/voip/VideoView.js

@ -19,9 +19,8 @@ limitations under the License.
var React = require('react');
var MatrixClientPeg = require("../../../../../src/MatrixClientPeg");
var ComponentBroker = require('../../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var VideoViewController = require('matrix-react-sdk/lib/controllers/molecules/voip/VideoView')
var VideoFeed = ComponentBroker.get('atoms/voip/VideoFeed');
module.exports = React.createClass({
displayName: 'VideoView',
@ -36,6 +35,7 @@ module.exports = React.createClass({
},
render: function() {
var VideoFeed = sdk.getComponent('atoms.voip.VideoFeed');
return (
<div className="mx_VideoView">
<div className="mx_VideoView_remoteVideoFeed">

15
src/skins/vector/views/organisms/CreateRoom.js

@ -20,16 +20,10 @@ var React = require('react');
var CreateRoomController = require('matrix-react-sdk/lib/controllers/organisms/CreateRoom')
var ComponentBroker = require('../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var PresetValues = require('../../../../src/controllers/atoms/create_room/Presets').Presets;
var CreateRoomButton = ComponentBroker.get("atoms/create_room/CreateRoomButton");
var RoomAlias = ComponentBroker.get("atoms/create_room/RoomAlias");
var Presets = ComponentBroker.get("atoms/create_room/Presets");
var UserSelector = ComponentBroker.get("molecules/UserSelector");
var RoomHeader = ComponentBroker.get("molecules/RoomHeader");
var Loader = require("react-loader");
@ -140,6 +134,13 @@ module.exports = React.createClass({
</div>
);
}
var CreateRoomButton = sdk.getComponent("atoms.create_room.CreateRoomButton");
var RoomAlias = sdk.getComponent("atoms.create_room.RoomAlias");
var Presets = sdk.getComponent("atoms.create_room.Presets");
var UserSelector = sdk.getComponent("molecules.UserSelector");
var RoomHeader = sdk.getComponent("molecules.RoomHeader");
return (
<div className="mx_CreateRoom">
<RoomHeader simpleHeader="Create room" />

12
src/skins/vector/views/organisms/LeftPanel.js

@ -17,17 +17,17 @@ limitations under the License.
'use strict';
var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var RoomList = ComponentBroker.get('organisms/RoomList');
var BottomLeftMenu = ComponentBroker.get('molecules/BottomLeftMenu');
var IncomingCallBox = ComponentBroker.get('molecules/voip/IncomingCallBox');
var RoomCreate = ComponentBroker.get('molecules/RoomCreate');
var sdk = require('matrix-react-sdk')
module.exports = React.createClass({
displayName: 'LeftPanel',
render: function() {
var RoomList = sdk.getComponent('organisms.RoomList');
var BottomLeftMenu = sdk.getComponent('molecules.BottomLeftMenu');
var IncomingCallBox = sdk.getComponent('molecules.voip.IncomingCallBox');
var RoomCreate = sdk.getComponent('molecules.RoomCreate');
return (
<aside className="mx_LeftPanel">
<img className="mx_LeftPanel_hideButton" src="img/hide.png" width="32" height="32" alt="<"/>

8
src/skins/vector/views/organisms/MemberList.js

@ -21,10 +21,7 @@ var classNames = require('classnames');
var MemberListController = require('matrix-react-sdk/lib/controllers/organisms/MemberList')
var ComponentBroker = require('../../../../src/ComponentBroker');
var MemberTile = ComponentBroker.get("molecules/MemberTile");
var EditableText = ComponentBroker.get("atoms/EditableText");
var sdk = require('matrix-react-sdk')
module.exports = React.createClass({
@ -48,6 +45,8 @@ module.exports = React.createClass({
},
makeMemberTiles: function() {
var MemberTile = sdk.getComponent("molecules.MemberTile");
var self = this;
return Object.keys(self.state.memberDict).map(function(userId) {
var m = self.state.memberDict[userId];
@ -81,6 +80,7 @@ module.exports = React.createClass({
mx_MemberTile_inviteEditing: this.state.editing,
});
var EditableText = sdk.getComponent("atoms.EditableText");
return (
<div className={ classes } onClick={ this.onClickInvite } >
<div className="mx_MemberTile_avatar"><img src="img/create-big.png" width="40" height="40" alt=""/></div>

5
src/skins/vector/views/organisms/RightPanel.js

@ -17,9 +17,7 @@ limitations under the License.
'use strict';
var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var MemberList = ComponentBroker.get('organisms/MemberList');
var sdk = require('matrix-react-sdk')
module.exports = React.createClass({
displayName: 'RightPanel',
@ -47,6 +45,7 @@ module.exports = React.createClass({
},
render: function() {
var MemberList = sdk.getComponent('organisms.MemberList');
var buttonGroup;
var panel;
if (this.props.roomId) {

6
src/skins/vector/views/organisms/RoomDirectory.js

@ -20,9 +20,7 @@ var React = require('react');
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var Modal = require("../../../../src/Modal");
var ComponentBroker = require('../../../../src/ComponentBroker');
var ErrorDialog = ComponentBroker.get("organisms/ErrorDialog");
var RoomHeader = ComponentBroker.get('molecules/RoomHeader');
var sdk = require('matrix-react-sdk')
var dis = require("../../../../src/dispatcher");
var Loader = require("react-loader");
@ -44,6 +42,7 @@ module.exports = React.createClass({
if (err) {
self.setState({ loading: false });
console.error("Failed to get publicRooms: %s", JSON.stringify(err));
var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
Modal.createDialog(ErrorDialog, {
title: "Failed to get public room list",
description: err.message
@ -128,6 +127,7 @@ module.exports = React.createClass({
);
}
var RoomHeader = sdk.getComponent('molecules.RoomHeader');
return (
<div className="mx_RoomDirectory">
<RoomHeader simpleHeader="Public Rooms" />

7
src/skins/vector/views/organisms/RoomList.js

@ -17,9 +17,7 @@ limitations under the License.
'use strict';
var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var CallView = ComponentBroker.get('molecules/voip/CallView');
var RoomDropTarget = ComponentBroker.get('molecules/RoomDropTarget');
var sdk = require('matrix-react-sdk')
var RoomListController = require('matrix-react-sdk/lib/controllers/organisms/RoomList')
@ -28,6 +26,9 @@ module.exports = React.createClass({
mixins: [RoomListController],
render: function() {
var CallView = sdk.getComponent('molecules.voip.CallView');
var RoomDropTarget = sdk.getComponent('molecules.RoomDropTarget');
var callElement;
if (this.state.show_call_element) {
callElement = <CallView className="mx_MatrixChat_callView"/>

12
src/skins/vector/views/organisms/RoomView.js

@ -20,16 +20,11 @@ var React = require('react');
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var ComponentBroker = require('../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var classNames = require("classnames");
var filesize = require('filesize');
var q = require('q');
var MessageTile = ComponentBroker.get('molecules/MessageTile');
var RoomHeader = ComponentBroker.get('molecules/RoomHeader');
var MessageComposer = ComponentBroker.get('molecules/MessageComposer');
var CallView = ComponentBroker.get("molecules/voip/CallView");
var RoomSettings = ComponentBroker.get("molecules/RoomSettings");
var RoomViewController = require('matrix-react-sdk/lib/controllers/organisms/RoomView')
var Loader = require("react-loader");
@ -82,6 +77,11 @@ module.exports = React.createClass({
},
render: function() {
var RoomHeader = sdk.getComponent('molecules.RoomHeader');
var MessageComposer = sdk.getComponent('molecules.MessageComposer');
var CallView = sdk.getComponent("molecules.voip.CallView");
var RoomSettings = sdk.getComponent("molecules.RoomSettings");
if (!this.state.room) {
if (this.props.roomId) {
return (

12
src/skins/vector/views/organisms/UserSettings.js

@ -14,16 +14,11 @@ limitations under the License.
'use strict';
var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var sdk = require('matrix-react-sdk')
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var UserSettingsController = require('matrix-react-sdk/lib/controllers/organisms/UserSettings')
var EditableText = ComponentBroker.get('atoms/EditableText');
var EnableNotificationsButton = ComponentBroker.get('atoms/EnableNotificationsButton');
var ChangeAvatar = ComponentBroker.get('molecules/ChangeAvatar');
var ChangePassword = ComponentBroker.get('molecules/ChangePassword');
var LogoutPrompt = ComponentBroker.get('organisms/LogoutPrompt');
var Loader = require("react-loader");
var Modal = require("../../../../src/Modal");
@ -34,6 +29,7 @@ module.exports = React.createClass({
editAvatar: function() {
var url = MatrixClientPeg.get().mxcUrlToHttp(this.state.avatarUrl);
var ChangeAvatar = sdk.getComponent('molecules.ChangeAvatar');
Modal.createDialog(ChangeAvatar, {initialAvatarUrl: url});
},
@ -50,6 +46,7 @@ module.exports = React.createClass({
},
onLogoutClicked: function(ev) {
var LogoutPrompt = sdk.getComponent('organisms.LogoutPrompt');
this.logoutModal = Modal.createDialog(LogoutPrompt, {onCancel: this.onLogoutPromptCancel});
},
@ -62,6 +59,9 @@ module.exports = React.createClass({
case this.Phases.Loading:
return <Loader />
case this.Phases.Display:
var EditableText = sdk.getComponent('atoms/EditableText');
var EnableNotificationsButton = sdk.getComponent('atoms/EnableNotificationsButton');
var ChangePassword = sdk.getComponent('molecules/ChangePassword');
return (
<div className="mx_UserSettings">
<div className="mx_UserSettings_User">

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

@ -17,18 +17,7 @@ limitations under the License.
'use strict';
var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var LeftPanel = ComponentBroker.get('organisms/LeftPanel');
var RoomView = ComponentBroker.get('organisms/RoomView');
var RightPanel = ComponentBroker.get('organisms/RightPanel');
var Login = ComponentBroker.get('templates/Login');
var UserSettings = ComponentBroker.get('organisms/UserSettings');
var Register = ComponentBroker.get('templates/Register');
var CreateRoom = ComponentBroker.get('organisms/CreateRoom');
var RoomDirectory = ComponentBroker.get('organisms/RoomDirectory');
var MatrixToolbar = ComponentBroker.get('molecules/MatrixToolbar');
var Notifier = ComponentBroker.get('organisms/Notifier');
var sdk = require('matrix-react-sdk')
var MatrixChatController = require('matrix-react-sdk/lib/controllers/pages/MatrixChat')
@ -52,6 +41,16 @@ module.exports = React.createClass({
render: function() {
if (this.state.logged_in && this.state.ready) {
var LeftPanel = sdk.getComponent('organisms.LeftPanel');
var RoomView = sdk.getComponent('organisms.RoomView');
var RightPanel = sdk.getComponent('organisms.RightPanel');
var Login = sdk.getComponent('templates.Login');
var UserSettings = sdk.getComponent('organisms.UserSettings');
var Register = sdk.getComponent('templates.Register');
var CreateRoom = sdk.getComponent('organisms.CreateRoom');
var RoomDirectory = sdk.getComponent('organisms.RoomDirectory');
var MatrixToolbar = sdk.getComponent('molecules.MatrixToolbar');
var Notifier = sdk.getComponent('organisms.Notifier');
var page_element;
var right_panel = "";

7
src/skins/vector/views/templates/Login.js

@ -18,16 +18,13 @@ limitations under the License.
var React = require('react');
var ComponentBroker = require("../../../../src/ComponentBroker");
var sdk = require('matrix-react-sdk')
var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var ProgressBar = ComponentBroker.get("molecules/ProgressBar");
var Loader = require("react-loader");
var LoginController = require('matrix-react-sdk/lib/controllers/templates/Login')
var ServerConfig = ComponentBroker.get("molecules/ServerConfig");
module.exports = React.createClass({
DEFAULT_HS_URL: 'https://matrix.org',
DEFAULT_IS_URL: 'https://vector.im',
@ -119,6 +116,8 @@ module.exports = React.createClass({
case 'fetch_stages':
var serverConfigStyle = {};
serverConfigStyle.display = this.state.serverConfigVisible ? 'block' : 'none';
var ServerConfig = sdk.getComponent("molecules.ServerConfig");
return (
<div>
<input className="mx_Login_checkbox" id="advanced" type="checkbox" checked={this.state.serverConfigVisible} onChange={this.onServerConfigVisibleChange} />

5
src/skins/vector/views/templates/Register.js

@ -18,14 +18,12 @@ limitations under the License.
var React = require('react');
var ComponentBroker = require("../../../../src/ComponentBroker");
var sdk = require('matrix-react-sdk')
var Loader = require("react-loader");
var RegisterController = require('matrix-react-sdk/lib/controllers/templates/Register')
var ServerConfig = ComponentBroker.get("molecules/ServerConfig");
module.exports = React.createClass({
DEFAULT_HS_URL: 'https://matrix.org',
DEFAULT_IS_URL: 'https://vector.im',
@ -98,6 +96,7 @@ module.exports = React.createClass({
case 'initial':
var serverConfigStyle = {};
serverConfigStyle.display = this.state.serverConfigVisible ? 'block' : 'none';
var ServerConfig = sdk.getComponent("molecules.ServerConfig");
return (
<div>
<form onSubmit={this.onInitialStageSubmit}>

11
vector/index.js

@ -17,12 +17,8 @@ limitations under the License.
'use strict';
var React = require("react");
// In normal usage of the module:
//var MatrixReactSdk = require("matrix-react-sdk");
// Or to import the source directly from the file system:
// (This is useful for debugging the SDK as it seems source
// maps cannot pass through two stages).
var MatrixReactSdk = require("../../src/index");
var sdk = require("matrix-react-sdk");
sdk.loadSkin(require('../src/skins/vector/skindex'));
var lastLocationHashSet = null;
@ -78,8 +74,9 @@ var makeRegistrationUrl = function() {
'#/register';
}
var MatrixChat = sdk.getComponent('pages.MatrixChat');
window.matrixChat = React.render(
<MatrixReactSdk.MatrixChat onNewScreen={onNewScreen} registrationUrl={makeRegistrationUrl()} />,
<MatrixChat onNewScreen={onNewScreen} registrationUrl={makeRegistrationUrl()} />,
document.getElementById('matrixchat')
);

Loading…
Cancel
Save