PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Merge branch 'develop' into kegan/controller-merging4

Browse source
This commit is contained in:
Kegan Dougal 2015-11-30 15:39:14 +00:00
commit 03485c2fca
12 changed files with 37 additions and 116 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/Avatar.js
View file

@ -24,7 +24,9 @@ module.exports = {
MatrixClientPeg.get().getHomeserverUrl(),
width,
height,
resizeMethod
resizeMethod,
false,
false
);
if (!url) {
// member can be null here currently since on invites, the JS SDK
@ -36,18 +38,12 @@ module.exports = {
},
defaultAvatarUrlForString: function(s) {
var images = [ '76cfa6', '50e2c2', 'f4c371' ];
var total = 0;
for (var i = 0; i < s.length; ++i) {
total += s.charCodeAt(i);
}
switch (total % 3) {
case 0:
return "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAIAAAADnC86AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADRJREFUeNrszQENADAIACB9QjNbxSKP4eagAFnTseHFErFYLBaLxWKxWCwWi8Vi8cX4CzAABSwCRWJw31gAAAAASUVORK5CYII=";
case 1:
return "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAIAAAADnC86AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADRJREFUeNrszQENADAIACB9chOaxgCP4eagAFk9seHFErFYLBaLxWKxWCwWi8Vi8cX4CzAAtKMCks/JG8MAAAAASUVORK5CYII=";
case 2:
return "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAIAAAADnC86AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADRJREFUeNrszQENADAIACB9YzNayQCP4eagADldseHFErFYLBaLxWKxWCwWi8Vi8cX4CzAAyiACeHwPiu4AAAAASUVORK5CYII=";
}
return 'img/' + images[total % images.length] + '.png';
}
}

40
src/components/views/avatars/MemberAvatar.js
View file

