feature:2269 add preview box on batch_manager_unit + add colorbox jqu…

…ery plugin git-svn-id: http://piwigo.org/svn/trunk@10648 68402e56-0260-453c-a942-63ccdbb3a9ee
Piwigo · Apr 27, 2011 · 7f1d691 · 7f1d691
1 parent e96fee5
commit 7f1d691
Show file tree

Hide file tree

Showing 9 changed files with 51 additions and 3 deletions.
diff --git a/admin/batch_manager_unit.php b/admin/batch_manager_unit.php
@@ -263,6 +263,7 @@
       array(
         'ID' => $row['id'],
         'TN_SRC' => $src,
+        'FILE_SRC' => $row['path'],
         'LEGEND' => !empty($row['name']) ?
             $row['name'] : get_name_from_file($row['file']),
         'U_EDIT' =>

diff --git a/admin/themes/default/template/batch_manager_unit.tpl b/admin/themes/default/template/batch_manager_unit.tpl
@@ -1,6 +1,6 @@
-
 {include file='include/autosize.inc.tpl'}
 {include file='include/datepicker.inc.tpl'}
+{include file='include/colorbox.inc.tpl'}
 
 {combine_script id='jquery.fcbkcomplete' load='async' require='jquery' path='themes/default/js/plugins/jquery.fcbkcomplete.js'}
 {footer_script require='jquery.fcbkcomplete'}
@@ -25,6 +25,8 @@ jQuery(document).ready(function() {
 		maxitems: 100,
 		newel: true
 	});
+
+  $("a.preview-box").colorbox();
 });
 {/literal}{/footer_script}
 
@@ -50,7 +52,11 @@ jQuery(document).ready(function() {
 <fieldset class="elementEdit">
   <legend>{$element.LEGEND}</legend>
 
-  <a href="{$element.U_EDIT}"><img src="{$element.TN_SRC}" alt="" title="{'Edit photo information'|@translate}"></a>
+  <span class="thumb">
+    <a href="{$element.FILE_SRC}" class="preview-box" title="{$element.LEGEND}"><img src="{$element.TN_SRC}" alt=""></a>
+    <br/>
+    <a href="{$element.U_EDIT}">{'Informations'|@translate}</a>
+  </span>
 
   <table>
 

diff --git a/admin/themes/default/template/include/colorbox.inc.tpl b/admin/themes/default/template/include/colorbox.inc.tpl
@@ -0,0 +1,2 @@
+{combine_script id='jquery.colorbox' require='jquery' path='themes/default/js/plugins/jquery.colorbox.min.js'}
+{combine_css path="themes/default/js/plugins/jquery.colorbox.css"}
diff --git a/admin/themes/default/theme.css b/admin/themes/default/theme.css
@@ -215,9 +215,10 @@ LI.menuLi {
 
 FORM#catModify TABLE { width: auto; }
 
-FIELDSET.elementEdit A {
+FIELDSET.elementEdit .thumb {
 	display: block;
 	float: right;
+	text-align: center;
 }
 
 TABLE.doubleSelect {

diff --git a/themes/default/images/colorbox-controls.png b/themes/default/images/colorbox-controls.png
diff --git a/themes/default/images/colorbox-loading.gif b/themes/default/images/colorbox-loading.gif
diff --git a/themes/default/js/plugins/jquery.colorbox.css b/themes/default/js/plugins/jquery.colorbox.css
@@ -0,0 +1,32 @@
+/* ColorBox Core Style */
+#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
+#cboxOverlay{position:fixed; width:100%; height:100%;}
+#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
+#cboxContent{position:relative;}
+#cboxLoadedContent{overflow:auto;}
+#cboxTitle{margin:0;}
+#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
+#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
+.cboxPhoto{float:left; margin:auto; border:0; display:block;}
+.cboxIframe{width:100%; height:100%; display:block; border:0;}
+
+/* User Style */
+#cboxWrapper{border-radius:10px; -moz-border-radius:10px: -webkit-border-radius:10px; background:#fff;}
+#cboxOverlay{background:#000;}
+#colorbox{}
+    #cboxTopLeft, #cboxTopRight, #cboxBottomLeft, #cboxBottomRight{width:11px; height:11px;}
+    #cboxMiddleLeft, #cboxMiddleRight{width:11px;}
+    #cboxTopCenter, #cboxBottomCenter{height:11px;} 
+    #cboxContent{background:#fff; overflow:hidden;}
+        #cboxError{padding:50px; colorbox-border:1px solid #ccc;}
+        #cboxLoadedContent{margin-bottom:28px;}
+        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#666;}
+        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
+        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
+        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(../../images/colorbox-controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
+        #cboxPrevious.hover{background-position:-50px -25px;}
+        #cboxNext{position:absolute; bottom:0; left:27px; background:url(../../images/colorbox-controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
+        #cboxNext.hover{background-position:-25px -25px;}
+        #cboxLoadingGraphic{background:url(../../images/colorbox-loading.gif) no-repeat center center;}
+        #cboxClose{position:absolute; bottom:0; right:0; background:url(../../images/colorbox-controls.png) no-repeat 0 0; width:25px; height:25px; text-indent:-9999px;}
+        #cboxClose.hover{background-position:0 -25px;}
diff --git a/themes/default/js/plugins/jquery.colorbox.min.js b/themes/default/js/plugins/jquery.colorbox.min.js
diff --git a/themes/default/template/include/colorbox.inc.tpl b/themes/default/template/include/colorbox.inc.tpl
@@ -0,0 +1,2 @@
+{combine_script id='jquery.colorbox' load='async' require='jquery' path='themes/default/js/plugins/jquery.colorbox.min.js'}
+{combine_css path="themes/default/js/plugins/jquery.colorbox.css"}