From: Michael J. Rubinsky <mrubinsk@horde.org>
Date: Mon, 3 Jan 2011 19:40:30 +0000 (-0500)
Subject: First stab at showing mobile sized "screen" images.
X-Git-Url: https://git.internetallee.de/?a=commitdiff_plain;h=0679972dec25f3cda73880c9688d8a5add81bcf0;p=horde.git

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 18b73d62b..556c2db8a 100644
--- 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 26022f966..83ff03cf5 100644
--- 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 2f9060971..5fd264e81 100644
--- 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
index 000000000..2c6f27c80
--- /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