butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Replace deprecated $on and $off with tiny-emitter

Browse source
This commit is contained in:
N-Pex 2025-05-06 11:34:53 +02:00
parent 7a801f3ec3
commit 3b4d3f08f6
6 changed files with 21 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

4
package-lock.json generated
View file

@ -38,6 +38,7 @@
"raw-loader": "^4.0.2",
"roboto-fontface": "*",
"stream-browserify": "^3.0.0",
"tiny-emitter": "^2.1.0",
"util": "^0.12.5",
"vue": "^3.5.13",
"vue-3-sanitize": "^0.1.4",
@ -6996,7 +6997,8 @@
"node_modules/tiny-emitter": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==",
"license": "MIT"
},
"node_modules/tinyglobby": {
"version": "0.2.12",

1
package.json
View file

@ -39,6 +39,7 @@
"raw-loader": "^4.0.2",
"roboto-fontface": "*",
"stream-browserify": "^3.0.0",
"tiny-emitter": "^2.1.0",
"util": "^0.12.5",
"vue": "^3.5.13",
"vue-3-sanitize": "^0.1.4",

17
src/components/AudioLayout.vue
View file

@ -87,6 +87,7 @@ import messageMixin from "./messages/messageMixin";
import util from "../plugins/utils";
import AuthedImage from "./AuthedImage.vue";
import clapping from "@/assets/sounds/clapping.mp3";
import emitter from 'tiny-emitter/instance';
export default {
mixins: [messageMixin],
@ -131,18 +132,18 @@ export default {
};
},
mounted() {
this.$root.$on('audio-playback-started', this.audioPlaybackStarted);
this.$root.$on('audio-playback-paused', this.audioPlaybackPaused);
this.$root.$on('audio-playback-ended', this.audioPlaybackEnded);
this.$root.$on('audio-playback-reaction', this.audioPlaybackReaction);
emitter.on('audio-playback-started', this.audioPlaybackStarted);
emitter.on('audio-playback-paused', this.audioPlaybackPaused);
emitter.on('audio-playback-ended', this.audioPlaybackEnded);
emitter.on('audio-playback-reaction', this.audioPlaybackReaction);
document.body.classList.add("dark");
this.$audioPlayer.setAutoplay(false);
},
beforeDestroy() {
this.$root.$off('audio-playback-started', this.audioPlaybackStarted);
this.$root.$off('audio-playback-paused', this.audioPlaybackPaused);
this.$root.$off('audio-playback-ended', this.audioPlaybackEnded);
this.$root.$off('audio-playback-reaction', this.audioPlaybackReaction);
emitter.off('audio-playback-started', this.audioPlaybackStarted);
emitter.off('audio-playback-paused', this.audioPlaybackPaused);
emitter.off('audio-playback-ended', this.audioPlaybackEnded);
emitter.off('audio-playback-reaction', this.audioPlaybackReaction);
document.body.classList.remove("dark");
this.$audioPlayer.removeListener(this._uid);
this.currentAudioEvent = null;

6
src/components/Chat.vue
View file

@ -397,7 +397,7 @@ import { imageSize } from "image-size";
import prettyBytes from "pretty-bytes";
import RoomExport from "./RoomExport.vue";
import EmojiPicker from 'vue3-emoji-picker';
import emitter from 'tiny-emitter/instance';
const READ_RECEIPT_TIMEOUT = 5000; /* How long a message must have been visible before the read marker is updated */
const WINDOW_BUFFER_SIZE = 0.3; /** Relative window height of when we start paginating. Always keep this much loaded before and after our scroll position! */
@ -562,7 +562,7 @@ export default {
},
mounted() {
this.$root.$on('audio-playback-ended', this.audioPlaybackEnded);
emitter.on('audio-playback-ended', this.audioPlaybackEnded);
const container = this.chatContainer;
if (container) {
this.scrollPosition = new ScrollPosition(container);
@ -573,7 +573,7 @@ export default {
},
beforeDestroy() {
this.$root.$off('audio-playback-ended', this.audioPlaybackEnded);
emitter.off('audio-playback-ended', this.audioPlaybackEnded);
this.$audioPlayer.pause();
this.stopRRTimer();
if (this.retentionTimer) {

2
src/main.js
View file

@ -182,8 +182,6 @@ app.use(i18n);
app.use(matrix, { store: store, i18n: i18n });
app.config.globalProperties.$root = app;
//app.use(matrix);
//app.use(config);
// app.use(analytics);

9
src/services/audio.service.js
View file

@ -1,4 +1,5 @@
import utils from "../plugins/utils";
import emitter from 'tiny-emitter/instance';
/**
* This plugin (available in all vue components as $audioPlayer) handles
@ -189,14 +190,14 @@ export default {
if (entry) {
entry.playing = true;
}
this.$root.$emit("audio-playback-started", this.currentEvent);
emitter.emit("audio-playback-started", this.currentEvent);
}
onPause() {
var entry = this.infoMap.get(this.currentEvent);
if (entry) {
entry.playing = false;
}
this.$root.$emit("audio-playback-paused", this.currentEvent);
emitter.emit("audio-playback-paused", this.currentEvent);
}
onEnded() {
var entry = this.infoMap.get(this.currentEvent);
@ -204,7 +205,7 @@ export default {
entry.playing = false;
entry.currentTime = entry.duration; // Next time restart
}
this.$root.$emit("audio-playback-ended", this.currentEvent);
emitter.emit("audio-playback-ended", this.currentEvent);
}
onTimeUpdate() {
var entry = this.infoMap.get(this.currentEvent);
@ -257,7 +258,7 @@ export default {
maybePlayClapEvent(previousTimeMs, timeNowMs) {
(this.currentClapReactions || []).forEach(reaction => {
if (previousTimeMs < reaction.timeOffset && timeNowMs >= reaction.timeOffset) {
this.$root.$emit("audio-playback-reaction", reaction);
emitter.emit("audio-playback-reaction", reaction);
}
});
}