Add a way for packagers to override some installation details
[mediawiki.git] / resources / jquery / jquery.arrowSteps.js
blobf9637545dc4fb49317917e8d95d8cf71edbbbf3b
1 /**
2  * jQuery arrowSteps plugin
3  * Copyright Neil Kandalgaonkar, 2010
4  * 
5  * This work is licensed under the terms of the GNU General Public License, 
6  * version 2 or later. 
7  * (see http://www.fsf.org/licensing/licenses/gpl.html). 
8  * Derivative works and later versions of the code must be free software 
9  * licensed under the same or a compatible license.
10  *
11  *
12  * DESCRIPTION
13  *
14  * Show users their progress through a series of steps, via a row of items that fit 
15  * together like arrows. One item can be highlighted at a time.
16  *
17  *
18  * SYNOPSIS 
19  *
20  * <ul id="robin-hood-daffy">
21  *   <li id="guard"><div>Guard!</div></li>
22  *   <li id="turn"><div>Turn!</div></li>
23  *   <li id="parry"><div>Parry!</div></li>
24  *   <li id="dodge"><div>Dodge!</div></li>
25  *   <li id="spin"><div>Spin!</div></li>
26  *   <li id="ha"><div>Ha!</div></li>
27  *   <li id="thrust"><div>Thrust!</div></li>
28  * </ul>
29  *
30  * <script language="javascript"><!-- 
31  *   $( '#robin-hood-daffy' ).arrowSteps();
32  *
33  *   $( '#robin-hood-daffy' ).arrowStepsHighlight( '#guard' );
34  *   // 'Guard!' is highlighted.
35  *
36  *   // ... user completes the 'guard' step ...
37  * 
38  *   $( '#robin-hood-daffy' ).arrowStepsHighlight( '#turn' );
39  *   // 'Turn!' is highlighted.
40  *
41  *   //-->
42  * </script>
43  *
44  */
46 ( function( $j ) { 
47         $j.fn.arrowSteps = function() {
48                 this.addClass( 'arrowSteps' );
49                 var $steps = this.find( 'li' );
51                 var width = parseInt( 100 / $steps.length, 10 );
52                 $steps.css( 'width', width + '%' );
54                 // every step except the last one has an arrow at the right hand side. Also add in the padding 
55                 // for the calculated arrow width.
56                 var arrowWidth = parseInt( this.outerHeight(), 10 );
57                 $steps.filter( ':not(:last-child)' ).addClass( 'arrow' )
58                       .find( 'div' ).css( 'padding-right', arrowWidth.toString() + 'px' );
60                 this.data( 'arrowSteps', $steps );
61                 return this;
62         };
63         
64         $j.fn.arrowStepsHighlight = function( selector ) {
65                 var $steps = this.data( 'arrowSteps' );
66                 var $previous;
67                 $j.each( $steps, function( i, step ) {
68                         var $step = $j( step );
69                         if ( $step.is( selector ) ) {
70                                 if ($previous) {
71                                         $previous.addClass( 'tail' );
72                                 }
73                                 $step.addClass( 'head' );
74                         } else {
75                                 $step.removeClass( 'head tail lasthead' );
76                         }
77                         $previous = $step;
78                 } ); 
79         };
81 } )( jQuery );