new: MOD subcatify integrated. On main page, thumbnails representing a

category are not displayed the same way as thumbnails representing a
picture. Feedback welcomed on this feature.


git-svn-id: http://piwigo.org/svn/trunk@1130 68402e56-0260-453c-a942-63ccdbb3a9ee

4 files changed, 113 insertions, 60 deletions

diff --git a/include/category_recent_cats.inc.php b/include/category_recent_cats.inc.php
index a0510db25..b3d86ed91 100644
--- a/include/category_recent_cats.inc.php
+++ b/include/category_recent_cats.inc.php
@@ -31,15 +31,26 @@
  *
  */
 
+// FIXME: categories having no representant
+// ($conf['allow_random_representative'] = true) are not displayed :-/
+
 // retrieving categories recently update, ie containing pictures added
 // recently. The calculated table field categories.date_last will be
 // easier to use
 $query = '
-SELECT c.id AS category_id,uppercats,representative_picture_id,path,file,tn_ext
-  FROM '.CATEGORIES_TABLE.' AS c INNER JOIN '.IMAGES_TABLE.' AS i
-    ON i.id = c.representative_picture_id
-  WHERE date_last > SUBDATE(CURRENT_DATE
-                            ,INTERVAL '.$user['recent_period'].' DAY)';
+SELECT c.id AS category_id
+       , uppercats
+       , representative_picture_id
+       , path
+       , file
+       , c.comment
+       , tn_ext
+       , nb_images
+  FROM '.CATEGORIES_TABLE.' AS c
+    INNER JOIN '.IMAGES_TABLE.' AS i ON i.id = c.representative_picture_id
+  WHERE date_last > SUBDATE(
+    CURRENT_DATE,INTERVAL '.$user['recent_period'].' DAY
+  )';
 if ( $user['forbidden_categories'] != '' )
 {
   $query.= '
@@ -52,47 +63,29 @@ $result = pwg_query( $query );
 // template thumbnail initialization
 if (mysql_num_rows($result) > 0)
 {
-  $template->assign_block_vars('thumbnails', array());
-  // first line
-  $template->assign_block_vars('thumbnails.line', array());
-  // current row displayed
-  $row_number = 0;
+  $template->assign_block_vars('categories', array());
 }
 
-$old_level_separator = $conf['level_separator'];
-$conf['level_separator'] = '<br />';
 // for each category, we have to search a recent picture to display and
 // the name to display
 while ( $row = mysql_fetch_array( $result ) )
 {
   $template->assign_block_vars(
-    'thumbnails.line.thumbnail',
+    'categories.category',
     array(
-      'IMAGE'       => get_thumbnail_src($row['path'], @$row['tn_ext']),
-      'IMAGE_ALT'   => $row['file'],
-      'IMAGE_TITLE' => $lang['hint_category'],
+      'SRC'       => get_thumbnail_src($row['path'], @$row['tn_ext']),
+      'ALT'   => $row['file'],
+      'TITLE' => $lang['hint_category'],
 
-      'U_IMG_LINK'  => make_index_url(
+      'URL'  => make_index_url(
         array(
           'category' => $row['category_id'],
           )
         ),
-      )
-    );
-
-  $template->assign_block_vars(
-    'thumbnails.line.thumbnail.category_name',
-    array(
       'NAME' => get_cat_display_name_cache($row['uppercats'], null, false),
+      'NB_IMAGES' => $row['nb_images'],
+      'DESCRIPTION' => @$row['comment'],
       )
     );
-
-  // create a new line ?
-  if (++$row_number == $user['nb_image_line'])
-  {
-    $template->assign_block_vars('thumbnails.line', array());
-    $row_number = 0;
-  }
 }
-$conf['level_separator'] = $old_level_separator;
 ?>
\ No newline at end of file
diff --git a/include/category_subcats.inc.php b/include/category_subcats.inc.php
index 3b27dcd22..57fe73cec 100644
--- a/include/category_subcats.inc.php
+++ b/include/category_subcats.inc.php
@@ -32,7 +32,7 @@
  */
 
 $query = '
-SELECT id, name, date_last, representative_picture_id
+SELECT id, name, date_last, representative_picture_id, comment, nb_images
   FROM '.CATEGORIES_TABLE.'
   WHERE id_uppercat '.
   (!isset($page['category']) ? 'is NULL' : '= '.$page['category']).'
@@ -98,7 +98,9 @@ SELECT representative_picture_id
         'category' => $row['id'],
         'picture' => $image_id,
         'name' => $row['name'],
-        'date_last' => @$row['date_last']
+        'date_last' => @$row['date_last'],
+        'comment' => @$row['comment'],
+        'nb_images' => $row['nb_images'],
         )
       );
   }
