diff options
Diffstat (limited to 'apps/web/src/lib')
| -rw-r--r-- | apps/web/src/lib/font-config.ts | 39 | ||||
| -rw-r--r-- | apps/web/src/lib/media-processing.ts | 38 | ||||
| -rw-r--r-- | apps/web/src/lib/storage/storage-service.ts | 6 | ||||
| -rw-r--r-- | apps/web/src/lib/time.ts | 8 | ||||
| -rw-r--r-- | apps/web/src/lib/timeline-constants.ts | 75 | ||||
| -rw-r--r-- | apps/web/src/lib/utils.ts | 30 |
6 files changed, 108 insertions, 88 deletions
diff --git a/apps/web/src/lib/font-config.ts b/apps/web/src/lib/font-config.ts new file mode 100644 index 00000000..0389054a --- /dev/null +++ b/apps/web/src/lib/font-config.ts @@ -0,0 +1,39 @@ +import {
+ Inter,
+ Roboto,
+ Open_Sans,
+ Playfair_Display,
+ Comic_Neue,
+} from "next/font/google";
+
+// Configure all fonts
+const inter = Inter({ subsets: ["latin"] });
+const roboto = Roboto({ subsets: ["latin"], weight: ["400", "700"] });
+const openSans = Open_Sans({ subsets: ["latin"] });
+const playfairDisplay = Playfair_Display({ subsets: ["latin"] });
+const comicNeue = Comic_Neue({ subsets: ["latin"], weight: ["400", "700"] });
+
+// Export font class mapping for use in components
+export const FONT_CLASS_MAP = {
+ Inter: inter.className,
+ Roboto: roboto.className,
+ "Open Sans": openSans.className,
+ "Playfair Display": playfairDisplay.className,
+ "Comic Neue": comicNeue.className,
+ Arial: "",
+ Helvetica: "",
+ "Times New Roman": "",
+ Georgia: "",
+} as const;
+
+// Export individual fonts for use in layout
+export const fonts = {
+ inter,
+ roboto,
+ openSans,
+ playfairDisplay,
+ comicNeue,
+};
+
+// Default font for the body
+export const defaultFont = inter;
diff --git a/apps/web/src/lib/media-processing.ts b/apps/web/src/lib/media-processing.ts index 4c1294ae..353c3113 100644 --- a/apps/web/src/lib/media-processing.ts +++ b/apps/web/src/lib/media-processing.ts @@ -6,7 +6,7 @@ import { getImageDimensions, type MediaItem, } from "@/stores/media-store"; -// import { generateThumbnail, getVideoInfo } from "./ffmpeg-utils"; // Temporarily disabled +import { generateThumbnail, getVideoInfo } from "./ffmpeg-utils"; export interface ProcessedMediaItem extends Omit<MediaItem, "id"> {} @@ -33,6 +33,7 @@ export async function processMediaFiles( let duration: number | undefined; let width: number | undefined; let height: number | undefined; + let fps: number | undefined; try { if (fileType === "image") { @@ -41,17 +42,31 @@ export async function processMediaFiles( width = dimensions.width; height = dimensions.height; } else if (fileType === "video") { - // Use basic thumbnail generation for now - const videoResult = await generateVideoThumbnail(file); - thumbnailUrl = videoResult.thumbnailUrl; - width = videoResult.width; - height = videoResult.height; - } else if (fileType === "audio") { - // For audio, we don't set width/height (they'll be undefined) - } + try { + // Use FFmpeg for comprehensive video info extraction + const videoInfo = await getVideoInfo(file); + duration = videoInfo.duration; + width = videoInfo.width; + height = videoInfo.height; + fps = videoInfo.fps; - // Get duration for videos and audio (if not already set by FFmpeg) - if ((fileType === "video" || fileType === "audio") && !duration) { + // Generate thumbnail using FFmpeg + thumbnailUrl = await generateThumbnail(file, 1); + } catch (error) { + console.warn( + "FFmpeg processing failed, falling back to basic processing:", + error + ); + // Fallback to basic processing + const videoResult = await generateVideoThumbnail(file); + thumbnailUrl = videoResult.thumbnailUrl; + width = videoResult.width; + height = videoResult.height; + duration = await getMediaDuration(file); + // FPS will remain undefined for fallback + } + } else if (fileType === "audio") { + // For audio, we don't set width/height/fps (they'll be undefined) duration = await getMediaDuration(file); } @@ -64,6 +79,7 @@ export async function processMediaFiles( duration, width, height, + fps, }); // Yield back to the event loop to keep the UI responsive diff --git a/apps/web/src/lib/storage/storage-service.ts b/apps/web/src/lib/storage/storage-service.ts index 79e932bd..0037dbdb 100644 --- a/apps/web/src/lib/storage/storage-service.ts +++ b/apps/web/src/lib/storage/storage-service.ts @@ -60,6 +60,9 @@ class StorageService { thumbnail: project.thumbnail, createdAt: project.createdAt.toISOString(), updatedAt: project.updatedAt.toISOString(), + backgroundColor: project.backgroundColor, + backgroundType: project.backgroundType, + blurIntensity: project.blurIntensity, }; await this.projectsAdapter.set(project.id, serializedProject); @@ -77,6 +80,9 @@ class StorageService { thumbnail: serializedProject.thumbnail, createdAt: new Date(serializedProject.createdAt), updatedAt: new Date(serializedProject.updatedAt), + backgroundColor: serializedProject.backgroundColor, + backgroundType: serializedProject.backgroundType, + blurIntensity: serializedProject.blurIntensity, }; } diff --git a/apps/web/src/lib/time.ts b/apps/web/src/lib/time.ts index e2db28c2..b3147946 100644 --- a/apps/web/src/lib/time.ts +++ b/apps/web/src/lib/time.ts @@ -1,14 +1,16 @@ // Time-related utility functions
-// Helper function to format time in various formats (MM:SS, HH:MM:SS, HH:MM:SS:CS)
+// Helper function to format time in various formats (MM:SS, HH:MM:SS, HH:MM:SS:CS, HH:MM:SS:FF)
export const formatTimeCode = (
timeInSeconds: number,
- format: "MM:SS" | "HH:MM:SS" | "HH:MM:SS:CS" = "HH:MM:SS:CS"
+ format: "MM:SS" | "HH:MM:SS" | "HH:MM:SS:CS" | "HH:MM:SS:FF" = "HH:MM:SS:CS",
+ fps: number = 30
): string => {
const hours = Math.floor(timeInSeconds / 3600);
const minutes = Math.floor((timeInSeconds % 3600) / 60);
const seconds = Math.floor(timeInSeconds % 60);
const centiseconds = Math.floor((timeInSeconds % 1) * 100);
+ const frames = Math.floor((timeInSeconds % 1) * fps);
switch (format) {
case "MM:SS":
@@ -17,5 +19,7 @@ export const formatTimeCode = ( return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`;
case "HH:MM:SS:CS":
return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}:${centiseconds.toString().padStart(2, "0")}`;
+ case "HH:MM:SS:FF":
+ return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}:${frames.toString().padStart(2, "0")}`;
}
};
diff --git a/apps/web/src/lib/timeline-constants.ts b/apps/web/src/lib/timeline-constants.ts deleted file mode 100644 index dd93cfdf..00000000 --- a/apps/web/src/lib/timeline-constants.ts +++ /dev/null @@ -1,75 +0,0 @@ -import type { TrackType } from "@/types/timeline"; - -// Track color definitions -export const TRACK_COLORS: Record< - TrackType, - { solid: string; background: string; border: string } -> = { - media: { - solid: "bg-blue-500", - background: "bg-blue-500/20", - border: "border-blue-500/30", - }, - text: { - solid: "bg-[#9C4937]", - background: "bg-[#9C4937]", - border: "border-[#9C4937]/40", - }, - audio: { - solid: "bg-green-500", - background: "bg-green-500/20", - border: "border-green-500/30", - }, -} as const; - -// Utility functions -export function getTrackColors(type: TrackType) { - return TRACK_COLORS[type]; -} - -export function getTrackElementClasses(type: TrackType) { - const colors = getTrackColors(type); - return `${colors.background} ${colors.border}`; -} - -export function getTrackLabelColor(type: TrackType) { - return getTrackColors(type).solid; -} - -// Track height definitions -export const TRACK_HEIGHTS: Record<TrackType, number> = { - media: 65, - text: 25, - audio: 50, -} as const; - -// Utility function for track heights -export function getTrackHeight(type: TrackType): number { - return TRACK_HEIGHTS[type]; -} - -// Calculate cumulative height up to (but not including) a track index -export function getCumulativeHeightBefore( - tracks: Array<{ type: TrackType }>, - trackIndex: number -): number { - return tracks - .slice(0, trackIndex) - .reduce((sum, track) => sum + getTrackHeight(track.type), 0); -} - -// Calculate total height of all tracks -export function getTotalTracksHeight( - tracks: Array<{ type: TrackType }> -): number { - return tracks.reduce((sum, track) => sum + getTrackHeight(track.type), 0); -} - -// Other timeline constants -export const TIMELINE_CONSTANTS = { - ELEMENT_MIN_WIDTH: 80, - PIXELS_PER_SECOND: 50, - TRACK_HEIGHT: 60, // Default fallback - DEFAULT_TEXT_DURATION: 5, - ZOOM_LEVELS: [0.25, 0.5, 1, 1.5, 2, 3, 4], -} as const; diff --git a/apps/web/src/lib/utils.ts b/apps/web/src/lib/utils.ts index ae939698..dd73059f 100644 --- a/apps/web/src/lib/utils.ts +++ b/apps/web/src/lib/utils.ts @@ -5,4 +5,34 @@ import { twMerge } from "tailwind-merge"; export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)); +} + +/** + * Generates a UUID v4 string + * Uses crypto.randomUUID() if available, otherwise falls back to a custom implementation + */ +export function generateUUID(): string { + // Use the native crypto.randomUUID if available + if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') { + return crypto.randomUUID(); + } + + // Secure fallback using crypto.getRandomValues + const bytes = new Uint8Array(16); + crypto.getRandomValues(bytes); + + // Set version 4 (UUIDv4) + bytes[6] = (bytes[6] & 0x0f) | 0x40; + // Set variant 10xxxxxx + bytes[8] = (bytes[8] & 0x3f) | 0x80; + + const hex = [...bytes].map(b => b.toString(16).padStart(2, '0')); + + return ( + hex.slice(0, 4).join('') + '-' + + hex.slice(4, 6).join('') + '-' + + hex.slice(6, 8).join('') + '-' + + hex.slice(8, 10).join('') + '-' + + hex.slice(10, 16).join('') + ); }
\ No newline at end of file |