r92812 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:< r92811‎ | r92812 | r92813 >
Date:22:18, 21 July 2011
Author:krinkle
Status:deferred
Tags:
Comment:
MoodBar front-end dev:
* ext.moodBar.core:
- form submission and error handling
- wrapping moodbar overlay in a wrapper so we can use margin instead of padding, and thus make width:100% work for elements inside (the input field to be exact), otherwise the input element would be 100%+padding
- swap expanded and collapsed icon trigger messages (triangles were mixed up)


Also:
- pointer on mood type hover
- disable function, versioned
Modified paths:
  • /trunk/extensions/MoodBar/MoodBar.i18n.php (modified) (history)
  • /trunk/extensions/MoodBar/MoodBar.php (modified) (history)
  • /trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.core.css (modified) (history)
  • /trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.core.js (modified) (history)
  • /trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.init.js (modified) (history)
  • /trunk/extensions/MoodBar/modules/ext.moodBar/images/ajax-spinner.gif (added) (history)
  • /trunk/extensions/MoodBar/modules/jquery.moodBar/jquery.moodBar.js (modified) (history)

Diff [purge]

Index: trunk/extensions/MoodBar/MoodBar.i18n.php
——@@ -41,9 +41,12 @@
4242 'moodbar-form-title' => 'Because...',
4343 'moodbar-form-note' => '140 character maximum',
4444 'moodbar-form-note-dynamic' => '$1 characters remaining',
45 - 'moodbar-form-submit' => 'Send Feedback',
 45+ 'moodbar-form-submit' => 'Share Feedback',
4646 'moodbar-form-policy-text' => 'By submitting, $1',
4747 'moodbar-form-policy-label' => 'our policy',
 48+ 'moodbar-loading-title' => 'Sharing...',
 49+ 'moodbar-success-title' => 'Thanks!',
 50+ 'moodbar-error-title' => 'Sharing...',
