deblan-mirror/thelounge
deblan-mirror/thelounge
1
0
Fork 0
mirror of https://github.com/thelounge/thelounge.git synced 2024-05-17 05:36:36 +02:00
Code Issues Projects Releases Wiki Activity

Only show more button on link previews when needed.

Browse source
This commit is contained in:
Richard Lewis 2018-08-31 21:15:46 +03:00 committed by Pavel Djundik
parent 26dc37033c
commit 8dff4a9478
3 changed files with 31 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
client/components/App.vue
View file

@ -93,6 +93,8 @@
</template>
<script>
import {throttle} from "lodash";
import NetworkList from "./NetworkList.vue";
import Chat from "./Chat.vue";
@ -110,5 +112,16 @@ export default {
methods: {
isPublic: () => document.body.classList.contains("public"),
},
mounted() {
// Make a single throttled resize listener available to all components
this.debouncedResize = throttle(() => {
this.$root.$emit('resize');
}, 100);
window.addEventListener("resize", this.debouncedResize, {passive: true});
},
beforeDestroy() {
window.removeEventListener("resize", this.debouncedResize);
},
};
</script>

21
client/components/LinkPreview.vue
View file

@ -147,12 +147,16 @@ export default {
return;
}
this.resizeListener = () => {this.handleResize()};
this.$root.$on('resize', this.resizeListener);
this.onPreviewUpdate();
},
destroyed() {
// Let this preview go through load/canplay events again,
// Otherwise the browser can cause a resize on video elements
this.link.canDisplay = false;
this.$root.$off('resize', this.resizeListener);
},
methods: {
onPreviewUpdate() {
@ -176,13 +180,7 @@ export default {
return;
}
this.$nextTick(() => {
if (!this.$refs.content) {
return;
}
this.showMoreButton = this.$refs.content.offsetWidth >= this.$refs.container.offsetWidth;
});
this.handleResize();
},
onThumbnailError() {
// If thumbnail fails to load, hide it and show the preview without it
@ -193,6 +191,15 @@ export default {
this.isContentShown = !this.isContentShown;
this.keepScrollPosition();
},
handleResize() {
this.$nextTick(() => {
if (!this.$refs.content) {
return;
}
this.showMoreButton = this.$refs.content.offsetWidth >= this.$refs.container.offsetWidth;
});
},
},
};
</script>

7
client/components/MessageList.vue
View file

@ -183,12 +183,13 @@ export default {
});
},
mounted() {
this.debouncedResize = throttle(this.handleResize, 100);
this.debouncedScroll = throttle(this.handleScroll, 100);
window.addEventListener("resize", this.debouncedResize, {passive: true});
this.$refs.chat.addEventListener("scroll", this.debouncedScroll, {passive: true});
this.resizeListener = () => {this.handleResize()}
this.$root.$on('resize', this.resizeListener);
this.$nextTick(() => {
if (this.historyObserver) {
this.historyObserver.observe(this.$refs.loadMoreButton);
@ -196,7 +197,7 @@ export default {
});
},
beforeDestroy() {
window.removeEventListener("resize", this.debouncedResize);
this.$root.$off('resize', this.resizeListener);
this.$refs.chat.removeEventListener("scroll", this.debouncedScroll);
},
destroyed() {