r92787 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r92786‎ | r92787 | r92788 >
Date:20:29, 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)
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)

Diff [purge]

Index: trunk/extensions/MoodBar/MoodBar.i18n.php
@@ -30,8 +30,8 @@
3131 'tooltip-moodbar-what' => 'Learn more about this feature',
3232 'moodbar-what-target' => 'http://www.mediawiki.org/wiki/MoodBar',
3333 'moodbar-what-label' => 'What is this?',
34 - 'moodbar-what-expanded' => '▶', // Ignore, do not translate. ▼
35 - 'moodbar-what-collapsed' => '▼', // Ignore, do not translate. ▶
 34+ 'moodbar-what-collapsed' => '▶', // Ignore, do not translate. ▼
 35+ 'moodbar-what-expanded' => '▼', // Ignore, do not translate. ▶
3636 'moodbar-what-content' => 'This feature is designed to help the Wikipedia community understand the experience of people editing Wikipedia.
3737 For more information, please visit the $1.',
3838 'moodbar-what-link' => 'feature page',
@@ -40,6 +40,8 @@
4141 'moodbar-form-note' => '140 character maximum',
4242 'moodbar-form-note-dynamic' => '$1 characters remaining',
4343 'moodbar-form-submit' => 'Send Feedback ▶',
 44+ 'moodbar-form-policy-text' => 'By submitting, $1',
 45+ 'moodbar-form-policy-label' => 'our policy',
4446 // Special:MoodBar
4547 'right-moodbar-view' => 'View and export MoodBar feedback',
4648 'moodbar-admin-title' => 'MoodBar feedback',
@@ -91,6 +93,14 @@
9294 * {{msg|moodbar-what-label}}',
9395 'moodbar-what-target' => 'Complete URL (including http://) or article name where more info can be found.',
9496 'moodbar-what-label' => 'Link text for the page where more info abut MoodBar can be found.',
 97+ 'moodbar-form-policy-text' => 'Text displayed below the input area.
 98+
 99+See also:
 100+* {{msg|moodbar-form-policy-label}}',
 101+ 'moodbar-form-policy-label' => 'Label text for the link to the privacy policy,.
 102+
 103+See also:
 104+* {{msg|moodbar-form-policy-text}}',
95105 );
96106
97107 /** Message documentation (Message documentation)
Index: trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.core.css
@@ -1,5 +1,5 @@
22 /* Overlay styling */
3 -#mw-moodBar-overlay {
 3+#mw-moodBar-overlayWrap {
44 position: absolute;
55 top: 4em;
66 left: 10.2em;
@@ -8,11 +8,14 @@
99 background: #fafafa;
1010 border: 1px solid #0645ad;
1111 border-radius: 40px;
12 - padding: 22px 22px;
1312 box-shadow: 7px 7px 15px rgba(0, 0, 0, 0.5);
1413 display: none;
1514 }
1615
 16+#mw-moodBar-overlay {
 17+ margin: 22px 22px;
 18+}
 19+
1720 .mw-moodBar-overlayTitle {
1821 font-weight: bold;
1922 white-space: nowrap;
@@ -60,6 +63,7 @@
6164
6265 .mw-moodBar-formInput {
6366 width: 100%;
 67+ outline: none;
6468 }
6569
6670 .mw-moodBar-formSubmit {
Index: trunk/extensions/MoodBar/modules/ext.moodBar/ext.moodBar.core.js
@@ -10,7 +10,7 @@
1111
1212 tpl: {
1313 overlay: '\
14 - <div id="mw-moodBar-overlay">\
 14+ <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>\
1616 <div class="mw-moodBar-overlayTitle"><html:msg key="moodbar-intro-using" /></div>\
1717 <div class="mw-moodBar-types"></div>\
@@ -19,8 +19,9 @@
2020 <span class="mw-moodBar-formNote"><html:msg key="moodbar-form-note" /></span>\
2121 <html:msg key="moodbar-form-title" />\
2222 </div>\
23 - <input type="text" maxlength="140" class="mw-moodBar-formInput" />\
 23+ <textarea maxlength="140" class="mw-moodBar-formInput" /></textarea>\
2424 <input type="button" class="mw-moodBar-formSubmit" />\
 25+ \
2526 </div>\
2627 <span class="mw-moodBar-overlayWhat">\
2728 <a title-msg="tooltip-moodbar-what">\
@@ -29,7 +30,7 @@
3031 </a>\
3132 <div class="mw-moodBar-overlayWhatContent"></div>\
3233 </span>\
33 - </div>',
 34+ </div></div>',
3435 type: '\
3536 <div class="mw-moodBar-type mw-moodBar-type-$1" rel="$1">\
3637 <span class="mw-moodBar-typeTitle"><html:msg key="moodbar-type-$1-title" /></span>\
@@ -56,7 +57,7 @@
5758 alert(1);
5859 } else {
5960 alert(0);
60 - }
 61+ }
6162 }
6263 },
6364
@@ -93,7 +94,7 @@
9495 .removeClass( 'mw-moodBar-selected' );
9596 } )
9697 .get( 0 )
97 - );
 98+ );
9899 } );
99100 return elems;
100101 } )
@@ -128,19 +129,15 @@
129130 .html(
130131 function() {
131132 var message, linkMessage, link;
132 -
133 - message = mw.message('moodbar-what-content');
134 - linkMessage = mw.msg('moodbar-what-link');
135 - link = mw.html.element('a',
136 - {
137 - 'href' : mb.conf.infoUrl,
138 - 'title' : linkMessage
 133+
 134+ message = mw.message( 'moodbar-what-content' );
 135+ linkMessage = mw.msg( 'moodbar-what-link' );
 136+ link = mw.html.element( 'a', {
 137+ 'href': mb.conf.infoUrl,
 138+ 'title': linkMessage
139139 }, linkMessage );
140 -
141 - message = message.escaped();
142 - message = message.replace( /\$1/, link );
143 -
144 - return message;
 140+
 141+ return message.escaped().replace( /\$1/, link );
145142 }
146143 )
147144 .end()
@@ -148,15 +145,20 @@
149146 .find( '.mw-moodBar-formSubmit' )
150147 .val( mw.msg( 'moodbar-form-submit' ) )
151148 .click( function() {
152 -
 149+ mb.feedbackItem.comment = mb.ui.overlay.find( 'mw-moodBar-formInput' ).val();
153150 } )
154151 .end();
155152
156 - // Inject overlay
157 - mb.ui.overlay.appendTo( 'body' );
 153+ mb.ui.overlay
 154+ // Inject overlay
 155+ .appendTo( 'body' )
 156+ // Fix the width after the icons and titles are localized and inserted
 157+ .width( function( i, width ) {
 158+ return width;
 159+ } );
158160
159161 // Bind triger
160 - mb.ui.trigger.click( mb.event.trigger );
 162+ mb.ui.trigger.click( mb.event.trigger );
161163 }
162164 } );
163165
Index: trunk/extensions/MoodBar/MoodBar.php
@@ -81,6 +81,8 @@
8282 'moodbar-form-title',
8383 'moodbar-form-note',
8484 'moodbar-form-note-dynamic',
 85+ 'moodbar-form-policy-text',
 86+ 'moodbar-form-policy-label',
8587 'moodbar-form-submit',
8688 ),
8789 'dependencies' => array(

Status & tagging log