From e4278574a8806b4748d132adb5f29fb61e6c6058 Mon Sep 17 00:00:00 2001 From: Stephan Bergemann Date: Tue, 12 Jun 2012 03:23:22 +0200 Subject: [PATCH 01/11] fixed sorting errors and missbehaviours - now sorting like file browser --- apps/gallery/lib/tiles.php | 39 +++++++++++++------- apps/gallery/templates/index.php | 61 ++++++++++++++++++++------------ 2 files changed, 65 insertions(+), 35 deletions(-) diff --git a/apps/gallery/lib/tiles.php b/apps/gallery/lib/tiles.php index e43c99bb76..48b54f0cf0 100644 --- a/apps/gallery/lib/tiles.php +++ b/apps/gallery/lib/tiles.php @@ -63,7 +63,7 @@ class TilesLine { $img_w = $this->tiles_array[$i]->getWidth(); $extra = ''; if ($img_w != IMAGE_WIDTH) $extra = ' style="width:'.$img_w.'px"'; - $r .= ''; + $r .= ''; } $r .= ''; @@ -122,7 +122,7 @@ class TileStack extends TileBase { $this->tiles_array = array(); $this->stack_name = $stack_name; for ($i = 0; $i < count($path_array) && $i < self::STACK_REPRESENTATIVES; $i++) { - $tile = new TileSingle($path_array[$i]); + $tile = new TileSingle($path_array[$i]); array_push($this->tiles_array, $tile); } } @@ -134,32 +134,47 @@ class TileStack extends TileBase { public function getWidth() { $max = 0; - for ($i = 0; $i < count($this->tiles_array); $i++) { - $max = max($max, $this->tiles_array[$i]->getWidth()); + if(count($this->tiles_array) == 0) { + $max = IMAGE_WIDTH; + } else { + for ($i = 0; $i < count($this->tiles_array); $i++) { + $max = max($max, $this->tiles_array[$i]->getWidth()); + } } return min(IMAGE_WIDTH, $max); } public function get() { $r = ''; - for ($i = 0; $i < count($this->tiles_array); $i++) { - $top = rand(-5, 5); - $left = rand(-5, 5); - $img_w = $this->tiles_array[$i]->getWidth(); - $extra = ''; - if ($img_w < IMAGE_WIDTH) { - $extra = 'width:'.$img_w.'px;'; + if(count($this->tiles_array) == 0) { + // aint no pictures in this folder... + $r.=''; + } else { + for ($i = 0; $i < count($this->tiles_array); $i++) { + $top = rand(-5, 5); + $left = rand(-5, 5); + $img_w = $this->tiles_array[$i]->getWidth(); + $extra = ''; + if ($img_w < IMAGE_WIDTH) { + $extra = 'width:'.$img_w.'px;'; + } + $r .= ''; } - $r .= ''; } return $r; } public function getOnHoverAction() { + if(count($this->tiles_array) == 0) { + return 'javascript:explode_empty(this);return false;'; + } return 'javascript:explode(this);return false;'; } public function getOnOutAction() { + if(count($this->tiles_array) == 0) { + return 'javascript:deplode_empty(this);return false;'; + } return 'javascript:deplode(this);return false;'; } diff --git a/apps/gallery/templates/index.php b/apps/gallery/templates/index.php index f992604549..930f80238b 100644 --- a/apps/gallery/templates/index.php +++ b/apps/gallery/templates/index.php @@ -16,6 +16,14 @@ div.visible { opacity: 0.8;} var root = ""; +function explode_empty(element) { + $('div', element).each(function(index, elem) { + if ($(elem).hasClass('title')) { + $(elem).addClass('visible'); + } + }); +} + function explode(element) { $('div', element).each(function(index, elem) { if ($(elem).hasClass('title')) { @@ -28,6 +36,14 @@ function explode(element) { }); } +function deplode_empty(element) { + $('div', element).each(function(index, elem) { + if ($(elem).hasClass('title')) { + $(elem).removeClass('visible'); + } + }); +} + function deplode(element) { $('div', element).each(function(index, elem) { if ($(elem).hasClass('title')) { @@ -79,41 +95,40 @@ $root = empty($_GET['root'])?'/':$_GET['root']; $images = \OC_FileCache::searchByMime('image', null, '/'.\OCP\USER::getUser().'/files'.$root); sort($images); -$arr = array(); $tl = new \OC\Pictures\TilesLine(); $ts = new \OC\Pictures\TileStack(array(), ''); $previous_element = @$images[0]; + +$root_images = array(); +$second_level_images = array(); + for($i = 0; $i < count($images); $i++) { $prev_dir_arr = explode('/', $previous_element); $dir_arr = explode('/', $images[$i]); - if (count($dir_arr)==1) { - $tl->addTile(new \OC\Pictures\TileSingle($root.$images[$i])); - continue; + if(count($dir_arr) == 1) { // getting the images in this directory + $root_images[] = $root.$images[$i]; + } else { + if (count($dir_arr) == 2) { // These are the pics in that subdir + $second_level_images[] = $root.$images[$i]; + } + if(strcmp($prev_dir_arr[0], $dir_arr[0]) != 0) { + $tl->addTile(new \OC\Pictures\TileStack($second_level_images, $prev_dir_arr[0])); + $second_level_images = array(); + } + // have us a little something to compare against + $previous_element = $images[$i]; } - if (strcmp($prev_dir_arr[0], $dir_arr[0])!=0) { - $tl->addTile(new \OC\Pictures\TileStack($arr, $prev_dir_arr[0])); - $arr = array(); - } - $arr[] = $root.$images[$i]; - $previous_element = $images[$i]; } -$dir_arr = explode('/', $previous_element); - -if (count($images)>1) { - if (count($dir_arr)==0) { - $tl->addTile(new \OC\Pictures\TileSingle($previous_element)); - } else if (count($dir_arr) && $ts->getCount() == 0){ - $ts = new \OC\Pictures\TileStack(array($root.$previous_element), $dir_arr[0]); - } else { - $arr[] = $previous_element; - $ts->addTile($arr); - } +// if last element in the directory was a directory we don't want to miss it :) +if(count($second_level_images)>0) { + $tl->addTile(new \OC\Pictures\TileStack($second_level_images, $prev_dir_arr[0])); } -if ($ts->getCount() != 0) { - $tl->addTile($ts); +// and finally our images actually stored in the root folder +for($i = 0; $iaddTile(new \OC\Pictures\TileSingle($root_images[$i])); } echo $tl->get(); From 4711c2bb412749100fa53d8e1684154b87846092 Mon Sep 17 00:00:00 2001 From: Stephan Bergemann Date: Tue, 12 Jun 2012 13:05:25 +0200 Subject: [PATCH 02/11] fixed second_level_images issue --- apps/gallery/templates/index.php | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/apps/gallery/templates/index.php b/apps/gallery/templates/index.php index 930f80238b..5a9aba9ea0 100644 --- a/apps/gallery/templates/index.php +++ b/apps/gallery/templates/index.php @@ -109,12 +109,11 @@ for($i = 0; $i < count($images); $i++) { if(count($dir_arr) == 1) { // getting the images in this directory $root_images[] = $root.$images[$i]; } else { - if (count($dir_arr) == 2) { // These are the pics in that subdir - $second_level_images[] = $root.$images[$i]; - } if(strcmp($prev_dir_arr[0], $dir_arr[0]) != 0) { $tl->addTile(new \OC\Pictures\TileStack($second_level_images, $prev_dir_arr[0])); $second_level_images = array(); + } else if (count($dir_arr) == 2) { // These are the pics in that subdir + $second_level_images[] = $root.$images[$i]; } // have us a little something to compare against $previous_element = $images[$i]; From e99a95a756b15028b11871c3c7350066f2751964 Mon Sep 17 00:00:00 2001 From: Stephan Bergemann Date: Tue, 12 Jun 2012 14:06:56 +0200 Subject: [PATCH 03/11] now also working for directories only containing one image --- apps/gallery/templates/index.php | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/apps/gallery/templates/index.php b/apps/gallery/templates/index.php index 5a9aba9ea0..5cff2c65a0 100644 --- a/apps/gallery/templates/index.php +++ b/apps/gallery/templates/index.php @@ -112,7 +112,8 @@ for($i = 0; $i < count($images); $i++) { if(strcmp($prev_dir_arr[0], $dir_arr[0]) != 0) { $tl->addTile(new \OC\Pictures\TileStack($second_level_images, $prev_dir_arr[0])); $second_level_images = array(); - } else if (count($dir_arr) == 2) { // These are the pics in that subdir + } + if (count($dir_arr) == 2) { // These are the pics in that subdir $second_level_images[] = $root.$images[$i]; } // have us a little something to compare against From 9f59cc5eb0069f28fc17eebc2adb3a62a13f95bd Mon Sep 17 00:00:00 2001 From: Stephan Bergemann Date: Tue, 12 Jun 2012 14:38:12 +0200 Subject: [PATCH 04/11] improved look of directories not containing images directly --- apps/gallery/lib/tiles.php | 4 ++-- apps/gallery/templates/index.php | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/gallery/lib/tiles.php b/apps/gallery/lib/tiles.php index 48b54f0cf0..817939759d 100644 --- a/apps/gallery/lib/tiles.php +++ b/apps/gallery/lib/tiles.php @@ -63,7 +63,7 @@ class TilesLine { $img_w = $this->tiles_array[$i]->getWidth(); $extra = ''; if ($img_w != IMAGE_WIDTH) $extra = ' style="width:'.$img_w.'px"'; - $r .= ''; + $r .= ''; } $r .= ''; @@ -148,7 +148,7 @@ class TileStack extends TileBase { $r = ''; if(count($this->tiles_array) == 0) { // aint no pictures in this folder... - $r.=''; + $r.=''; } else { for ($i = 0; $i < count($this->tiles_array); $i++) { $top = rand(-5, 5); diff --git a/apps/gallery/templates/index.php b/apps/gallery/templates/index.php index 5cff2c65a0..42ef9f6587 100644 --- a/apps/gallery/templates/index.php +++ b/apps/gallery/templates/index.php @@ -9,7 +9,7 @@ div.miniature_border {position:absolute; height: 150px; -moz-transition-duration div.line {display:inline-block; border: 0; width: auto; height: 160px} div.gallery_div img{position:absolute; top: 1; left: 0; -moz-transition-duration: 0.3s; -o-transition-duration:0.3s; -webkit-transition-duration: 0.3s; height:150px; width: auto;} div.gallery_div img.shrinker {width:80px !important;} -div.title { opacity: 0; text-align: center; vertical-align: middle; font-family: Arial; font-size: 12px; border: 0; position: absolute; text-overflow: ellipsis; bottom: 20px; left:5px; height:auto; padding: 5px; width: 140px; background-color: black; color: white; -webkit-transition: opacity 0.5s; z-index:1000; border-radius: 7px} +div.title { opacity: 0; text-align: center; vertical-align: middle; font-family: Arial; font-size: 12px; border: 0; position: absolute; text-overflow: ellipsis; bottom: 20px; right:-5px; height:auto; padding: 5px; width: 140px; background-color: black; color: white; -webkit-transition: opacity 0.5s; z-index:1000; border-radius: 7px} div.visible { opacity: 0.8;}