Coder Social home page Coder Social logo

Comments (6)

yomotsu avatar yomotsu commented on June 3, 2024 2

Unfortunately, CC will block scroll currently...

CC prevents wheel events, then scroll events will be blocked as a side effect.
here is the code:

const onMouseWheel = ( event: WheelEvent ): void => {
if ( ! this._domElement ) return;
if ( ! this._enabled || this.mouseButtons.wheel === ACTION.NONE ) return;
if (
this._interactiveArea.left !== 0 ||
this._interactiveArea.top !== 0 ||
this._interactiveArea.width !== 1 ||
this._interactiveArea.height !== 1
) {
const elRect = this._domElement.getBoundingClientRect();
const left = event.clientX / elRect.width;
const top = event.clientY / elRect.height;
// check if the interactiveArea contains the drag start position.
if (
left < this._interactiveArea.left ||
left > this._interactiveArea.right ||
top < this._interactiveArea.top ||
top > this._interactiveArea.bottom
) return;
}
event.preventDefault();

Maybe we could add a new option like releaseWheelOnEdges to disable the event prevention for wheel events.
(should we consider touch events too...?)
(any idea for good naming for the new option...?)

from camera-controls.

yomotsu avatar yomotsu commented on June 3, 2024 2

Thank you, guys, for your suggestions.
The name releaseEventOnEdges sounds to cover both wheel and touch events.
Let me use the name!

It may take time, but I will add features when I have time.

Probably on scrolling is something easier than on dragging

Yeah...actually I have no idea for detecting orbit limit...but oneday.
I will start with wheel control.

from camera-controls.

SrinivasPrabhu794 avatar SrinivasPrabhu794 commented on June 3, 2024 1

Hi,

Will this be released anytime soon ?

from camera-controls.

IDrumsey avatar IDrumsey commented on June 3, 2024

@yomotsu Is zooming with touch events done differently than scrolling the page with touch events? Just thinking... on desktop you zoom with the mouse wheel AND page scroll with the mouse wheel. But if on mobile zooming is done with two fingers and scrolling is performed with a different action, we might not need to include touch events for this new feature.

Some naming options...

  • normalScrollOnZoomBounds
  • scrollOnZoomBounds
  • swapZoomToScrollOnZoomBounds

just a few ideas

from camera-controls.

esnho avatar esnho commented on June 3, 2024

@IDrumsey on mobile the scrolling is prevented by the camera orbit event, would be great if CC let the page scroll when the orbit reached its limit!

@yomotsu what do you think of an option like releaseEventOnEdges available on those behaviours that can reach an edge?
Probably on scrolling is something easier than on dragging

from camera-controls.

IDrumsey avatar IDrumsey commented on June 3, 2024

@esnho, yeah. I forgot about orbiting constraints. Would make sense to start auto scrolling when the limits were reached.

Not familiar with the codebase, but maybe something like releaseEventOnEdges(eventTypes: [event type] = [Zoom, Orbit, ...]){}

from camera-controls.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.