diff --git a/src/lib/poster/Poster.svelte b/src/lib/poster/Poster.svelte index b372d345..3aba958b 100644 --- a/src/lib/poster/Poster.svelte +++ b/src/lib/poster/Poster.svelte @@ -33,6 +33,8 @@ // If poster is active (scaled up) let posterActive = false; + // If mouse in on poster. Added to fix #656. + let mouseOverPoster = false; let containerEl: HTMLDivElement; @@ -66,7 +68,6 @@ } function handleInnerKeyUp(e: KeyboardEvent) { - console.log(e.target); if (e.key === "Enter" && (e.target as HTMLElement)?.id === "ilikemoviessueme") { if (typeof onClick !== "undefined") { onClick(); @@ -94,6 +95,7 @@
  • { + mouseOverPoster = true; if (!posterActive) calculateTransformOrigin(e); if (!isTouch()) { posterActive = true; @@ -106,12 +108,15 @@ } }} on:focusout={() => { - if (!isTouch()) { + if (!isTouch() && !mouseOverPoster) { // Only on !isTouch (to match focusin) to avoid breaking a tap and hold on link on mobile. + // and only if mouse isn't still over the poster, fixes focusout on click of rating/status + // poster buttons causing poster to shrink until refocused with click/mouse out & in again. posterActive = false; } }} on:mouseleave={() => { + mouseOverPoster = false; posterActive = false; const ae = document.activeElement; if ( diff --git a/src/lib/poster/PosterRating.svelte b/src/lib/poster/PosterRating.svelte index fc5607f9..142c18b9 100644 --- a/src/lib/poster/PosterRating.svelte +++ b/src/lib/poster/PosterRating.svelte @@ -27,7 +27,8 @@ class={[ "rating", minimal ? (!rating ? "minimal" : "minimal-space") : "", - disableInteraction ? "interaction-disabled" : "" + disableInteraction ? "interaction-disabled" : "", + minimal ? "is-minimal" : "" ].join(" ")} on:click={(ev) => { ev.stopPropagation(); @@ -132,12 +133,16 @@