mirrors/Piwigo
1
0
Fork 0
mirror of https://github.com/Piwigo/Piwigo.git synced 2025-04-27 11:49:56 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Multisize and mobile theme.

Browse source 
Use ajax loader for thumbnails in mobile theme.
Use standard square parameters for mobile theme.
Change square parameters to 120px.

git-svn-id: http://piwigo.org/svn/trunk@13472 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
patdenice 2012-03-03 18:09:10 +00:00
parent 5464e7b697
commit db7e67ae20
5 changed files with 33 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

2
include/derivative_std_params.inc.php
View file

@ -160,7 +160,7 @@ final class ImageStdParams
private static function make_default()
{
self::$watermark = new WatermarkParams();
self::$type_map[IMG_SQUARE] = new DerivativeParams( SizingParams::square(100,100) );
self::$type_map[IMG_SQUARE] = new DerivativeParams( SizingParams::square(120,120) );
self::$type_map[IMG_THUMB] = new DerivativeParams( SizingParams::classic(144,144) );
self::$type_map[IMG_SMALL] = new DerivativeParams( SizingParams::classic(240,240) );
self::$type_map[IMG_MEDIUM] = new DerivativeParams( SizingParams::classic(432,432) );

4
include/page_tail.php
View file

@ -66,11 +66,11 @@ if ($conf['show_gt'])
$template->assign('debug', $debug_vars );
//------------------------------------------------------------- mobile version
if ( !empty($conf['mobile_theme']) && get_device() != 'desktop')
if ( !empty($conf['mobile_theme']) && (get_device() != 'desktop' || mobile_theme()))
{
$template->assign('TOGGLE_MOBILE_THEME_URL',
add_url_params(
make_index_url(),
duplicate_index_url(),
array('mobile' => mobile_theme() ? 'false' : 'true')
)
);

17
themes/smartpocket/js/smartpocket.js Normal file
View file

@ -0,0 +1,17 @@
(function(window, $, PhotoSwipe){
$(document).ready(function(){
var options = {
jQueryMobile: true,
imageScaleMethod: "fitNoUpscale"
};
$(".thumbnails a").photoSwipe(options);
$(document).bind('orientationchange', set_thumbnails_width);
set_thumbnails_width();
});
}(window, window.jQuery, window.Code.PhotoSwipe));
function set_thumbnails_width() {
nb_thumbs = Math.max(3, Math.ceil($('.thumbnails').width() / 130));
width = Math.floor(1000000 / nb_thumbs) / 10000;
$('.thumbnails li').css('width', width+'%');
}

4
themes/smartpocket/template/mainpage_categories.tpl
View file

@ -1,10 +1,10 @@
{define_derivative name='derivative_params' width=120 height=120 crop=true}
{define_derivative name='derivative_params_square' type='square'}
<ul data-role="listview" data-inset="true">
{foreach from=$category_thumbnails item=cat}
<li>
<a href="{$cat.URL}">
<img src="{$pwg->derivative_url($derivative_params, $cat.representative.src_image)}">
<img src="{$pwg->derivative_url($derivative_params_square, $cat.representative.src_image)}">
<h3>{$cat.NAME}</h3>
<p class="Nb_images">{$cat.CAPTION_NB_IMAGES}</p>
</a>

38
themes/smartpocket/template/thumbnails.tpl
View file

@ -1,41 +1,25 @@
{if !empty($thumbnails)}
{combine_script id='klass' path='themes/smartpocket/js/klass.min.js'}
{combine_script id='photoswipe' path='themes/smartpocket/js/code.photoswipe.jquery.min.js' require='klass,jquery.mobile'}
{combine_script id='smartpocket' path='themes/smartpocket/js/smartpocket.js' require='photoswipe'}
{combine_script id='jquery.ajaxmanager' path='themes/default/js/plugins/jquery.ajaxmanager.js' load='footer'}
{combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='footer'}
{define_derivative name='derivative_params_thumb' width=120 height=120 crop=true}
{define_derivative name='derivative_params_full' type='large'}
{define_derivative name='derivative_params_square' type='square'}
{define_derivative name='derivative_params_large' type='large'}
{footer_script}{literal}
(function(window, $, PhotoSwipe){
$(document).ready(function(){
var options = {
jQueryMobile: true,
imageScaleMethod: "fitNoUpscale"
};
$(".thumbnails a").photoSwipe(options);
$(document).bind('orientationchange', set_thumbnails_width);
set_thumbnails_width();
});
}(window, window.jQuery, window.Code.PhotoSwipe));
function set_thumbnails_width() {
nb_thumbs = Math.max(3, Math.ceil($('.thumbnails').width() / 130));
width = Math.floor(1000000 / nb_thumbs) / 10000;
$('.thumbnails li').css('width', width+'%');
}
{/literal}{/footer_script}
<ul class="thumbnails">
{foreach from=$thumbnails item=thumbnail}{strip}
{assign var=derivative value=$pwg->derivative($derivative_params_square, $thumbnail.src_image)}
{if isset($page_selection[$thumbnail.id])}
<li>
<a href="{$pwg->derivative_url($derivative_params_full, $thumbnail.src_image)}" rel="external">
<img src="{$pwg->derivative_url($derivative_params_thumb, $thumbnail.src_image)}" alt="{$thumbnail.TN_ALT}">
<li>
<a href="{$pwg->derivative_url($derivative_params_large, $thumbnail.src_image)}" rel="external">
<img {if !$derivative->is_cached()}data-{/if}src="{$derivative->get_url()}" alt="{$thumbnail.TN_ALT}">
</a>
</li>
{else}
<li style="display:none;">
<a href="{$pwg->derivative_url($derivative_params_full, $thumbnail.src_image)}" rel="external"></a>
<li style="display:none;">
<a href="{$pwg->derivative_url($derivative_params_large, $thumbnail.src_image)}" rel="external"></a>
</li>
{/if}
{/strip}{/foreach}