Skip to content

Commit 15f7da7

Browse files
Fix gifuct loading for rounded GIF tool (#106)
- switch the GIF rounded-corners tool to the gifuct-js dist build to avoid the `exports` reference error in browsers - add a runtime guard that surfaces a clear error if the gifuct parsing globals fail to load ------ [Codex Task](https://chatgpt.com/codex/tasks/task_e_69524477cf648325b47456862b98eb7d)
1 parent e6566fa commit 15f7da7

1 file changed

Lines changed: 13 additions & 5 deletions

File tree

gif-rounded-corners.html

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -135,9 +135,8 @@ <h1>GIF Rounded Corners</h1>
135135
</section>
136136
</main>
137137

138-
<script src="https://cdn.jsdelivr.net/npm/gifuct-js@2.1.2/lib/index.min.js"></script>
138+
<script src="https://cdn.jsdelivr.net/npm/gifuct-js@2.1.2/dist/gifuct.min.js"></script>
139139
<script src="https://cdnjs.cloudflare.com/ajax/libs/gif.js/0.2.0/gif.js" integrity="sha512-nNOFtIS+H0lwgdUDaPn/g1ssw3uN9AkEM7zy2wLaTQeLQNeNiitUcLpEpDIh3Z4T22MdeTNru/SQbNM4ig2rng==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
140-
141140
<script>
142141
(() => {
143142
const fileInput = document.getElementById('gif-input');
@@ -214,13 +213,22 @@ <h1>GIF Rounded Corners</h1>
214213

215214
try {
216215
const arrayBuffer = await selectedFile.arrayBuffer();
217-
const gif = window.gifuct.parseGIF(arrayBuffer);
218-
const frames = window.gifuct.decompressFrames(gif, true);
216+
const gifuct = window.gifuct || window.GIFuct;
217+
if (!gifuct || !gifuct.parseGIF || !gifuct.decompressFrames) {
218+
throw new Error('GIF parsing library failed to load. Please retry or check your connection.');
219+
}
220+
221+
const gif = gifuct.parseGIF(arrayBuffer);
222+
const frames = gifuct.decompressFrames(gif, true);
219223
if (!frames.length) {
220224
throw new Error('No frames found in the GIF.');
221225
}
222226

223227
const { width, height } = frames[0].dims;
228+
if (width !== height) {
229+
throw new Error(`GIF must be square. This one is ${width}x${height}.`);
230+
}
231+
224232
const canvas = document.createElement('canvas');
225233
canvas.width = width;
226234
canvas.height = height;
@@ -268,7 +276,7 @@ <h1>GIF Rounded Corners</h1>
268276
gifEncoder.render();
269277
} catch (error) {
270278
console.error(error);
271-
processStatus.textContent = 'Something went wrong while rounding the GIF. Please try another file.';
279+
processStatus.textContent = error.message || 'Something went wrong while rounding the GIF. Please try another file.';
272280
processButton.disabled = false;
273281
}
274282
}

0 commit comments

Comments
 (0)