Revert "Remove jquery.arrowSteps module"

It should probably be deprecated first after all.

This reverts commit 6fba9a7dc6ac969676c57f85b09bbdac9067a2bd.

Bug: T144974
Change-Id: I830fbfc2e453be6b18d43775a8aa1a366690907c

diff --git a/RELEASE-NOTES-1.28 b/RELEASE-NOTES-1.28
index 116dc2a..1f4b8dc 100644 (file)
--- a/RELEASE-NOTES-1.28
+++ b/RELEASE-NOTES-1.28
@@ -169,7 +169,6 @@ changes to languages because of Phabricator reports.
   phpunit.php: --regex and --keep-uploads. Instead of --regex, use --filter.
   Instead of --keep-uploads, use the same option to parserTests.php, but you
   must specify a directory with --upload-dir.
-* The 'jquery.arrowSteps' ResourceLoader module was removed.
 
 == Compatibility ==
 

diff --git a/jsduck.json b/jsduck.json
index ad95506..5b18365 100644 (file)
--- a/jsduck.json
+++ b/jsduck.json
@@ -19,6 +19,7 @@
                "resources/src/mediawiki.toolbar",
                "resources/src/mediawiki.widgets",
                "resources/src/jquery/jquery.accessKeyLabel.js",
+               "resources/src/jquery/jquery.arrowSteps.js",
                "resources/src/jquery/jquery.autoEllipsis.js",
                "resources/src/jquery/jquery.badge.js",
                "resources/src/jquery/jquery.byteLength.js",

diff --git a/resources/Resources.php b/resources/Resources.php
index ff39537..63c3490 100644 (file)
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -165,6 +165,11 @@ return [
                ],
                'scripts' => 'resources/lib/jquery/jquery.appear.js',
        ],
+       'jquery.arrowSteps' => [
+               'scripts' => 'resources/src/jquery/jquery.arrowSteps.js',
+               'styles' => 'resources/src/jquery/jquery.arrowSteps.css',
+               'targets' => [ 'desktop', 'mobile' ],
+       ],
        'jquery.async' => [
                'scripts' => 'resources/lib/jquery/jquery.async.js',
        ],

diff --git a/resources/src/jquery/images/jquery.arrowSteps.divider-ltr.png b/resources/src/jquery/images/jquery.arrowSteps.divider-ltr.png
new file mode 100644 (file)
index 0000000..84ed2a2
Binary files /dev/null and b/resources/src/jquery/images/jquery.arrowSteps.divider-ltr.png differ

diff --git a/resources/src/jquery/images/jquery.arrowSteps.divider-rtl.png b/resources/src/jquery/images/jquery.arrowSteps.divider-rtl.png
new file mode 100644 (file)
index 0000000..c212aeb
Binary files /dev/null and b/resources/src/jquery/images/jquery.arrowSteps.divider-rtl.png differ

diff --git a/resources/src/jquery/images/jquery.arrowSteps.head-ltr.png b/resources/src/jquery/images/jquery.arrowSteps.head-ltr.png
new file mode 100644 (file)
index 0000000..e6546bf
Binary files /dev/null and b/resources/src/jquery/images/jquery.arrowSteps.head-ltr.png differ

diff --git a/resources/src/jquery/images/jquery.arrowSteps.head-rtl.png b/resources/src/jquery/images/jquery.arrowSteps.head-rtl.png
new file mode 100644 (file)
index 0000000..2af30b9
Binary files /dev/null and b/resources/src/jquery/images/jquery.arrowSteps.head-rtl.png differ

diff --git a/resources/src/jquery/images/jquery.arrowSteps.tail-ltr.png b/resources/src/jquery/images/jquery.arrowSteps.tail-ltr.png
new file mode 100644 (file)
index 0000000..3ad990b
Binary files /dev/null and b/resources/src/jquery/images/jquery.arrowSteps.tail-ltr.png differ

diff --git a/resources/src/jquery/images/jquery.arrowSteps.tail-rtl.png b/resources/src/jquery/images/jquery.arrowSteps.tail-rtl.png
new file mode 100644 (file)
index 0000000..1d3048e
Binary files /dev/null and b/resources/src/jquery/images/jquery.arrowSteps.tail-rtl.png differ

