mirror of
https://github.com/element-hq/element-web.git
synced 2024-12-05 00:39:07 +03:00
Use default AppTile menu bar.
This commit is contained in:
Richard Lewis
parent
f3943bef51
commit
7b75dbbd15
2 changed files with 79 additions and 61 deletions
|
|
@ -274,12 +274,16 @@ export default class AppTile extends React.Component {
|
|||
|
||||
_onEditClick(e) {
|
||||
console.log("Edit widget ID ", this.props.id);
|
||||
const IntegrationsManager = sdk.getComponent("views.settings.IntegrationsManager");
|
||||
const src = this._scalarClient.getScalarInterfaceUrlForRoom(
|
||||
this.props.room.roomId, 'type_' + this.props.type, this.props.id);
|
||||
Modal.createTrackedDialog('Integrations Manager', '', IntegrationsManager, {
|
||||
src: src,
|
||||
}, "mx_IntegrationsManager");
|
||||
if (this.props.onEditClick) {
|
||||
this.props.onEditClick();
|
||||
} else {
|
||||
const IntegrationsManager = sdk.getComponent("views.settings.IntegrationsManager");
|
||||
const src = this._scalarClient.getScalarInterfaceUrlForRoom(
|
||||
this.props.room.roomId, 'type_' + this.props.type, this.props.id);
|
||||
Modal.createTrackedDialog('Integrations Manager', '', IntegrationsManager, {
|
||||
src: src,
|
||||
}, "mx_IntegrationsManager");
|
||||
}
|
||||
}
|
||||
|
||||
_onSnapshotClick(e) {
|
||||
|
|
@ -298,34 +302,38 @@ export default class AppTile extends React.Component {
|
|||
* otherwise revoke access for the widget to load in the user's browser
|
||||
*/
|
||||
_onDeleteClick() {
|
||||
if (this._canUserModify()) {
|
||||
// Show delete confirmation dialog
|
||||
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
|
||||
Modal.createTrackedDialog('Delete Widget', '', QuestionDialog, {
|
||||
title: _t("Delete Widget"),
|
||||
description: _t(
|
||||
"Deleting a widget removes it for all users in this room." +
|
||||
" Are you sure you want to delete this widget?"),
|
||||
button: _t("Delete widget"),
|
||||
onFinished: (confirmed) => {
|
||||
if (!confirmed) {
|
||||
return;
|
||||
}
|
||||
this.setState({deleting: true});
|
||||
MatrixClientPeg.get().sendStateEvent(
|
||||
this.props.room.roomId,
|
||||
'im.vector.modular.widgets',
|
||||
{}, // empty content
|
||||
this.props.id,
|
||||
).catch((e) => {
|
||||
console.error('Failed to delete widget', e);
|
||||
this.setState({deleting: false});
|
||||
});
|
||||
},
|
||||
});
|
||||
if (this.props.onDeleteClick) {
|
||||
this.props.onDeleteClick();
|
||||
} else {
|
||||
console.log("Revoke widget permissions - %s", this.props.id);
|
||||
this._revokeWidgetPermission();
|
||||
if (this._canUserModify()) {
|
||||
// Show delete confirmation dialog
|
||||
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
|
||||
Modal.createTrackedDialog('Delete Widget', '', QuestionDialog, {
|
||||
title: _t("Delete Widget"),
|
||||
description: _t(
|
||||
"Deleting a widget removes it for all users in this room." +
|
||||
" Are you sure you want to delete this widget?"),
|
||||
button: _t("Delete widget"),
|
||||
onFinished: (confirmed) => {
|
||||
if (!confirmed) {
|
||||
return;
|
||||
}
|
||||
this.setState({deleting: true});
|
||||
MatrixClientPeg.get().sendStateEvent(
|
||||
this.props.room.roomId,
|
||||
'im.vector.modular.widgets',
|
||||
{}, // empty content
|
||||
this.props.id,
|
||||
).catch((e) => {
|
||||
console.error('Failed to delete widget', e);
|
||||
this.setState({deleting: false});
|
||||
});
|
||||
},
|
||||
});
|
||||
} else {
|
||||
console.log("Revoke widget permissions - %s", this.props.id);
|
||||
this._revokeWidgetPermission();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -429,6 +437,22 @@ export default class AppTile extends React.Component {
|
|||
return safeWidgetUrl;
|
||||
}
|
||||
|
||||
_getTileTitle() {
|
||||
const name = this.formatAppTileName();
|
||||
const titleSpacer = <span> - </span>;
|
||||
let title = '';
|
||||
if (this.state.widgetPageTitle && this.state.widgetPageTitle != this.formatAppTileName()) {
|
||||
title = this.state.widgetPageTitle;
|
||||
}
|
||||
|
||||
return (
|
||||
<span>
|
||||
<b>{ name }</b>
|
||||
<span>{ title ? titleSpacer : '' }{ title }</span>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
let appTileBody;
|
||||
|
||||
|
|
@ -508,17 +532,14 @@ export default class AppTile extends React.Component {
|
|||
{ this.props.showMenubar &&
|
||||
<div ref="menu_bar" className="mx_AppTileMenuBar" onClick={this.onClickMenuBar}>
|
||||
<span className="mx_AppTileMenuBarTitle">
|
||||
<TintableSvgButton
|
||||
{ this.props.showMinimise && <TintableSvgButton
|
||||
src={windowStateIcon}
|
||||
className="mx_AppTileMenuBarWidget mx_AppTileMenuBarWidgetPadding"
|
||||
title={_t('Minimize apps')}
|
||||
width="10"
|
||||
height="10"
|
||||
/>
|
||||
<b>{ this.formatAppTileName() }</b>
|
||||
{ this.state.widgetPageTitle && this.state.widgetPageTitle != this.formatAppTileName() && (
|
||||
<span> - { this.state.widgetPageTitle }</span>
|
||||
) }
|
||||
/> }
|
||||
{ this.props.showTitle && this._getTileTitle() }
|
||||
</span>
|
||||
<span className="mx_AppTileMenuBarWidgets">
|
||||
{ /* Snapshot widget */ }
|
||||
|
|
@ -575,10 +596,20 @@ AppTile.propTypes = {
|
|||
showMenubar: React.PropTypes.bool,
|
||||
// Should the AppTile render itself
|
||||
show: React.PropTypes.bool,
|
||||
// Optional onEditClickHandler (overrides default behaviour)
|
||||
onEditClick: React.PropTypes.func,
|
||||
// Optional onDeleteClickHandler (overrides default behaviour)
|
||||
onDeleteClick: React.PropTypes.func,
|
||||
// Optionally hide the tile title
|
||||
showTitle: React.PropTypes.bool,
|
||||
// Optionally hide the tile minimise icon
|
||||
showMinimise: React.PropTypes.bool,
|
||||
};
|
||||
|
||||
AppTile.defaultProps = {
|
||||
url: "",
|
||||
waitForIframeLoad: true,
|
||||
showMenubar: true,
|
||||
showTitle: true,
|
||||
showMinimise: true,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -25,6 +25,8 @@ import sdk from '../../../index';
|
|||
import SdkConfig from '../../../SdkConfig';
|
||||
import ScalarAuthClient from '../../../ScalarAuthClient';
|
||||
import dis from '../../../dispatcher';
|
||||
import TintableSvgButton from '../elements/TintableSvgButton';
|
||||
|
||||
|
||||
export default class Stickerpack extends React.Component {
|
||||
constructor(props) {
|
||||
|
|
@ -103,6 +105,7 @@ export default class Stickerpack extends React.Component {
|
|||
stickerpackWidget.content.name = stickerpackWidget.name || "Stickerpack";
|
||||
console.warn('Stickerpack widget', stickerpackWidget);
|
||||
this.widgetId = stickerpackWidget.id;
|
||||
|
||||
stickersContent = (
|
||||
<div
|
||||
style={{
|
||||
|
|
@ -115,18 +118,10 @@ export default class Stickerpack extends React.Component {
|
|||
className='mx_Stickers_content'
|
||||
style={{
|
||||
border: 'none',
|
||||
height: this.popoverHeight - 30,
|
||||
height: this.popoverHeight,
|
||||
width: this.popoverWidth,
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
'float': 'right',
|
||||
'fontSize': 'smaller',
|
||||
'cursor': 'pointer',
|
||||
}}
|
||||
onClick={this._removeStickerpackWidgets}
|
||||
>X</div>
|
||||
<AppTile
|
||||
id={stickerpackWidget.id}
|
||||
url={stickerpackWidget.content.url}
|
||||
|
|
@ -138,21 +133,13 @@ export default class Stickerpack extends React.Component {
|
|||
creatorUserId={MatrixClientPeg.get().credentials.userId}
|
||||
waitForIframeLoad={true}
|
||||
show={true}
|
||||
showMenubar={false}
|
||||
showMenubar={true}
|
||||
onEditClick={this._launchManageIntegrations}
|
||||
onDeleteClick={this._removeStickerpackWidgets}
|
||||
showTitle={false}
|
||||
showMinimise={false}
|
||||
/>
|
||||
</div>
|
||||
<div style={{
|
||||
height: '20px',
|
||||
position: 'absolute',
|
||||
bottom: '5px',
|
||||
right: '19px',
|
||||
width: '263px',
|
||||
textAlign: 'right',
|
||||
padding: '5px',
|
||||
borderTop: '1px solid #999',
|
||||
}}>
|
||||
<span className='mx_Stickers_addLink' onClick={this._launchManageIntegrations} > { _t("Manage sticker packs") } </span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
|
|
|
|||
Loading…
Reference in a new issue