feature 2928: fctorize switchBox (now js is loaded async + also apply to the calendar type links on index page)

git-svn-id: http://piwigo.org/svn/trunk@23437 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
rvelices
2013-06-22 04:44:48 +00:00
parent 6d74171c3c
commit 0b319ddd45
3 changed files with 32 additions and 31 deletions

View File

@@ -1,11 +1,23 @@
function switchBox(link, box) {
jQuery(link).click(function() {
var elt = jQuery(box);
elt.css("left", Math.min( jQuery(this).offset().left, jQuery(window).width() - elt.outerWidth(true) - 5))
.css("top", jQuery(this).offset().top + jQuery(this).outerHeight(true))
.toggle();
});
jQuery(box).on("mouseleave click", function() {
jQuery(this).hide();
});
}
(function () {
var sbFunc = function(link, box) {
jQuery(link).click(function() {
var elt = jQuery(box);
elt.css("left", Math.min( jQuery(this).offset().left, jQuery(window).width() - elt.outerWidth(true) - 5))
.css("top", jQuery(this).offset().top + jQuery(this).outerHeight(true))
.toggle();
return false;
});
jQuery(box).on("mouseleave click", function() {
jQuery(this).hide();
});
};
if (window.SwitchBox) {
for (var i=0; i<SwitchBox.length; i+=2)
sbFunc(SwitchBox[i], SwitchBox[i+1]);
}
SwitchBox = {
push: sbFunc
}
})();

View File

@@ -1,4 +1,4 @@
{combine_script id='core.switchbox' load='footer' require='jquery' path='themes/default/js/switchbox.js'}
{combine_script id='core.switchbox' load='async' require='jquery' path='themes/default/js/switchbox.js'}
{$MENUBAR}
@@ -26,7 +26,7 @@
{/if}
{/foreach}
</div>
{footer_script require='core.switchbox'}switchBox("#sortOrderLink", "#sortOrderBox");{/footer_script}
{footer_script}(SwitchBox=window.SwitchBox||[]).push("#sortOrderLink", "#sortOrderBox");{/footer_script}
{/strip}</li>
{/if}
{if !empty($image_derivatives)}
@@ -43,7 +43,7 @@
{/if}
{/foreach}
</div>
{footer_script require='core.switchbox'}switchBox("#derivativeSwitchLink", "#derivativeSwitchBox");{/footer_script}
{footer_script}(SwitchBox=window.SwitchBox||[]).push("#derivativeSwitchLink", "#derivativeSwitchBox");{/footer_script}
{/strip}</li>
{/if}
@@ -101,26 +101,15 @@
{if isset($chronology_views)}
<div class="calendarViews">{'View'|@translate}:
<a id="calendarViewSwitchLink" href="javascript:toggleCalendarViewsBox()">
<a id="calendarViewSwitchLink" href="#">
{foreach from=$chronology_views item=view}{if $view.SELECTED}{$view.CONTENT}{/if}{/foreach}
</a>
</a>
<div id="calendarViewSwitchBox" class="switchBox">
{foreach from=$chronology_views item=view name=loop}{if !$smarty.foreach.loop.first}<br>{/if}
<span{if !$view.SELECTED} style="visibility:hidden"{/if}>&#x2714; </span><a href="{$view.VALUE}">{$view.CONTENT}</a>
{/foreach}
</div>
{footer_script require='jquery'}{literal}
function toggleCalendarViewsBox() {
var elt = jQuery("#calendarViewSwitchBox")
, ePos = jQuery("#calendarViewSwitchLink");
elt.css("left", Math.min( ePos.offset().left, jQuery(window).width() - elt.outerWidth(true) - 5))
.css("top", ePos.offset().top + ePos.outerHeight(true))
.toggle();
};
jQuery("#calendarViewSwitchBox").on("mouseleave", function() {
jQuery(this).hide();
});
{/literal}{/footer_script}
{footer_script}(SwitchBox=window.SwitchBox||[]).push("#calendarViewSwitchLink", "#calendarViewSwitchBox");{/footer_script}
</div>
{/if}

View File

@@ -1,4 +1,4 @@
{combine_script id='core.switchbox' load='footer' require='jquery' path='themes/default/js/switchbox.js'}
{combine_script id='core.switchbox' load='async' require='jquery' path='themes/default/js/switchbox.js'}
{if isset($MENUBAR)}{$MENUBAR}{/if}
<div id="content"{if isset($MENUBAR)} class="contentWithMenu"{/if}>
@@ -20,7 +20,7 @@
<div class="actionButtons">
{if isset($current.unique_derivatives) && count($current.unique_derivatives)>1}
{footer_script require='jquery,core.switchbox'}{literal}
{footer_script require='jquery'}{literal}
function changeImgSrc(url,typeSave,typeMap)
{
var theImg = document.getElementById("theMainImage");
@@ -34,7 +34,7 @@ function changeImgSrc(url,typeSave,typeMap)
jQuery('#derivativeChecked'+typeSave).css('visibility','visible');
document.cookie = 'picture_deriv='+typeSave+';path={/literal}{$COOKIE_PATH}{literal}';
}
switchBox("#derivativeSwitchLink", "#derivativeSwitchBox");
(SwitchBox=window.SwitchBox||[]).push("#derivativeSwitchLink", "#derivativeSwitchBox");
{/literal}{/footer_script}
{strip}<a id="derivativeSwitchLink" title="{'Photo sizes'|@translate}" class="pwg-state-default pwg-button" rel="nofollow">
<span class="pwg-icon pwg-icon-sizes">&nbsp;</span><span class="pwg-button-text">{'Photo sizes'|@translate}</span>