r104629 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:< r104628‎ | r104629 | r104630 >
Date:00:18, 30 November 2011
Author:rsterbin
Status:deferred (Comments)
Tags:
Comment:
Rearranged the jquery plugin a bit to pull markup into its own section:
- Added $.articleFeedbackv5.templates with the help tooltip and the generic
clear block
- Added $.articleFeedbackv5.enableSubmission() with the shared
functionality and a call to a bucket-specific version, if one exists
- For each bucket:
- Created a templates object with the block markup, as well as tag
markup for bucket 2 and rating markup for bucket 5
- Updated buildForm() to get the template from templates.block
- Updated buildForm() to pull in the template for the tooltip where
appropriate
- Removed enableSubmission(), except for bucket 5 where it does
something special

First pass with bucket 3:
- ArticleFeedbackv5.i18n.php:
- Added bucket3 messages
- ArticleFeedbackv5.hooks.php:
- Updated message tags passed to modules
- modules/jquery.articleFeedbackv5/jquery.articleFeedbackv5.js:
- $.articleFeedbackv5.buckets[3]:
- Cleaned up markup to add templates where needed
- Updated buildForm() to set the ratings labels
- Updated bindEvents() to add the mouseover/out/down for ratings,
the clear button, and switching out the default text

Added bucket 4 messages to ArticleFeedbackv5.i18n.php
Set a default tag on bucket 2
Modified paths:
  • /trunk/extensions/ArticleFeedbackv5/ArticleFeedbackv5.hooks.php (modified) (history)
  • /trunk/extensions/ArticleFeedbackv5/ArticleFeedbackv5.i18n.php (modified) (history)
  • /trunk/extensions/ArticleFeedbackv5/modules/jquery.articleFeedbackv5/jquery.articleFeedbackv5.js (modified) (history)

Diff [purge]

Index: trunk/extensions/ArticleFeedbackv5/ArticleFeedbackv5.i18n.php
——@@ -54,6 +54,21 @@
5555 'articlefeedbackv5-bucket2-problem-comment-default' => 'Report a problem. How can this article be improved?',
5656 'articlefeedbackv5-bucket2-praise-comment-default' => 'What do you like most? Share your praise with the editors',
5757 'articlefeedbackv5-bucket2-form-submit' => 'Post Your Feedback',
 58+ 'articlefeedbackv5-bucket3-title' => 'Help improve this article',
 59+ 'articlefeedbackv5-bucket3-rating-question' => 'How would you rate this article?',
 60+ 'articlefeedbackv5-bucket3-rating-tooltip-1' => 'Incomprehensible',
 61+ 'articlefeedbackv5-bucket3-rating-tooltip-2' => 'Difficult to understand',
 62+ 'articlefeedbackv5-bucket3-rating-tooltip-3' => 'Adequate clarity',
 63+ 'articlefeedbackv5-bucket3-rating-tooltip-4' => 'Good clarity',
 64+ 'articlefeedbackv5-bucket3-rating-tooltip-5' => 'Exceptional clarity',
 65+ 'articlefeedbackv5-bucket3-comment-default' => 'Add a comment. How can this article be improved?',
 66+ 'articlefeedbackv5-bucket3-form-submit' => 'Post Your Feedback',
 67+ 'articlefeedbackv5-bucket4-title' => 'Help improve this article',
 68+ 'articlefeedbackv5-bucket4-subhead' => 'Did you know that you can edit this page?',
 69+ 'articlefeedbackv5-bucket4-teaser-line1' => 'Wikipedia works because anyone can edit its articles.',
 70+ 'articlefeedbackv5-bucket4-teaser-line2' => 'Go ahead, give it a try. Be bold!',
 71+ 'articlefeedbackv5-bucket4-learn-to-edit' => 'Learn how to edit',
 72+ 'articlefeedbackv5-bucket4-form-submit' => 'Edit this page',
5873 'articlefeedbackv5-bucket5-form-success' => 'Saved successfully',
5974 'articlefeedbackv5-shared-on-feedback' => 'Your comment will be shared on this $1.',
6075 'articlefeedbackv5-shared-on-feedback-linktext' => 'feedback page',
Index: trunk/extensions/ArticleFeedbackv5/modules/jquery.articleFeedbackv5/jquery.articleFeedbackv5.js
——@@ -110,6 +110,28 @@
111111 $.articleFeedbackv5.feedbackId = 0;
112112
113113 // }}}
 114+ // {{{ Templates shared by multiple buckets/ctas
 115+
 116+ $.articleFeedbackv5.templates = {
 117+
 118+ helpToolTip: '\
 119+ <a class="articleFeedbackv5-tooltip-trigger"></a>\
 120+ <div class="articleFeedbackv5-tooltip">\
 121+ <div class="tooltip-top"></div>\
 122+ <div class="tooltip-repeat">\
 123+ <h3><html:msg key="help-tooltip-title" /></h3>\
 124+ <p><html:msg key="help-tooltip-info" /></p>\
 125+ <p><a target="_blank" href="http://www.mediawiki.org/wiki/Article_feedback/Version_5"><html:msg key="help-tooltip-linktext" /></a></p>\
 126+ </div>\
 127+ <div class="tooltip-bottom"></div>\
 128+ </div>\
 129+ ',
 130+
 131+ clear: '<div class="clear"></div>'
 132+
 133+ };
 134+
 135+ // }}}
