aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorflop25 <flop25@piwigo.org>2014-01-25 23:12:34 +0000
committerflop25 <flop25@piwigo.org>2014-01-25 23:12:34 +0000
commit948adde84006257791e5e7239c2c159eeac0d872 (patch)
tree3991e82b9d38e3a42b7d2390a76e836dbf805a1d
parented9bdd861baf6f4e6c6b9df39e70591e26b7b3ad (diff)
bug:2700 implementation of jBreadCrumb
comments appreciated on the bugtracker git-svn-id: http://piwigo.org/svn/trunk@26971 68402e56-0260-453c-a942-63ccdbb3a9ee
Diffstat (limited to '')
-rw-r--r--themes/elegant/js/jquery.jBreadCrumb.js206
-rw-r--r--themes/elegant/local_head.tpl15
-rw-r--r--themes/elegant/theme.css83
-rw-r--r--themes/elegant/themeconf.inc.php7
4 files changed, 309 insertions, 2 deletions
diff --git a/themes/elegant/js/jquery.jBreadCrumb.js b/themes/elegant/js/jquery.jBreadCrumb.js
new file mode 100644
index 000000000..bb722868e
--- /dev/null
+++ b/themes/elegant/js/jquery.jBreadCrumb.js
@@ -0,0 +1,206 @@
+/**
+ * @author Jason Roy for CompareNetworks Inc.
+ * Thanks to mikejbond for suggested udaptes
+ *
+ * Version 1.1
+ * Copyright (c) 2009 CompareNetworks Inc.
+ *
+ * Licensed under the MIT license:
+ * http://www.opensource.org/licenses/mit-license.php
+ *
+ */
+(function($)
+{
+
+ // Private variables
+
+ var _options = {};
+ var _container = {};
+ var _breadCrumbElements = {};
+ var _autoIntervalArray = [];
+ var _easingEquation;
+
+ // Public functions
+
+ jQuery.fn.jBreadCrumb = function(options)
+ {
+ _options = $.extend({}, $.fn.jBreadCrumb.defaults, options);
+
+ return this.each(function()
+ {
+ _container = $(this);
+ setupBreadCrumb();
+ });
+
+ };
+
+ // Private functions
+
+ function setupBreadCrumb()
+ {
+ //Check if easing plugin exists. If it doesn't, use "swing"
+ if(typeof(jQuery.easing) == 'object')
+ {
+ _easingEquation = 'easeOutQuad'
+ }
+ else
+ {
+ _easingEquation = 'swing'
+ }
+
+ //The reference object containing all of the breadcrumb elements
+ _breadCrumbElements = jQuery(_container).find('li');
+
+ //Keep it from overflowing in ie6 & 7
+ jQuery(_container).find('ul').wrap('<div style="overflow:hidden; position:relative; width: ' + jQuery(_container).css("width") + ';"><div>');
+ //Set an arbitrary width width to avoid float drop on the animation
+ jQuery(_container).find('ul').width(5000);
+
+ //If the breadcrumb contains nothing, don't do anything
+ if (_breadCrumbElements.length > 0)
+ {
+ jQuery(_breadCrumbElements[_breadCrumbElements.length - 1]).addClass('last');
+ jQuery(_breadCrumbElements[0]).addClass('first');
+
+ //If the breadcrumb object length is long enough, compress.
+
+ if (_breadCrumbElements.length > _options.minimumCompressionElements)
+ {
+ compressBreadCrumb();
+ };
+ };
+ };
+
+ function compressBreadCrumb()
+ {
+
+ // Factor to determine if we should compress the element at all
+ var finalElement = jQuery(_breadCrumbElements[_breadCrumbElements.length - 1]);
+
+
+ // If the final element is really long, compress more elements
+ if (jQuery(finalElement).width() > _options.maxFinalElementLength)
+ {
+ if (_options.beginingElementsToLeaveOpen > 0)
+ {
+ _options.beginingElementsToLeaveOpen--;
+
+ }
+ if (_options.endElementsToLeaveOpen > 0)
+ {
+ _options.endElementsToLeaveOpen--;
+ }
+ }
+ // If the final element is within the short and long range, compress to the default end elements and 1 less beginning elements
+ if (jQuery(finalElement).width() < _options.maxFinalElementLength && jQuery(finalElement).width() > _options.minFinalElementLength)
+ {
+ if (_options.beginingElementsToLeaveOpen > 0)
+ {
+ _options.beginingElementsToLeaveOpen--;
+
+ }
+ }
+
+ var itemsToRemove = _breadCrumbElements.length - 1 - _options.endElementsToLeaveOpen;
+
+ // We compress only elements determined by the formula setting below
+
+ //TODO : Make this smarter, it's only checking the final elements length. It could also check the amount of elements.
+ jQuery(_breadCrumbElements[_breadCrumbElements.length - 1]).css(
+ {
+ background: 'none'
+ });
+
+ $(_breadCrumbElements).each(function(i, listElement)
+ {
+ if (i > _options.beginingElementsToLeaveOpen && i < itemsToRemove)
+ {
+
+ jQuery(listElement).find('a').wrap('<span></span>').width(jQuery(listElement).find('a').width() + 10);
+
+ // Add the overlay png.
+ // jQuery(listElement).append(jQuery('<div class="' + _options.overlayClass + '"></div>').css(
+ // {
+ // display: 'block'
+ // })).css(
+ // {
+ // background: 'none'
+ // });
+
+ var options =
+ {
+ id: i,
+ width: jQuery(listElement).width(),
+ listElement: jQuery(listElement).find('span'),
+ isAnimating: false,
+ element: jQuery(listElement).find('span')
+
+ };
+ jQuery(listElement).bind('mouseover', options, expandBreadCrumb).bind('mouseout', options, shrinkBreadCrumb);
+ jQuery(listElement).find('a').unbind('mouseover', expandBreadCrumb).unbind('mouseout', shrinkBreadCrumb);
+ listElement.autoInterval = setInterval(function()
+ {
+ clearInterval(listElement.autoInterval);
+ jQuery(listElement).find('span').animate(
+ {
+ width: _options.previewWidth
+ }, _options.timeInitialCollapse, _options.easing);
+ }, (150 * (i - 2)));
+
+ }
+ });
+
+ };
+
+ function expandBreadCrumb(e)
+ {
+ var elementID = e.data.id;
+ var originalWidth = e.data.width;
+ jQuery(e.data.element).stop();
+ jQuery(e.data.element).animate(
+ {
+ width: originalWidth
+ },
+ {
+ duration: _options.timeExpansionAnimation,
+ easing: _options.easing,
+ queue: false
+ });
+ return false;
+
+ };
+
+ function shrinkBreadCrumb(e)
+ {
+ var elementID = e.data.id;
+ jQuery(e.data.element).stop();
+ jQuery(e.data.element).animate(
+ {
+ width: _options.previewWidth
+ },
+ {
+ duration: _options.timeCompressionAnimation,
+ easing: _options.easing,
+ queue: false
+ });
+ return false;
+ };
+
+ // Public global variables
+
+ jQuery.fn.jBreadCrumb.defaults =
+ {
+ maxFinalElementLength: 400,
+ minFinalElementLength: 200,
+ minimumCompressionElements: 4,
+ endElementsToLeaveOpen: 1,
+ beginingElementsToLeaveOpen: 1,
+ timeExpansionAnimation: 800,
+ timeCompressionAnimation: 500,
+ timeInitialCollapse: 600,
+ easing: _easingEquation,
+ overlayClass: 'chevronOverlay',
+ previewWidth: 40
+ };
+
+})(jQuery);
diff --git a/themes/elegant/local_head.tpl b/themes/elegant/local_head.tpl
index 8c2b4045c..a342df6b8 100644
--- a/themes/elegant/local_head.tpl
+++ b/themes/elegant/local_head.tpl
@@ -1,11 +1,24 @@
+{html_style}
+.browsePath ul li span a:before, .browsePath ul li.last:before
+{ldelim}
+ content: "{$LEVEL_SEPARATOR}";
+}
+{/html_style}
{footer_script}
var p_main_menu = "{$elegant.p_main_menu}", p_pict_descr = "{$elegant.p_pict_descr}", p_pict_comment = "{$elegant.p_pict_comment}";
+ jQuery(document).ready(function()
+ {
+ jQuery(".browsePath").jBreadCrumb();
+ })
{/footer_script}
{if $BODY_ID=='thePicturePage'}
{combine_script id='elegant.scripts_pp' load='footer' require='jquery' path='themes/elegant/scripts_pp.js'}
{else}
{combine_script id='elegant.scripts' load='footer' require='jquery' path='themes/elegant/scripts.js'}
{/if}
- <!--[if lt IE 8]>
+{combine_script id='jquery.jBreadCrumb' load='footer' require='jquery' path='themes/elegant/js/jquery.jBreadCrumb.js'}
+
+
+<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css" href="{$ROOT_URL}themes/elegant/fix-ie7.css">
<![endif]-->
diff --git a/themes/elegant/theme.css b/themes/elegant/theme.css
index 83f130deb..2a37e54f4 100644
--- a/themes/elegant/theme.css
+++ b/themes/elegant/theme.css
@@ -273,3 +273,86 @@ a:hover { border-bottom: none;}
#the_page .content .stuffs { margin: 0!important}
.categoryActions .theme_menuf { display: none;}
+
+/* BreadCrumb */
+.browsePath
+{
+ margin: 0;
+ padding: 0;
+ float: left;
+ display: block;
+ height: 26px;
+ overflow: hidden;
+ width: 990px;
+ padding:5px;
+}
+.browsePath ul
+{
+ margin: 0;
+ padding: 0;
+ height: 26px;
+ display: block;
+}
+.browsePath ul li
+{
+ display: block;
+ float: left;
+ position: relative;
+ height: 26px;
+ overflow: hidden;
+ line-height: 26px;
+ margin: 0px;
+ font-size: .9167em;
+}
+.browsePath ul li a:before, .browsePath ul li.last:before
+{
+ content: "/";
+ display: inline-block;
+ margin-left: 0.2em;
+ margin-right: 0.2em;
+ text-align: center;
+ text-decoration: inherit;
+ text-transform: none;
+ width: 1em;
+}
+.browsePath ul li div.chevronOverlay
+{
+ position: absolute;
+ right: 0;
+ top: 0;
+ z-index: 2;
+}
+.browsePath ul li span
+{
+ display: block;
+ overflow: hidden;
+}
+.browsePath ul li a
+{
+ display: block;
+ position: relative;
+ height: 26px;
+ line-height: 26px;
+ overflow: hidden;
+ float: left;
+}
+.browsePath ul li.first a
+{
+ height: 26px !important;
+ text-indent:-1000em;
+ width:26px;
+ padding: 0;
+ margin: 0;
+ overflow: hidden;
+ background:url(icon/icons_sprite.png) no-repeat -26px 0;
+}
+.browsePath ul li.first a:hover
+{
+ background-image:url(icon/icons_sprite-hover.png);
+}
+.browsePath ul li.last
+{
+ background: none;
+ margin-right: 0;
+ padding-right: 0;
+}
diff --git a/themes/elegant/themeconf.inc.php b/themes/elegant/themeconf.inc.php
index d5afc6f6e..e0611ffce 100644
--- a/themes/elegant/themeconf.inc.php
+++ b/themes/elegant/themeconf.inc.php
@@ -15,7 +15,12 @@ $themeconf = array(
// Need upgrade?
global $conf;
include(PHPWG_THEMES_PATH.'elegant/admin/upgrade.inc.php');
-
+add_event_handler('loc_begin_picture', 'level_separator_elegant');
+function level_separator_elegant()
+{
+ global $template;
+ $template->assign( 'LEVEL_SEPARATOR', '#&$' );
+}
add_event_handler('init', 'set_config_values_elegant');
function set_config_values_elegant()
{