aljaz/rabbit
1
0
Fork 0
mirror of https://github.com/aljazceru/rabbit.git synced 2025-12-18 22:44:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: organized config

Browse Source
This commit is contained in:
Shusui MOYATANI
2023-05-20 03:58:36 +09:00
parent 067b0a2973
commit 9c902b1b40
6 changed files with 190 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src/components/event/textNote/ImageDisplay.tsx
View File

@@ -10,38 +10,7 @@ type ImageDisplayProps = {
const ImageDisplay: Component<ImageDisplayProps> = (props) => {
let imageRef: HTMLImageElement | undefined;
let canvasRef: HTMLCanvasElement | undefined;
const [hidden, setHidden] = createSignal(props.initialHidden);
const [playing, setPlaying] = createSignal(true);
// const isGIF = () => props.url.match(/\.gif/i);
const play = () => {
setPlaying(true);
};
/*
const stop = () => {
if (canvasRef == null || imageRef == null) return;
canvasRef.width = imageRef.width;
canvasRef.height = imageRef.height;
canvasRef
.getContext('2d')
?.drawImage(
imageRef,
0,
0,
imageRef.naturalWidth,
imageRef.naturalHeight,
0,
0,
imageRef.width,
imageRef.height,
);
setPlaying(false);
};
*/
return (
<Show
@@ -59,43 +28,10 @@ const ImageDisplay: Component<ImageDisplayProps> = (props) => {
<img
ref={imageRef}
class="max-h-64 max-w-full rounded object-contain shadow hover:shadow-md"
classList={{
'inline-block': playing(),
hidden: !playing(),
}}
src={playing() ? fixUrl(props.url) : undefined}
src={fixUrl(props.url)}
alt={props.url}
/>
<canvas
ref={canvasRef}
class="inline-block max-h-64 max-w-full rounded object-contain shadow hover:shadow-md"
classList={{
'w-0': playing(),
'h-0': playing(),
'w-auto': !playing(),
'h-auto': !playing(),
}}
onClick={(ev) => {
ev.preventDefault();
play();
}}
/>
</SafeLink>
{/*
<Show when={isGIF()}>
<button
class=""
onClick={() => {
if (playing()) stop();
else play();
}}
>
<Show when={!playing()} fallback="⏸">
▶
</Show>
</button>
</Show>
*/}
</Show>
);
};