Prevent blank preview fallback when uploaded image produces no drawable output

[Copilot]

When an uploaded image does not yield usable face-driven/derived processing output, the preview could end up blank or effectively hidden. This change makes the fallback explicit: if there is no drawable result, the app keeps showing the original uploaded image instead of replacing it with an empty canvas.

• Preview fallback

  • Treat the original upload as the default visible image whenever the generated preview has no drawable path.
  • Avoid switching the canvas into an empty result state when processing does not produce usable output.

• Canvas rendering safety

  • Paint a solid white canvas background before rendering, rather than clearing to transparency.
  • Prevent failed or empty downstream processing from surfacing as a transparent/blank preview.

• UI behavior

  • Disable the preview toggle until drawable string-art output exists.
  • Keep the toggle label aligned with the actual visible state during fallback.

const hasDrawableStringArt = currentPath.length > 1;
const shouldShowOriginal = !!imageUrl && (showOriginal || !hasDrawableStringArt);

ctx.fillStyle = 'white';
ctx.fillRect(0, 0, width, height);

if (shouldShowOriginal) {
  ctx.drawImage(img, x, y, scaledWidth, scaledHeight);
}

Original prompt

Fix the image upload/background-removal behavior when no face is detected.

Repository: FireAndIceFrog/StringArtGenerator

Problem:

• When a user uploads an image, the app attempts face-based background removal/cropping.
• If no face is found, the current behavior blanks or hides the entire image/screen.
• This is a bad failure mode.

Required fix:

• Update the upload/image-processing flow so that background removal is not applied when no face is detected.
• In the no-face-detected case, preserve and display the original uploaded image instead of blanking/hiding it.
• Make the fallback behavior explicit and safe: failed face detection should not result in an empty/transparent image being shown.

Implementation guidance:

• Identify where face detection result is used to trigger background removal or masking.
• Guard the background-removal path so it only runs when a face is successfully detected.
• Ensure any downstream state/UI logic does not replace the visible image with an empty result when face detection fails.
• If relevant, add or update tests for the no-face-detected case.

Acceptance criteria:

• Uploading an image with a detectable face should continue to behave as expected.
• Uploading an image with no detectable face should leave the original image visible.
• The app should not blank the whole screen/image when face detection fails.
• Any background-removal or face-centered processing should be skipped when no face is found.

The following is the prior conversation context from the user's chat exploration (may be truncated):

User: When I upload an image it's doing something weird - when it can't find a face it just blanks the whole screen. Look into it and fix it so that it doesn't hide the whole image, it shouldn't apply the background removal if it can't find the face

Assistant: I can investigate and fix that, but to make code changes I need the repository explicitly in owner/repo format and, if you want me to open a PR, you need to ask for a PR explicitly.

Right now I have the repo from your URL as:

FireAndIceFrog/StringArtGenerator

Two options:

1. Investigate only: I’ll trace the image upload/background-removal flow and tell you exactly what to change.
2. Create a PR: say “open a PR in FireAndIceFrog/StringArtGenerator to fix it”.

Which do you want?I can investigate and fix that, but to make code changes I need the repository explicitly in owner/repo format and, if you want me to open a PR, you need to ask for a PR explicitly.

Right now I have the repo from your URL as:

FireAndIceFrog/StringArtGenerator

Two options:

1. Investigate only: I’ll trace the image upload/background-removal flow and tell you exactly what to change.
2. Create a PR: say “open a PR in FireAndIceFrog/StringArtGenerator to fix it”.

Which do you want?

User: open a PR in FireAndIceFrog/StringArtGenerator to fix it

Assistant: I’m waiting for your confirmation in the approval dialog before I can continue and open the PR.

This pull request was created from Copilot chat.