diff --git a/Dockerfile b/Dockerfile index 379ef7d..7122ae8 100644 --- a/Dockerfile +++ b/Dockerfile @@ -6,7 +6,7 @@ WORKDIR /app COPY package*.json ./ # Install dependencies -RUN npm ci +RUN npm install # Copy source code COPY . . diff --git a/package.json b/package.json index c78e8fb..d168666 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,9 @@ "engines": { "node": ">=16.0.0" }, + "dependencies": { + "gif.js": "^0.2.0" + }, "devDependencies": { "typescript": "^5.0.0", "vite": "^4.0.0" diff --git a/src/gif.d.ts b/src/gif.d.ts new file mode 100644 index 0000000..60cec1d --- /dev/null +++ b/src/gif.d.ts @@ -0,0 +1,24 @@ +declare module 'gif.js' { + interface GIFOptions { + workers?: number; + quality?: number; + width?: number; + height?: number; + transparent?: string; + background?: string; + dither?: boolean; + debug?: boolean; + repeat?: number; + workerScript?: string; + } + + class GIF { + constructor(options?: GIFOptions); + addFrame(canvas: HTMLCanvasElement, options?: { delay?: number; copy?: boolean; }): void; + render(): void; + on(event: 'finished', callback: (blob: Blob) => void): void; + on(event: 'progress', callback: (progress: number) => void): void; + } + + export default GIF; +} \ No newline at end of file diff --git a/src/main.ts b/src/main.ts index 94b1903..58a2c1e 100644 --- a/src/main.ts +++ b/src/main.ts @@ -299,14 +299,13 @@ class BitfielderApp { try { // Import GIF.js dynamically - const { default: GIF } = await import('https://cdn.skypack.dev/gif.js@0.2.0'); + const { default: GIF } = await import('gif.js'); const gif = new GIF({ workers: 2, quality: 10, width: this.canvas.width, - height: this.canvas.height, - workerScript: 'https://cdn.skypack.dev/gif.js@0.2.0/dist/gif.worker.js' + height: this.canvas.height }); const frameDuration = 1000 / 30; // 30 FPS