FieldTypeZooms - Zoom/Pan Tiled Image Viewer

[SteveB]

This is about viewing large images with a frontend viewer that pans and zooms a view made from image tiles stored on the server. Like you're used to seeing with maps.

The module is a work in progress and I'm fishing for advice and suggestions about integration etc.

The viewer is OpenSeadragon, which works with lots of different tiling schemes. Examples at the link.
Tiles go in folders within the assets/ folder. I'm keeping them in their own branch now (assets/zoom/{id}/{tag}/) but it doesn't have to be that way.

The module (patterned after FieldtypeEvents - Thank You!) stores meta information about the tile sets and has a render method to make markup for your template.
 

I have an image for this but the forum tells me: "You are not allowed to use that image extension on this community." It's .jpg

Render them like this:

$zees = $page->Zooms;
if(!empty($zees)){
    $spex->addScript($config->urls->templates.'scripts/openseadragon.js');
    foreach($zees as $z){
        $a = $z->renderZoom();
        $spex->docReady($a['js']);
        echo $a['html'];
    }
}

Nothing magic about using spex there. I just happen to be using it. The javascript being handled there should run after the page is loaded. The html markup is just a couple of divs, one for buttons and one for the image, and possibly a label. You could do it in your template code but it seemed handy to build default markup into the module.

I already have sets of tiles which were made for an old Zoomify viewer. I've slightly customized the tile loader to handle the different naming conventions so OpenSeaDragon can use them like dzi tile sets. Pretty much anything you need to do like that involves one small JS function which provides the URL to the image.

So far, I can put tile files in assets, enter the meta info in the page editor, view the page and see the zooms. The markup has reasonable ids and classnames so you can style zooms individually or globally and multiple zooms on the same page function just fine.

Next Steps:
People will want to add/replace images. I'm thinking of using an ordinary images field to upload and store the originals and have a scheduled task do the tile making offline. Tiling takes more time and memory than I would want to use in a hook on save approach. I would use the image's tags field as a place for the user to put a name to be used both as a label and as a subfolder name for the tiles.

Thanks