Browse Source

Play a sound when marking a task as done

pull/398/head
kolaente 5 months ago
parent
commit
7f5140bbb4
Signed by: konrad GPG Key ID: F40E70337AB24C9B
  1. 3
      nginx.conf
  2. BIN
      public/audio/pop.wav
  3. 2
      src/ServiceWorker/sw.js
  4. 4
      src/components/tasks/partials/singleTaskInList.vue
  5. 11
      src/helpers/playPop.js
  6. 6
      src/views/list/views/Kanban.vue
  7. 6
      src/views/tasks/TaskDetailView.vue
  8. 12
      src/views/user/Settings.vue

3
nginx.conf

@ -34,7 +34,7 @@ http {
gzip_buffers 16 8k;
gzip_http_version 1.1;
gzip_min_length 256;
gzip_types text/plain text/css application/json application/x-javascript application/javascript text/xml application/xml application/xml+rss text/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml font/woff2 image/x-icon;
gzip_types text/plain text/css application/json application/x-javascript application/javascript text/xml application/xml application/xml+rss text/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml font/woff2 image/x-icon audio/wav;
# Expires map
map $sent_http_content_type $expires {
@ -49,6 +49,7 @@ http {
font/woff2 max;
image/svg+xml max;
image/x-icon max;
audio/wav max;
~image/ max;
~font/ max;
}

BIN
public/audio/pop.wav

2
src/ServiceWorker/sw.js

@ -4,7 +4,7 @@
// Cache assets
workbox.routing.registerRoute(
// This regexp matches all files in precache-manifest
new RegExp('.+\\.(css|json|js|svg|woff2|png|html|txt)$'),
new RegExp('.+\\.(css|json|js|svg|woff2|png|html|txt|wav)$'),
new workbox.strategies.StaleWhileRevalidate(),
)

4
src/components/tasks/partials/singleTaskInList.vue

@ -92,6 +92,7 @@ import User from '../../misc/user'
import Fancycheckbox from '../../input/fancycheckbox'
import DeferTask from './defer-task'
import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
import {playPop} from '@/helpers/playPop'
export default {
name: 'singleTaskInList',
@ -164,6 +165,9 @@ export default {
const updateFunc = () => {
this.taskService.update(this.task)
.then(t => {
if(this.task.done) {
playPop()
}
this.task = t
this.$emit('task-updated', t)
this.success(

11
src/helpers/playPop.js

@ -0,0 +1,11 @@
export const playSoundWhenDoneKey = 'playSoundWhenTaskDone'
export const playPop = () => {
const enabled = localStorage.getItem(playSoundWhenDoneKey) === 'true' || localStorage.getItem(playSoundWhenDoneKey) === null
if(!enabled) {
return
}
const popSound = new Audio('/audio/pop.wav')
popSound.play()
}

6
src/views/list/views/Kanban.vue

@ -265,6 +265,7 @@ import Rights from '../../../models/rights.json'
import {LOADING, LOADING_MODULE} from '@/store/mutation-types'
import FilterPopup from '@/components/list/partials/filter-popup'
import Dropdown from '@/components/misc/dropdown'
import {playPop} from '@/helpers/playPop'
export default {
name: 'Kanban',
@ -421,6 +422,11 @@ export default {
this.$set(this.taskUpdating, task.id, true)
task.done = !task.done
this.$store.dispatch('tasks/update', task)
.then(() => {
if(task.done) {
playPop()
}
})
.catch(e => {
this.error(e, this)
})

6
src/views/tasks/TaskDetailView.vue

@ -421,6 +421,7 @@ import ColorPicker from '../../components/input/colorPicker'
import attachmentUpload from '../../components/tasks/mixins/attachmentUpload'
import heading from '@/components/tasks/partials/heading'
import Datepicker from '@/components/input/datepicker'
import {playPop} from '@/helpers/playPop'
export default {
name: 'TaskDetailView',
@ -644,6 +645,11 @@ export default {
},
toggleTaskDone() {
this.task.done = !this.task.done
if(this.task.done) {
playPop()
}
this.saveTask(true, () => this.toggleTaskDone())
},
setDescriptionChanged(e) {

12
src/views/user/Settings.vue

@ -108,6 +108,12 @@
Send me Reminders for tasks via Email
</label>
</div>
<div class="field">
<label class="checkbox">
<input type="checkbox" v-model="playSoundWhenDone"/>
Play a sound when marking tasks as done
</label>
</div>
<x-button
:loading="userSettingsService.loading"
@ -225,6 +231,7 @@ import TotpModel from '../../models/totp'
import TotpService from '../../services/totp'
import UserSettingsService from '../../services/userSettings'
import UserSettingsModel from '../../models/userSettings'
import {playSoundWhenDoneKey} from '@/helpers/playPop'
import {mapState} from 'vuex'
@ -249,6 +256,7 @@ export default {
totpConfirmPasscode: '',
totpDisableForm: false,
totpDisablePassword: '',
playSoundWhenDone: false,
settings: UserSettingsModel,
userSettingsService: UserSettingsService,
@ -273,6 +281,8 @@ export default {
emailRemindersEnabled: this.$store.state.auth.info.emailRemindersEnabled ?? false,
})
this.playSoundWhenDone = localStorage.getItem(playSoundWhenDoneKey) === 'true' || localStorage.getItem(playSoundWhenDoneKey) === null
this.totpStatus()
},
mounted() {
@ -370,6 +380,8 @@ export default {
.catch(e => this.error(e, this))
},
updateSettings() {
localStorage.setItem(playSoundWhenDoneKey, this.playSoundWhenDone)
this.userSettingsService.update(this.settings)
.then(() => {
this.$store.commit('auth/setUserSettings', this.settings)

Loading…
Cancel
Save