Auto trim clips if too long to fit into the remaining space in the film (#422)

Co-authored-by: Christopher Oliphant <RALifeCoach@users.noreply.github.com>

app/pages/PageEnigma/comps/Timeline/TrackClips.tsx

@@ -120,8 +120,8 @@ export const TrackClips = ({ id, clips, updateClip, group, type }: Props) => {
       (event.clientX - position.x) / 4 / scale.value,
     );
 
-    if (clipOffset + (dragItem.value!.length ?? 0) > filmLength.value * 60) {
-      DndAsset.notDropText = "Item is longer than the film length";
+    if (clipOffset + 30 > filmLength.value * 60) {
+      DndAsset.notDropText = "Not enough room to hold item";
       canDrop.value = false;
       return;
     }

app/pages/PageEnigma/signals/audioGroup.ts

@@ -6,6 +6,8 @@ import { toEngineActions } from "~/pages/PageEnigma/Queue/toEngineActions";
 import * as uuid from "uuid";
 import { signal } from "@preact/signals-core";
 import { ClipUI } from "~/pages/PageEnigma/datastructures/clips/clip_ui";
+import { filmLength } from "~/pages/PageEnigma/signals/sizing";
+import { publishClip } from "~/pages/PageEnigma/signals/utils/publishClip";
 
 export const audioGroup = signal<AudioGroup>({
   id: "AG-1",
@@ -69,17 +71,13 @@ export function addGlobalAudio({
     clip_uuid,
   } as Clip;
 
+  publishClip(newClip, dragItem, offset);
+
   const oldAudioGroup = audioGroup.value;
   audioGroup.value = {
     ...oldAudioGroup,
     clips: [...oldAudioGroup.clips, newClip],
   };
-
-  Queue.publish({
-    queueName: QueueNames.TO_ENGINE,
-    action: toEngineActions.ADD_CLIP,
-    data: newClip,
-  });
 }
 
 export function toggleAudioMute() {

app/pages/PageEnigma/signals/characterGroups/characterGroup.ts

@@ -13,6 +13,8 @@ import { toEngineActions } from "~/pages/PageEnigma/Queue/toEngineActions";
 import * as uuid from "uuid";
 import { ToastTypes } from "~/enums";
 import { addToast } from "~/signals";
+import { filmLength } from "~/pages/PageEnigma/signals";
+import { publishClip } from "~/pages/PageEnigma/signals/utils/publishClip";
 
 export const characterGroup = signal<CharacterGroup>({
   id: "CG1",
@@ -49,11 +51,7 @@ export function addCharacterAnimation({
         return { ...character };
       }
 
-      Queue.publish({
-        queueName: QueueNames.TO_ENGINE,
-        action: toEngineActions.ADD_CLIP,
-        data: newClip,
-      });
+      publishClip(newClip, dragItem, offset);
 
       return {
         ...character,
@@ -95,11 +93,7 @@ export function addCharacterExpression({
         return { ...character };
       }
 
-      Queue.publish({
-        queueName: QueueNames.TO_ENGINE,
-        action: toEngineActions.ADD_CLIP,
-        data: newClip,
-      });
+      publishClip(newClip, dragItem, offset);
 
       return {
         ...character,
@@ -141,11 +135,7 @@ export function addCharacterAudio({
         return { ...character };
       }
 
-      Queue.publish({
-        queueName: QueueNames.TO_ENGINE,
-        action: toEngineActions.ADD_CLIP,
-        data: newClip,
-      });
+      publishClip(newClip, dragItem, offset);
 
       return {
         ...character,

app/pages/PageEnigma/signals/utils/publishClip.ts

@@ -0,0 +1,25 @@
+import Queue from "~/pages/PageEnigma/Queue/Queue";
+import { QueueNames } from "~/pages/PageEnigma/Queue/QueueNames";
+import { toEngineActions } from "~/pages/PageEnigma/Queue/toEngineActions";
+import { filmLength } from "~/pages/PageEnigma/signals";
+import { MediaItem, Clip } from "~/pages/PageEnigma/models";
+
+export function publishClip(
+  newClip: Clip,
+  dragItem: MediaItem,
+  offset: number,
+) {
+  Queue.publish({
+    queueName: QueueNames.TO_ENGINE,
+    action: toEngineActions.ADD_CLIP,
+    data: newClip,
+  });
+  if (offset + (dragItem.length ?? 0) > filmLength.value * 60) {
+    newClip.length = filmLength.value * 60 - offset;
+    Queue.publish({
+      queueName: QueueNames.TO_ENGINE,
+      action: toEngineActions.UPDATE_CLIP,
+      data: newClip,
+    });
+  }
+}