LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Fixes the play/pause on drag issue with the floating player. (#221)

Browse source 
I tried to use event.preventDefault on the click handler but that didn't 
work. So instead I'm using css 'pointer-events: none' to disable click 
events on the player while the player is being dragged.

https://github.com/OdyseeTeam/odysee-frontend/issues/206
This commit is contained in:
maxime peabody 2021-11-08 03:51:03 -08:00 committed by GitHub
parent 0f1d4039a9
commit d7ada7904b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
ui/component/fileRenderFloating/view.jsx
View file

@ -295,10 +295,13 @@ export default function FileRenderFloating(props: Props) {
}
function handleDragMove(e, ui) {
setWasDragging(true);
const { x, y } = position;
const newX = x + ui.deltaX;
const newY = y + ui.deltaY;
// Mark as dragging if the position changed and we were not dragging before.
if (!wasDragging && (newX !== x || newY !== y)) {
setWasDragging(true);
}
setPosition({
x: newX,
y: newY,
@ -307,7 +310,6 @@ export default function FileRenderFloating(props: Props) {
function handleDragStop(e) {
if (wasDragging) {
e.stopPropagation();
setWasDragging(false);
setRelativePos({
x: position.x / getScreenWidth(),
@ -334,6 +336,7 @@ export default function FileRenderFloating(props: Props) {
'content__viewer--inline': !isFloating,
'content__viewer--secondary': isComment,
'content__viewer--theater-mode': !isFloating && videoTheaterMode,
'content__viewer--disable-click': wasDragging,
})}
style={
!isFloating && fileViewerRect

4
ui/scss/component/_content.scss
View file

@ -4,6 +4,10 @@
top: var(--spacing-s);
}
.content__viewer--disable-click {
pointer-events: none;
}
.content__viewer--inline {
max-height: var(--inline-player-max-height);
border: none;