@ -43,10 +43,7 @@ module.exports = React.createClass({
},
defaultAvatarUrl: function(member, width, height, resizeMethod) {
if (this.skinnedDefaultAvatarUrl) {
return this.skinnedDefaultAvatarUrl(member, width, height, resizeMethod);
}
return "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAIAAAADnC86AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADRJREFUeNrszQENADAIACB9QjNbxSKP4eagAFnTseHFErFYLBaLxWKxWCwWi8Vi8cX4CzAABSwCRWJw31gAAAAASUVORK5CYII=";
return Avatar.defaultAvatarUrlForString(member.userId);
},
onError: function(ev) {
@ -60,22 +57,10 @@ module.exports = React.createClass({
},
_computeUrl: function() {
var url = this.props.member.getAvatarUrl(
MatrixClientPeg.get().getHomeserverUrl(),
this.props.width,
this.props.height,
this.props.resizeMethod,
false
);
if (!url) {
url = this.defaultAvatarUrl(
this.props.member,
this.props.width,
this.props.height,
this.props.resizeMethod
);
}
return url;
return Avatar.avatarUrlForMember(this.props.member,
this.props.width,
this.props.height,
this.props.resizeMethod);
},
refreshUrl: function() {
@ -95,21 +80,6 @@ module.exports = React.createClass({
///////////////
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)) {

8
src/components/views/avatars/RoomAvatar.js
View file

@ -15,6 +15,7 @@ limitations under the License.
*/
var React = require('react');
var MatrixClientPeg = require('../../../MatrixClientPeg');
var Avatar = require('../../../Avatar');
module.exports = React.createClass({
displayName: 'RoomAvatar',
@ -134,12 +135,7 @@ module.exports = React.createClass({
},
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';
return Avatar.defaultAvatarUrlForString(this.props.room.roomId);
},
render: function() {

2
src/components/views/messages/MFileMessage.js → src/components/views/messages/MFileBody.js
View file

@ -21,7 +21,7 @@ var filesize = require('filesize');
var MatrixClientPeg = require('../../../MatrixClientPeg');
module.exports = React.createClass({
displayName: 'MFileMessage',
displayName: 'MFileBody',
presentableTextForFile: function(content) {
var linkText = 'Attachment';

2
src/components/views/messages/MImageMessage.js → src/components/views/messages/MImageBody.js
View file

@ -24,7 +24,7 @@ var Modal = require('../../../Modal');
var sdk = require('../../../index');
module.exports = React.createClass({
displayName: 'MImageMessage',
displayName: 'MImageBody',
thumbHeight: function(fullWidth, fullHeight, thumbWidth, thumbHeight) {
if (!fullWidth || !fullHeight) {

52
src/components/views/messages/MRoomMemberEvent.js
View file

@ -1,52 +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 sdk = require('../../../index');
var TextForEvent = require('../../../TextForEvent');
module.exports = React.createClass({
displayName: 'MRoomMemberEvent',
getMemberEventText: function() {
return TextForEvent.textForEvent(this.props.mxEvent);
},
render: function() {
// XXX: for now, just cheekily borrow the css from message tile...
var timestamp = this.props.last ? <MessageTimestamp ts={this.props.mxEvent.getTs()} /> : null;
var text = this.getMemberEventText();
if (!text) return <div/>;
var MessageTimestamp = sdk.getComponent('messages.MessageTimestamp');
var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
return (
<div className="mx_MessageTile mx_MessageTile_notice">
<div className="mx_MessageTile_avatar">
<MemberAvatar member={this.props.mxEvent.sender} />
</div>
{ timestamp }
<span className="mx_SenderProfile"></span>
<span className="mx_MessageTile_content">
{ text }
</span>
</div>
);
},
});

2
src/components/views/messages/MVideoMessage.js → src/components/views/messages/MVideoBody.js
View file

@ -24,7 +24,7 @@ var Modal = require('../../../Modal');
var sdk = require('../../../index');
module.exports = React.createClass({
displayName: 'MVideoMessage',
displayName: 'MVideoBody',
thumbScale: function(fullWidth, fullHeight, thumbWidth, thumbHeight) {
if (!fullWidth || !fullHeight) {

16
src/components/views/messages/Message.js → src/components/views/messages/MessageEvent.js
View file

@ -20,7 +20,7 @@ var React = require('react');
var sdk = require('../../../index');
module.exports = React.createClass({
displayName: 'Message',
displayName: 'MessageEvent',
statics: {
needsSenderProfile: function() {
@ -29,15 +29,15 @@ module.exports = React.createClass({
},
render: function() {
var UnknownMessageTile = sdk.getComponent('messages.UnknownMessage');
var UnknownMessageTile = sdk.getComponent('messages.UnknownBody');
var tileTypes = {
'm.text': sdk.getComponent('messages.TextualMessage'),
'm.notice': sdk.getComponent('messages.TextualMessage'),
'm.emote': sdk.getComponent('messages.TextualMessage'),
'm.image': sdk.getComponent('messages.MImageMessage'),
'm.file': sdk.getComponent('messages.MFileMessage'),
'm.video': sdk.getComponent('messages.MVideoMessage')
'm.text': sdk.getComponent('messages.TextualBody'),
'm.notice': sdk.getComponent('messages.TextualBody'),
'm.emote': sdk.getComponent('messages.TextualBody'),
'm.image': sdk.getComponent('messages.MImageBody'),
'm.file': sdk.getComponent('messages.MFileBody'),
'm.video': sdk.getComponent('messages.MVideoBody')
};
var content = this.props.mxEvent.getContent();

2
src/components/views/messages/TextualMessage.js → src/components/views/messages/TextualBody.js
View file

@ -26,7 +26,7 @@ var linkifyMatrix = require('../../../linkify-matrix');
linkifyMatrix(linkify);
module.exports = React.createClass({
displayName: 'TextualMessage',
displayName: 'TextualBody',
componentDidMount: function() {
linkifyElement(this.refs.content, linkifyMatrix.options);

2
src/components/views/messages/UnknownMessage.js → src/components/views/messages/UnknownBody.js
View file

@ -19,7 +19,7 @@ limitations under the License.
var React = require('react');
module.exports = React.createClass({
displayName: 'UnknownMessage',
displayName: 'UnknownBody',
render: function() {
var content = this.props.mxEvent.getContent();

13
src/components/views/messages/Event.js → src/components/views/rooms/EventTile.js
View file

@ -37,7 +37,7 @@ try {
}
var eventTileTypes = {
'm.room.message': 'messages.Message',
'm.room.message': 'messages.MessageEvent',
'm.room.member' : 'messages.TextualEvent',
'm.call.invite' : 'messages.TextualEvent',
'm.call.answer' : 'messages.TextualEvent',
@ -48,6 +48,17 @@ var eventTileTypes = {
var MAX_READ_AVATARS = 5;
// Our component structure for EventTiles on the timeline is:
//
// .-EventTile------------------------------------------------.
// | MemberAvatar (SenderProfile) TimeStamp |
// | .-{Message,Textual}Event---------------. Read Avatars |
// | | .-MFooBody-------------------. | |
// | | | (only if MessageEvent) | | |
// | | '----------------------------' | |
// | '--------------------------------------' |
// '----------------------------------------------------------'
module.exports = React.createClass({
displayName: 'Event',

0
src/components/views/messages/MessageComposer.js → src/components/views/rooms/MessageComposer.js
View file