mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-10-26 04:35:55 +03:00
Code Issues Projects Releases Packages Wiki Activity

ugly impl to track whether to hide the widget or not

Browse source
This commit is contained in:
Matthew Hodgson 2016-04-03 23:30:48 +01:00
parent e61c99f7f3
commit 0eb7b627fc
2 changed files with 38 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
src/components/views/messages/TextualBody.js
View file

@ -46,6 +46,13 @@ module.exports = React.createClass({
getInitialState: function() {
return {
link: null,
// track whether the preview widget is hidden
// we can't directly use mxEvent's widgetHidden property
// as shouldComponentUpdate needs to be able to do before & after
// comparisons of the property (and we don't pass it in as a top
// level prop to avoid bloating the number of props flying around)
widgetHidden: false,
};
},
@ -55,6 +62,13 @@ module.exports = React.createClass({
var link = this.findLink(this.refs.content.children);
if (link) {
this.setState({ link: link.getAttribute("href") });
// lazy-load the hidden state of the preview widget from localstorage
if (global.localStorage) {
var hidden = global.localStorage.getItem("hide_preview_" + this.props.mxEvent.getId());
this.props.mxEvent.widgetHidden = hidden;
this.setState({ widgetHidden: hidden });
}
}
if (this.props.mxEvent.getContent().format === "org.matrix.custom.html")
@ -78,7 +92,22 @@ module.exports = React.createClass({
return (nextProps.mxEvent.getId() !== this.props.mxEvent.getId() ||
nextProps.highlights !== this.props.highlights ||
nextProps.highlightLink !== this.props.highlightLink ||
nextState.link !== this.state.link);
nextState.link !== this.state.link ||
nextProps.mxEvent.widgetHidden !== this.state.widgetHidden);
},
componentWillUpdate: function(nextProps, nextState) {
this.setState({ widgetHidden: nextProps.mxEvent.widgetHidden });
},
onCancelClick: function(event) {
this.props.mxEvent.widgetHidden = true;
this.setState({ widgetHidden: true });
// FIXME: persist this somewhere smarter than local storage
if (global.localStorage) {
global.localStorage.setItem("hide_preview_" + this.props.mxEvent.getId(), "1");
}
this.forceUpdate();
},
render: function() {
@ -89,9 +118,13 @@ module.exports = React.createClass({
var widget;
if (this.state.link) {
if (this.state.link && !this.state.widgetHidden) {
var LinkPreviewWidget = sdk.getComponent('rooms.LinkPreviewWidget');
widget = <LinkPreviewWidget link={ this.state.link } mxEvent={ this.props.mxEvent } onWidgetLoad={ this.props.onWidgetLoad }/>;
widget = <LinkPreviewWidget
link={ this.state.link }
mxEvent={ this.props.mxEvent }
onCancelClick={ this.onCancelClick }
onWidgetLoad={ this.props.onWidgetLoad }/>;
}
switch (content.msgtype) {

18
src/components/views/rooms/LinkPreviewWidget.js
View file

@ -32,6 +32,7 @@ module.exports = React.createClass({
propTypes: {
link: React.PropTypes.string.isRequired,
mxEvent: React.PropTypes.object.isRequired,
onCancelClick: React.PropTypes.func,
onWidgetLoad: React.PropTypes.func,
},
@ -42,12 +43,6 @@ module.exports = React.createClass({
},
componentWillMount: function() {
if (global.localStorage) {
if (global.localStorage.getItem("hide_preview_" + this.props.mxEvent.getId()) === "1") {
return;
}
}
MatrixClientPeg.get().getUrlPreview(this.props.link, this.props.mxEvent.getTs()).then((res)=>{
this.setState({ preview: res });
this.props.onWidgetLoad();
@ -66,15 +61,6 @@ module.exports = React.createClass({
linkifyElement(this.refs.description, linkifyMatrix.options);
},
onCancelClick: function(event) {
this.setState({ preview: null });
// FIXME: persist this somewhere smarter than local storage
// FIXME: add to event contextual menu ability to unhide hidden previews
if (global.localStorage) {
global.localStorage.setItem("hide_preview_" + this.props.mxEvent.getId(), "1");
}
},
render: function() {
var p = this.state.preview;
if (!p) return <div/>;
@ -109,7 +95,7 @@ module.exports = React.createClass({
</div>
</div>
<img className="mx_LinkPreviewWidget_cancel" src="img/cancel.svg" width="18" height="18"
onClick={ this.onCancelClick }/>
onClick={ this.props.onCancelClick }/>
</div>
);
}