Add touch support!

[aseemk]

Seadragon Ajax has great mouse navigation built-in; we should have the same for touch navigation. Maybe a TouchTracker class like MouseTracker, or maybe just add touch support directly into MouseTracker?

One thing to consider is that we may not want to enable touch support by default, since we would be overriding the native panning (scrolling) and zooming of the webpage in the browser. This is probably something that should be enabled at the app level.

[shyam-habarakada]

Hi Aseem, has any work been done on this? I need this, and am willing to help :D

[aseemk]

Hey Shyam!

Some work has been done in this area, but not officially. For Zoom.it, @gasi (during his internship!) implemented a TouchController class for exactly this purpose:

http://zoom.it/scripts/Seadragon.TouchController.js

The code was never officially licensed or released, but FYI. You can see it in action by visiting e.g. http://zoom.it/hid on your iPhone or iPad. It works pretty well; the only thing it's missing is finger tracking (e.g. as you zoom, it doesn't track your fingers exactly 1:1 like the native Maps app does, for example).

The popular iScroll library by @cubiq does touch support for web apps in general:

https://github.com/cubiq/iscroll

You can see it in action by visiting http://cubiq.org/dropbox/iscroll4/examples/zoom/ on your iPhone or iPad. It doesn't support Seadragon Ajax or anything like that, but it's MIT-licensed, so you could use it as reference code if you wanted. Notice that it too doesn't track fingers 1:1.

Hope this helps for now! Good luck, and looking forward to see what you decide and/or come up with. =)

[shyam-habarakada]

Great. I will look at these, especially the Seadragon.TouchController.js. Will ping you offline with more details.

[shyam-habarakada]

fyi - chatted with Daniel and got the touch support working. Thanks!

[aseemk]

Great to hear!

[gasi]

For everyone else, include your own copy of http://zoom.it/scripts/Seadragon.TouchController.js and use the following code:

viewer.addEventListener('open', onViewerOpen);

// …

function onViewerOpen(event) {
    var touchController = new Seadragon.TouchController(viewer);
}

[rogerhoward]

The script has an "All Rights Reserved" notice right at the top; has anyone provided an open licensed version of this code for anyone to use? I'd love to use it, but it won't pass muster with our legal team as-is.

[aseemk]

Unfortunately not that I know of, sorry. If you have the resources, you can always reimplement it on your own, using iScroll as reference code since that's MIT-licensed. It's fun. =) Good luck!

[ElvisYang]

Hi aseemk,

For seaDragon, is there some plan to support deep zoom collection?

[ElvisYang]

I have tried to use the SeaDragon Ajax, and also use TouchController.js to support the touch in Mobile device. They works properly.

Currently I also want deep zoom collection in Mobile side, so Is there some suggestion on it?

[aseemk]

Sorry Elvis, Seadragon Ajax is not being actively developed (see issue #8), so there's no plan to support Deep Zoom Collections anytime soon.

[Siddiqui]

Hi,

I have used SeaDragon.TouchController.js for the mobile devices, touches move, touches start and multi-touch event in iOS 4.x working successfully, but multi-touch event is not working in android 4.x.

I have tried other demos of multi-touch in android 4.x and its working fine. Can you please give me some guideline on this issue?

[aseemk]

Sorry @Siddiqui, I don't have any experience with touch on Android. Maybe others here have. Good luck.

[Siddiqui]

Thanks @aseemk for your reply.

Has any one else experienced this issue?

[nator]

This seems to be the best place to ask before we embark on a rewrite: has anyone done the work to make an open-source version of the touch controller? Thanks!

[aseemk]

I don't know the answer to that question, but I thought I'd share that I recently learned of project called OpenSeadragon, which is a fully open-source fork of Seadragon Ajax that has active maintainers and contributors, so some of you guys might like to take a look over there.

http://thatcher.github.com/openseadragon/

My friend @iangilman — who's also the inventor of Seadragon Ajax! — just joined the OpenSeadragon team, so maybe he can chime in with some thoughts, too.

[nator]

Fantastic! We'll start there. Thanks so much for the prompt response!

[iangilman]

And yes, OpenSeadragon already supports touch events.

[Praha]

I have been trying to get touch unsuccessfully to get Seadragon.TouchController.js working. Where exactly do I put:

viewer.addEventListener('open', onViewerOpen);

// …

function onViewerOpen(event) {
var touchController = new Seadragon.TouchController(viewer);
}

Also, can you direct me to any sites with Seadragon.TouchController.js implemented so I can have a look myself at the code.

Thanks.

[iangilman]

@Praha have you tried http://openseadragon.github.io yet? It's the latest version of the Seadragon Ajax code, and it supports touch events.