First stab at showing mobile sized "screen" images.

Uses tinySrc.mobi when able to, otherwise, shows full size screen image for now.
Eventually will resize the screen image to some standard mobile size.

diff --git a/ansel/js/mobile.js b/ansel/js/mobile.js
index 18b73d6..556c2db 100644 (file)
--- a/ansel/js/mobile.js
+++ b/ansel/js/mobile.js
@@ -20,6 +20,8 @@ var AnselMobile = {
      */
     currentGallery: null,
 
+    currentImages: null,
+
     /**
      * Currently loaded image thumbnails
      */
@@ -61,6 +63,17 @@ var AnselMobile = {
         HordeMobile.doAction('getGallery', { id: id }, AnselMobile.galleryLoaded);
     },
 
+    toImage: function(index)
+    {
+        var i = $('<img>').attr({ 'src': ((AnselMobile.currentGallery.tiny) ? 'http://i.tinysrc.mobi/' : '') + AnselMobile.currentImages[index].screen });
+        $('#anselimageview').empty();
+        $('#anselimageview').append(i);
+        $('#imageview h1').text(AnselMobile.currentImages[index].fn)
+        $('#imagebackbutton .ui-btn-text').text(AnselMobile.currentGallery.n);
+        //$('#gallerybackbutton').attr({ 'action': 'back' });
+        $.mobile.changePage('imageview', 'slide', false, true);
+    },
+
     /**
      * Callback for after a gallery is loaded.
      *
@@ -84,20 +97,21 @@ var AnselMobile = {
             $('#thumbs').before(AnselMobile.buildGalleryList(l, r.sg).listview());
         }
         $('#galleryview h1').text(r.n);
-        if ($.mobile.activePage.attr('id') != 'galleryview') {
-            $.mobile.changePage('galleryview', 'slide', false, true);
-        }
         $('#thumbs').empty();
+        AnselMobile.currentImages = r.imgs;
         $.each(r.imgs, function(k, i) {
-            var img = $('<li>').addClass('anselthumb').append($('<a>').attr({ 'href': '#' }).append($('<img>').attr({ src: i.url })));
+            var img = $('<li>').addClass('anselthumb').append($('<a>').attr({ 'href': '#', 'image-key': k, }).append($('<img>').attr({ src: i.url })));
             $('#thumbs').append(img);
         });
+        if ($.mobile.activePage.attr('id') != 'galleryview') {
+            $.mobile.changePage('galleryview', 'slide', false, true);
+        }
         if (r.p) {
             $('#gallerybackbutton .ui-btn-text').text(r.pn);
             $('#gallerybackbutton').attr({ 'action': 'gallery', 'gallery-id': r.p });
         } else {
             $('#gallerybackbutton .ui-btn-text').text($.mobile.page.prototype.options.backBtnText);
-            $('#gallerybackbutton').attr({ 'action': 'home' });
+            $('#gallerybackbutton').attr({ 'action': 'home', 'gallery-id': null });
         }
         AnselMobile.centerGrid();
     },
@@ -138,6 +152,10 @@ var AnselMobile = {
             if (elt.hasClass('ansel-gallery')) {
                 AnselMobile.toGallery(elt.attr('ansel-gallery-id'));
             }
+
+            if (elt.attr('image-key')) {
+                AnselMobile.toImage(elt.attr('image-key'));
+            }
             if (elt.attr('id') == 'gallerybackbutton') {
                 switch (elt.attr('action')) {
                 case 'home':
@@ -147,6 +165,9 @@ var AnselMobile = {
                     AnselMobile.toGallery(elt.attr('gallery-id'));
                 }
             }
+            if (elt.attr('id') == 'imagebackbutton') {
+                window.history.back();
+            }
             elt = elt.parent();
         }
     },

diff --git a/ansel/lib/Gallery.php b/ansel/lib/Gallery.php
index 26022f9..83ff03c 100644 (file)
--- a/ansel/lib/Gallery.php
+++ b/ansel/lib/Gallery.php
@@ -1032,6 +1032,7 @@ class Ansel_Gallery extends Horde_Share_Object_Sql_Hierarchical implements Seria
         }
 
         if ($full) {
+            $json->tiny = ($GLOBALS['conf']['vfs']['src'] == 'direct' || $this->hasPermission('', Horde_Perms::READ));
             $json->sg = array();
             if ($this->hasSubGalleries()) {
                 $sgs = $GLOBALS['injector']->getInstance('Ansel_Storage')->listGalleries(array('parent' => $this->getId(), 'all_levels' => false));
@@ -1040,11 +1041,13 @@ class Ansel_Gallery extends Horde_Share_Object_Sql_Hierarchical implements Seria
                 }
             }
 
-            $images = $this->listImages();
+            $images = $this->getImages();
             foreach ($images as $img) {
                 $i = new StdClass();
-                $i->id = $img;
-                $i->url = Ansel::getImageUrl($img, 'thumb', false, Ansel::getStyleDefinition('ansel_mobile'))->toString();
+                $i->id = $img->id;
+                $i->url = Ansel::getImageUrl($img->id, 'thumb', false, Ansel::getStyleDefinition('ansel_mobile'))->toString();
+                $i->screen = Ansel::getImageUrl($img->id, 'screen', $json->tiny, Ansel::getStyleDefinition('ansel_default'))->toString();
+                $i->fn = $img->filename;
                 $json->imgs[] = $i;
             }
         }

diff --git a/ansel/mobile.php b/ansel/mobile.php
index 2f90609..5fd264e 100644 (file)
--- a/ansel/mobile.php
+++ b/ansel/mobile.php
@@ -27,7 +27,7 @@ require $registry->get('templates', 'horde') . '/common-header-mobile.inc';
 echo $view->render('head');
 echo $view->render('galleries');
 echo $view->render('gallery');
-//echo $view->render('gallery');
+echo $view->render('image');
 //echo $view->render('photo');
 echo $view->render('notice');
 $registry->get('templates', 'horde') . '/common-footer-mobile.inc';

diff --git a/ansel/templates/mobile/image.html.php b/ansel/templates/mobile/image.html.php
new file mode 100644 (file)
index 0000000..2c6f27c
--- /dev/null
+++ b/ansel/templates/mobile/image.html.php
@@ -0,0 +1,7 @@
+<div data-role="page" data-theme="h" id="imageview">
+  <div data-role="header">
+    <a data-role="button" data-icon="arrow-l" href="#" id="imagebackbutton"></a>
+    <h1></h1>
+  </div>
+  <div id="anselimageview"></div>
+</div>
\ No newline at end of file