multilevel gallery

apps/gallery/ajax/galleryOp.php

@@ -41,7 +41,6 @@ function handleRemove($name) {
 
 function handleGetThumbnails($albumname) {
   OC_Response::enableCaching(3600 * 24); // 24 hour
-  error_log(htmlentities($albumname));
   $thumbnail = OC::$CONFIG_DATADIRECTORY.'/../gallery/'.urldecode($albumname).'.png';
   header('Content-Type: '.OC_Image::getMimeTypeForFile($thumbnail));
   OC_Response::sendFile($thumbnail);
@@ -88,20 +87,36 @@ function handleStoreSettings($root, $order) {
   OC_JSON::success(array('rescan' => $rescan));
 }
 
-
+function handleGetGallery($path) {
-function handleGetGalleries() {
   $a = array();
+  $root = OC_Preferences::getValue(OC_User::getUser(),'gallery', 'root', '/');
+  if (strlen($root) > 1)
+    $path = $root.'/'.trim($path, '/');
+  else
+    $path = '/'.ltrim($path, '/');
+  if (strlen($path) > 1) $path = rtrim($path, '/');
+  error_log($path);
+  $result = OC_Gallery_Album::find(OC_User::getUser(), null, $path);
+  $album_details = $result->fetchRow();
 
-  $result = OC_Gallery_Album::find(OC_User::getUser());
+  $result = OC_Gallery_Album::find(OC_User::getUser(), null, null, $path);
 
   while ($r = $result->fetchRow()) {
     $album_name = $r['album_name'];
     $tmp_res = OC_Gallery_Photo::find($r['album_id']);
 
-    $a[] = array('name' => utf8_encode($album_name), 'numOfItems' => min($tmp_res->numRows(), 10), 'bgPath' => OC::$WEBROOT.'/data/'.OC_User::getUser().'/gallery/'.$album_name.'.png');
+    $a[] = array('name' => utf8_encode($album_name), 'numOfItems' => min($tmp_res->numRows(), 10));
   }
   
-  OC_JSON::success(array('albums'=>$a));
+  $result = OC_Gallery_Photo::find($album_details['album_id']);
+
+  $p = array();
+
+  while ($r = $result->fetchRow()) {
+    $p[] = utf8_encode($r['file_path']);
+  }
+
+  OC_JSON::success(array('albums'=>$a, 'photos'=>$p));
 }
 
 if ($_GET['operation']) {
@@ -130,7 +145,10 @@ if ($_GET['operation']) {
     handleStoreSettings($_GET['root'], $_GET['order']);
     break;
   case 'get_galleries':
-    handleGetGalleries();
+    handleGetGalleries($_GET['path']);
+    break;
+  case 'get_gallery':
+    handleGetGallery($_GET['path']);
     break;
   default:
     OC_JSON::error(array('cause' => 'Unknown operation'));

apps/gallery/appinfo/database.xml

@@ -33,6 +33,12 @@
 				<notnull>true</notnull>
 				<length>100</length>
 			</field>
+			<field>
+				<name>parent_path</name>
+				<type>text</type>
+				<notnull>true</notnull>
+				<length>100</length>
+			</field>
 		</declaration>
 	</table>
 	<table>

apps/gallery/appinfo/info.xml

@@ -2,7 +2,7 @@
 <info>
 	<id>gallery</id>
 	<name>Gallery</name>
-	<version>0.3</version>
+	<version>0.4</version>
 	<licence>AGPL</licence>
 	<author>Bartek Przybylski</author>
 	<require>2</require>

apps/gallery/css/styles.css

@@ -1,13 +1,14 @@
 div#gallery_list { margin: 4.5em 2em 0 2em; }
 div#gallery_list.leftcontent { padding-top: 15pt; margin: 0; position: absolute; bottom:0px; text-align: center; overflow: auto; }
-div.gallery_album_box { width: 200px; position:relative; text-align: center; border: 0; display: inline-block; margin: 5pt; vertical-align: top; padding: 5px 5px 5px 5px; position: relative; -webkit-transition: color 0.5s ease-in-out; -o-transition: color 0.5s ease-in-out; -moz-transition: color 0.5s ease-in-out;color: #BBB;}
+div.gallery_box { width: 200px; position:relative; text-align: center; border: 0; display: inline-block; margin: 5pt; vertical-align: top; padding: 5px 5px 5px 5px; position: relative; -webkit-transition: color 0.5s ease-in-out; -o-transition: color 0.5s ease-in-out; -moz-transition: color 0.5s ease-in-out;color: #BBB;}
-div.gallery_album_box h1 { font-size: 9pt; font-family: Verdana; }
+div.album {border: 1px solid #e0e0e0; border-radius: 7px;}
+div.gallery_box h1 { font-size: 9pt; font-family: Verdana; }
 div.gallery_album_decoration { width: 200px; position: absolute; border: 0; height: 20px; top: 5px; text-align:right; vertical-align:middle; background-color: #eee; opacity: 0; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft:7px;}
-div.gallery_album_box:hover { color: black; }
+div.gallery_box:hover { color: black; }
-div.gallery_album_box:hover div.gallery_album_decoration { opacity: 0.7;}
+div.gallery_box:hover div.gallery_album_decoration { opacity: 0.7;}
 div.gallery_album_decoration a {padding: 0 4pt; cursor: pointer;}
 div.gallery_album_cover { width: 200px; height: 200px; border: 0; padding: 0; position:relative;}
-div.gallery_album_box:hover div.gallery_control_overlay { opacity:0.5 }
+div.gallery_box:hover div.gallery_control_overlay { opacity:0.5 }
 div.gallery_control_overlay a { color:white; }
 #gallery_images.rightcontent { padding:10px 5px; bottom: 0px; overflow: auto; right:0px}
 #scan { position:absolute; right:13.5em; top:0em; }

apps/gallery/js/album_cover.js

@@ -1,34 +1,62 @@
 var actual_cover;
-$(document).ready(function() {
+var paths = '';
-  $.getJSON('ajax/galleryOp.php', {operation: 'get_galleries'}, function(r) {
+var crumbCount = 0;
+$(document).ready(returnToElement(0));
+
+function returnToElement(num) {
+  while (crumbCount != num) {
+    $('#g-album-navigation .last').remove();
+    $('#g-album-navigation .crumb :last').parent().addClass('last');
+    crumbCount--;
+    paths = paths.substring(0, paths.lastIndexOf('\/'));
+  }
+  $.getJSON('ajax/galleryOp.php', {operation: 'get_gallery', path: paths }, albumClickHandler);
+}
+
+function albumClick(e) {
+  var title = decodeURIComponent(escape(e.data.title));
+  paths += '/' + title;
+  crumbCount++;
+  $.getJSON('ajax/galleryOp.php', {operation: 'get_gallery', path: paths }, albumClickHandler);
+  if ($('#g-album-navigation :last-child'))
+    $('#g-album-navigation :last-child').removeClass('last');
+  $('#g-album-navigation').append('<div class="crumb last real" style="background-image:url(\''+OC.webroot+'/core/img/breadcrumb.png\')"><a href=\"javascript:returnToElement('+crumbCount+');\">'+title+'</a></div>');
+}
+
+function albumClickHandler(r) {
+    Albums.photos = [];
+    Albums.albums = [];
     if (r.status == 'success') {
       for (var i in r.albums) {
         var a = r.albums[i];
         Albums.add(a.name, a.numOfItems);
       }
+      for (var i in r.photos) {
+        Albums.photos.push(r.photos[i]);
+      }
       var targetDiv = document.getElementById('gallery_list');
       if (targetDiv) {
         $(targetDiv).html('');
         Albums.display(targetDiv);
-        $('#gallery_list').sortable({revert:true});
+        //$('#gallery_list').sortable({revert:true});
-        $('.gallery_album_box').each(function(i, e) {
+        $('.album').each(function(i, el) {
-          $(e).draggable({connectToSortable: '#gallery_list', handle: '.dummy'})
+          $(el).click({title:$(el).attr('title')}, albumClick);
+          //$(el).draggable({connectToSortable: '#gallery_list', handle: '.dummy'});
         });
       } else {
-        alert('Error occured: no such layer `gallery_list`');
+        OC.dialogs.alert(t('gallery', 'Error: no such layer `gallery_list`'), t('gallery', 'Internal error'));
       }
     } else {
-      alert('Error occured: ' + r.message);
+      OC.dialogs.alert(t('gallery', 'Error: ') + r.message, t('gallery', 'Internal error'));
     }
-  });
+}
-});
 
 function createNewAlbum() {
   var name = prompt("album name", "");
   if (name != null && name != "") {
     $.getJSON("ajax/createAlbum.php", {album_name: name}, function(r) {
       if (r.status == "success") {
-        var v = '<div class="gallery_album_box"><a href="?view='+r.name+'"><img class="gallery_album_cover"/></a><h1>'+r.name+'</h1></div>';
+        var v = '<div class="gallery_box"><a href="?view='+r.name+'"><img class="gallery_album_cover"/></a><h1>'+r.name+'</h1></div>';
         $('div#gallery_list').append(v);
       }
     });
@@ -55,10 +83,6 @@ function scanForAlbums(cleanup) {
       for(var a in r.paths) {
         $.getJSON('ajax/galleryOp.php',{operation:'partial_create','path':r.paths[a]}, function(r) {
 
-          if (r.status == 'success') {
-            Albums.add(r.album_details.albumName, r.album_details.imagesCount);
-          }
-
           albumCounter++;
           $('#scanprogressbar').progressbar({ value: (albumCounter/totalAlbums)*100 });
           if (albumCounter == totalAlbums) {
@@ -66,7 +90,9 @@ function scanForAlbums(cleanup) {
             var targetDiv = document.getElementById('gallery_list');
             if (targetDiv) {
               targetDiv.innerHTML = '';
-              Albums.display(targetDiv);
+              Albums.photos = [];
+              Albums.albums = [];
+              returnToElement(0);
             } else {
               alert('Error occured: no such layer `gallery_list`');
             }
@@ -87,7 +113,7 @@ function galleryRemove(albumName) {
     if (decision) {
       $.getJSON("ajax/galleryOp.php", {operation: "remove", name: decodeURIComponent(escape(albumName))}, function(r) {
         if (r.status == "success") {
-          $(".gallery_album_box").filterAttr('data-album',albumName).remove();
+          $(".gallery_box").filterAttr('data-album',albumName).remove();
           Albums.remove(albumName);
         } else {
           OC.dialogs.alert(r.cause, "Error");
@@ -109,7 +135,7 @@ function galleryRename(name) {
     }
     $.getJSON('ajax/galleryOp.php', {operation: 'rename', oldname: name, newname: newname}, function(r) {
       if (r.status == 'success') {
-        Albums.rename($(".gallery_album_box").filterAttr('data-album',name), newname);
+        Albums.rename($(".gallery_box").filterAttr('data-album',name), newname);
       } else {
         OC.dialogs.alert('Error: ' + r.cause, 'Error');
       }

apps/gallery/js/albums.js

@@ -7,6 +7,7 @@ Albums={
   // to display to user as preview picture when scrolling throught
   // the album cover
   albums:new Array(),
+  photos:new Array(),
   // add simply adds new album to internal structure
   // however albums names must be unique so other
   // album with the same name wont be insered,
@@ -41,10 +42,11 @@ Albums={
   // displays gallery in linear representation
   // on given element, and apply default styles for gallery
   display: function(element) {
-    var displayTemplate = '<div class="gallery_album_box"><div class="dummy"></div><a class="view"><div class="gallery_album_cover"></div></a><h1></h1><div class="gallery_album_decoration"><a><img src="img/share.png" title="Share"></a><a class="rename"><img src="img/rename.png" title="Rename"></a><a class="remove"><img src="img/delete.png" title="Delete"></a></div></div>';
+    var displayTemplate = '<div class="gallery_box album"><div class="dummy"></div><a class="view"><div class="gallery_album_cover"></div></a><h1></h1><div class="gallery_album_decoration"><a><img src="img/share.png" title="Share"></a><a class="rename"><img src="img/rename.png" title="Rename"></a><a class="remove"><img src="img/delete.png" title="Delete"></a></div></div>';
     for (var i in Albums.albums) {
       var a = Albums.albums[i];
 	  var local=$(displayTemplate);
+    local.attr('title', a.name);
 	  local.attr('data-album',a.name);
 	  $(".gallery_album_decoration a.rename", local).bind('click', {name: a.name},function(event){
 			event.preventDefault();
@@ -54,7 +56,7 @@ Albums={
 		  event.preventDefault();
 		  galleryRemove(event.data.name);
     });
-    $("a.view", local).attr('href','?view='+decodeURIComponent(escape(a.name)));
+ //   $("a.view", local).attr('href','?view='+decodeURIComponent(escape(a.name)));
     $('h1',local).text(decodeURIComponent(escape(a.name)));
     $(".gallery_album_cover", local).attr('title',decodeURIComponent(escape(a.name)));
       $(".gallery_album_cover", local).css('background-repeat', 'no-repeat');
@@ -73,6 +75,13 @@ Albums={
       });
       $(element).append(local);
     }
+    var photoDisplayTemplate = '<div class="gallery_box"><div class="dummy"></div><div><a rel="images" href="'+OC.webroot+'/files/download.php?file=URLPATH"><img src="ajax/thumbnail.php?img=IMGPATH"></a></div></div>';
+    for (var i in Albums.photos) {
+      $(element).append(photoDisplayTemplate.replace("IMGPATH", escape(Albums.photos[i])).replace("URLPATH", escape(Albums.photos[i])));
+    }
+    $("a[rel=images]").fancybox({
+      'titlePosition': 'inside'
+    });
   },
   rename: function(element, new_name) {
     if (new_name) {

apps/gallery/lib/album.php

@@ -23,8 +23,9 @@
 
 class OC_Gallery_Album {
 	public static function create($owner, $name, $path){
-		$stmt = OC_DB::prepare('INSERT INTO *PREFIX*gallery_albums (uid_owner, album_name, album_path) VALUES (?, ?, ?)');
+    $id = self::getParentPath($path);
-		$stmt->execute(array($owner, $name, $path));
+		$stmt = OC_DB::prepare('INSERT INTO *PREFIX*gallery_albums (uid_owner, album_name, album_path, parent_path) VALUES (?, ?, ?, ?)');
+		$stmt->execute(array($owner, $name, $path, $id));
 	}
 
 	public static function rename($oldname, $newname, $owner) {
@@ -40,6 +41,13 @@ class OC_Gallery_Album {
     }
   }
 
+  public static function getParentPath($path) {
+    if (strlen($path)==1) return '';
+    $path = substr($path, 0, strrpos($path, '/'));
+    if ($path == '') $path = '/';
+    return $path;
+  }
+
 	public static function remove($owner, $name=null) {
 		$sql = 'DELETE FROM *PREFIX*gallery_albums WHERE uid_owner = ?';
 		$args = array($owner);
@@ -66,7 +74,7 @@ class OC_Gallery_Album {
     }
   }
 	
-  public static function find($owner, $name=null, $path=null){
+  public static function find($owner, $name=null, $path=null, $parent=null){
 		$sql = 'SELECT * FROM *PREFIX*gallery_albums WHERE uid_owner = ?';
 		$args = array($owner);
 		if (!is_null($name)){
@@ -77,6 +85,10 @@ class OC_Gallery_Album {
       $sql .= ' AND album_path = ?';
       $args[] = $path;
     }
+    if (!is_null($parent)){
+      $sql .= ' AND parent_path = ?';
+      $args[] = $parent;
+    }
     $order = OC_Preferences::getValue(OC_User::getUser(), 'gallery', 'order', 'ASC');
     $sql .= ' ORDER BY album_name ' . $order;
 

apps/gallery/lib/scanner.php

@@ -21,7 +21,7 @@
 * 
 */
 
-require_once('base.php'); // base lib
+require_once('base.php');
 require_once('images_utils.php');
 
 class OC_Gallery_Scanner {
@@ -40,20 +40,14 @@ class OC_Gallery_Scanner {
   }
 
   public static function createName($name) {
-    $root = OC_Preferences::getValue(OC_User::getUser(), 'gallery', 'root', '/');
+    return basename($name);
-    $name = str_replace('/', '.', str_replace(OC::$CONFIG_DATADIRECTORY, '', $name));
-    if (substr($name, 0, strlen($root)) == str_replace('/','.',$root)) {
-      $name = substr($name, strlen($root));
-    }
-    $name = ($name==='.') ? 'main' : trim($name,'.');
-    return $name;
   }
 
   public static function scanDir($path, &$albums) {
     $current_album = array('name'=> $path, 'imagesCount' => 0, 'images' => array());
     $current_album['name'] = self::createName($current_album['name']);
 
-    if ($dh = OC_Filesystem::opendir($path.'/')) {
+    if ($dh = OC_Filesystem::opendir($path)) {
       while (($filename = readdir($dh)) !== false) {
         $filepath = ($path[strlen($path)-1]=='/'?$path:$path.'/').$filename;
         if (substr($filename, 0, 1) == '.') continue;
@@ -108,7 +102,6 @@ class OC_Gallery_Scanner {
 	foreach($images as $image){
 		$path=dirname($image);
 		if(array_search($path,$paths)===false){
-			error_log($path);
 			$paths[]=$path;
 		}
 	}

apps/gallery/templates/index.php

@@ -2,6 +2,10 @@
 OC_Util::addStyle('gallery', 'styles');
 OC_Util::addScript('gallery', 'albums');
 OC_Util::addScript('gallery', 'album_cover');
+OC_Util::addStyle('files', 'files');
+OC_Util::addScript('files_imageviewer', 'jquery.mousewheel-3.0.4.pack');
+OC_Util::addScript('files_imageviewer', 'jquery.fancybox-1.3.4.pack');
+OC_Util::addStyle( 'files_imageviewer', 'jquery.fancybox-1.3.4' );
 $l = new OC_L10N('gallery');
 ?>
 
@@ -9,10 +13,13 @@ $l = new OC_L10N('gallery');
   <div id="scan">
     <div id="scanprogressbar"></div>
     <input type="button" id="g-scan-button" value="<?php echo $l->t('Rescan');?>" onclick="javascript:scanForAlbums();" />
-  </div>
-  <div id="g-settings">
     <input type="button" id="g-settings-button" value="<?php echo $l->t('Settings');?>" onclick="javascript:settings();"/>
   </div>
+  <div id="g-album-navigation">
+    <div class="crumb last" style="background-image:url('/owncloud/core/img/breadcrumb.png')">
+      <a href="javascript:returnToElement(0);">main</a>
+    </div>
+  </div>
 </div>
 <div id="gallery_list">
 </div>