diff options
| author | rvelices <rv-github@modusoptimus.com> | 2013-09-18 16:36:27 +0000 |
|---|---|---|
| committer | rvelices <rv-github@modusoptimus.com> | 2013-09-18 16:36:27 +0000 |
| commit | fb85af3b4f30c7bb15eecc5ea7120b36405e1a87 (patch) | |
| tree | afa0a927222f7171683bac344e9b728f7914ad1a /themes | |
| parent | 45c0f9228c94bbd66077c0bad217df40929664cc (diff) | |
smartpocket retina aware thumbnails display on index page
git-svn-id: http://piwigo.org/svn/trunk@24514 68402e56-0260-453c-a942-63ccdbb3a9ee
Diffstat (limited to 'themes')
| -rw-r--r-- | themes/smartpocket/js/smartpocket.js | 24 | ||||
| -rw-r--r-- | themes/smartpocket/template/thumbnails.tpl | 2 |
2 files changed, 14 insertions, 12 deletions
diff --git a/themes/smartpocket/js/smartpocket.js b/themes/smartpocket/js/smartpocket.js index 9ee1027c4..436adf205 100644 --- a/themes/smartpocket/js/smartpocket.js +++ b/themes/smartpocket/js/smartpocket.js @@ -20,20 +20,22 @@ return '<div class="ps-toolbar-close"><div class="ps-toolbar-content"></div></di });
// onToolbarTap - listen out for when the toolbar is tapped
myPhotoSwipe.addEventHandler(PhotoSwipe.EventTypes.onToolbarTap, function(e){
- if (e.toolbarAction === PhotoSwipe.Toolbar.ToolbarAction.none){
- if (e.tapTarget === more_link || Util.DOM.isChildOf(e.tapTarget, more_link)){
- var currentImage = myPhotoSwipe.getCurrentImage();
- window.location=currentImage.metaData.picture_url;
- }
- }
-}); $(document).bind('orientationchange', set_thumbnails_width);
- set_thumbnails_width();
+ if (e.toolbarAction === PhotoSwipe.Toolbar.ToolbarAction.none){
+ if (e.tapTarget === more_link || Util.DOM.isChildOf(e.tapTarget, more_link)){
+ var currentImage = myPhotoSwipe.getCurrentImage();
+ window.location=currentImage.metaData.picture_url;
+ }
+ }
+ });
+ $(window).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+'%');
+ var dpr = window.devicePixelRatio>1 ? window.devicePixelRatio : 1
+ , nb_thumbs = Math.max(2, Math.ceil($('.thumbnails').width() / (var_thumb_width/dpr+2*5)))
+ , width = Math.floor(1000000 / nb_thumbs) / 10000;
+ $('.thumbnails li').css('width', width+'%');
}
diff --git a/themes/smartpocket/template/thumbnails.tpl b/themes/smartpocket/template/thumbnails.tpl index 36af6609f..f4e56e570 100644 --- a/themes/smartpocket/template/thumbnails.tpl +++ b/themes/smartpocket/template/thumbnails.tpl @@ -5,7 +5,7 @@ {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'}
{footer_script}
- var var_loop = {if $smartpocket.loop}true{else}false{/if}, var_autohide = {$smartpocket.autohide}, var_trad = "{'More Information'|@translate}";
+ var var_loop = {if $smartpocket.loop}true{else}false{/if}, var_autohide = {$smartpocket.autohide}, var_trad = "{'More Information'|@translate}", var_thumb_width={$thumbnail_derivative_params->max_width()};
{/footer_script}
<ul class="thumbnails">
|