4851 // Special:MoodBar
4952 'right-moodbar-view' => 'View and export MoodBar feedback',
5053 'moodbar-admin-title' => 'MoodBar feedback',
Index: trunk/extensions/MoodBar/modules/jquery.moodBar/jquery.moodBar.js
——@@ -17,7 +17,7 @@
1818 * - type: A string.
1919 * @return jqXHR
2020 */
21 - 'submit' : function( fbProps ) {
 21+ 'submit': function( fbProps ) {
2222 var clientData = $.client.profile(),
2323 fbProps = $.extend( {
2424 'page': mw.config.get( 'wgPageName' ),
Index: trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.init.js
——@@ -9,6 +9,14 @@
1010
1111 conf: mw.config.get( 'mbConfig' ),
1212
 13+ cookiePrefix: function() {
 14+ return 'ext.moodBar@' + mb.conf.bucketConfig.version + '-';
 15+ },
 16+
 17+ isDisabled: function() {
 18+ return $.cookie( mb.cookiePrefix() + 'disabled' ) == '1';
 19+ },
 20+
1321 ui: {
1422 // jQuery objects
1523 pMoodbar: null,
——@@ -49,6 +57,8 @@
5058
5159 };
5260
53 - mb.init();
 61+ if ( !mb.isDisabled() ) {
 62+ mb.init();
 63+ }
5464
5565 } )( jQuery );
Index: trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.core.css
——@@ -40,6 +40,10 @@
4141 text-align: center;
4242 }
4343
 44+.mw-moodBar-type {
 45+ cursor: pointer;
 46+}
 47+
4448 .mw-moodBar-typeTitle,
4549 .mw-moodBar-privacy,
4650 .mw-moodBar-overlayWhat {
——@@ -67,6 +71,11 @@
6872 outline: none;
6973 }
7074
 75+.mw-moodBar-privacy,
 76+.mw-moodBar-overlayWhatContent {
 77+ font-size: 10px;
 78+}
 79+
7180 .mw-moodBar-formSubmit {
7281 float: right;
7382 }
Index: trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.core.js
——@@ -9,9 +9,12 @@
1010 $.extend( mb, {
1111
1212 tpl: {
13 - overlay: '\
 13+ overlayBase: '\
1414 <div id="mw-moodBar-overlayWrap"><div id="mw-moodBar-overlay">\
1515 <span class="mw-moodBar-overlayClose"><a href="#"><html:msg key="moodbar-close" /></a></span>\
 16+ <div class="mw-moodBar-overlayContent"></div>\
 17+ </div></div>',
 18+ userinput: '\
1619 <div class="mw-moodBar-overlayTitle"><html:msg key="moodbar-intro-using" /></div>\
1720 <div class="mw-moodBar-types"></div>\
1821 <div class="mw-moodBar-form">\
——@@ -26,17 +29,22 @@
2730 </div>\
2831 </div>\
2932 <span class="mw-moodBar-overlayWhat">\
30 - <a title-msg="tooltip-moodbar-what">\
 33+ <a href="#" title-msg="tooltip-moodbar-what">\
3134 <span class="mw-moodBar-overlayWhatTrigger"></span>\
3235 <span class="mw-moodBar-overlayWhatLabel"><html:msg key="moodbar-what-label" /></span>\
3336 </a>\
3437 <div class="mw-moodBar-overlayWhatContent"></div>\
35 - </span>\
36 - </div></div>',
 38+ </span>',
3739 type: '\
3840 <div class="mw-moodBar-type mw-moodBar-type-$1" rel="$1">\
3941 <span class="mw-moodBar-typeTitle"><html:msg key="moodbar-type-$1-title" /></span>\
40 - </div>'
 42+ </div>',
 43+ loading: '\
 44+ <div><img src="' + mw.config.get( 'wgExtensionAssetsPath' ) + '/MoodBar/modules/ext.moodBar/images/ajax-spinner.gif" />Sharing...</div>',
 45+ success: '\
 46+ <div>Thanks!</div>',
 47+ error: '\
 48+ <div>Oops!</div>'
4149 },
4250
4351 event: {
——@@ -51,7 +59,13 @@
5260
5361 disable: function( e ) {
5462 e.preventDefault();
55 - // TODO write
 63+ $.cookie(
 64+ mb.cookiePrefix() + 'disabled',
 65+ '1',
 66+ { 'path': '/', 'expires': Number( mb.conf.disableExpiration ) }
 67+ );
 68+ mb.ui.overlay.fadeOut( 'fast' );
 69+ mb.ui.trigger.fadeOut( 'fast' );
5670 }
5771 },
5872
——@@ -61,9 +75,9 @@
6276 type: 'unknown',
6377 callback: function( data ) {
6478 if ( data && data.moodbar && data.moodbar.result === 'success' ) {
65 - alert(1);
 79+ mb.swapContent( mb.tpl.success );
6680 } else {
67 - alert(0);
 81+ mb.swapContent( '.mw-moodBar-overlayContent' );
6882 }
6983 }
7084 },
——@@ -73,7 +87,11 @@
7488 msgOptions.params['moodbar-intro-using'] = [mw.config.get( 'wgSiteName' )];
7589
7690 // Create overlay
77 - mb.ui.overlay = $( mb.tpl.overlay )
 91+ mb.ui.overlay = $( mb.tpl.overlayBase )
 92+ // Fill content with user input screen
 93+ .find( '.mw-moodBar-overlayContent' )
 94+ .html( mb.tpl.userinput )
 95+ .end()
7896 // Handle all html:msgs
7997 .localize( msgOptions )
8098 // Bind close-toggle
——@@ -83,7 +101,7 @@
84102 // Populate type selector
85103 .find( '.mw-moodBar-types' )
86104 .append( function() {
87 - var $mwMoodBarTypes = $(this),
 105+ var $mwMoodBarTypes = $( this ),
88106 elems = [];
89107 $.each( mb.conf.validTypes, function( id, type ) {
90108 elems.push(
——@@ -116,7 +134,8 @@
117135 .text( mw.msg( 'moodbar-what-collapsed' ) )
118136 .end()
119137 .find( '.mw-moodBar-overlayWhat > a' )
120 - .click( function() {
 138+ .click( function( e ) {
 139+ e.preventDefault();
121140 mb.ui.overlay
122141 .find( '.mw-moodBar-overlayWhatContent' )
123142 .each( function() {
——@@ -187,7 +206,9 @@
188207 .find( '.mw-moodBar-formSubmit' )
189208 .val( mw.msg( 'moodbar-form-submit' ) )
190209 .click( function() {
191 - mb.feedbackItem.comment = mb.ui.overlay.find( 'mw-moodBar-formInput' ).val();
 210+ mb.feedbackItem.comment = mb.ui.overlay.find( '.mw-moodBar-formInput' ).val();
 211+ mb.swapContent( mb.tpl.loading );
 212+ //$.moodBar.submit( mb.feedbackItem );
192213 } )
193214 .end();
194215
——@@ -201,9 +222,18 @@
202223
203224 // Bind triger
204225 mb.ui.trigger.click( mb.event.trigger );
 226+ },
 227+ swapContent: function( tpl ) {
 228+ mb.ui.overlay
 229+ .find( '.mw-moodBar-overlayContent' )
 230+ .html( tpl )
 231+ .localize();
 232+ return true;
205233 }
206234 } );
207235
208 - mb.core();
 236+ if ( !mb.isDisabled() ) {
 237+ mb.core();
 238+ }
209239
210240 } )( jQuery );
Index: trunk/extensions/MoodBar/modules/ext.moodBar/images/ajax-spinner.gif
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Property changes on: trunk/extensions/MoodBar/modules/ext.moodBar/images/ajax-spinner.gif
___________________________________________________________________
Added: svn:mime-type
211241 + application/octet-stream
Index: trunk/extensions/MoodBar/MoodBar.php
——@@ -121,9 +121,10 @@
122122 'using' => 10,
123123 'share' => 10,
124124 ),
125 - 'version' => 1,
 125+ 'version' => 2,
126126 'expires' => 30,
127127 ),
128128 'infoUrl' => 'http://www.mediawiki.org/wiki/MoodBar',
129129 'privacyUrl' => 'about:blank',
 130+ 'disableExpiration' => 365,
130131 );

Status & tagging log