@@ -126,44 +128,28 @@ SELECT id, path, tn_ext
     $images[$row['id']] = get_thumbnail_src($row['path'], @$row['tn_ext']);
   }
 
-  $template->assign_block_vars('thumbnails', array());
-  // first line
-  $template->assign_block_vars('thumbnails.line', array());
-  // current row displayed
-  $row_number = 0;
+  $template->assign_block_vars('categories', array());
   
   foreach ($cat_thumbnails as $item)
   {
     $template->assign_block_vars(
-      'thumbnails.line.thumbnail',
+      'categories.category',
       array(
-        'IMAGE'       => $images[$item['picture']],
-        'IMAGE_ALT'   => $item['name'],
-        'IMAGE_TITLE' => $lang['hint_category'],
-        'IMAGE_TS'    => get_icon(@$item['date_last']),
+        'SRC'   => $images[$item['picture']],
+        'ALT'   => $item['name'],
+        'TITLE' => $lang['hint_category'],
+        'ICON'  => get_icon(@$item['date_last']),
         
-        'U_IMG_LINK'  => make_index_url(
+        'URL' => make_index_url(
           array(
             'category' => $item['category'],
             )
           ),
-        'CLASS'       => 'thumbCat',
+        'NAME' => $item['name'],
+        'NB_IMAGES' => $item['nb_images'],
+        'DESCRIPTION' => @$item['comment'],
         )
       );
-    
-    $template->assign_block_vars(
-      'thumbnails.line.thumbnail.category_name',
-      array(
-        'NAME' => $item['name']
-        )
-      );
-    
-    // create a new line ?
-    if (++$row_number == $user['nb_image_line'])
-    {
-      $template->assign_block_vars('thumbnails.line', array());
-      $row_number = 0;
-    }
   }
 }
 ?>
diff --git a/template/yoga/content.css b/template/yoga/content.css
index 56599ec93..9fc3f996d 100644
--- a/template/yoga/content.css
+++ b/template/yoga/content.css
@@ -259,3 +259,49 @@ DIV.calImg {
   text-align: left;
   vertical-align: top;
 }
+
+/* Category thumbnails on main page, CSS code inspired from MOD subcatify */
+#content UL.thumbnailCategories {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  text-align: center;
+}
+
+#content UL.thumbnailCategories LI {
+  width: 49.9%; /* 49.9% for 2 per line, 33.3% for 3 per line*/
+  margin:0;
+  padding:0;
+  float:left;
+}
+
+#content DIV.thumbnailCategory {
+  display:block;
+  border: 1px solid #aaa;
+  padding: 5px 0px 0px 4px;
+  margin: 5px;
+}
+
+#content DIV.thumbnailCategory DIV.description {
+  font-size: 90%;
+}
+
+#content DIV.thumbnailCategory DIV.description H3 {
+  text-align: left;
+  background: #eee;
+  margin: 0;
+  padding: 0.1em;
+  font-size: 120%;
+}
+
+#content DIV.thumbnailCategory DIV.description P {
+  margin: 0;
+}
+
+#content DIV.thumbnailCategory DIV.illustration {
+  text-align: left;
+  padding: 2px;
+  float: left;
+  width: 110px;   /* sorry, this is a very personal value :-( */
+  height: 110px;
+}
diff --git a/template/yoga/index.tpl b/template/yoga/index.tpl
index 494d2059b..e56ceaa97 100644
--- a/template/yoga/index.tpl
+++ b/template/yoga/index.tpl
@@ -176,7 +176,7 @@
 </h2>
   <!-- END calendar -->
 
-  </div> <!-- content -->
+  </div> <!-- titrePage -->
 
 <!-- BEGIN calendar -->
 <!-- BEGIN navbar -->
@@ -231,6 +231,34 @@
 </ul>
 <!-- END thumbnails -->
 
+<!-- BEGIN categories -->
+<ul class="thumbnailCategories">
+  <!-- BEGIN category -->
+  <li>
+    <div class="thumbnailCategory">
+      <div class="illustration">
+        <a href="{categories.category.URL}">
+          <img src="{categories.category.SRC}"
+               alt="{categories.category.ALT}"
+             title="{categories.category.TITLE}">
+        </a>
+      </div>
+      <div class="description">
+        <h3>
+          {categories.category.ICON}
+          <a href="{categories.category.URL}">{categories.category.NAME}</a>
+        </h3>
+        <p>{categories.category.NB_IMAGES} {lang:pictures}</p>
+        <p>{categories.category.DESCRIPTION}</p>
+      </div>
+      <hr class="separation" />
+    </div>
+  </li>
+  <!-- END category -->
+</ul>
+<hr class="separation" />
+<!-- END categories -->
+
 <!-- BEGIN cat_infos -->
 <!-- BEGIN navigation -->
 <div class="navigationBar">