Merge "Vector: Fix padding values of div#content"
[lhc/web/wiklou.git] / resources / jquery / jquery.arrowSteps.js
index 1b414dd..a1fd679 100644 (file)
  * </script>
  *
  */
-
 ( function ( $ ) {
        $.fn.arrowSteps = function () {
+               var $steps, width, arrowWidth,
+                       paddingSide = $( 'body' ).hasClass( 'rtl' ) ? 'padding-left' : 'padding-right';
+
                this.addClass( 'arrowSteps' );
-               var $steps = this.find( 'li' );
+               $steps = this.find( 'li' );
 
-               var width = parseInt( 100 / $steps.length, 10 );
+               width = parseInt( 100 / $steps.length, 10 );
                $steps.css( 'width', width + '%' );
 
-               // every step except the last one has an arrow at the right hand side. Also add in the padding
-               // for the calculated arrow width.
-               var arrowWidth = parseInt( this.outerHeight(), 10 );
+               // Every step except the last one has an arrow pointing forward:
+               // at the right hand side in LTR languages, and at the left hand side in RTL.
+               // Also add in the padding for the calculated arrow width.
+               arrowWidth = parseInt( this.outerHeight(), 10 );
                $steps.filter( ':not(:last-child)' ).addClass( 'arrow' )
-                     .find( 'div' ).css( 'padding-right', arrowWidth.toString() + 'px' );
+                     .find( 'div' ).css( paddingSide, arrowWidth.toString() + 'px' );
 
                this.data( 'arrowSteps', $steps );
                return this;
        };
 
        $.fn.arrowStepsHighlight = function ( selector ) {
-               var $steps = this.data( 'arrowSteps' );
-               var $previous;
+               var $previous,
+                       $steps = this.data( 'arrowSteps' );
                $.each( $steps, function ( i, step ) {
                        var $step = $( step );
                        if ( $step.is( selector ) ) {