Hopiu/vue-material
1
0
Fork 0
mirror of https://github.com/Hopiu/vue-material.git synced 2026-05-23 14:25:49 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

pause snackbar timeout on hover (#434)

Browse source 
#321
This commit is contained in:
Igor Ribeiro 2017-02-04 19:21:18 -02:00 committed by Marcos Moura
parent a4697bc9f6
commit 0c0ec011ed
1 changed files with 14 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/components/mdSnackbar/mdSnackbar.vue
View file

@ -1,5 +1,5 @@
<template>
<div class="md-snackbar" :class="[themeClass, classes]" :id="snackbarId">
<div class="md-snackbar" :class="[themeClass, classes]" :id="snackbarId" @mouseenter="pauseTimeout" @mouseleave="resumeTimeout">
<div class="md-snackbar-container" ref="container">
<div class="md-snackbar-content">
<slot></slot>
@ -89,6 +89,7 @@
this.active = true;
this.$emit('open');
this.closeTimeout = window.setTimeout(this.close, this.mdDuration);
this.timeoutStartedAt = Date.now();
},
close() {
if (this.$refs.container) {
@ -103,13 +104,25 @@
this.$refs.container.removeEventListener(transitionEndEventName, removeElement);
this.$refs.container.addEventListener(transitionEndEventName, removeElement);
window.clearTimeout(this.closeTimeout);
this.pendingDuration = this.mdDuration;
}
},
pauseTimeout() {
this.pendingDuration = this.pendingDuration - (Date.now() - this.timeoutStartedAt);
this.timeoutStartedAt = 0;
window.clearTimeout(this.closeTimeout);
},
resumeTimeout() {
this.timeoutStartedAt = Date.now();
this.closeTimeout = window.setTimeout(this.close, this.pendingDuration);
}
},
mounted() {
this.$nextTick(() => {
this.snackbarElement = this.$el;
this.snackbarElement.parentNode.removeChild(this.snackbarElement);
this.timeoutStartedAt = 0;
this.pendingDuration = this.mdDuration;
});
},
beforeDestroy() {