phenixrhyder
commited on
Update index.html
Browse files- index.html +15 -5
index.html
CHANGED
@@ -240,7 +240,6 @@
|
|
240 |
const boardSize = dom.canvas.parentElement.clientWidth;
|
241 |
dom.canvas.width = boardSize;
|
242 |
dom.canvas.height = boardSize;
|
243 |
-
// BUG FIX: Removed arbitrary scaling. Checker size is now 1-to-1 with the slider value.
|
244 |
const liveConfig = { ...state };
|
245 |
drawPattern(ctx, boardSize, boardSize, liveConfig);
|
246 |
};
|
@@ -267,6 +266,7 @@
|
|
267 |
const { id, value, type, checked } = e.target;
|
268 |
state[id] = type === 'checkbox' ? checked : value;
|
269 |
if(type === 'range') state[id] = parseInt(value, 10);
|
|
|
270 |
updateUI();
|
271 |
};
|
272 |
|
@@ -293,20 +293,30 @@
|
|
293 |
const [w, h] = cb.value.split('x').map(Number);
|
294 |
sizesToGenerate.push({ w, h });
|
295 |
});
|
296 |
-
|
297 |
-
|
|
|
|
|
298 |
if (customW > 0 && customH > 0) {
|
299 |
sizesToGenerate.push({ w: customW, h: customH });
|
300 |
}
|
301 |
|
302 |
-
if (sizesToGenerate.length === 0) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
303 |
|
304 |
dom.modal.imagesContainer.innerHTML = '';
|
305 |
sizesToGenerate.forEach(size => {
|
306 |
const offscreenCanvas = document.createElement('canvas');
|
307 |
offscreenCanvas.width = size.w;
|
308 |
offscreenCanvas.height = size.h;
|
309 |
-
// For export, we use the state directly without scaling the checker size
|
310 |
drawPattern(offscreenCanvas.getContext('2d'), size.w, size.h, state);
|
311 |
|
312 |
const imageCard = document.createElement('div');
|
|
|
240 |
const boardSize = dom.canvas.parentElement.clientWidth;
|
241 |
dom.canvas.width = boardSize;
|
242 |
dom.canvas.height = boardSize;
|
|
|
243 |
const liveConfig = { ...state };
|
244 |
drawPattern(ctx, boardSize, boardSize, liveConfig);
|
245 |
};
|
|
|
266 |
const { id, value, type, checked } = e.target;
|
267 |
state[id] = type === 'checkbox' ? checked : value;
|
268 |
if(type === 'range') state[id] = parseInt(value, 10);
|
269 |
+
// BUG FIX: Directly update the UI and redraw on every single input change.
|
270 |
updateUI();
|
271 |
};
|
272 |
|
|
|
293 |
const [w, h] = cb.value.split('x').map(Number);
|
294 |
sizesToGenerate.push({ w, h });
|
295 |
});
|
296 |
+
|
297 |
+
// BUG FIX: Added robust parsing for custom sizes to prevent crashes.
|
298 |
+
const customW = parseInt(dom.modal.customWidth.value, 10) || 0;
|
299 |
+
const customH = parseInt(dom.modal.customHeight.value, 10) || 0;
|
300 |
if (customW > 0 && customH > 0) {
|
301 |
sizesToGenerate.push({ w: customW, h: customH });
|
302 |
}
|
303 |
|
304 |
+
if (sizesToGenerate.length === 0) {
|
305 |
+
// Add a visual cue that nothing was selected
|
306 |
+
dom.modal.generateBtn.textContent = "Select a size!";
|
307 |
+
dom.modal.generateBtn.classList.add('bg-red-500');
|
308 |
+
setTimeout(() => {
|
309 |
+
dom.modal.generateBtn.textContent = "Generate";
|
310 |
+
dom.modal.generateBtn.classList.remove('bg-red-500');
|
311 |
+
}, 2000);
|
312 |
+
return;
|
313 |
+
}
|
314 |
|
315 |
dom.modal.imagesContainer.innerHTML = '';
|
316 |
sizesToGenerate.forEach(size => {
|
317 |
const offscreenCanvas = document.createElement('canvas');
|
318 |
offscreenCanvas.width = size.w;
|
319 |
offscreenCanvas.height = size.h;
|
|
|
320 |
drawPattern(offscreenCanvas.getContext('2d'), size.w, size.h, state);
|
321 |
|
322 |
const imageCard = document.createElement('div');
|