ensured clips can be inserted at an index

Author: k9p5

src/clips/clip/clip.ts

@@ -230,7 +230,8 @@ export class Clip<Props extends ClipProps = ClipProps> extends EventEmitterMixin
 
 		replaceKeyframes(copy, copy.start.subtract(this.start));
 
-		await this.track.add(copy);
+		const index = this.track.clips.findIndex((c) => c.id == this.id);
+		await this.track.add(copy, index + 1);
 
 		return copy;
 	}

src/clips/media/media.ts

@@ -233,7 +233,9 @@ export class MediaClip<Props extends MediaClipProps = MediaClipProps> extends Cl
 	}
 
 	public copy(): MediaClip {
-		return MediaClip.fromJSON(JSON.parse(JSON.stringify(this)));
+		const clip = MediaClip.fromJSON(JSON.parse(JSON.stringify(this)));
+		clip.transcript = this.transcript;
+		return clip;
 	}
 
 	public async split(time?: frame | Timestamp): Promise<this> {
@@ -267,7 +269,8 @@ export class MediaClip<Props extends MediaClipProps = MediaClipProps> extends Cl
 
 		replaceKeyframes(copy, copy.start.subtract(this.start));
 
-		await this.track.add(copy);
+		const index = this.track.clips.findIndex((c) => c.id == this.id);
+		await this.track.add(copy, index + 1);
 
 		return copy;
 	}

src/tracks/track/track.interfaces.ts

@@ -12,7 +12,7 @@ import type { Timestamp } from '../../models';
 
 export interface InsertStrategy<T extends InsertMode> {
 	readonly mode: T;
-	add(clip: Clip, track: Track<Clip>): void;
+	add(clip: Clip, track: Track<Clip>, index?: number): void;
 	update(clip: Clip, track: Track<Clip>): void;
 	offset(time: Timestamp, track: Track<Clip>): void;
 }

src/tracks/track/track.strategies.ts

@@ -62,13 +62,21 @@ export class DefaultInsertStrategy implements InsertStrategy<'DEFAULT'> {
 export class StackInsertStrategy implements InsertStrategy<'STACK'> {
 	public mode = insertModes[1];
 
-	public add(clip: Clip, track: Track<Clip>): void {
+	public add(clip: Clip, track: Track<Clip>, index: number = 0): void {
 		// fallback is -1 because one frame will be added
-		const stop = track.clips.at(-1)?.stop.millis ?? -1;
+		const stop = track.clips.at(index - 1)?.stop.millis ?? -1;
 		const offset = stop - clip.start.millis + 1;
 
 		clip.offsetBy(new Timestamp(offset));
-		track.clips.push(clip);
+
+		if (index == 0) {
+			track.clips.push(clip);
+		} else {
+			track.clips.splice(index, 0, clip);
+			track.clips.slice(index + 1).forEach((c) => {
+				c.offsetBy(clip.stop.subtract(clip.start));
+			});
+		}
 	}
 
 	public update(_: Clip, track: Track<Clip>): void {

src/tracks/track/track.ts

@@ -190,17 +190,19 @@ export class Track<Clp extends Clip> extends EventEmitterMixin<Events, typeof Se
 
 	/**
 	 * Adds a new clip to the track
+	 * @param clip The clip to add
+	 * @param index The index to insert the clip at, will be ignored if track is not stacked
 	 * @throws Error if the clip can't be added
 	 */
-	public async add(clip: Clp): Promise<Clp> {
+	public async add(clip: Clp, index?: number): Promise<Clp> {
 		// only append clip if composition is initialized
 		if (this.composition && !this.composition.renderer) {
 			await new Promise(this.composition.resolve('init'));
 		}
 
 		await clip.init();
 		await clip.connect(this);
-		await this.strategy.add(clip, this);
+		await this.strategy.add(clip, this, index);
 
 		clip.on('frame', () => {
 			this.strategy.update(clip, this);