Matrix-Mirrors/schildi-web
1
0
Fork 0
mirror of https://github.com/SchildiChat/element-web.git synced 2024-10-01 01:26:12 -04:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #533 from vector-im/matthew/inbound-calls

Browse Source 
position the inbound call box correctly
This commit is contained in:
Matthew Hodgson 2015-12-18 15:59:05 +00:00
commit d7b87743f3
4 changed files with 22 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/structures/LeftPanel.js
View File

@ -62,7 +62,7 @@ var LeftPanel = React.createClass({
// audio/video not crap out // audio/video not crap out
var activeCall = CallHandler.getAnyActiveCall(); var activeCall = CallHandler.getAnyActiveCall();
var callForRoom = CallHandler.getCallForRoom(selectedRoomId); var callForRoom = CallHandler.getCallForRoom(selectedRoomId);
var showCall = (activeCall && !callForRoom); var showCall = (activeCall && activeCall.call_state === 'connected' && !callForRoom);
this.setState({ this.setState({
showCallElement: showCall showCallElement: showCall
}); });
@ -87,7 +87,6 @@ var LeftPanel = React.createClass({
render: function() { render: function() {
var RoomList = sdk.getComponent('rooms.RoomList'); var RoomList = sdk.getComponent('rooms.RoomList');
var BottomLeftMenu = sdk.getComponent('structures.BottomLeftMenu'); var BottomLeftMenu = sdk.getComponent('structures.BottomLeftMenu');
var IncomingCallBox = sdk.getComponent('voip.IncomingCallBox');
var collapseButton; var collapseButton;
var classes = "mx_LeftPanel"; var classes = "mx_LeftPanel";
@ -100,7 +99,7 @@ var LeftPanel = React.createClass({
} }
var callPreview; var callPreview;
if (this.state.showCallElement) { if (this.state.showCallElement && !this.props.collapsed) {
var CallView = sdk.getComponent('voip.CallView'); var CallView = sdk.getComponent('voip.CallView');
callPreview = ( callPreview = (
<CallView <CallView
@ -112,7 +111,6 @@ var LeftPanel = React.createClass({
return ( return (
<aside className={classes}> <aside className={classes}>
{ collapseButton } { collapseButton }
<IncomingCallBox />
{ callPreview } { callPreview }
<RoomList <RoomList
selectedRoom={this.props.selectedRoom} selectedRoom={this.props.selectedRoom}

7
src/components/structures/RoomSubList.js
View File

@ -64,7 +64,8 @@ var RoomSubList = React.createClass({
bottommost: React.PropTypes.bool, bottommost: React.PropTypes.bool,
selectedRoom: React.PropTypes.string.isRequired, selectedRoom: React.PropTypes.string.isRequired,
activityMap: React.PropTypes.object.isRequired, activityMap: React.PropTypes.object.isRequired,
collapsed: React.PropTypes.bool.isRequired collapsed: React.PropTypes.bool.isRequired,
incomingCall: React.PropTypes.object,
}, },
getInitialState: function() { getInitialState: function() {
@ -239,7 +240,9 @@ var RoomSubList = React.createClass({
selected={ selected } selected={ selected }
unread={ self.props.activityMap[room.roomId] === 1 } unread={ self.props.activityMap[room.roomId] === 1 }
highlight={ self.props.activityMap[room.roomId] === 2 } highlight={ self.props.activityMap[room.roomId] === 2 }
isInvite={ self.props.label === 'Invites' } /> isInvite={ self.props.label === 'Invites' }
incomingCall={ self.props.incomingCall && (self.props.incomingCall.roomId === room.roomId) ? self.props.incomingCall : null }
/>
); );
}); });
}, },

13
src/skins/vector/css/molecules/voip/IncomingCallbox.css
View File

@ -19,11 +19,12 @@ limitations under the License.
border: 1px solid #a4a4a4; border: 1px solid #a4a4a4;
border-radius: 8px; border-radius: 8px;
background-color: #fff; background-color: #fff;
position: absolute; position: fixed;
z-index: 1000; z-index: 1000;
left: 235px;
top: 155px;
padding: 6px; padding: 6px;
margin-top: -3px;
margin-left: -20px;
width: 200px;
} }
.mx_IncomingCallBox_chevron { .mx_IncomingCallBox_chevron {
@ -39,14 +40,13 @@ limitations under the License.
} }
.mx_IncomingCallBox_buttons { .mx_IncomingCallBox_buttons {
display: table-row; display: flex;
} }
.mx_IncomingCallBox_buttons_cell { .mx_IncomingCallBox_buttons_cell {
vertical-align: middle; vertical-align: middle;
display: table-cell;
padding: 6px; padding: 6px;
width: 50%; flex: 1;
} }
.mx_IncomingCallBox_buttons_decline, .mx_IncomingCallBox_buttons_decline,
@ -57,6 +57,7 @@ limitations under the License.
line-height: 36px; line-height: 36px;
border-radius: 36px; border-radius: 36px;
color: #fff; color: #fff;
margin: auto;
} }
.mx_IncomingCallBox_buttons_decline { .mx_IncomingCallBox_buttons_decline {

12
vector/index.html
View File

@ -27,6 +27,14 @@
<meta name="theme-color" content="#ffffff"> <meta name="theme-color" content="#ffffff">
</head> </head>
<body style="height: 100%;"> <body style="height: 100%;">
<section id="matrixchat" style="height: 100%;"></section>
<script src="bundle.js"></script>
<link rel="stylesheet" href="bundle.css">
<img src="img/warning.svg" width="24" height="23" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
<audio id="ringAudio" loop>
<source src="media/ring.ogg" type="audio/ogg" />
<source src="media/ring.mp3" type="audio/mpeg" />
</audio>
<audio id="ringbackAudio" loop> <audio id="ringbackAudio" loop>
<source src="media/ringback.ogg" type="audio/ogg" /> <source src="media/ringback.ogg" type="audio/ogg" />
<source src="media/ringback.mp3" type="audio/mpeg" /> <source src="media/ringback.mp3" type="audio/mpeg" />
@ -39,9 +47,5 @@
<source src="media/busy.ogg" type="audio/ogg" /> <source src="media/busy.ogg" type="audio/ogg" />
<source src="media/busy.mp3" type="audio/mpeg" /> <source src="media/busy.mp3" type="audio/mpeg" />
</audio> </audio>
<section id="matrixchat" style="height: 100%;"></section>
<script src="bundle.js"></script>
<link rel="stylesheet" href="bundle.css">
<img src="img/warning.svg" width="24" height="23" style="visibility: hidden; position: absolute; top: 0px; left: 0px;"/>
</body> </body>
</html> </html>