feature:2230
the size of the squared thumbnails depend of the sizes of all the thumbnails : the clipping is an average of the clipping of each of the thumbnails git-svn-id: http://piwigo.org/svn/trunk@9864 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
parent
565d68a66e
commit
692abe1650
4 changed files with 36 additions and 18 deletions
|
|
@ -209,31 +209,44 @@ $result = pwg_query($query);
|
|||
|
||||
// template thumbnail initialization
|
||||
$current_rank = 1;
|
||||
|
||||
$thumbnail_info=array();
|
||||
$clipping=array();
|
||||
while ($row = pwg_db_fetch_assoc($result))
|
||||
{
|
||||
$src = get_thumbnail_url($row);
|
||||
|
||||
list($thumbnail_width, $thumbnail_height) = getimagesize($src);
|
||||
$thumbnail_x_center = $thumbnail_width/2;
|
||||
$thumbnail_y_center = $thumbnail_height/2;
|
||||
|
||||
$template->append(
|
||||
'thumbnails',
|
||||
array(
|
||||
'ID' => $row['id'],
|
||||
'TN_SRC' => $src,
|
||||
'RANK' => $current_rank * 10,
|
||||
'CLIP_TOP' => round($thumbnail_y_center - 96/2),
|
||||
'CLIP_RIGHT' => round($thumbnail_x_center + 96/2),
|
||||
'CLIP_BOTTOM' => round($thumbnail_y_center + 96/2),
|
||||
'CLIP_LEFT' => round($thumbnail_x_center - 96/2)
|
||||
)
|
||||
$thumbnail_size = getimagesize($src);
|
||||
$thumbnail_info[] = array(
|
||||
'width' => $thumbnail_size[0],
|
||||
'height' => $thumbnail_size[1],
|
||||
'id' => $row['id'],
|
||||
'tn_src' => $src,
|
||||
'rank' => $current_rank * 10,
|
||||
);
|
||||
$clipping[]= min($thumbnail_size[0]*0.75,$thumbnail_size[1]*0.75);
|
||||
|
||||
$current_rank++;
|
||||
}
|
||||
|
||||
$clipping=array_sum($clipping)/count($clipping);
|
||||
foreach ($thumbnail_info as $thumbnails_info)
|
||||
{
|
||||
$thumbnail_x_center = $thumbnails_info['width']/2;
|
||||
$thumbnail_y_center = $thumbnails_info['height']/2;
|
||||
$template->append(
|
||||
'thumbnails',
|
||||
array(
|
||||
'ID' => $thumbnails_info['id'],
|
||||
'TN_SRC' => $thumbnails_info['tn_src'],
|
||||
'RANK' => $thumbnails_info['rank'],
|
||||
'CLIPING' => round($clipping),
|
||||
'CLIPING_li' => round($clipping+8),
|
||||
'CLIP_TOP' => round($thumbnail_y_center - $clipping/2),
|
||||
'CLIP_RIGHT' => round($thumbnail_x_center + $clipping/2),
|
||||
'CLIP_BOTTOM' => round($thumbnail_y_center + $clipping/2),
|
||||
'CLIP_LEFT' => round($thumbnail_x_center - $clipping/2)
|
||||
)
|
||||
);
|
||||
}
|
||||
// image order management
|
||||
$sort_fields = array(
|
||||
'' => '',
|
||||
|
|
|
|||
|
|
@ -2,3 +2,7 @@
|
|||
#the_page { min-height:100%; position:relative; padding:0; margin:0; }
|
||||
#menubar { margin: 0; }
|
||||
#footer { left: 0; }
|
||||
|
||||
UL.thumbnails li.rank-of-image {
|
||||
text-align:left;
|
||||
}
|
||||
|
|
@ -43,8 +43,8 @@ jQuery(document).ready(function() {
|
|||
<p>{'Drag to re-order'|@translate}</p>
|
||||
<ul class="thumbnails">
|
||||
{foreach from=$thumbnails item=thumbnail}
|
||||
<li class="rank-of-image">
|
||||
<div class="clipwrapper">
|
||||
<li class="rank-of-image" style="width:{$thumbnail.CLIPING_li}px; height:{$thumbnail.CLIPING_li}px; ">
|
||||
<div class="clipwrapper" style="width:{$thumbnail.CLIPING}px; height:{$thumbnail.CLIPING}px; ">
|
||||
<div class="clip" style="clip:rect({$thumbnail.CLIP_TOP}px {$thumbnail.CLIP_RIGHT}px {$thumbnail.CLIP_BOTTOM}px {$thumbnail.CLIP_LEFT}px);top:-{$thumbnail.CLIP_TOP}px;left:-{$thumbnail.CLIP_LEFT}px">
|
||||
<img src="{$thumbnail.TN_SRC}" class="thumbnail" alt="">
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -54,6 +54,7 @@ UL.thumbnails li.rank-of-image img {
|
|||
position:relative;
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
margin: 3px;
|
||||
}
|
||||
.clip {
|
||||
position:absolute;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue