diff --git a/src/main.ts b/src/main.ts
index fdb7f03..385838b 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -5,12 +5,16 @@ import App from "./App.vue";
import router from "./router";
import NProgress from "nprogress";
import "../node_modules/nprogress/nprogress.css";
+import { Quill } from "@vueup/vue-quill";
+import QuillCursors from "quill-cursors";
import { http } from "./serverCom";
import "./main.css";
NProgress.configure({ showSpinner: false });
+Quill.register("modules/cursors", QuillCursors);
+
const app = createApp(App);
app.use(createPinia());
diff --git a/src/stores/admin/operation/connection.ts b/src/stores/admin/operation/connection.ts
index 1059862..180b803 100644
--- a/src/stores/admin/operation/connection.ts
+++ b/src/stores/admin/operation/connection.ts
@@ -1,5 +1,5 @@
import { defineStore } from "pinia";
-import { io, type Socket } from "socket.io-client";
+import { io, Socket } from "socket.io-client";
import { useNotificationStore } from "../../notification";
import { refreshToken, url } from "../../../serverCom";
@@ -19,7 +19,8 @@ export const useConnectionStore = defineStore("connection", {
this.connection?.disconnect();
this.connection = io(url, {
reconnection: true,
- reconnectionDelayMax: 10000,
+ reconnectionDelayMax: 1000,
+ reconnectionAttempts: 1,
auth: (cb) => {
cb({ token: localStorage.getItem("accessToken") });
},
@@ -46,18 +47,6 @@ export const useConnectionStore = defineStore("connection", {
message: msg,
});
});
- this.connection.on("reconnect", (attemptNumber) => {
- notificationStore.push("Socket-Reconnect", `Reconnect erfolgreich`, "success");
- });
- this.connection.on("reconnect_attempt", (attemptNumber) => {
- notificationStore.push("Socket-Reconnect-Versuch", `Reconnect-Versuch Nr.${attemptNumber}`, "info");
- });
- this.connection.on("reconnect_error", (error) => {
- notificationStore.push("Socket-Warnung", "Reconnect fehlgeschlagen", "warning");
- });
- this.connection.on("reconnect_failed", () => {
- notificationStore.push("Socket-Fehler", "Reconnect-Versuche erfolglos beendet", "error");
- });
},
disconnectClient(): void {
this.connection?.disconnect();
@@ -67,6 +56,11 @@ export const useConnectionStore = defineStore("connection", {
if (err.message == "xhr poll error") {
notificationStore.push("Socket-Netzwerk-Fehler", "Reconnect Versuch in 10s", "error");
+ this.disconnectClient();
+ setTimeout(() => {
+ console.log("hi");
+ this.connectClient();
+ }, 10000);
} else if (err.message == "Token expired") {
notificationStore.push("Session", "Session wird verlängert", "info");
refreshToken()
diff --git a/src/stores/admin/operation/missionDetail.ts b/src/stores/admin/operation/missionDetail.ts
index f20d4ef..7ababf6 100644
--- a/src/stores/admin/operation/missionDetail.ts
+++ b/src/stores/admin/operation/missionDetail.ts
@@ -4,79 +4,46 @@ import * as Y from "yjs";
import { Awareness } from "y-protocols/awareness.js";
import { computed, ref } from "vue";
-export const useMissionDetailStore = defineStore(
- "missionDetail",
- () => {
- const connectionStore = useConnectionStore();
+export const useMissionDetailStore = defineStore("missionDetail", () => {
+ const connectionStore = useConnectionStore();
- const ydoc = ref(new Y.Doc());
- const awareness = ref(new Awareness(ydoc.value));
+ const ydoc = ref(new Y.Doc());
+ const awareness = ref(new Awareness(ydoc.value));
- const editor = ref(ydoc.value.getText("editor"));
+ const editor = ref(ydoc.value.getText("editor"));
- const title = computed({
- get() {
- return ydoc.value.getMap("form").get("title") ?? "";
- },
- set(val) {
- ydoc.value.getMap("form").set("title", val);
- },
+ const title = computed({
+ get() {
+ return ydoc.value.getMap("form").get("title") ?? "";
+ },
+ set(val) {
+ ydoc.value.getMap("form").set("title", val);
+ },
+ });
+
+ function init(missionId: string) {
+ connectionStore.connection?.on("package-sync", (update) => {
+ Y.applyUpdate(ydoc.value, new Uint8Array(update));
});
- function init(missionId: string) {
- connectionStore.connection?.emit("room:join", missionId);
-
- connectionStore.connection?.on("sync", (update) => {
- Y.applyUpdate(ydoc.value, update);
- });
- }
- function destroy() {
- connectionStore?.connection?.emit("room:leave");
- useMissionDetailStore().$reset();
- }
-
- ydoc.value.on("update", (update) => {
- console.log(Array.from(update));
- connectionStore.connection?.emit("sync", Array.from(update));
-
- ydoc.value = new Y.Doc();
- awareness.value = new Awareness(ydoc.value);
- editor.value = ydoc.value.getText("editor");
+ connectionStore.connection?.on("package-mission", (initial) => {
+ Y.applyUpdate(ydoc.value, new Uint8Array(initial));
});
- return { ydoc, awareness, editor, title, init, destroy };
+ connectionStore.connection?.emit("mission:join", missionId);
}
- // {
- // state: () => {
- // const ydoc = new Y.Doc();
- // return {
- // ydoc: ydoc as Y.Doc,
- // awareness: new Awareness(ydoc) as Awareness,
+ function destroy() {
+ connectionStore?.connection?.emit("mission:leave");
- // editor: "",
- // };
- // },
- // actions: {
- // init(missionId: string) {
- // const connectionStore = useConnectionStore();
- // if (!connectionStore.connection) return;
+ ydoc.value = new Y.Doc();
+ awareness.value = new Awareness(ydoc.value);
+ editor.value = ydoc.value.getText("editor");
+ }
- // connectionStore.connection.emit("room:join", missionId);
+ ydoc.value.on("update", (update) => {
+ console.log(connectionStore.connection);
+ connectionStore.connection?.emit("mission:sync", Array.from(update));
+ });
- // connectionStore.connection.on("sync", (update) => {
- // Y.applyUpdate(this.ydoc, update);
- // });
-
- // this.$subscribe((mutation, state) => {
- // console.log(mutation, state);
- // });
- // },
- // destroy() {
- // const connectionStore = useConnectionStore();
- // if (!connectionStore.connection) return;
- // connectionStore.connection.emit("room:leave");
- // this.$reset();
- // },
- // },
- // }
-);
+ return { ydoc, awareness, editor, title, init, destroy };
+});
diff --git a/src/views/admin/operation/mission/MissionDetail.vue b/src/views/admin/operation/mission/MissionDetail.vue
index b09b336..a6c7761 100644
--- a/src/views/admin/operation/mission/MissionDetail.vue
+++ b/src/views/admin/operation/mission/MissionDetail.vue
@@ -13,7 +13,6 @@
- {{ title }}
@@ -83,7 +82,7 @@ import { defineComponent } from "vue";
import { mapActions, mapState, mapWritableState } from "pinia";
import { useAbilityStore } from "@/stores/ability";
import { Quill, QuillEditor } from "@vueup/vue-quill";
-import QuillCursors from "quill-cursors";
+import type QuillCursors from "quill-cursors";
import "@vueup/vue-quill/dist/vue-quill.snow.css";
import { QuillBinding } from "y-quill";
import { moduleOptions } from "@/helpers/quillConfig";
@@ -105,9 +104,6 @@ export default defineComponent({
...mapState(useForceStore, ["availableForces"]),
...mapWritableState(useMissionDetailStore, ["editor", "title"]),
},
- created() {
- Quill.register("modules/cursors", QuillCursors);
- },
methods: {
initEditor(quill: Quill) {
this.binding = new QuillBinding(this.editor, quill);
diff --git a/src/views/admin/operation/mission/MissionOverview.vue b/src/views/admin/operation/mission/MissionOverview.vue
index 34b1e8f..559d7bb 100644
--- a/src/views/admin/operation/mission/MissionOverview.vue
+++ b/src/views/admin/operation/mission/MissionOverview.vue
@@ -69,6 +69,7 @@ export default defineComponent({
},
connectionStatus() {
if (this.connectionStatus) {
+ console.log("hi");
this.init(this.id);
}
},