r103276 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r103275‎ | r103276 | r103277 >
Date:01:07, 16 November 2011
Author:krinkle
Status:ok (Comments)
Tags:
Comment:
[RL2] Implement "new category" ajax

*Implement "new category" ajax
-- Adds dynamic option at the bottom of the category dropdowb
-- When chosen shows the text input and focusses it
-- Onchange/onblur* of the input, update the gadget blob
-- When drop down isn't on the "new category" update category to chosen option in gadget blob

* Other minor changes
-- comment fixes, optimalization, clean up

* Note: .hide() is called on the input, no problem with flashing here since all this is build off-DOM before the dialog even appears.

* TODO: Verify this works properly in older versions of IE.
Modified paths:
  • /branches/RL2/extensions/Gadgets/Gadgets.i18n.php (modified) (history)
  • /branches/RL2/extensions/Gadgets/Gadgets.php (modified) (history)
  • /branches/RL2/extensions/Gadgets/modules/ext.gadgets.gadgetmanager.js (modified) (history)
  • /branches/RL2/extensions/Gadgets/modules/ext.gadgets.specialgadgets.tabs.js (modified) (history)

Diff [purge]

Index: branches/RL2/extensions/Gadgets/Gadgets.i18n.php
@@ -90,6 +90,7 @@
9191 'gadgetmanager-prop-dependencies' => 'Dependencies',
9292 'gadgetmanager-prop-messages' => 'Messages',
9393 'gadgetmanager-prop-category' => 'Category',
 94+ 'gadgetmanager-prop-category-new' => 'New category...',
9495 'gadgetmanager-prop-rights' => 'Required user rights',
9596 'gadgetmanager-prop-default' => 'Enable by default',
9697 'gadgetmanager-prop-hidden' => 'Hide gadget',
@@ -219,7 +220,12 @@
220221 # For the ext.gadgets.gadgetmanager module
221222 'gadgets-gadget-create' => 'Identical to core:
222223 * {{mw-msg|vector-view-create}}
223 -* {{mw-msg|create}}',
 224+* {{mw-msg|create}}
 225+
 226+{{Output|plain}}',
 227+ 'gadgetmanager-prop-category-new' => 'Special option in the "Category" drop down menu. When selected an input field appears allowing the user to create a new (custom) category. Should and in ellipsis ("...") or something like it appropiate for the target language.
 228+
 229+{{Output|plain}}',
224230 'gadgetmanager-comment-modify' => 'Edit summary used when modifying gadget definition pages through AJAX on [[Special:Gadgets]].',
225231 'gadgetmanager-comment-create' => 'Edit summary used when creating gadget definition pages through AJAX on [[Special:Gadgets]].',
226232
Index: branches/RL2/extensions/Gadgets/Gadgets.php
@@ -232,6 +232,7 @@
233233 'gadgetmanager-prop-dependencies',
234234 'gadgetmanager-prop-messages',
235235 'gadgetmanager-prop-category',
 236+ 'gadgetmanager-prop-category-new',
236237 'gadgetmanager-prop-rights',
237238 'gadgetmanager-prop-default',
238239 'gadgetmanager-prop-hidden',
Index: branches/RL2/extensions/Gadgets/modules/ext.gadgets.gadgetmanager.js
@@ -48,7 +48,7 @@
4949 <table>\
5050 <tr>\
5151 <td class="mw-gadgetmanager-label"><label for="mw-gadgetmanager-input-category"><html:msg key="gadgetmanager-prop-category" /></label></td>\
52 - <td><select id="mw-gadgetmanager-input-category"></select></td>\
 52+ <td><select id="mw-gadgetmanager-input-category"></select><input type="text" id="mw-gadgetmanager-input-category-new" /></td>\
5353 </tr>\
5454 <tr>\
5555 <td class="mw-gadgetmanager-label"><label for="mw-gadgetmanager-input-rights"><html:msg key="gadgetmanager-prop-rights" /></label></td>\
@@ -340,7 +340,8 @@
341341 var metadata = gadget.metadata,
342342 $form = $( tpl.fancyForm ).localize(),
343343 $idSpan = $form.find( '.mw-gadgetmanager-id' ),
344 - $idErrMsg = $form.find( '.mw-gadgetmanager-id-errorbox' );
 344+ $idErrMsg = $form.find( '.mw-gadgetmanager-id-errorbox' ),
 345+ $newCatInput = $form.find( '#mw-gadgetmanager-input-category-new' );
345346
346347 if ( mode === 'create' ) {
347348
@@ -556,19 +557,35 @@
557558 var current = metadata.settings.category,
558559 opts = '',
559560 i = 0,
 561+ catslen = categories.length,
560562 cat;
561 - for ( ; i < categories.length; i++ ) {
 563+ for ( ; i < catslen; i++ ) {
562564 cat = categories[i];
563565 opts += mw.html.element( 'option', {
564566 value: cat.name,
565567 selected: cat.name === current
566568 }, cat.title );
567569 }
 570+ opts += '<option disabled="disabled">-------</option>'
 571+ + '<option data-gadgets-new-category="true">' + mw.message( 'gadgetmanager-prop-category-new' ).escaped() + '</option>';
568572 return opts;
569 - }).change( function() {
570 - metadata.settings.category = $(this).val();
 573+ }).bind( 'change', function() {
 574+ if ( $(this).children( ':selected' ).data( 'gadgetsNewCategory' ) === true ) {
 575+ metadata.settings.category = $newCatInput.val();
 576+ $newCatInput.show().focus();
 577+ } else {
 578+ metadata.settings.category = $(this).val();
 579+ $newCatInput.hide();
 580+ }
571581 });
572582
 583+ $newCatInput
 584+ .hide()
 585+ .prop( 'placeholder', mw.msg( 'gadgetmanager-prop-category-new' ) )
 586+ .bind( 'blur change', function(){
 587+ metadata.settings.category = $(this).val();
 588+ });
 589+
573590 // Gadget settings: rights
574591 $form.find( '#mw-gadgetmanager-input-rights' ).createPropCloud({
575592 props: metadata.settings.rights,
Index: branches/RL2/extensions/Gadgets/modules/ext.gadgets.specialgadgets.tabs.js
@@ -17,7 +17,7 @@
1818 mw.msg( 'gadgets-gadget-create' ),
1919 'ca-create', // Use whatever core has for pages ? Or use gadget-create ?
2020 mw.msg( 'gadgets-gadget-create-tooltip' ),
21 - 'e' // Same as core for ca-edit
 21+ 'e' // Same as core for ca-edit/ca-create
2222 );
2323 $( createTab ).click( function( e ) {
2424 e.preventDefault();

Follow-up revisions

RevisionCommit summaryAuthorDate
r106522[RL2] Clarify message docs added in r103276catrope19:12, 17 December 2011

Comments

#Comment by Catrope (talk | contribs)   19:32, 17 December 2011
+				.prop( 'placeholder', mw.msg( 'gadgetmanager-prop-category-new' ) )

If you intend for this to work in browsers that don't support the placeholder attribute (I see Firefox supports it nowadays, I didn't know that), you need to use jquery.placeholder's emulation. Call .placeholder() after setting the property, and add a dependency on jquery.placeholder . That said, the placeholder isn't very important, so we can probably afford not to do the emulation.

Status & tagging log