feat: 내 정보/설정 페이지 반응형, 500px/1000px 설정

hwe/ts/util/auto500px.ts

@@ -5,6 +5,7 @@ import { keyScreenMode, ScreenModeType } from "@/defs";
 export function auto500px(targetHeight = 700): void {
     let deviceWidth = -1;
     let viewportMeta!: HTMLMetaElement;
+    let oldMode: ScreenModeType = 'auto';
 
 
     function init() {
@@ -23,24 +24,32 @@ export function auto500px(targetHeight = 700): void {
     }
 
     function adjustViewportWidth() {
+        const screenMode = (localStorage.getItem(keyScreenMode) as ScreenModeType)??'auto';
+        if(screenMode != oldMode){
+            oldMode = screenMode;
+            if(screenMode == '500px'){
+                viewportMeta.content = 'width=500';
+                return;
+            }
+
+            if(screenMode == '1000px'){
+                viewportMeta.content = 'width=1000';
+                return;
+            }
+
+            if(screenMode == 'auto'){
+                deviceWidth = -1;
+            }
+        }
+
         if (deviceWidth == window.screen.availWidth) {
             return;
         }
+
         deviceWidth = window.screen.availWidth;
         const innerHeight = window.innerHeight;
         const selectorHeight = targetHeight;
 
-        const screenMode = (localStorage.getItem(keyScreenMode) as ScreenModeType)??'auto';
-        if(screenMode == '500px'){
-            viewportMeta.content = 'width=500';
-            return;
-        }
-
-        if(screenMode == '1000px'){
-            viewportMeta.content = 'width=1000';
-            return;
-        }
-
         if (deviceWidth < 500) {
             viewportMeta.content = 'width=500';
             return;
@@ -69,5 +78,8 @@ export function auto500px(targetHeight = 700): void {
         adjustViewportWidth();
         window.addEventListener('scroll', adjustViewportWidth, true);
         window.addEventListener('orientationchange', adjustViewportWidth, true);
+        document.addEventListener('tryChangeScreenMode', adjustViewportWidth, false);
+
+
     });
 }