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

Merge branch 'develop' into matthew/redesign

Browse source
This commit is contained in:
David Baker 2015-10-30 11:50:34 +00:00
commit ffb9ce89c7
15 changed files with 100 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
CHANGES.rst
View file

@ -1,3 +1,14 @@
Changes in vector v0.1.2 (2015-10-28)
======================================
* Support Room Avatars
* Fullscreen video calls
* Mute mic in VoIP calls
* Fix bug with multiple desktop notifications
* Context menu on messages
* Better hover-over on member list
* Support CAS auth
* Many other bug fixes
Changes in vector v0.1.1 (2015-08-10)
======================================

6
package.json
View file

@ -1,6 +1,6 @@
{
"name": "vector-web",
"version": "0.0.1",
"version": "0.1.2",
"description": "Vector webapp",
"author": "matrix.org",
"repository": {
@ -27,8 +27,8 @@
"filesize": "^3.1.2",
"flux": "~2.0.3",
"linkifyjs": "^2.0.0-beta.4",
"matrix-js-sdk": "^0.2.2",
"matrix-react-sdk": "^0.0.1",
"matrix-js-sdk": "^0.3.0",
"matrix-react-sdk": "^0.0.2",
"q": "^1.4.1",
"react": "^0.13.3",
"react-loader": "^1.4.0",

1
src/controllers/molecules/voip/CallView.js
View file

@ -90,6 +90,7 @@ module.exports = {
else {
this.getVideoView().getLocalVideoElement().style.display = "none";
this.getVideoView().getRemoteVideoElement().style.display = "none";
dis.dispatch({action: 'video_fullscreen', fullscreen: false});
}
}
};

5
src/controllers/organisms/RoomList.js
View file

@ -34,6 +34,7 @@ module.exports = {
cli.on("Room.timeline", this.onRoomTimeline);
cli.on("Room.name", this.onRoomName);
cli.on("RoomState.events", this.onRoomStateEvents);
cli.on("RoomMember.name", this.onRoomMemberName);
var s = this.getRoomLists();
s.activityMap = {};
@ -112,6 +113,10 @@ module.exports = {
setTimeout(this.refreshRoomList, 0);
},
onRoomMemberName: function(ev, member) {
setTimeout(this.refreshRoomList, 0);
},
refreshRoomList: function() {
this.setState(this.getRoomLists());

4
src/skins/vector/css/common.css
View file

@ -86,6 +86,10 @@ a:visited {
cursor: pointer;
}
.mx_ContextualMenu_spinner {
display: block;
margin: 0 auto;
}
.mx_Dialog_background {
position: fixed;

BIN
src/skins/vector/img/spinner.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 34 KiB

1
src/skins/vector/views/atoms/RoomAvatar.js
View file

@ -17,7 +17,6 @@ limitations under the License.
'use strict';
var React = require('react');
var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
var RoomAvatarController = require('matrix-react-sdk/lib/controllers/atoms/RoomAvatar')

34
src/skins/vector/views/atoms/Spinner.js Normal file
View file

@ -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');
module.exports = React.createClass({
displayName: 'Spinner',
render: function() {
var w = this.props.w || 32;
var h = this.props.h || 32;
var imgClass = this.props.imgClassName || "";
return (
<div>
<img src="img/spinner.gif" width={w} height={h} className={imgClass}/>
</div>
);
}
});

1
src/skins/vector/views/molecules/EventAsTextTile.js
View file

@ -18,7 +18,6 @@ limitations under the License.
var React = require('react');
var sdk = require('matrix-react-sdk')
var TextForEvent = require('matrix-react-sdk/lib/TextForEvent');
module.exports = React.createClass({

4
src/skins/vector/views/molecules/EventTile.js
View file

@ -70,8 +70,6 @@ module.exports = React.createClass({
var SenderProfile = sdk.getComponent('molecules.SenderProfile');
var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
var UnknownMessageTile = sdk.getComponent('molecules.UnknownMessageTile');
var content = this.props.mxEvent.getContent();
var msgtype = content.msgtype;
@ -79,7 +77,7 @@ module.exports = React.createClass({
// This shouldn't happen: the caller should check we support this type
// before trying to instantiate us
if (!EventTileType) {
return null;
throw new Error("Event type not supported");
}
var classes = classNames({

8
src/skins/vector/views/molecules/MemberInfo.js
View file

@ -17,6 +17,7 @@ limitations under the License.
'use strict';
var React = require('react');
var Loader = require("../atoms/Spinner");
var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
var sdk = require('matrix-react-sdk')
@ -37,7 +38,7 @@ module.exports = React.createClass({
},
render: function() {
var interactButton, kickButton, banButton, muteButton, giveModButton;
var interactButton, kickButton, banButton, muteButton, giveModButton, spinner;
if (this.props.member.userId === MatrixClientPeg.get().credentials.userId) {
interactButton = <div className="mx_MemberInfo_field" onClick={this.onLeaveClick}>Leave room</div>;
}
@ -45,6 +46,10 @@ module.exports = React.createClass({
interactButton = <div className="mx_MemberInfo_field" onClick={this.onChatClick}>Start chat</div>;
}
if (this.state.creatingRoom) {
spinner = <Loader imgClassName="mx_ContextualMenu_spinner"/>;
}
if (this.state.can.kick) {
kickButton = <div className="mx_MemberInfo_field" onClick={this.onKick}>
Kick
@ -88,6 +93,7 @@ module.exports = React.createClass({
{kickButton}
{banButton}
{giveModButton}
{spinner}
</div>
</div>
);

2
src/skins/vector/views/molecules/MessageTile.js
View file

@ -17,12 +17,10 @@ limitations under the License.
'use strict';
var React = require('react');
var classNames = require("classnames");
var sdk = require('matrix-react-sdk')
var MessageTileController = require('matrix-react-sdk/lib/controllers/molecules/MessageTile')
var ContextualMenu = require('../../../../ContextualMenu');
module.exports = React.createClass({
displayName: 'MessageTile',

4
src/skins/vector/views/molecules/RoomHeader.js
View file

@ -39,7 +39,7 @@ module.exports = React.createClass({
},
onFullscreenClick: function() {
dis.dispatch({action: 'video_fullscreen'}, true);
dis.dispatch({action: 'video_fullscreen', fullscreen: true}, true);
},
render: function() {
@ -60,7 +60,7 @@ module.exports = React.createClass({
var call_buttons;
if (this.state && this.state.call_state != 'ended') {
var muteVideoButton;
//var muteVideoButton;
var activeCall = (
CallHandler.getCallForRoom(this.props.room.roomId)
);

20
src/skins/vector/views/molecules/voip/IncomingCallBox.js
View file

@ -31,24 +31,28 @@ module.exports = React.createClass({
},
render: function() {
if (!this.state.incomingCall || !this.state.incomingCall.roomId) {
return (
<div>
<audio ref="ringAudio" loop>
// NB: This block MUST have a "key" so React doesn't clobber the elements
// between in-call / not-in-call.
var audioBlock = (
<audio ref="ringAudio" key="voip_ring_audio" loop>
<source src="media/ring.ogg" type="audio/ogg" />
<source src="media/ring.mp3" type="audio/mpeg" />
</audio>
);
if (!this.state.incomingCall || !this.state.incomingCall.roomId) {
return (
<div>
{audioBlock}
</div>
);
}
var caller = MatrixClientPeg.get().getRoom(this.state.incomingCall.roomId).name;
return (
<div className="mx_IncomingCallBox">
{audioBlock}
<img className="mx_IncomingCallBox_chevron" src="img/chevron-left.png" width="9" height="16" />
<audio ref="ringAudio" loop>
<source src="media/ring.ogg" type="audio/ogg" />
<source src="media/ring.mp3" type="audio/mpeg" />
</audio>
<div className="mx_IncomingCallBox_title">
Incoming { this.state.incomingCall ? this.state.incomingCall.type : '' } call from { caller }
</div>

20
src/skins/vector/views/molecules/voip/VideoView.js
View file

@ -51,8 +51,26 @@ module.exports = React.createClass({
return;
}
var element = this.container.getDOMNode();
var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullscreen;
if (payload.fullscreen) {
var requestMethod = (
element.requestFullScreen ||
element.webkitRequestFullScreen ||
element.mozRequestFullScreen ||
element.msRequestFullscreen
);
requestMethod.call(element);
}
else {
var exitMethod = (
document.exitFullscreen ||
document.mozCancelFullScreen ||
document.webkitExitFullscreen ||
document.msExitFullscreen
);
if (exitMethod) {
exitMethod.call(document);
}
}
break;
}
},