Page MenuHomePhabricator
Files F7159777

No OneTemporary
Actions

View Options

diff --git a/app/assets/styles/blink/_ConferenceParticipantSelf.scss b/app/assets/styles/blink/_ConferenceParticipantSelf.scss
index 9dc438e..e0e4e2b 100644
--- a/app/assets/styles/blink/_ConferenceParticipantSelf.scss
+++ b/app/assets/styles/blink/_ConferenceParticipantSelf.scss
@@ -1,8 +1,14 @@
.container {
flex: 1;
+ width: 120px;
+ height: 90px;
+ box-shadow: 0 2px 3.84px #ccc;
+ shadowOpacity: 0.5;
+ elevation: 6;
}
.video {
- height: 100px;
- width: 100px;
-}
\ No newline at end of file
+ height:100%;
+ width: 100%;
+ border: 1px solid #fff;
+}
diff --git a/app/components/ConferenceParticipantSelf.js b/app/components/ConferenceParticipantSelf.js
index 4dd8d43..35d8c38 100644
--- a/app/components/ConferenceParticipantSelf.js
+++ b/app/components/ConferenceParticipantSelf.js
@@ -1,98 +1,96 @@
import React, { Component } from 'react';
import { View } from 'react-native';
import PropTypes from 'prop-types';
//const hark = require('hark');
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { RTCView } from 'react-native-webrtc';
import { Card } from 'react-native-paper';
import styles from '../assets/styles/blink/_ConferenceParticipantSelf.scss';
class ConferenceParticipantSelf extends Component {
constructor(props) {
super(props);
this.state = {
active: false,
hasVideo: false,
sharesScreen: false,
}
// this.speechEvents = null;
}
componentDidMount() {
// factor it out to a function to avoid lint warning about calling setState here
this.attachSpeechEvents();
// this.refs.videoElement.onresize = (event) => {
// this.handleResize(event)
// };
}
handleResize(event) {
const resolutions = [ '1280x720', '960x540', '640x480', '640x360', '480x270','320x180'];
const videoResolution = event.target.videoWidth + 'x' + event.target.videoHeight;
if (resolutions.indexOf(videoResolution) === -1) {
this.setState({sharesScreen: true});
} else {
this.setState({sharesScreen: false});
}
}
componentWillUnmount() {
// if (this.speechEvents !== null) {
// this.speechEvents.stop();
// this.speechEvents = null;
// }
}
attachSpeechEvents() {
this.setState({hasVideo: this.props.stream.getVideoTracks().length > 0});
// const options = {
// interval: 150,
// play: false
// };
// this.speechEvents = hark(this.props.stream, options);
// this.speechEvents.on('speaking', () => {
// this.setState({active: true});
// });
// this.speechEvents.on('stopped_speaking', () => {
// this.setState({active: false});
// });
}
render() {
if (this.props.stream == null) {
return false;
}
// const tooltip = (
// <Tooltip id="t-myself">{this.props.identity.displayName || this.props.identity.uri}</Tooltip>
// );
let muteIcon
if (this.props.audioMuted) {
muteIcon = (
<Icon name="microphone-off" />
);
}
return (
- <Card style={styles.container}>
- <Card.Content>
- {muteIcon}
- <RTCView objectFit="cover" style={styles.video} ref="videoElement" poster="assets/images/transparent-1px.png" streamURL={this.props.stream ? this.props.stream.toURL() : null} mirror={true}/>
- </Card.Content>
- </Card>
+ <View style={styles.container}>
+ {muteIcon}
+ <RTCView objectFit="cover" style={styles.video} ref="videoElement" poster="assets/images/transparent-1px.png" streamURL={this.props.stream ? this.props.stream.toURL() : null} mirror={true}/>
+ </View>
);
}
}
ConferenceParticipantSelf.propTypes = {
stream: PropTypes.object.isRequired,
identity: PropTypes.object.isRequired,
audioMuted: PropTypes.bool.isRequired,
generatedVideoTrack: PropTypes.bool
};
export default ConferenceParticipantSelf;

File Metadata

Mime Type
text/x-diff
Expires
Sat, Nov 23, 11:28 AM (1 d, 2 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
3409155
Default Alt Text
(4 KB)

Event Timeline