R
For anyone interested, I managed to get this to work.
First, from my VUE file, which is a Quasar layout file:
<div
id="clockdiv"
v-show="isAuthenticated"
>
<q-tooltip>
Due to HIPPA concerns, if you're inactive on this website, you'll be logged out when time expires.
</q-tooltip>
<div
id="timerTitle"
class="smalltext"
>
Auto
<br>
logout
</div>
<div>
<span
id="minutes"
class="minutes"
/>
<div class="smalltext">Min</div>
</div>
<div>
<span
id="seconds"
class="seconds"
/>
<div class="smalltext">Sec</div>
</div>
</div>
mounted () {
this.listener = (event) => {
// console.log('document event triggered')
this.initializeClock('clockdiv', new Date(Date.parse(new Date()) + 20 * 60 * 1000))
}
document.addEventListener('mousedown', this.listener)
document.addEventListener('keydown', this.listener)
document.addEventListener('touchstart', this.listener)
}
And my plugin file (idle-vue.js):
import Vue from 'vue'
import IdleVue from 'idle-vue'
import store from '../store'
const eventsHub = new Vue()
export default ({ Vue }) => {
const options = {
eventEmitter: eventsHub,
idleTime: 1200000, // 20 minutes
store: store,
startAtIdle: false,
events: ['keydown', 'mousedown', 'touchstart']
}
Vue.use(IdleVue, options)
}