114136 // {{{ Bucket UI objects
115137
116138 /**
——@@ -132,31 +154,20 @@
133155 */
134156 '1': {
135157
136 - // {{{ buildForm
 158+ // {{{ templates
137159
138160 /**
139 - * Builds the empty form
140 - *
141 - * @return Element the form
 161+ * Pull out the markup so it's easy to find
142162 */
143 - buildForm: function () {
 163+ templates: {
144164
145 - // The overall template
146 - var block_tpl = '\
 165+ /**
 166+ * The template for the whole block
 167+ */
 168+ block: '\
147169 <form>\
148170 <div class="title-wrap">\
149171 <h2 class="articleFeedbackv5-title"><html:msg key="bucket1-title" /></h2>\
150 - <a class="articleFeedbackv5-tooltip-trigger"></a>\
151 - <div class="articleFeedbackv5-tooltip">\
152 - <div class="tooltip-top"></div>\
153 - <div class="tooltip-repeat">\
154 - <h3><html:msg key="help-tooltip-title" /></h3>\
155 - <p><html:msg key="help-tooltip-info" /></p>\
156 - <p><a target="_blank" href="http://www.mediawiki.org/wiki/Article_feedback/Version_5"><html:msg key="help-tooltip-linktext" /></a></p>\
157 - </div>\
158 - <div class="tooltip-bottom"></div>\
159 - </div>\
160 - <div class="clear"></div>\
161172 </div>\
162173 <div class="form-row articleFeedbackv5-bucket1-toggle">\
163174 <p class="instructions-left"><html:msg key="bucket1-question-toggle" /></p>\
——@@ -185,10 +196,28 @@
186197 <button class="articleFeedbackv5-submit" type="submit" disabled="disabled"><html:msg key="bucket1-form-submit" /></button>\
187198 <div class="clear"></div>\
188199 </form>\
189 - ';
 200+ '
 201+
 202+ },
 203+
 204+ // }}}
 205+ // {{{ buildForm
 206+
 207+ /**
 208+ * Builds the empty form
 209+ *
 210+ * @return Element the form
 211+ */
 212+ buildForm: function () {
 213+
190214 // Start up the block to return
191 - var $block = $( block_tpl );
 215+ var $block = $( $.articleFeedbackv5.currentBucket().templates.block );
192216
 217+ // Add the help tooltip to the title
 218+ $block.find( '.title-wrap' )
 219+ .append( $.articleFeedbackv5.templates.helpToolTip )
 220+ .append( $.articleFeedbackv5.templates.clear );
 221+
193222 // Start out the tooltip hidden
194223 $block.find( '.articleFeedbackv5-tooltip' ).hide();
195224
——@@ -260,7 +289,7 @@
261290 $txt.val( new_val == 'yes' ? def_msg_yes : def_msg_no );
262291 }
263292 // enable submission
264 - $.articleFeedbackv5.currentBucket().enableSubmission( true );
 293+ $.articleFeedbackv5.enableSubmission( true );
265294 } );
266295
267296 // Clear out the question on focus
——@@ -291,7 +320,7 @@
292321 $( this ).val( def_msg );
293322 $(this).removeClass( 'active' );
294323 } else {
295 - $.articleFeedbackv5.currentBucket().enableSubmission( true );
 324+ $.articleFeedbackv5.enableSubmission( true );
296325 }
297326 } );
298327
——@@ -305,29 +334,6 @@
306335 },
307336
308337 // }}}
309 - // {{{ enableSubmission
310 -
311 - /**
312 - * Enables or disables submission of the form
313 - *
314 - * @param state bool true to enable; false to disable
315 - */
316 - enableSubmission: function ( state ) {
317 - var $h = $.articleFeedbackv5.$holder;
318 - if ( state ) {
319 - if ($.articleFeedbackv5.successTimeout) {
320 - clearTimeout( $.articleFeedbackv5.successTimeout );
321 - }
322 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': false } );
323 - $h.find( '.articleFeedbackv5-success span' ).hide();
324 - $h.find( '.articleFeedbackv5-pending span' ).fadeIn( 'fast' );
325 - } else {
326 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': true } );
327 - $h.find( '.articleFeedbackv5-pending span' ).hide();
328 - }
329 - },
330 -
331 - // }}}
332338 // {{{ getFormData
333339
334340 /**
——@@ -398,7 +404,7 @@
399405 $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-success span' )
400406 .fadeOut( 'slow' );
401407 }, 5000 );
402 - },
 408+ }
403409
404410 // }}}
405411
——@@ -425,39 +431,20 @@
426432 commentDefault: {},
427433
428434 // }}}
429 - // {{{ buildForm
 435+ // {{{ templates
430436
431437 /**
432 - * Builds the empty form
433 - *
434 - * @return Element the form
 438+ * Pull out the markup so it's easy to find
435439 */
436 - buildForm: function () {
 440+ templates: {
437441
438 - // The overall template
439 - var block_tpl = '\
 442+ /**
 443+ * The template for the whole block
 444+ */
 445+ block: '\
440446 <form>\
441447 <div class="title-wrap">\
442 - <h2 class="articleFeedbackv5-title">\
443 - <html:msg key="bucket2-title" />\
444 - </h2>\
445 - <a class="articleFeedbackv5-tooltip-trigger"></a>\
446 - <div class="articleFeedbackv5-tooltip">\
447 - <div class="tooltip-top"></div>\
448 - <div class="tooltip-repeat">\
449 - <h3>\
450 - <html:msg key="help-tooltip-title" />\
451 - </h3>\
452 - <p>\
453 - <html:msg key="help-tooltip-info" />\
454 - </p>\
455 - <p><a target="_blank" href="http://www.mediawiki.org/wiki/Article_feedback/Version_5">\
456 - <html:msg key="help-tooltip-linktext" />\
457 - </a></p>\
458 - </div>\
459 - <div class="tooltip-bottom"></div>\
460 - </div>\
461 - <div class="clear"></div>\
 448+ <h2 class="articleFeedbackv5-title"><html:msg key="bucket2-title" /></h2>\
462449 </div>\
463450 <div>\
464451 <div class="articleFeedbackv5-tags">\
——@@ -478,19 +465,35 @@
479466 </button>\
480467 <div class="clear"></div>\
481468 </form>\
482 - ';
 469+ ',
483470
484 - var tag_tpl = '\
 471+
 472+ /**
 473+ * The template for a single tag
 474+ */
 475+ tag: '\
485476 <li>\
486477 <span class="tag-selector"></span>\
487478 <label class="articleFeedbackv5-tag-label"></label>\
488479 <input name="articleFeedbackv5-bucket2-tag" type="radio" class="articleFeedbackv5-tag-input" />\
489480 <span class="clear"></span>\
490481 </li>\
491 - ';
 482+ '
492483
 484+ },
 485+
 486+ // }}}
 487+ // {{{ buildForm
 488+
 489+ /**
 490+ * Builds the empty form
 491+ *
 492+ * @return Element the form
 493+ */
 494+ buildForm: function () {
 495+
493496 // Start up the block to return
494 - var $block = $( block_tpl );
 497+ var $block = $( $.articleFeedbackv5.currentBucket().templates.block );
495498
496499 // Add the tags from the options
497500 $block.find( '.articleFeedbackv5-tags ul' ).each( function () {
——@@ -501,7 +504,7 @@
502505 $.articleFeedbackv5.currentBucket().commentDefault[key] = mw.msg( comm_def_msg );
503506 var label_msg = 'articlefeedbackv5-bucket2-' + key + '-label';
504507 var tag_id = 'articleFeedbackv5-bucket2-' + key;
505 - var $tag = $( tag_tpl );
 508+ var $tag = $( $.articleFeedbackv5.currentBucket().templates.tag );
506509 $tag.attr( 'rel', key );
507510 $tag.find( '.articleFeedbackv5-tag-input' )
508511 .attr( 'id', tag_id )
——@@ -512,9 +515,15 @@
513516 .text( mw.msg( label_msg ) );
514517 $tag.appendTo( $( this ) );
515518 }
516 - $( '<li class="clear"></li>' ).appendTo( $( this ) );
 519+ $( $.articleFeedbackv5.templates.clear ).appendTo( $( this ) );
 520+
517521 } );
518522
 523+ // Add the help tooltip to the title
 524+ $block.find( '.title-wrap' )
 525+ .append( $.articleFeedbackv5.templates.helpToolTip )
 526+ .append( $.articleFeedbackv5.templates.clear );
 527+
519528 // Start out the tooltip hidden
520529 $block.find( '.articleFeedbackv5-tooltip' ).hide();
521530
——@@ -560,12 +569,17 @@
561570 */
562571 bindEvents: function ( $block ) {
563572
 573+ // Tooltip
 574+ $block.find( '.articleFeedbackv5-tooltip-trigger' ).click( function () {
 575+ $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-tooltip' ).toggle();
 576+ } );
 577+
564578 // Enable submission and switch out the comment default on toggle selection
565579 $block.find( '.articleFeedbackv5-tags li' )
566580 .click( function ( e ) {
567581 var new_val = $( this ).attr( 'rel' );
568582 $.articleFeedbackv5.currentBucket().selectTag( new_val );
569 - $.articleFeedbackv5.currentBucket().enableSubmission( true );
 583+ $.articleFeedbackv5.enableSubmission( true );
570584 } );
571585
572586 // Clear out the question on focus
——@@ -573,13 +587,10 @@
574588 .focus( function () {
575589 var key = $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-tags input[checked]' ).val();
576590 var def_msg = $.articleFeedbackv5.currentBucket().commentDefault[key];
577 - console.log( key );
578 - console.log( def_msg );
579591 if ( $( this ).val() == def_msg ) {
580592 $( this ).val( '' );
581593 $(this).addClass( 'active' );
582594 }
583 -
584595 })
585596 .blur( function () {
586597 var key = $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-tags input[checked]' ).val();
——@@ -588,7 +599,7 @@
589600 $( this ).val( def_msg );
590601 $(this).removeClass( 'active' );
591602 } else {
592 - $.articleFeedbackv5.currentBucket().enableSubmission( true );
 603+ $.articleFeedbackv5.enableSubmission( true );
593604 }
594605 } );
595606
——@@ -602,6 +613,20 @@
603614 },
604615
605616 // }}}
 617+ // {{{ afterBuild
 618+
 619+ /**
 620+ * Handles any setup that has to be done once the markup is in the
 621+ * holder
 622+ */
 623+ afterBuild: function () {
 624+
 625+ // Default to 'suggestion'
 626+ $.articleFeedbackv5.currentBucket().selectTag( 'suggestion' );
 627+
 628+ },
 629+
 630+ // }}}
