Show/hide apps panel and misc formatting and lint fixes
This commit is contained in:
parent
95988bd5ec
commit
7e1de2ac35
3 changed files with 45 additions and 28 deletions
|
@ -43,7 +43,7 @@ import KeyCode from '../../KeyCode';
|
|||
|
||||
import UserProvider from '../../autocomplete/UserProvider';
|
||||
|
||||
var DEBUG = false;
|
||||
const DEBUG = false;
|
||||
|
||||
if (DEBUG) {
|
||||
// using bind means that we get to keep useful line numbers in the console
|
||||
|
@ -133,6 +133,7 @@ module.exports = React.createClass({
|
|||
callState: null,
|
||||
guestsCanJoin: false,
|
||||
canPeek: false,
|
||||
showApps: false,
|
||||
|
||||
// error object, as from the matrix client/server API
|
||||
// If we failed to load information about the room,
|
||||
|
@ -168,7 +169,7 @@ module.exports = React.createClass({
|
|||
onClickCompletes: true,
|
||||
onStateChange: (isCompleting) => {
|
||||
this.forceUpdate();
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
if (this.props.roomAddress[0] == '#') {
|
||||
|
@ -434,9 +435,14 @@ module.exports = React.createClass({
|
|||
this._updateConfCallNotification();
|
||||
|
||||
this.setState({
|
||||
callState: callState
|
||||
callState: callState,
|
||||
});
|
||||
|
||||
break;
|
||||
case 'appsDrawer':
|
||||
this.setState({
|
||||
showApps: payload.show ? true : false,
|
||||
});
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
@ -1638,7 +1644,8 @@ module.exports = React.createClass({
|
|||
draggingFile={this.state.draggingFile}
|
||||
displayConfCallNotification={this.state.displayConfCallNotification}
|
||||
maxHeight={this.state.auxPanelMaxHeight}
|
||||
onResize={this.onChildResize} >
|
||||
onResize={this.onChildResize}
|
||||
showApps={this.state.showApps} >
|
||||
{ aux }
|
||||
</AuxPanel>
|
||||
);
|
||||
|
@ -1651,8 +1658,14 @@ module.exports = React.createClass({
|
|||
if (canSpeak) {
|
||||
messageComposer =
|
||||
<MessageComposer
|
||||
room={this.state.room} onResize={this.onChildResize} uploadFile={this.uploadFile}
|
||||
callState={this.state.callState} tabComplete={this.tabComplete} opacity={ this.props.opacity }/>;
|
||||
room={this.state.room}
|
||||
onResize={this.onChildResize}
|
||||
uploadFile={this.uploadFile}
|
||||
callState={this.state.callState}
|
||||
tabComplete={this.tabComplete}
|
||||
opacity={ this.props.opacity }
|
||||
showApps={ this.state.showApps }
|
||||
/>;
|
||||
}
|
||||
|
||||
// TODO: Why aren't we storing the term/scope/count in this format
|
||||
|
|
|
@ -14,11 +14,12 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
var React = require('react');
|
||||
var MatrixClientPeg = require("../../../MatrixClientPeg");
|
||||
var sdk = require('../../../index');
|
||||
var dis = require("../../../dispatcher");
|
||||
var ObjectUtils = require('../../../ObjectUtils');
|
||||
const React = require('react');
|
||||
const MatrixClientPeg = require("../../../MatrixClientPeg");
|
||||
const sdk = require('../../../index');
|
||||
const dis = require("../../../dispatcher");
|
||||
const ObjectUtils = require('../../../ObjectUtils');
|
||||
const AppsDrawer = require('./AppsDrawer');
|
||||
|
||||
module.exports = React.createClass({
|
||||
displayName: 'AuxPanel',
|
||||
|
@ -68,10 +69,10 @@ module.exports = React.createClass({
|
|||
},
|
||||
|
||||
render: function() {
|
||||
var CallView = sdk.getComponent("voip.CallView");
|
||||
var TintableSvg = sdk.getComponent("elements.TintableSvg");
|
||||
const CallView = sdk.getComponent("voip.CallView");
|
||||
const TintableSvg = sdk.getComponent("elements.TintableSvg");
|
||||
|
||||
var fileDropTarget = null;
|
||||
let fileDropTarget = null;
|
||||
if (this.props.draggingFile) {
|
||||
fileDropTarget = (
|
||||
<div className="mx_RoomView_fileDropTarget">
|
||||
|
@ -85,19 +86,18 @@ module.exports = React.createClass({
|
|||
);
|
||||
}
|
||||
|
||||
var conferenceCallNotification = null;
|
||||
let conferenceCallNotification = null;
|
||||
if (this.props.displayConfCallNotification) {
|
||||
var supportedText, joinText;
|
||||
let supportedText;
|
||||
let joinText;
|
||||
if (!MatrixClientPeg.get().supportsVoip()) {
|
||||
supportedText = " (unsupported)";
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
joinText = (<span>
|
||||
Join as <a onClick={(event)=>{ this.onConferenceNotificationClick(event, 'voice');}}
|
||||
href="#">voice</a> or <a onClick={(event)=>{ this.onConferenceNotificationClick(event, 'video'); }}
|
||||
href="#">video</a>.
|
||||
</span>);
|
||||
|
||||
}
|
||||
conferenceCallNotification = (
|
||||
<div className="mx_RoomView_ongoingConfCallNotification">
|
||||
|
@ -106,7 +106,7 @@ module.exports = React.createClass({
|
|||
);
|
||||
}
|
||||
|
||||
var callView = (
|
||||
const callView = (
|
||||
<CallView ref="callView" room={this.props.room}
|
||||
ConferenceHandler={this.props.conferenceHandler}
|
||||
onResize={this.props.onResize}
|
||||
|
@ -114,8 +114,14 @@ module.exports = React.createClass({
|
|||
/>
|
||||
);
|
||||
|
||||
let appsDrawer = null;
|
||||
if(this.props.showApps) {
|
||||
appsDrawer = <AppsDrawer ref="appsDrawer" room={this.props.room} />;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="mx_RoomView_auxPanel" style={{maxHeight: this.props.maxHeight}} >
|
||||
{ appsDrawer }
|
||||
{ fileDropTarget }
|
||||
{ callView }
|
||||
{ conferenceCallNotification }
|
||||
|
|
|
@ -164,18 +164,16 @@ export default class MessageComposer extends React.Component {
|
|||
}
|
||||
|
||||
onShowAppsClick(ev) {
|
||||
console.warn("Showing apps");
|
||||
dis.dispatch({
|
||||
action: 'showApps',
|
||||
room_id: this.props.room.roomId,
|
||||
action: 'appsDrawer',
|
||||
show: true,
|
||||
});
|
||||
}
|
||||
|
||||
onHideAppsClick(ev) {
|
||||
console.warn("Hiding apps");
|
||||
dis.dispatch({
|
||||
action: 'hideApps',
|
||||
room_id: this.props.room.roomId,
|
||||
action: 'appsDrawer',
|
||||
show: false,
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -278,7 +276,7 @@ export default class MessageComposer extends React.Component {
|
|||
}
|
||||
|
||||
// Apps
|
||||
if (this.props.showAppsState && this.props.showAppsState == 'visible') {
|
||||
if (this.props.showApps) {
|
||||
hideAppsButton =
|
||||
<div key="controls_hide_apps" className="mx_MessageComposer_apps" onClick={this.onHideAppsClick} title="Hide Apps">
|
||||
<TintableSvg src="img/icons-apps-active.svg" width="35" height="35"/>
|
||||
|
@ -431,5 +429,5 @@ MessageComposer.propTypes = {
|
|||
opacity: React.PropTypes.number,
|
||||
|
||||
// string representing the current room app drawer state
|
||||
showAppsState: React.PropTypes.string,
|
||||
showApps: React.PropTypes.bool,
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue