Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Click on image to step #20

Closed
pablosbrain opened this issue Mar 3, 2011 · 5 comments
Closed

Click on image to step #20

pablosbrain opened this issue Mar 3, 2011 · 5 comments
Assignees
Milestone

Comments

@pablosbrain
Copy link

Feature Request: Click either half of an image to go to the next or previous frame

Similar to the navigation in some lightbox image gallery displays, make it possible to click once without dragging on either side of the image to step through the frames.

@pisi
Copy link
Owner

pisi commented Mar 4, 2011

Nice one, Pablo! Interesting suggestion, indeed. Thank you very much for it. It fits very nicely my future vision of Reel. I also expect some UI elements like arrow buttons sticked to both left and right edges of the image to visually support such possibility. Stay tuned for future versions. It probably won't be inside the upcomming patch release 1.1.1, but it certainly will be in 1.2.

@ghost ghost assigned pisi May 8, 2011
pisi added a commit that referenced this issue Nov 26, 2011
…ce by one frame #20

Default value is false. The direction of the movement then depends on the horizontal distance from image center.
A `panned` private switch takes care of eliminating unwanted click event after even brief mousemove has happened.
It triggers either `"stepLeft"` or `"stepRight"` events.
pisi added a commit that referenced this issue Nov 26, 2011
Even with `steppable: false` these two events are still available in the API.
pisi added a commit that referenced this issue Nov 26, 2011
It tended to start playing after two quicky successive step clicks.
@pisi
Copy link
Owner

pisi commented Nov 26, 2011

The implemented a solution for this feature request, that has two distinct aspects:

  1. As @pablosbrain requested the entire image area is now clickable and depending on the click position relative to the image center, it triggers either "stepLeft" or "stepRight" event. This is enabled by default and can be disabled by setting new option steppable to false.
  2. And that brings us to the new events - "stepLeft" and "stepRight". These two when .trigger()ed they advance Reel instance one frame left or right. Events are available even when steppable: false.

@pisi
Copy link
Owner

pisi commented Nov 27, 2011

The code was merged into development branch

@pisi pisi closed this as completed Nov 27, 2011
@pisi pisi reopened this Dec 12, 2011
@pisi
Copy link
Owner

pisi commented Dec 12, 2011

Gregory Stewart reported: "one thing I noticed with the stepping is that when I use it with the option to reverse the direction of my slides ({cw : true}) the built-in stepping ignores it and uses the default direction."

@pisi
Copy link
Owner

pisi commented Dec 23, 2011

I'm a bit baffled by Greg's report, because as far as I tested it, if setup right, if clicking the left half causes a default counterclockwise motion and vise versa. If cw: true the reaction is the same - left click for counter-clockwise. So it works just as expected.

I think it may be just a matter of cw option misuse. The cw option is not for reversing the direction. It is there to tell Reel in what manner you have your shots organized, how (in which direction) you took your pictures. You can not deliberatly change this value as it is either this or that depending on the images. Reel assumes a counter-clockwise order of the frames. Rule of the thumb is, that when you setup your Reel and while dragging, the object or the scene does not follow the mouse when dragged, you need to use the cw option to correct Reel's assumption.

@pisi pisi closed this as completed Dec 23, 2011
pisi added a commit that referenced this issue Dec 30, 2011
Just missing annotations examples - the'll be in the beta.

Changes:

* Non-`wheelable` Reels now allow scrolling of the page when wheeling above the Reel instance.
* New option `attr` allows to set custom attributes of the IMG tag (useful for re-using DOM nodes).
* Instances being re-instantiated now perform automatic teardown (GH-62).
* Proper image preload events unbinding on teardown (GH-64).
* Option `scrollable` can disable page scrolling (if needed) on touch devices.
* New event `"openingDone"` now announces the end of opening animation (GH-65).
* Internal event `slide` renamed to `pan` (GH-51).
* Actual frame number is manifested with a wrapper class name, e.g. `frame-8` (GH-69).
* Improved order of preloaded images gradually increasing fidelity of the image, thus the name `"fidelity"` and this mode is now default. The former order is designated `"linear". Preloading mode is chosen by new `preload` option accepting a mode name. (GH-10).
* Deprecated options `hotspot`, `tooltip` and `reversed` have been removed.
* Bare click on left/right half of the image steps the Reel one frame forward/back. Set `steppable` to false to disable. Comes with `"stepLeft"` and `"stepRight"` events (GH-20).
* Custom text/graphics can augment the frames using the brand new `annotations` feature (GH-36).
* New complementary `.unreel()` function to revert effects of `.reel()` on the DOM.
* Control event `play` now accepts optional `speed` parameter.
* Mouse cursor is now customizable with the new `cursor` option. The new failsafe cursor is now `"move"`.
pisi added a commit that referenced this issue Jul 16, 2012
========

Lovely new features:
* in-picture annotations
* new image preloading method
* frame by frame stepping
* new data change model
* full documentation
* jQuery 1.5+

New options:
* `annotations`, `attr`, `cursor`, `steppable`, improved `images`

New events:
* `stepLeft`, `stepRight`, `openingDone`, improved `play`

New methods:
* `.unreel()`, improved `.reel()`

Includes fixes for issues #10, #20, #36, #51, #62, #64, #65, #69, #103, #110, #111, #113, #115, #117, #122, #124, #125, #126

Enjoy!
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants