#176 レイヤー配分の準備

Author: ienaga

src/js/menu/application/ScreenMenu/service/ScreenMenuAllInactiveService.ts

@@ -5,7 +5,9 @@ import {
     $SCREEN_DISTRIBUTE_TO_LAYERS_ID,
     $SCREEN_DISTRIBUTE_TO_KEYFRAMES_ID,
     $SCREEN_ALIGN_COORDINATES_PREV_KEYFRAME_ID,
+    $SCREEN_ALIGN_COORDINATES_NEXT_KEYFRAME_ID,
     $SCREEN_ALIGN_MATRIX_PREV_KEYFRAME_ID,
+    $SCREEN_ALIGN_MATRIX_NEXT_KEYFRAME_ID,
     $SCREEN_INTEGRATING_PATHS_ID,
     $SCREEN_ADD_TWEEN_CURVE_POINTER_ID,
     $SCREEN_DELETE_TWEEN_CURVE_POINTER_ID,
@@ -29,7 +31,9 @@ export const execute = (): void =>
         $SCREEN_DISTRIBUTE_TO_LAYERS_ID,
         $SCREEN_DISTRIBUTE_TO_KEYFRAMES_ID,
         $SCREEN_ALIGN_COORDINATES_PREV_KEYFRAME_ID,
+        $SCREEN_ALIGN_COORDINATES_NEXT_KEYFRAME_ID,
         $SCREEN_ALIGN_MATRIX_PREV_KEYFRAME_ID,
+        $SCREEN_ALIGN_MATRIX_NEXT_KEYFRAME_ID,
         $SCREEN_INTEGRATING_PATHS_ID,
         $SCREEN_ADD_TWEEN_CURVE_POINTER_ID,
         $SCREEN_DELETE_TWEEN_CURVE_POINTER_ID,

src/js/menu/application/ScreenMenu/service/ScreenMenuUpdateStylePrevKeyframeCoordsService.ts

@@ -0,0 +1,45 @@
+import type { MovieClip } from "@/core/domain/model/MovieClip";
+import {
+    $SCREEN_ALIGN_COORDINATES_NEXT_KEYFRAME_ID,
+    $SCREEN_ALIGN_COORDINATES_PREV_KEYFRAME_ID,
+    $SCREEN_ALIGN_MATRIX_NEXT_KEYFRAME_ID,
+    $SCREEN_ALIGN_MATRIX_PREV_KEYFRAME_ID
+} from "@/config/ScreenConfig";
+
+/**
+ * @description スクリーンのメニューを選択中のElementに合わせてアクティブ・非アクティブに更新する
+ *              Update the screen menu to be active/inactive according to the selected Element
+ *
+ * @return {void}
+ * @method
+ * @public
+ */
+export const execute = (movie_clip: MovieClip): void =>
+{
+    const ids = [
+        $SCREEN_ALIGN_COORDINATES_PREV_KEYFRAME_ID,
+        $SCREEN_ALIGN_COORDINATES_NEXT_KEYFRAME_ID,
+        $SCREEN_ALIGN_MATRIX_PREV_KEYFRAME_ID,
+        $SCREEN_ALIGN_MATRIX_NEXT_KEYFRAME_ID
+    ];
+
+    const show = movie_clip.selectedDepths.size > 0;
+    for (let idx = 0; idx < ids.length; idx++) {
+
+        // 単独選択時の表示
+        const element: HTMLElement | null = document
+            .getElementById(ids[idx]) as HTMLElement;
+
+        if (!element) {
+            continue;
+        }
+
+        // 選択しているDisplayObjectがある場合はボタンをアクティブにする
+        if (show) {
+            element.setAttribute("style", "");
+        } else {
+            element.style.opacity = "0.5";
+            element.style.pointerEvents = "none";
+        }
+    }
+};

src/js/menu/application/ScreenMenu/service/ScreenMenuUpdateStylePrevNextKeyframeService.ts

@@ -3,7 +3,7 @@ import { execute as screenMenuAllInactiveService } from "../service/ScreenMenuAl
 import { execute as screenMenuUpdateStyleSubMenuService } from "../service/ScreenMenuUpdateStyleSubMenuService";
 import { execute as screenMenuUpdateStyleEditMovieClipService } from "../service/ScreenMenuUpdateStyleEditMovieClipService";
 import { execute as screenMenuUpdateStyleMoveParentMovieClipService } from "../service/ScreenMenuUpdateStyleMoveParentMovieClipService";
-import { execute as screenMenuUpdateStylePrevKeyframeCoordsService } from "../service/ScreenMenuUpdateStylePrevKeyframeCoordsService";
+import { execute as screenMenuUpdateStylePrevNextKeyframeService } from "../service/ScreenMenuUpdateStylePrevNextKeyframeService";
 
 /**
  * @description スクリーンのメニューを選択中のElementに合わせてアクティブ・非アクティブに更新する
@@ -29,7 +29,7 @@ export const execute = (): void =>
         screenMenuUpdateStyleEditMovieClipService(movieClip);
 
         // 前のキーフレームの座標に合わせるボタンのスタイルを更新
-        screenMenuUpdateStylePrevKeyframeCoordsService(movieClip);
+        screenMenuUpdateStylePrevNextKeyframeService(movieClip);
     }
 
     // 親のMovieClipへの移動ボタンのスタイルを更新