diff --git a/resources/src/jquery/jquery.arrowSteps.css b/resources/src/jquery/jquery.arrowSteps.css
new file mode 100644 (file)
index 0000000..d24fcc9
--- /dev/null
+++ b/resources/src/jquery/jquery.arrowSteps.css
@@ -0,0 +1,45 @@
+.arrowSteps {
+       list-style-type: none;
+       list-style-image: none;
+       border: 1px solid #666;
+       position: relative;
+}
+
+.arrowSteps li {
+       float: left;
+       padding: 0px;
+       margin: 0px;
+       border: 0 none;
+}
+
+.arrowSteps li div {
+       padding: 0.5em;
+       text-align: center;
+       white-space: nowrap;
+       overflow: hidden;
+}
+
+.arrowSteps li.arrow div {
+       /* @embed */
+       background: url( images/jquery.arrowSteps.divider-ltr.png ) no-repeat right center;
+}
+
+/* applied to the element preceding the highlighted step */
+.arrowSteps li.arrow.tail div {
+       /* @embed */
+       background: url( images/jquery.arrowSteps.tail-ltr.png ) no-repeat right center;
+}
+
+/* this applies to all highlighted, including the last */
+.arrowSteps li.head div {
+       /* @embed */
+       background: url( images/jquery.arrowSteps.head-ltr.png ) no-repeat left center;
+       font-weight: bold;
+}
+
+/* this applies to all highlighted arrows except the last */
+.arrowSteps li.arrow.head div {
+       /* TODO: eliminate duplication of jquery.arrowSteps.head.png embedding */
+       /* @embed */
+       background: url( images/jquery.arrowSteps.head-ltr.png ) no-repeat right center;
+}

diff --git a/resources/src/jquery/jquery.arrowSteps.js b/resources/src/jquery/jquery.arrowSteps.js
new file mode 100644 (file)
index 0000000..b0c36c6
--- /dev/null
+++ b/resources/src/jquery/jquery.arrowSteps.js
@@ -0,0 +1,98 @@
+/*!
+ * jQuery arrowSteps plugin
+ * Copyright Neil Kandalgaonkar, 2010
+ *
+ * This work is licensed under the terms of the GNU General Public License,
+ * version 2 or later.
+ * (see http://www.fsf.org/licensing/licenses/gpl.html).
+ * Derivative works and later versions of the code must be free software
+ * licensed under the same or a compatible license.
+ */
+
+/**
+ * @class jQuery.plugin.arrowSteps
+ */
+( function ( $ ) {
+       /**
+        * Show users their progress through a series of steps, via a row of items that fit
+        * together like arrows. One item can be highlighted at a time.
+        *
+        *     <ul id="robin-hood-daffy">
+        *       <li id="guard"><div>Guard!</div></li>
+        *       <li id="turn"><div>Turn!</div></li>
+        *       <li id="parry"><div>Parry!</div></li>
+        *       <li id="dodge"><div>Dodge!</div></li>
+        *       <li id="spin"><div>Spin!</div></li>
+        *       <li id="ha"><div>Ha!</div></li>
+        *       <li id="thrust"><div>Thrust!</div></li>
+        *     </ul>
+        *
+        *     <script>
+        *       $( '#robin-hood-daffy' ).arrowSteps();
+        *     </script>
+        *
+        * @return {jQuery}
+        * @chainable
+        */
+       $.fn.arrowSteps = function () {
+               var $steps, width, arrowWidth, $stepDiv,
+                       $el = this,
+                       paddingSide = $( 'body' ).hasClass( 'rtl' ) ? 'padding-left' : 'padding-right';
+
+               $el.addClass( 'arrowSteps' );
+               $steps = $el.find( 'li' );
+
+               width = parseInt( 100 / $steps.length, 10 );
+               $steps.css( 'width', width + '%' );
+
+               // 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.
+               $stepDiv = $steps.filter( ':not(:last-child)' ).addClass( 'arrow' ).find( 'div' );
+
+               // Execute when complete page is fully loaded, including all frames, objects and images
+               $( window ).on( 'load', function () {
+                       arrowWidth = parseInt( $el.outerHeight(), 10 );
+                       $stepDiv.css( paddingSide, arrowWidth.toString() + 'px' );
+               } );
+
+               $el.data( 'arrowSteps', $steps );
+
+               return this;
+       };
+
+       /**
+        * Highlights the element selected by the selector.
+        *
+        *       $( '#robin-hood-daffy' ).arrowStepsHighlight( '#guard' );
+        *       // 'Guard!' is highlighted.
+        *
+        *       // ... user completes the 'guard' step ...
+        *
+        *       $( '#robin-hood-daffy' ).arrowStepsHighlight( '#turn' );
+        *       // 'Turn!' is highlighted.
+        *
+        * @param {string} selector
+        */
+       $.fn.arrowStepsHighlight = function ( selector ) {
+               var $previous,
+                       $steps = this.data( 'arrowSteps' );
+               $.each( $steps, function ( i, step ) {
+                       var $step = $( step );
+                       if ( $step.is( selector ) ) {
+                               if ( $previous ) {
+                                       $previous.addClass( 'tail' );
+                               }
+                               $step.addClass( 'head' );
+                       } else {
+                               $step.removeClass( 'head tail lasthead' );
+                       }
+                       $previous = $step;
+               } );
+       };
+
+       /**
+        * @class jQuery
+        * @mixins jQuery.plugin.arrowSteps
+        */
+}( jQuery ) );