muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
Code Packages Activity Actions

minimal slide height

Browse source
This commit is contained in:
Fedor Katurov 2019-10-17 11:24:23 +07:00
parent b2b21f5b9a
commit 31093d42c3
1 changed files with 13 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/node/NodeImageSlideBlock/index.tsx
View file

@ -89,13 +89,13 @@ const NodeImageSlideBlock: FC<IProps> = ({ node, is_loading, updateLayout }) =>
const { width } = wrap.current.getBoundingClientRect();
const selected = Math.abs(-offset / width);
const prev = heights[Math.floor(selected)] || 320;
const next = heights[Math.ceil(selected)] || 320;
const prev = Math.max(heights[Math.floor(selected)] || 320, 320);
const next = Math.max(heights[Math.ceil(selected)] || 320, 320);
const now = prev - (prev - next) * (selected % 1);
setHeight(now);
console.log({ offset, prev, next, now, selected });
}, [offset, heights]);
// useEffect(() => {
// const timer = setTimeout(() => setIsAnimated(true), 250);
//
@ -104,8 +104,16 @@ const NodeImageSlideBlock: FC<IProps> = ({ node, is_loading, updateLayout }) =>
const onDrag = useCallback(
event => {
if (!is_dragging) return;
setOffset(initial_offset + event.clientX - initial_x);
if (!is_dragging || !slide.current || !wrap.current) return;
const { width: slide_width } = slide.current.getBoundingClientRect();
const { width: wrap_width } = wrap.current.getBoundingClientRect();
console.log(wrap_width - slide_width, initial_offset + event.clientX - initial_x);
setOffset(
Math.min(Math.max(initial_offset + event.clientX - initial_x, wrap_width - slide_width), 0)
);
},
[is_dragging, initial_x, setOffset, initial_offset]
);