fix: prevent back movement whenever tegaki is open.

Author: purifetchi

PinkSea.Frontend/src/api/tegaki/store.ts

@@ -0,0 +1,11 @@
+import { defineStore } from 'pinia'
+
+export const useTegakiViewStore = defineStore(
+  'tegakiViewStore',
+  {
+    state: () => {
+      return {
+        pop: false
+      }
+    }
+  });

PinkSea.Frontend/src/api/tegaki/tegaki-view-helper.ts

@@ -0,0 +1,26 @@
+import { Tegaki } from '@/api/tegaki/tegaki';
+import { useTegakiViewStore } from '@/api/tegaki/store'
+import type { Router } from 'vue-router'
+import i18next from 'i18next'
+
+window.addEventListener('popstate', () => {
+  const store = useTegakiViewStore();
+  store.pop = true;
+});
+
+export const withTegakiViewBackProtection = (router: Router) : void => {
+  router.beforeEach((to, from) => {
+    console.log(`visible ${Tegaki.visible}`)
+    if (!Tegaki.visible) {
+      return true;
+    }
+
+    const confirm = window.confirm(i18next.t("tegakijs.confirmCancel"));
+    if (confirm) {
+      Tegaki.hide();
+      return true;
+    }
+
+    return false;
+  });
+};

PinkSea.Frontend/src/api/tegaki/tegaki.js

@@ -2701,6 +2701,8 @@ export var Tegaki = {
 
   startTimeStamp: 0,
 
+  visible: false,
+
   bg: null,
   canvas: null,
   ctx: null,
@@ -2846,6 +2848,8 @@ export var Tegaki = {
         self.loadReplayFromURL(opts.replayURL);
       }
     }
+
+    self.visible = true;
   },
 
   init: function() {
@@ -3137,6 +3141,8 @@ export var Tegaki = {
     Tegaki.bg.classList.add('tegaki-hidden');
     document.body.classList.remove('tegaki-backdrop');
     Tegaki.unBindGlobalEvents();
+
+    Tegaki.visible = false;
   },
 
   destroy: function() {
@@ -3171,6 +3177,8 @@ export var Tegaki = {
     Tegaki.replayViewer = null;
 
     Tegaki.destroyBuffers();
+
+    Tegaki.visible = false;
   },
 
   flatten: function(ctx) {

PinkSea.Frontend/src/router/index.ts

@@ -9,6 +9,7 @@ import { xrpc } from '@/api/atproto/client'
 import TagView from '@/views/TagView.vue'
 import SettingsView from '@/views/SettingsView.vue'
 import i18next from 'i18next'
+import { withTegakiViewBackProtection } from '@/api/tegaki/tegaki-view-helper'
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
@@ -84,5 +85,6 @@ const router = createRouter({
 });
 
 withBreadcrumb(router);
+withTegakiViewBackProtection(router);
 
 export default router