606631 // {{{ selectTag
607632
608633 /**
——@@ -644,29 +669,6 @@
645670 },
646671
647672 // }}}
648 - // {{{ enableSubmission
649 -
650 - /**
651 - * Enables or disables submission of the form
652 - *
653 - * @param state bool true to enable; false to disable
654 - */
655 - enableSubmission: function ( state ) {
656 - var $h = $.articleFeedbackv5.$holder;
657 - if ( state ) {
658 - if ($.articleFeedbackv5.successTimeout) {
659 - clearTimeout( $.articleFeedbackv5.successTimeout );
660 - }
661 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': false } );
662 - $h.find( '.articleFeedbackv5-success span' ).hide();
663 - $h.find( '.articleFeedbackv5-pending span' ).fadeIn( 'fast' );
664 - } else {
665 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': true } );
666 - $h.find( '.articleFeedbackv5-pending span' ).hide();
667 - }
668 - },
669 -
670 - // }}}
671673 // {{{ getFormData
672674
673675 /**
——@@ -729,7 +731,7 @@
730732 $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-success span' )
731733 .fadeOut( 'slow' );
732734 }, 5000 );
733 - },
 735+ }
734736
735737 // }}}
736738
——@@ -743,56 +745,37 @@
744746 */
745747 '3': {
746748
747 - // {{{ buildForm
 749+ // {{{ templates
748750
749751 /**
750 - * Builds the empty form
751 - *
752 - * @return Element the form
 752+ * Pull out the markup so it's easy to find
753753 */
754 - buildForm: function () {
 754+ templates: {
755755
756 - // The overall template
757 - var block_tpl = '\
 756+ /**
 757+ * The template for the whole block
 758+ */
 759+ block: '\
758760 <form>\
759761 <div class="title-wrap">\
760 - <h2 class="articleFeedbackv5-title">\
761 - <html:msg key="bucket3-title" />\
762 - </h2>\
763 - <a class="articleFeedbackv5-tooltip-trigger"></a>\
764 - <div class="articleFeedbackv5-tooltip">\
765 - <div class="tooltip-top"></div>\
766 - <div class="tooltip-repeat">\
767 - <h3>\
768 - <html:msg key="help-tooltip-title" />\
769 - </h3>\
770 - <p>\
771 - <html:msg key="help-tooltip-info" />\
772 - </p>\
773 - <p><a target="_blank" href="http://www.mediawiki.org/wiki/Article_feedback/Version_5">\
774 - <html:msg key="help-tooltip-linktext" />\
775 - </a></p>\
776 - </div>\
777 - <div class="tooltip-bottom"></div>\
778 - </div>\
779 - <div class="clear"></div>\
 762+ <h2 class="articleFeedbackv5-title"><html:msg key="bucket3-title" /></h2>\
780763 </div>\
781764 <div>\
782 - <p class="instructions-left">\
783 - <html:msg key="bucket3-question-toggle" />\
784 - </p>\
785 - <div class="articleFeedbackv5-rating articleFeedbackv5-rating-new" rel="trustworthy">\
786 - <span class="articleFeedbackv5-rating-prompt">How would you rate this article?</span>\
787 - <input type="hidden" name="r1" value="2">\
 765+ <p class="instructions-left"><html:msg key="bucket3-rating-question" /></p>\
 766+ <div class="articleFeedbackv5-rating articleFeedbackv5-rating-new">\
 767+ <input type="hidden" name="rating" value="0">\
788768 <div class="articleFeedback-rating-labels articleFeedback-visibleWith-form">\
789 - <div class="articleFeedbackv5-rating-label articleFeedback-rating-label-full" rel="1"></div>\
790 - <div class="articleFeedbackv5-rating-label articleFeedback-rating-label-full" rel="2"></div>\
 769+ <div class="articleFeedbackv5-rating-label" rel="1"></div>\
 770+ <div class="articleFeedbackv5-rating-label" rel="2"></div>\
791771 <div class="articleFeedbackv5-rating-label" rel="3"></div>\
792772 <div class="articleFeedbackv5-rating-label" rel="4"></div>\
793773 <div class="articleFeedbackv5-rating-label" rel="5"></div>\
794 - <div class="articleFeedback-rating-clear" original-title="Remove this rating" style="display: block; "></div>\
 774+ <div class="articleFeedbackv5-rating-clear" original-title="Remove this rating" style="display: block; "></div>\
795775 </div>\
796776 <div style="clear:both;"></div>\
 777+ <div class="articleFeedbackv5-visibleWith-form">\
 778+ <div class="articleFeedbackv5-rating-tooltip"></div>\
 779+ </div>\
797780 </div>\
798781 <div class="clear"></div>\
799782 </div>\
——@@ -803,18 +786,40 @@
804787 <p class="articlefeedbackv5-shared-on-feedback"></p>\
805788 <p class="articlefeedbackv5-transparency-terms"></p>\
806789 </div>\
807 - <button class="articleFeedbackv5-submit" type="submit" disabled="disabled">\
808 - <html:msg key="bucket3-form-submit" />\
809 - </button>\
 790+ <button class="articleFeedbackv5-submit" type="submit" disabled="disabled"><html:msg key="bucket3-form-submit" /></button>\
810791 <div class="clear"></div>\
811792 </form>\
812 - ';
 793+ '
 794+
 795+ },
 796+
 797+ // }}}
 798+ // {{{ buildForm
 799+
 800+ /**
 801+ * Builds the empty form
 802+ *
 803+ * @return Element the form
 804+ */
 805+ buildForm: function () {
 806+
813807 // Start up the block to return
814 - var $block = $( block_tpl );
 808+ var $block = $( $.articleFeedbackv5.currentBucket().templates.block );
815809
 810+ // Add the help tooltip to the title
 811+ $block.find( '.title-wrap' )
 812+ .append( $.articleFeedbackv5.templates.helpToolTip )
 813+ .append( $.articleFeedbackv5.templates.clear );
 814+
816815 // Start out the tooltip hidden
817816 $block.find( '.articleFeedbackv5-tooltip' ).hide();
818817
 818+ // Fill in the rating clear title
 819+ var clear_msg = mw.msg( 'articlefeedbackv5-bucket3-clear-rating' );
 820+ $block.find( '.articleFeedback-rating-clear' )
 821+ .attr( 'original-title', clear_msg ) // not sure what this is for... Sean?
 822+ .attr( 'title', clear_msg );
 823+
819824 // Fill in the disclosure text
820825 $block.find( '.articlefeedbackv5-shared-on-feedback' )
821826 .html( $.articleFeedbackv5.buildLink(
——@@ -836,6 +841,10 @@
837842 target: '_blank'
838843 } ) );
839844
 845+ // Start with a default comment
 846+ $block.find( '.articleFeedbackv5-comment textarea' )
 847+ .val( mw.msg( 'articlefeedbackv5-bucket3-comment-default' ) );
 848+
840849 // Localize the block
841850 $block.localize( { 'prefix': 'articlefeedbackv5-' } );
842851
——@@ -857,6 +866,86 @@
858867 */
859868 bindEvents: function ( $block ) {
860869
 870+ // Tooltip
 871+ $block.find( '.articleFeedbackv5-tooltip-trigger' ).click( function () {
 872+ $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-tooltip' ).toggle();
 873+ } );
 874+
 875+ // Set up rating behavior
 876+ var rlabel = $block.find( '.articleFeedbackv5-rating-label' );
 877+ rlabel.hover( function () {
 878+ // mouse on
 879+ var $el = $( this );
 880+ var $rating = $el.closest( '.articleFeedbackv5-rating' );
 881+ $el.addClass( 'articleFeedbackv5-rating-label-hover-head' );
 882+ $el.prevAll( '.articleFeedbackv5-rating-label' )
 883+ .addClass( 'articleFeedbackv5-rating-label-hover-tail' );
 884+ $rating.find( '.articleFeedbackv5-rating-tooltip' )
 885+ .text( mw.msg( 'articlefeedbackv5-bucket3-rating-tooltip-' + $el.attr( 'rel' ) ) )
 886+ .show();
 887+ }, function () {
 888+ // mouse off
 889+ var $el = $( this );
 890+ var $rating = $el.closest( '.articleFeedbackv5-rating' );
 891+ $el.removeClass( 'articleFeedbackv5-rating-label-hover-head' );
 892+ $el.prevAll( '.articleFeedbackv5-rating-label' )
 893+ .removeClass( 'articleFeedbackv5-rating-label-hover-tail' );
 894+ $rating.find( '.articleFeedbackv5-rating-tooltip' )
 895+ .hide();
 896+ $.articleFeedbackv5.currentBucket().updateRating( $rating );
 897+ });
 898+ rlabel.mousedown( function () {
 899+ $.articleFeedbackv5.enableSubmission( true );
 900+ var $h = $.articleFeedbackv5.$holder;
 901+ if ( $h.hasClass( 'articleFeedbackv5-expired' ) ) {
 902+ // Changing one means the rest will get submitted too
 903+ $h.removeClass( 'articleFeedbackv5-expired' );
 904+ $h.find( '.articleFeedbackv5-rating' )
 905+ .addClass( 'articleFeedbackv5-rating-new' );
 906+ }
 907+ var $el = $( this );
 908+ var $rating = $el.closest( '.articleFeedbackv5-rating' );
 909+ $rating.addClass( 'articleFeedbackv5-rating-new' );
 910+ $rating.find( 'input:hidden' ).val( $el.attr( 'rel' ) );
 911+ $el.addClass( 'articleFeedbackv5-rating-label-down' );
 912+ $el.nextAll()
 913+ .removeClass( 'articleFeedbackv5-rating-label-full' );
 914+ $el.parent().find( '.articleFeedbackv5-rating-clear' ).show();
 915+ } );
 916+ rlabel.mouseup( function () {
 917+ $(this).removeClass( 'articleFeedbackv5-rating-label-down' );
 918+ } );
 919+
 920+ // Icon to clear out the ratings
 921+ $block.find( '.articleFeedbackv5-rating-clear' )
 922+ .click( function () {
 923+ $.articleFeedbackv5.enableSubmission( true );
 924+ $(this).hide();
 925+ var $rating = $(this).closest( '.articleFeedbackv5-rating' );
 926+ $rating.find( 'input:hidden' ).val( 0 );
 927+ $.articleFeedbackv5.currentBucket().updateRating( $rating );
 928+ } );
 929+
 930+ // Clear out the question on focus
 931+ $block.find( '.articleFeedbackv5-comment textarea' )
 932+ .focus( function () {
 933+ var def_msg = mw.msg( 'articlefeedbackv5-bucket3-comment-default' );
 934+ if ( $( this ).val() == def_msg ) {
 935+ $( this ).val( '' );
 936+ $(this).addClass( 'active' );
 937+ }
 938+ })
 939+ .blur( function () {
 940+ var def_msg = mw.msg( 'articlefeedbackv5-bucket3-comment-default' );
 941+ if ( $( this ).val() == '' ) {
 942+ $( this ).val( def_msg );
 943+ $(this).removeClass( 'active' );
 944+ } else {
 945+ $.articleFeedbackv5.enableSubmission( true );
 946+ }
 947+ } );
 948+
 949+
861950 // Attach the submit
862951 $block.find( '.articleFeedbackv5-submit' )
863952 .click( function ( e ) {
——@@ -867,25 +956,27 @@
868957 },
869958
870959 // }}}
871 - // {{{ enableSubmission
 960+ // {{{ updateRating
872961
873962 /**
874 - * Enables or disables submission of the form
 963+ * Updates the stars to match the associated hidden field
875964 *
876 - * @param state bool true to enable; false to disable
 965+ * @param $rating the rating block
877966 */
878 - enableSubmission: function ( state ) {
879 - var $h = $.articleFeedbackv5.$holder;
880 - if ( state ) {
881 - if ($.articleFeedbackv5.successTimeout) {
882 - clearTimeout( $.articleFeedbackv5.successTimeout );
883 - }
884 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': false } );
885 - $h.find( '.articleFeedbackv5-success span' ).hide();
886 - $h.find( '.articleFeedbackv5-pending span' ).fadeIn( 'fast' );
 967+ updateRating: function ( $rating ) {
 968+ $rating.find( '.articleFeedbackv5-rating-label' )
 969+ .removeClass( 'articleFeedbackv5-rating-label-full' );
 970+ var val = $rating.find( 'input:hidden' ).val();
 971+ var $label = $rating.find( '.articleFeedbackv5-rating-label[rel="' + val + '"]' );
 972+ if ( $label.length ) {
 973+ $label.prevAll( '.articleFeedbackv5-rating-label' )
 974+ .add( $label )
 975+ .addClass( 'articleFeedbackv5-rating-label-full' );
 976+ $label.nextAll( '.articleFeedbackv5-rating-label' )
 977+ .removeClass( 'articleFeedbackv5-rating-label-full' );
 978+ $rating.find( '.articleFeedbackv5-rating-clear' ).show();
887979 } else {
888 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': true } );
889 - $h.find( '.articleFeedbackv5-pending span' ).hide();
 980+ $rating.find( '.articleFeedbackv5-rating-clear' ).hide();
890981 }
891982 },
892983
——@@ -952,7 +1043,7 @@
9531044 $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-success span' )
9541045 .fadeOut( 'slow' );
9551046 }, 5000 );
956 - },
 1047+ }
9571048
9581049 // }}}
9591050
——@@ -966,47 +1057,54 @@
9671058 */
9681059 '4': {
9691060
970 - // {{{ buildForm
 1061+ // {{{ templates
9711062
9721063 /**
973 - * Builds the empty form
974 - *
975 - * @return Element the form
 1064+ * Pull out the markup so it's easy to find
9761065 */
977 - buildForm: function () {
 1066+ templates: {
9781067
979 - // The overall template
980 - var block_tpl = '\
 1068+ /**
 1069+ * The template for the whole block
 1070+ */
 1071+ block: '\
9811072 <form>\
9821073 <div class="title-wrap">\
9831074 <h2 class="articleFeedbackv5-title"><html:msg key="bucket4-title" /></h2>\
984 - <a class="articleFeedbackv5-tooltip-trigger"></a>\
985 - <div class="articleFeedbackv5-tooltip">\
986 - <div class="tooltip-top"></div>\
987 - <div class="tooltip-repeat">\
988 - <h4><html:msg key="help-tooltip-title" /></h4>\
989 - <p><html:msg key="help-tooltip-info" /></p>\
990 - <p><a target="_blank" href="http://www.mediawiki.org/wiki/Article_feedback/Version_5"><html:msg key="help-tooltip-linktext" /></a></p>\
991 - </div>\
992 - <div class="tooltip-bottom"></div>\
993 - </div>\
994 - <div class="clear"></div>\
9951075 </div>\
9961076 <div class="form-row articleFeedbackv5-bucket4-toggle">\
9971077 <h3><html:msg key="bucket4-subhead"></h3>\
9981078 <p class="instructions-left"><html:msg key="bucket4-teaser-line1" /><br />\
999 - <html:msg key="bucket4-teaser-line1" /></p>\
 1079+ <html:msg key="bucket4-teaser-line2" /></p>\
10001080 </div>\
10011081 <div class="articleFeedbackv5-disclosure">\
1002 - <p><a class="articleFeedbackv5-learn-to-edit" target="_blank"><html:msg key="bucket4-learn-to-edit"></a></p>\
 1082+ <p><a class="articleFeedbackv5-learn-to-edit" target="_blank"><html:msg key="bucket4-learn-to-edit"> &gt;&gt;</a></p>\
10031083 </div>\
10041084 <a class="articleFeedbackv5-submit"><html:msg key="bucket4-form-submit" /></a>\
10051085 <div class="clear"></div>\
10061086 </form>\
1007 - ';
 1087+ '
 1088+
 1089+ },
 1090+
 1091+ // }}}
 1092+ // {{{ buildForm
 1093+
 1094+ /**
 1095+ * Builds the empty form
 1096+ *
 1097+ * @return Element the form
 1098+ */
 1099+ buildForm: function () {
 1100+
10081101 // Start up the block to return
1009 - var $block = $( block_tpl );
 1102+ var $block = $( $.articleFeedbackv5.currentBucket().templates.block );
10101103
 1104+ // Add the help tooltip to the title
 1105+ $block.find( '.title-wrap' )
 1106+ .append( $.articleFeedbackv5.templates.helpToolTip )
 1107+ .append( $.articleFeedbackv5.templates.clear );
 1108+
10111109 // Start out the tooltip hidden
10121110 $block.find( '.articleFeedbackv5-tooltip' ).hide();
10131111
——@@ -1035,6 +1133,23 @@
10361134 .addClass( 'ui-button-blue' )
10371135
10381136 return $block;
 1137+ },
 1138+
 1139+ // }}}
 1140+ // {{{ bindEvents
 1141+
 1142+ /**
 1143+ * Binds any events
 1144+ *
 1145+ * @param $block element the form block
 1146+ */
 1147+ bindEvents: function ( $block ) {
 1148+
 1149+ // Tooltip
 1150+ $block.find( '.articleFeedbackv5-tooltip-trigger' ).click( function () {
 1151+ $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-tooltip' ).toggle();
 1152+ } );
 1153+
10391154 }
10401155
10411156 // }}}
——@@ -1071,17 +1186,17 @@
10721187 loadAggregate: true,
10731188
10741189 // }}}
1075 - // {{{ buildForm
 1190+ // {{{ templates
10761191
10771192 /**
1078 - * Builds the empty form
1079 - *
1080 - * @return Element the form
 1193+ * Pull out the markup so it's easy to find
10811194 */
1082 - buildForm: function () {
 1195+ templates: {
10831196
1084 - // The overall template
1085 - var block_tpl = '\
 1197+ /**
 1198+ * The template for the whole block
 1199+ */
 1200+ block: '\
10861201 <form>\
10871202 <div class="articleFeedbackv5-switch articleFeedbackv5-switch-report articleFeedbackv5-visibleWith-form" rel="report"><html:msg key="bucket5-report-switch-label" /></div>\
10881203 <div class="articleFeedbackv5-switch articleFeedbackv5-switch-form articleFeedbackv5-visibleWith-report" rel="form"><html:msg key="bucket5-form-switch-label" /></div>\
——@@ -1121,10 +1236,13 @@
11221237 </div>\
11231238 </div>\
11241239 </form>\
1125 - ';
 1240+ ',
11261241
1127 - // A single rating block
1128 - var rating_tpl = '\
 1242+
 1243+ /**
 1244+ * The template for a single rating
 1245+ */
 1246+ rating: '\
11291247 <div class="articleFeedbackv5-rating">\
11301248 <div class="articleFeedbackv5-label"></div>\
11311249 <input type="hidden" name="" />\
——@@ -1144,10 +1262,26 @@
11451263 <div class="articleFeedbackv5-rating-count articleFeedbackv5-visibleWith-report"></div>\
11461264 <div style="clear:both;"></div>\
11471265 </div>\
 1266+ '
 1267+
 1268+ },
 1269+
 1270+ // }}}
 1271+ // {{{ buildForm
 1272+
 1273+ /**
 1274+ * Builds the empty form
 1275+ *
 1276+ * @return Element the form
 1277+ */
 1278+ buildForm: function () {
 1279+
 1280+ // A single rating block
 1281+ var rating_tpl = '\
11481282 ';
11491283
11501284 // Start up the block to return
1151 - var $block = $( block_tpl );
 1285+ var $block = $( $.articleFeedbackv5.currentBucket().templates.block );
11521286
11531287 // Add the ratings from the options
11541288 $block.find( '.articleFeedbackv5-ratings' ).each( function () {
——@@ -1156,7 +1290,8 @@
11571291 var key = info[i];
11581292 var tip_msg = 'articlefeedbackv5-bucket5-' + key + '-tip';
11591293 var label_msg = 'articlefeedbackv5-bucket5-' + key + '-label';
1160 - var $rtg = $( rating_tpl ).attr( 'rel', key );
 1294+ var $rtg = $( $.articleFeedbackv5.currentBucket().templates.rating );
 1295+ $rtg.attr( 'rel', key );
11611296 $rtg.find( '.articleFeedbackv5-label' )
11621297 .attr( 'title', mw.msg( tip_msg ) )
11631298 .text( mw.msg( label_msg ) );
——@@ -1276,7 +1411,7 @@
12771412 .each( function () {
12781413 var id = 'articleFeedbackv5-expertise-' + $(this).attr( 'value' );
12791414 $(this).click( function () {
1280 - $.articleFeedbackv5.currentBucket().enableSubmission( true );
 1415+ $.articleFeedbackv5.enableSubmission( true );
12811416 } );
12821417 } );
12831418
——@@ -1338,8 +1473,7 @@
13391474 bucket.updateRating( $rating );
13401475 });
13411476 rlabel.mousedown( function () {
1342 - var bucket = $.articleFeedbackv5.currentBucket();
1343 - bucket.enableSubmission( true );
 1477+ $.articleFeedbackv5.enableSubmission( true );
13441478 var $h = $.articleFeedbackv5.$holder;
13451479 if ( $h.hasClass( 'articleFeedbackv5-expired' ) ) {
13461480 // Changing one means the rest will get submitted too
——@@ -1349,7 +1483,7 @@
13501484 }
13511485 $h.find( '.articleFeedbackv5-expertise' )
13521486 .each( function () {
1353 - bucket.enableExpertise( $(this) );
 1487+ $.articleFeedbackv5.currentBucket().enableExpertise( $(this) );
13541488 } );
13551489 var $el = $( this );
13561490 var $rating = $el.closest( '.articleFeedbackv5-rating' );
——@@ -1367,12 +1501,11 @@
13681502 // Icon to clear out the ratings
13691503 $block.find( '.articleFeedbackv5-rating-clear' )
13701504 .click( function () {
1371 - var bucket = $.articleFeedbackv5.currentBucket();
1372 - bucket.enableSubmission( true );
 1505+ $.articleFeedbackv5.enableSubmission( true );
13731506 $(this).hide();
13741507 var $rating = $(this).closest( '.articleFeedbackv5-rating' );
13751508 $rating.find( 'input:hidden' ).val( 0 );
1376 - bucket.updateRating( $rating );
 1509+ $.articleFeedbackv5.currentBucket().updateRating( $rating );
13771510 } );
13781511
13791512 },
——@@ -1413,14 +1546,9 @@
14141547 enableSubmission: function ( state ) {
14151548 var $h = $.articleFeedbackv5.$holder;
14161549 if ( state ) {
1417 - if ($.articleFeedbackv5.successTimeout) {
1418 - clearTimeout( $.articleFeedbackv5.successTimeout );
1419 - }
1420 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': false } );
14211550 $h.find( '.articleFeedbackv5-success span' ).hide();
14221551 $h.find( '.articleFeedbackv5-pending span' ).fadeIn( 'fast' );
14231552 } else {
1424 - $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': true } );
14251553 $h.find( '.articleFeedbackv5-pending span' ).hide();
14261554 }
14271555 },
——@@ -1884,6 +2012,27 @@
18852013 return full;
18862014 };
18872015
 2016+ /**
 2017+ * Utility method: Enables or disables submission of the form
 2018+ *
 2019+ * @param state bool true to enable; false to disable
 2020+ */
 2021+ $.articleFeedbackv5.enableSubmission = function ( state ) {
 2022+ var $h = $.articleFeedbackv5.$holder;
 2023+ if ( state ) {
 2024+ if ($.articleFeedbackv5.successTimeout) {
 2025+ clearTimeout( $.articleFeedbackv5.successTimeout );
 2026+ }
 2027+ $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': false } );
 2028+ } else {
 2029+ $h.find( '.articleFeedbackv5-submit' ).button( { 'disabled': true } );
 2030+ }
 2031+ var bucket = $.articleFeedbackv5.currentBucket();
 2032+ if ( 'enableSubmission' in bucket ) {
 2033+ bucket.enableSubmission( state );
 2034+ }
 2035+ };
 2036+
18882037 // }}}
18892038 // {{{ Form loading methods
18902039
——@@ -1956,6 +2105,10 @@
19572106 $.articleFeedbackv5.$holder
19582107 .html( $wrapper )
19592108 .append( '<div class="articleFeedbackv5-lock"></div>' );
 2109+
 2110+ if ( 'afterBuild' in bucket ) {
 2111+ bucket.afterBuild();
 2112+ }
19602113 };
19612114
19622115 // }}}
——@@ -2082,9 +2235,7 @@
20832236 */
20842237 $.articleFeedbackv5.lockForm = function () {
20852238 var bucket = $.articleFeedbackv5.currentBucket();
2086 - if ( 'enableSubmission' in bucket ) {
2087 - $.articleFeedbackv5.currentBucket().enableSubmission( false );
2088 - }
 2239+ $.articleFeedbackv5.enableSubmission( false );
20892240 $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-lock' ).show();
20902241 };
20912242
——@@ -2093,9 +2244,7 @@
20942245 */
20952246 $.articleFeedbackv5.unlockForm = function () {
20962247 var bucket = $.articleFeedbackv5.currentBucket();
2097 - if ( 'enableSubmission' in bucket ) {
2098 - $.articleFeedbackv5.currentBucket().enableSubmission( true );
2099 - }
 2248+ $.articleFeedbackv5.enableSubmission( true );
21002249 $.articleFeedbackv5.$holder.find( '.articleFeedbackv5-lock' ).hide();
21012250 };
21022251
Index: trunk/extensions/ArticleFeedbackv5/ArticleFeedbackv5.hooks.php
——@@ -73,7 +73,22 @@
7474 'articlefeedbackv5-bucket1-form-submit',
7575 'articlefeedbackv5-bucket2-title',
7676 'articlefeedbackv5-bucket2-form-submit',
77 -
 77+ 'articlefeedbackv5-bucket3-title',
 78+ 'articlefeedbackv5-bucket3-rating-question',
 79+ 'articlefeedbackv5-bucket3-clear-rating',
 80+ 'articlefeedbackv5-bucket3-rating-tooltip-1',
 81+ 'articlefeedbackv5-bucket3-rating-tooltip-2',
 82+ 'articlefeedbackv5-bucket3-rating-tooltip-3',
 83+ 'articlefeedbackv5-bucket3-rating-tooltip-4',
 84+ 'articlefeedbackv5-bucket3-rating-tooltip-5',
 85+ 'articlefeedbackv5-bucket3-comment-default',
 86+ 'articlefeedbackv5-bucket3-form-submit',
 87+ 'articlefeedbackv5-bucket4-title',
 88+ 'articlefeedbackv5-bucket4-subhead',
 89+ 'articlefeedbackv5-bucket4-teaser-line1',
 90+ 'articlefeedbackv5-bucket4-teaser-line2',
 91+ 'articlefeedbackv5-bucket4-learn-to-edit',
 92+ 'articlefeedbackv5-bucket4-form-submit',
7893 'articlefeedbackv5-bucket5-form-switch-label',
7994 'articlefeedbackv5-bucket5-form-panel-title',
8095 'articlefeedbackv5-bucket5-form-panel-explanation',

Follow-up revisions

RevisionCommit summaryAuthorDate
r104988Updated Option 3 and tooltip text, and added documentation lines for new mess...rsterbin18:50, 2 December 2011

Comments

#Comment by Johnduhart (talk | contribs)   14:06, 2 December 2011

Please add message documentation for the newly added messages. Thanks.

#Comment by Rsterbin (talk | contribs)   18:51, 2 December 2011

Done in r104988

Status & tagging log