| Index: trunk/extensions/ArticleCreationWorkflow/includes/ArticleCreationTemplates.php |
| — | — | @@ -129,7 +129,9 @@ |
| 130 | 130 | |
| 131 | 131 | return <<<HTML |
| 132 | 132 | <div class="ac-button-wrap"> |
| 133 | | - <a class="ac-article-button ac-button ac-button-$color ac-article-$button" data-ac-button="$button" href="$target"> |
| | 133 | + <a class="ac-article-button ac-button ac-button-$color |
| | 134 | + ac-article-$button" data-ac-button="$button" |
| | 135 | + data-ac-color="$color" href="$target"> |
| 134 | 136 | <div class="ac-arrow ac-arrow-forward"> </div> |
| 135 | 137 | <div class="ac-button-text"> |
| 136 | 138 | <div class="ac-button-title">$buttonTitle</div> |
| Index: trunk/extensions/ArticleCreationWorkflow/modules/ext.articleCreation.user/ext.articleCreation.user.js |
| — | — | @@ -12,21 +12,23 @@ |
| 13 | 13 | ac.setupTooltips(); |
| 14 | 14 | |
| 15 | 15 | $(document).click( function(e) { |
| 16 | | - $('.ac-article-button') |
| 17 | | - //remove green states and hide their tooltips |
| 18 | | - .removeClass('ac-button-green') |
| 19 | | - .removeClass('ac-button-selected') |
| 20 | | - .each ( function (i, e) { |
| 21 | | - $(this) .parent() |
| 22 | | - .find('.mw-ac-tooltip') |
| 23 | | - .hide(); |
| 24 | | - }); |
| | 16 | + if ( $(e.target).is('.mw-ac-interstitial *' ) ) { |
| | 17 | + return; |
| | 18 | + } |
| | 19 | + |
| | 20 | + ac.hideInterstitial( $('.ac-article-button') ); |
| 25 | 21 | |
| 26 | 22 | ac.panel |
| 27 | 23 | .find('.mw-ac-interstitial') |
| 28 | 24 | .hide(); |
| 29 | 25 | } ); |
| 30 | 26 | |
| | 27 | + $(document).keydown( function(e) { |
| | 28 | + if ( e.keyCode == 27 ) {// ESC |
| | 29 | + ac.hideInterstitial( $('.ac-article-button') ); |
| | 30 | + } |
| | 31 | + }); |
| | 32 | + |
| 31 | 33 | //setup button hover states |
| 32 | 34 | ac.panel |
| 33 | 35 | .find( '.ac-article-button' ) |
| — | — | @@ -68,20 +70,21 @@ |
| 69 | 71 | e.preventDefault(); |
| 70 | 72 | e.stopPropagation(); |
| 71 | 73 | |
| 72 | | - $('.ac-article-button') |
| 73 | | - //remove green states and hide their tooltips |
| 74 | | - .removeClass('ac-button-green') |
| 75 | | - .removeClass('ac-button-selected') |
| 76 | | - .each ( function (i, e) { |
| 77 | | - $(this) .parent() |
| 78 | | - .find('.mw-ac-tooltip') |
| 79 | | - .hide(); |
| 80 | | - }); |
| 81 | | - |
| | 74 | + var alreadySelected = $(this) |
| | 75 | + .hasClass('ac-button-selected'); |
| | 76 | + |
| | 77 | + ac.hideInterstitial($('.ac-article-button')); |
| | 78 | + $('.ac-article-button').not($(this)) |
| | 79 | + .addClass('ac-faded'); |
| | 80 | + |
| 82 | 81 | ac.panel |
| 83 | 82 | .find('.mw-ac-interstitial') |
| 84 | 83 | .hide(); |
| 85 | 84 | |
| | 85 | + if ( alreadySelected ) { |
| | 86 | + return; |
| | 87 | + } |
| | 88 | + |
| 86 | 89 | if ( ! $(this).parent().find('.mw-ac-interstitial').length || |
| 87 | 90 | ac.isInterstitialDisabled($(this).data('ac-button')) |
| 88 | 91 | ) { |
| — | — | @@ -93,6 +96,7 @@ |
| 94 | 97 | |
| 95 | 98 | $( this ) |
| 96 | 99 | //make it green |
| | 100 | + .removeClass('ac-button-blue') |
| 97 | 101 | .addClass('ac-button-green') |
| 98 | 102 | .addClass('ac-button-selected') |
| 99 | 103 | .parent() |
| — | — | @@ -110,10 +114,11 @@ |
| 111 | 115 | .hover (function (){ |
| 112 | 116 | $( '.ac-article-button' ) |
| 113 | 117 | .not( this ) |
| 114 | | - .addClass( 'ac-faded' ); |
| | 118 | + .removeClass( 'ac-button-hover' ); |
| | 119 | + $(this).addClass('ac-button-hover'); |
| 115 | 120 | }, function(){ |
| 116 | 121 | $( '.ac-article-button' ) |
| 117 | | - .removeClass( 'ac-faded' ); |
| | 122 | + .removeClass( 'ac-button-hover' ); |
| 118 | 123 | }); |
| 119 | 124 | |
| 120 | 125 | }, |
| — | — | @@ -188,12 +193,31 @@ |
| 189 | 194 | title = article; |
| 190 | 195 | } |
| 191 | 196 | |
| | 197 | + // Normalise title |
| | 198 | + title = title.charAt(0).toUpperCase() + title.substr(1); |
| | 199 | + title = title.replace(' ', '_' ); |
| | 200 | + |
| 192 | 201 | jQuery.trackActionWithOptions( { |
| 193 | 202 | id : ac.config['tracking-code-prefix'] + action, |
| 194 | 203 | namespace : namespaceNumber, |
| 195 | 204 | info : title |
| 196 | 205 | } ); |
| 197 | 206 | } |
| | 207 | + }, |
| | 208 | + |
| | 209 | + hideInterstitial : function($elements) { |
| | 210 | + //remove green states and hide their tooltips |
| | 211 | + $elements |
| | 212 | + .removeClass('ac-button-green') |
| | 213 | + .removeClass('ac-button-selected') |
| | 214 | + .each ( function (i, e) { |
| | 215 | + var color = $(this).data('ac-color'); |
| | 216 | + $(this) .addClass( 'ac-button-'+color ) |
| | 217 | + .parent() |
| | 218 | + .find('.mw-ac-tooltip,.mw-ac-interstitial') |
| | 219 | + .hide(); |
| | 220 | + }); |
| | 221 | + $('.ac-article-button').removeClass('ac-faded'); |
| 198 | 222 | } |
| 199 | 223 | |
| 200 | 224 | }); |
| Index: trunk/extensions/ArticleCreationWorkflow/modules/ext.articleCreation.core/ext.articleCreation.core.css |
| — | — | @@ -61,6 +61,22 @@ |
| 62 | 62 | ); |
| 63 | 63 | } |
| 64 | 64 | |
| | 65 | +.ac-button-blue.ac-button-hover { |
| | 66 | + background-image: linear-gradient(bottom, #43649c 10%, #6699ee 90%); |
| | 67 | + background-image: -o-linear-gradient(bottom, #43649c 10%, #6699ee 90%); |
| | 68 | + background-image: -moz-linear-gradient(bottom, #43649c 10%, #6699ee 90%); |
| | 69 | + background-image: -webkit-linear-gradient(bottom, #43649c 10%, #6699ee 90%); |
| | 70 | + background-image: -ms-linear-gradient(bottom, #43649c 10%, #6699ee 90%); |
| | 71 | + |
| | 72 | + background-image: -webkit-gradient( |
| | 73 | + linear, |
| | 74 | + left bottom, |
| | 75 | + left top, |
| | 76 | + color-stop(0.1, #43649c), |
| | 77 | + color-stop(0.9, #6699ee) |
| | 78 | + ); |
| | 79 | +} |
| | 80 | + |
| 65 | 81 | .ac-button-red { |
| 66 | 82 | background-image: linear-gradient(bottom, #850000 10%, #CC0000 90%); |
| 67 | 83 | background-image: -o-linear-gradient(bottom, #850000 10%, #CC0000 90%); |