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

Annotations Link behaviour and IOS devices #122

Closed
goul opened this issue May 3, 2012 · 15 comments
Closed

Annotations Link behaviour and IOS devices #122

goul opened this issue May 3, 2012 · 15 comments

Comments

@goul
Copy link

goul commented May 3, 2012

Hi,

I'm having an issue where annotation nodes do not seem to honour click requests under IOS 5 in Safari. I am using the 1.2 bundle with an annotation defined as follows. The same code when clicking on an annotation follows the link correctly - on IOS I see no change pressing on the defined annotation.

Cheers,
Paul.
Code below.

<img id="image" src='ff/ff1.jpg' width="640" height="480" />
    <script>
      $(function()
        { // when DOM ready

                $('#image').reel(
                {
                        frames:8,
                        speed:0.1,
                        revolution:100,
                        images:      [
                                'ff/ff1.jpg',
                                'ff/ff2.jpg',
                                'ff/ff3.jpg',
                                'ff/ff4.jpg',
                                'ff/ff5.jpg',
                                'ff/ff6.jpg',
                                'ff/ff7.jpg',
                                'ff/ff8.jpg'
                                ],
                        annotations:
                        {
                                "headlight" :
                                {
                                        x:[370,441,484],
                                        y:[298,291,276],
                                        image:
                                        {
                                                src:"./img/crosshair.png",
                                                width:  20,
                                                height: 20
                                        },
                                        link:
                                        {
                                                href: "http://www.google.com#headlight"
                                        }, 
                                }
                        }
                });
        }
      );
@goul
Copy link
Author

goul commented May 3, 2012

Wondering now if I'm doing something dumb, if I add the following :

 node:
                                        {
                                                html: "<a href='http://www.google.com/'>dave</a>"
                                        },

Clicking on dave follows links elsewhere, but not on IOS. Apologies if I'm just being stupid.

Paul.

@ghost ghost assigned pisi May 4, 2012
@pisi
Copy link
Owner

pisi commented May 4, 2012

I can confirm the same behavior on one of examples on my iPad. Don't know the reason of that yet. Looks like the click event gets roadblocked somewhere (interesting is that the :hover style for the link is correctly applied when clicking, but that's it). Will check it out to see what I can do. Please hold on. Apologies for the inconvenience and thanks for reporting it!

@goul
Copy link
Author

goul commented May 4, 2012

No worries - thanks for the amazing plugin. Don't stress too much as I can work around with some direct binding.

@pisi
Copy link
Owner

pisi commented May 4, 2012

@goul, you're too kind.

pisi added a commit that referenced this issue May 7, 2012
…S doesn't really work with click events the way I expected it to do. Therefore we can not bind to `click` on annotation notes directly to prevent bubbling of the event higher, where it would be falsely picked up by steppable event bindings. Without it we need the steppables bindings after annotations bindings.
pisi added a commit that referenced this issue May 7, 2012
…oking onto Reel's own touch-enabled `up` event, which in combination with already existing private Boolean `panned` will simulate a click event nicely. #122
pisi added a commit that referenced this issue May 7, 2012
@pisi
Copy link
Owner

pisi commented May 7, 2012

This issue also helped to uncover one more bug in stepping through Reel by clicking on iOS. Thanks for helping make Reel better! :)

Both issues are fixed now in the development branch. Checked on iOS 4 and Android 2.3.5 @goul, please verify, thx.

@pisi
Copy link
Owner

pisi commented May 21, 2012

This bugfix just landed in the v1.2rc2 heading for the 1.2 launch. If you can, please verify this bugfix is working for you. Thanks!

@goul
Copy link
Author

goul commented May 21, 2012

Will do Peter - sorry I've been travelling with clients for the last 3
weeks - I've not forgotten!

Cheers,
Paul.

On Mon, May 21, 2012 at 4:51 PM, Petr Vostřel
reply@reply.github.com
wrote:

This bugfix just landed in the v1.2rc2 heading for the 1.2 launch. If you can, please verify this bugfix is working for you. Thanks!


Reply to this email directly or view it on GitHub:
#122 (comment)

@pisi
Copy link
Owner

pisi commented May 21, 2012

Perfect! I appreciate it. I'm just having strong itches for the release these days, so making sure where things are at the moment ;) Thanks, mate!

@Awzen
Copy link

Awzen commented May 22, 2012

Can't make it work on my iPad 2...
I tried with the latest release though.
When i click on an annotation, there is a little step of one frame, but the link doesn't work at all.
Do you have any suggestion ?
Awesome plugin btw.

@pisi
Copy link
Owner

pisi commented May 22, 2012

Ouch. Have no idea :/ When I grab my iPad 1 and visit http://test.vostrel.cz/jquery.reel/example/object-movie-clockwise-sequence/ , clicking on annotation link works like a charm. There's a link to manufacturer "UAV Factory" here and there below the plane (mainly when the plane is facing you), I would love to know how this link is holding up on your iPad2, @Awzen. I have no iPad2 around unfortunately.

@Awzen
Copy link

Awzen commented May 23, 2012

It's working when I use text links, but not image links.
Weird isn't it ?

pisi added a commit that referenced this issue May 23, 2012
pisi added a commit that referenced this issue May 23, 2012
@pisi
Copy link
Owner

pisi commented May 23, 2012

It's working when I use text links, but not image links.

Now this was a useful bump in the right direction! Thanks :) Potential fix landed in the development branch. Can you confirm this fix on the iPad2, please?

@Awzen
Copy link

Awzen commented May 25, 2012

Problem solved !
Thanks for your support and your awesome plugin ;)

@pisi pisi closed this as completed May 25, 2012
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!
@aceckert
Copy link

First of all, amazing plugin.

Even though this is closed I though I would throw in my 2 cents, for anyone who happens to run into issues with click behaviors on annotations when viewed on an iOS device. I found comment string because I was having trouble with onClick functions within an annotation not working on the iPad (works on desktop)

I put hotspots on my spinning object as annotations so I could make them track with points on the object. the hotspots onClick would bring up a popup div with details on the object. Anyways onClick didn't work on the iPad an in reading this I learned that would work in the latest version of reel.

Anyways, I finally got the function to work by changing my onClick to "

  • link
  • ".

    This may be an obvious work around to some, but I was happy to get it to work.

    @pisi
    Copy link
    Owner

    pisi commented Nov 14, 2012

    @aceckert Right. Sadly, clicks aren't that simple on iOS. The element has to qualify for click event. So Reel uses mousedown-based implementation of clicks on annotations instead and the way to create clickable annotations is to properly define link property of annotation.

    Thanks for commenting tho!

    This issue was closed.
    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

    4 participants