Isarra has uploaded a new change for review. ( https://gerrit.wikimedia.org/r/332734 )
Change subject: ...I'm not sure what happened here. ...................................................................... ...I'm not sure what happened here. Was: Use addmodulestyles as an array to load all the damn styles Because everything works fine without js now and we shouldn't be using js for the base page layout stuff because that's stupid. Also now with arrays. We like arrays. And purple ink. Yes. Yes. Bug: ... what the crap, self. Change-Id: Iadabee28535159241a41354d2f2762987b2c01fb --- M CollaborationKit.hooks.php M extension.json M includes/CollaborationHubContentEditor.php M includes/CollaborationListContentEditor.php M includes/SpecialCreateCollaborationHub.php M includes/SpecialCreateHubFeature.php M includes/content/CollaborationHubContent.php M includes/content/CollaborationListContent.php M modules/ext.CollaborationKit.colour.js M modules/ext.CollaborationKit.edit.styles.less M modules/ext.CollaborationKit.hubimage.js M modules/ext.CollaborationKit.icon.js 12 files changed, 146 insertions(+), 136 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/CollaborationKit refs/changes/34/332734/1 diff --git a/CollaborationKit.hooks.php b/CollaborationKit.hooks.php index c27099e..a55e95b 100644 --- a/CollaborationKit.hooks.php +++ b/CollaborationKit.hooks.php @@ -107,9 +107,11 @@ $colour = Revision::newFromTitle( $parentHub )->getContent()->getThemeColour(); $text = Html::rawElement( 'div', [ 'class' => "mw-cklist-square-$colour" ], $text ); - $out->addModuleStyles( 'ext.CollaborationKit.hubsubpage.styles' ); - $out->addModules( 'ext.CollaborationKit.icons' ); - $out->addModules( 'ext.CollaborationKit.blots' ); + $out->addModuleStyles( [ + 'ext.CollaborationKit.hubsubpage.styles', + 'ext.CollaborationKit.icons', + 'ext.CollaborationKit.blots' + ] ); // Set this mostly just so we can make sure this entire thing hasn't already been done, because otherwise the ToC is added twice on edit for some reason $out->setProperty( 'CollaborationHubSubpage', true ); diff --git a/extension.json b/extension.json index 4b8d88d..427f70d 100644 --- a/extension.json +++ b/extension.json @@ -92,14 +92,8 @@ "ext.CollaborationKit.list.styles": { "styles": "ext.CollaborationKit.list.styles.less" }, - "zzext.CollaborationKit.edit.styles": { + "ext.CollaborationKit.edit.styles": { "styles": "ext.CollaborationKit.edit.styles.less" - }, - "ext.CollaborationKit.iconbrowser.styles": { - "styles": "ext.CollaborationKit.iconbrowser.styles.less" - }, - "ext.CollaborationKit.colourbrowser.styles": { - "styles": "ext.CollaborationKit.colourbrowser.styles.less" }, "ext.CollaborationKit.iconbrowser": { "scripts": "ext.CollaborationKit.icon.js", @@ -115,9 +109,10 @@ "collaborationkit-icon-select", "collaborationkit-icon-launchbutton", "cancel" - ] + ], + "styles": "ext.CollaborationKit.iconbrowser.styles.less" }, - "ext.CollaborationKit.hubimage": { + "ext.CollaborationKit.hubimagebrowser": { "scripts": "ext.CollaborationKit.hubimage.js", "dependencies": [ "oojs-ui", @@ -134,7 +129,7 @@ "cancel" ] }, - "ext.CollaborationKit.colour": { + "ext.CollaborationKit.colourbrowser": { "scripts": "ext.CollaborationKit.colour.js", "dependencies": [ "oojs-ui", @@ -170,7 +165,8 @@ "collaborationkit-green2", "collaborationkit-green3", "collaborationkit-black" - ] + ], + "styles": "ext.CollaborationKit.colourbrowser.styles.less" }, "ext.CollaborationKit.list.edit": { "scripts": "ext.CollaborationKit.list.edit.js", diff --git a/includes/CollaborationHubContentEditor.php b/includes/CollaborationHubContentEditor.php index 302dca0..f15954c 100644 --- a/includes/CollaborationHubContentEditor.php +++ b/includes/CollaborationHubContentEditor.php @@ -17,12 +17,11 @@ $out = $this->getContext()->getOutput(); $out->addModules( [ 'mediawiki.htmlform', - 'ext.CollaborationKit.colour', - 'ext.CollaborationKit.hubimage' + 'ext.CollaborationKit.colourbrowser', + 'ext.CollaborationKit.hubimagebrowser' ] ); $out->addModuleStyles( [ - 'zzext.CollaborationKit.edit.styles', - 'ext.CollaborationKit.colourbrowser.styles' + 'ext.CollaborationKit.edit.styles', ] ); $out->addJsConfigVars( 'wgCollaborationKitColourList', CollaborationHubContent::getThemeColours() ); } @@ -36,7 +35,7 @@ $fields = [ 'display_name' => [ 'type' => 'text', - 'cssclass' => 'mw-ck-displayinput', + 'cssclass' => 'mw-ck-display-input', 'label-message' => 'collaborationkit-hubedit-displayname', 'help-message' => 'collaborationkit-hubedit-displayname-help', 'name' => 'wpCollabHubDisplayName', @@ -45,7 +44,7 @@ ], 'icon' => [ 'type' => 'text', - 'cssclass' => 'mw-ck-hubimageinput', + 'cssclass' => 'mw-ck-hub-image-input', 'label-message' => 'collaborationkit-hubedit-image', 'help-message' => 'collaborationkit-hubedit-image-help', 'name' => 'wpCollabHubImage', @@ -65,7 +64,7 @@ } $fields['colour'] = [ 'type' => 'select', - 'cssclass' => 'mw-ck-colourinput', + 'cssclass' => 'mw-ck-colour-input', 'name' => 'wpCollabHubColour', 'id' => 'wpCollabHubColour', 'label-message' => 'collaborationkit-hubedit-colour', @@ -77,7 +76,7 @@ $fields['introduction'] = [ 'type' => 'textarea', - 'cssclass' => 'mw-ck-introductioninput', + 'cssclass' => 'mw-ck-introduction-input', 'label-message' => 'collaborationkit-hubedit-introduction', 'placeholder' => 'collaborationkit-hubedit-introduction-placeholder', 'name' => 'wpCollabHubIntroduction', @@ -93,7 +92,7 @@ } $fields['content'] = [ 'type' => 'textarea', - 'cssclass' => 'mw-ck-textboxmain', + 'cssclass' => 'mw-ck-content-input', 'label-message' => 'collaborationkit-hubedit-content', 'help-message' => 'collaborationkit-hubedit-content-help', 'name' => 'wpCollabHubContent', @@ -104,7 +103,7 @@ $fields['footer'] = [ 'type' => 'textarea', - 'cssclass' => 'mw-ck-footerinput', + 'cssclass' => 'mw-ck-footer-input', 'label-message' => 'collaborationkit-hubedit-footer', 'help-message' => 'collaborationkit-hubedit-footer-help', 'name' => 'wpCollabHubFooter', diff --git a/includes/CollaborationListContentEditor.php b/includes/CollaborationListContentEditor.php index c473cca..7dd6865 100644 --- a/includes/CollaborationListContentEditor.php +++ b/includes/CollaborationListContentEditor.php @@ -14,7 +14,7 @@ $out = $this->getContext()->getOutput(); $out->addModules( 'mediawiki.htmlform' ); - $out->addModuleStyles( 'zzext.CollaborationKit.edit.styles' ); + $out->addModuleStyles( 'ext.CollaborationKit.edit.styles' ); } protected function showContentForm() { @@ -37,7 +37,7 @@ $fields = [ 'description' => [ 'type' => 'textarea', - 'cssclass' => 'mw-ck-introductioninput', + 'cssclass' => 'mw-ck-introduction-input', 'label-message' => 'collaborationkit-listedit-description', 'placeholder' => 'collaborationkit-listedit-description-placeholder', 'name' => 'wpCollabListDescription', @@ -47,7 +47,7 @@ ], 'content' => [ 'type' => 'textarea', - 'cssclass' => 'mw-ck-textboxmain', + 'cssclass' => 'mw-ck-content-input', 'label-message' => 'collaborationkit-listedit-list', 'help-message' => 'collaborationkit-listedit-list-help', 'name' => 'wpCollabListContent', diff --git a/includes/SpecialCreateCollaborationHub.php b/includes/SpecialCreateCollaborationHub.php index f6c12f3..8d20116 100644 --- a/includes/SpecialCreateCollaborationHub.php +++ b/includes/SpecialCreateCollaborationHub.php @@ -20,9 +20,11 @@ */ public function execute( $par ) { $out = $this->getContext()->getOutput(); - $out->addModules( 'ext.CollaborationKit.colour' ); - $out->addModules( 'ext.CollaborationKit.hubimage' ); - $out->addModuleStyles( 'ext.CollaborationKit.colourbrowser.styles' ); + $out->addModules( [ + 'ext.CollaborationKit.colourbrowser', + 'ext.CollaborationKit.hubimagebrowser' + ] ); + $out->addModuleStyles( 'ext.CollaborationKit.edit.styles' ); $out->addJsConfigVars( 'wgCollaborationKitColourList', CollaborationHubContent::getThemeColours() ); parent::execute( $par ); @@ -54,7 +56,7 @@ // Hub image/icon thing 'icon' => [ 'type' => 'text', - 'cssclass' => 'mw-ck-hubimageinput', + 'cssclass' => 'mw-ck-hub-image-input', 'label-message' => 'collaborationkit-hubedit-image', 'help-message' => 'collaborationkit-hubedit-image-help' ], @@ -66,7 +68,7 @@ } $fields['colour'] = [ 'type' => 'select', - 'cssclass' => 'mw-ck-colourinput', + 'cssclass' => 'mw-ck-colour-input', 'id' => 'wpCollabHubColour', 'label-message' => 'collaborationkit-hubedit-colour', 'options' => $this->getOptions( $colours ), diff --git a/includes/SpecialCreateHubFeature.php b/includes/SpecialCreateHubFeature.php index 0234b1b..a1af255 100644 --- a/includes/SpecialCreateHubFeature.php +++ b/includes/SpecialCreateHubFeature.php @@ -19,7 +19,7 @@ public function execute( $par ) { $output = $this->getContext()->getOutput(); $output->addModules( 'ext.CollaborationKit.iconbrowser' ); - $output->addModuleStyles( 'ext.CollaborationKit.iconbrowser.styles' ); + $output->addModuleStyles( 'ext.CollaborationKit.edit.styles' ); $output->addJsConfigVars( 'wgCollaborationKitIconList', CollaborationKitIcon::getCannedIcons() ); parent::execute( $par ); } diff --git a/includes/content/CollaborationHubContent.php b/includes/content/CollaborationHubContent.php index 6eb5351..ccd1755 100644 --- a/includes/content/CollaborationHubContent.php +++ b/includes/content/CollaborationHubContent.php @@ -283,11 +283,13 @@ $output->setText( $html ); // Add some style stuff - $output->addModuleStyles( 'ext.CollaborationKit.hub.styles' ); - $output->addModuleStyles( 'oojs-ui.styles.icons-editing-core' ); - $output->addModules( 'ext.CollaborationKit.icons' ); - $output->addModules( 'ext.CollaborationKit.blots' ); - $output->addModules( 'ext.CollaborationKit.list.styles' ); + $output->addModuleStyles( [ + 'ext.CollaborationKit.hub.styles', + 'oojs-ui.styles.icons-editing-core', + 'ext.CollaborationKit.icons', + 'ext.CollaborationKit.blots', + 'ext.CollaborationKit.list.styles' + ] ); $output->setEnableOOUI( true ); } } diff --git a/includes/content/CollaborationListContent.php b/includes/content/CollaborationListContent.php index bb35930..af8cb9a 100644 --- a/includes/content/CollaborationListContent.php +++ b/includes/content/CollaborationListContent.php @@ -994,8 +994,10 @@ * @param $parser Parser */ public static function loadStyles( $content, array $attributes, Parser $parser ) { - $parser->getOutput()->addModuleStyles( 'ext.CollaborationKit.list.styles' ); - $parser->getOutput()->addModules( 'ext.CollaborationKit.icons' ); + $parser->getOutput()->addModuleStyles( [ + 'ext.CollaborationKit.list.styles', + 'ext.CollaborationKit.icons' + ] ); return ''; } diff --git a/modules/ext.CollaborationKit.colour.js b/modules/ext.CollaborationKit.colour.js index 4bc7f82..7898d47 100644 --- a/modules/ext.CollaborationKit.colour.js +++ b/modules/ext.CollaborationKit.colour.js @@ -133,11 +133,11 @@ colourBrowserButton.setLabel( mw.msg( 'collaborationkit-colour-launchbutton' ) ); colourBrowserButton.on( 'click', openItUp ); - curColour = $( 'select#mw-ck-colourinput option:selected, div.mw-ck-colourinput select option:selected' ).val(); + curColour = $( 'select#mw-ck-colourinput option:selected, div.mw-ck-colour-input select option:selected' ).val(); - $( 'select#mw-ck-colourinput, div.oo-ui-fieldLayout-field div.mw-ck-colourinput' ).css( 'display', 'none' ); - $( '.mw-ck-colourinput' ).addClass( 'colour-browser-field' ); - $( '.mw-ck-colourinput' ).append( + $( 'select#mw-ck-colourinput, div.oo-ui-fieldLayout-field div.mw-ck-colour-input' ).css( 'display', 'none' ); + $( '.mw-ck-colour-input' ).addClass( 'colour-browser-field' ); + $( '.mw-ck-colour-input' ).append( $( '<div class="colourPreview mw-ck-colourblock-container"></div>' ) .append( getColourBlock( curColour ) ) .append( diff --git a/modules/ext.CollaborationKit.edit.styles.less b/modules/ext.CollaborationKit.edit.styles.less index 2a8753a..7231f50 100644 --- a/modules/ext.CollaborationKit.edit.styles.less +++ b/modules/ext.CollaborationKit.edit.styles.less @@ -2,17 +2,24 @@ .ck-customeditor-toolbars( @default ); -.mw-collabkit-modifiededitform .oo-ui-labelElement-label { - font-weight: bold; -} -.mw-ck-displayinput, -.mw-ck-hubimageinput { - input { - width: 40%; +.mw-collabkit-modifiededitform { + .oo-ui-textInputWidget { + max-width: 100%; } } -.oo-ui-textInputWidget { - max-width: 100%; +.mw-htmlform-ooui-wrapper, +.mw-collabkit-modifiededitform { + label .oo-ui-labelElement-label { + font-weight: bold; + } + .mw-ck-title-input, + .mw-ck-display-input, + .mw-ck-icon-input, + .mw-ck-hub-image-input { + &.oo-ui-textInputWidget { + max-width: 40em; + } + } } .ck-customeditor-toolbars( @color ) { diff --git a/modules/ext.CollaborationKit.hubimage.js b/modules/ext.CollaborationKit.hubimage.js index 5c8a544..063e4d8 100644 --- a/modules/ext.CollaborationKit.hubimage.js +++ b/modules/ext.CollaborationKit.hubimage.js @@ -17,41 +17,41 @@ // Use the initialize() method to add content to the dialog's $body, // to initialize widgets, and to set up event handlers. ProcessDialog.prototype.initialize = function () { - ProcessDialog.super.prototype.initialize.apply( this, arguments ); + ProcessDialog.super.prototype.initialize.apply( this, arguments ); - this.content = new mw.widgets.MediaSearchWidget(); - this.$body.append( this.content.$element ); - }; + this.content = new mw.widgets.MediaSearchWidget(); + this.$body.append( this.content.$element ); + }; // In the event "Select" is pressed ProcessDialog.prototype.getActionProcess = function ( action ) { - var dialog, openItUp, windowManager, processDialog, - currentImageFilename, currentImage, hubimageBrowserButton; + var dialog, openItUp, windowManager, processDialog, + currentImageFilename, currentImage, hubimageBrowserButton; - dialog = this; - if ( action ) { - return new OO.ui.Process( function () { - fileObj = dialog.content.getResults().getSelectedItem().getData(); - fileUrl = fileObj.thumburl; - fileTitle = new mw.Title( fileObj.title ); - fileTitle = fileTitle.title + '.' + fileTitle.ext; + dialog = this; + if ( action ) { + return new OO.ui.Process( function () { + fileObj = dialog.content.getResults().getSelectedItem().getData(); + fileUrl = fileObj.thumburl; + fileTitle = new mw.Title( fileObj.title ); + fileTitle = fileTitle.title + '.' + fileTitle.ext; - // Generate preview - $( 'img.hubimagePreview' ) - .attr( 'style', 'display:block' ) - .attr( 'src', fileUrl ) - .attr( 'width', '200px' ) - .css( 'margin-bottom', '10px' ); + // Generate preview + $( 'img.hubimagePreview' ) + .attr( 'style', 'display:block' ) + .attr( 'src', fileUrl ) + .attr( 'width', '200px' ) + .css( 'margin-bottom', '10px' ); - // Set form value - $( '.mw-ck-hubimageinput input' ).val( fileTitle ); + // Set form value + $( '.mw-ck-hub-image-input input' ).val( fileTitle ); - dialog.close( { action: action } ); - } ); - } - // Fallback to parent handler. - return ProcessDialog.super.prototype.getActionProcess.call( this, action ); - }; + dialog.close( { action: action } ); + } ); + } + // Fallback to parent handler. + return ProcessDialog.super.prototype.getActionProcess.call( this, action ); + }; // Get dialog height. ProcessDialog.prototype.getBodyHeight = function () { @@ -79,16 +79,16 @@ hubimageBrowserButton.setLabel( mw.msg( 'collaborationkit-hubimage-launchbutton' ) ); hubimageBrowserButton.on( 'click', openItUp ); - $( 'div.mw-ck-hubimageinput' ).addClass( 'hubimage-browser-field' ); - $( 'div.mw-ck-hubimageinput label' ) + $( 'div.mw-ck-hub-image-input' ).addClass( 'hubimage-browser-field' ); + $( 'div.mw-ck-hub-image-input div' ).css( 'display', 'none' ); + $( 'div.mw-ck-hub-image-input' ) .append( '<img class="hubimagePreview" /><div class="hubimageBrowserButton">' ) .append( hubimageBrowserButton.$element ) .append( '</div>' ); - $( 'div.mw-ck-hubimageinput input' ).css( 'display', 'none' ); // Load current hub image - if ( $( 'div.mw-ck-hubimageinput input' ).val() !== undefined ) { - currentImageFilename = 'File:' + $( 'div.mw-ck-hubimageinput input' ).val(); + if ( $( 'div.mw-ck-hub-image-input input' ).val() !== undefined ) { + currentImageFilename = 'File:' + $( 'div.mw-ck-hub-image-input input' ).val(); currentImage = new mw.Api() .get( { action: 'query', @@ -97,13 +97,13 @@ iiprop: 'url', iiurlwidth: 200 } ) .done( function ( data ) { - $( 'img.hubimagePreview' ) - .attr( 'src', data.query.pages[ -1 ].imageinfo[ 0 ].thumburl ) - .css( 'margin-bottom', '10px' ) - .css( 'width', '200px' ) - .css( 'height', 'auto' ) - .css( 'display', 'block' ); - } + $( 'img.hubimagePreview' ) + .attr( 'src', data.query.pages[ -1 ].imageinfo[ 0 ].thumburl ) + .css( 'margin-bottom', '10px' ) + .css( 'width', '200px' ) + .css( 'height', 'auto' ) + .css( 'display', 'block' ); + } ); } diff --git a/modules/ext.CollaborationKit.icon.js b/modules/ext.CollaborationKit.icon.js index 0dbf54d..bf0d283 100644 --- a/modules/ext.CollaborationKit.icon.js +++ b/modules/ext.CollaborationKit.icon.js @@ -17,67 +17,67 @@ // Use the initialize() method to add content to the dialog's $body, // to initialize widgets, and to set up event handlers. ProcessDialog.prototype.initialize = function () { - var iconList, radioChoices, className; + var iconList, radioChoices, className; - ProcessDialog.super.prototype.initialize.apply( this, arguments ); + ProcessDialog.super.prototype.initialize.apply( this, arguments ); - this.content = new OO.ui.PanelLayout( { padded: true, expanded: false } ); + this.content = new OO.ui.PanelLayout( { padded: true, expanded: false } ); - iconList = mw.config.get( 'wgCollaborationKitIconList' ); + iconList = mw.config.get( 'wgCollaborationKitIconList' ); - radioChoices = []; - for ( i = 0; i < iconList.length; i++ ) { - divElm = $( '<div></div>' ) - .addClass( 'mw-ck-iconbrowser-iconcontainer' ) - .append( $( '<div></div>' ) - .addClass( 'mw-ck-icon-' + iconList[ i ] ) - .addClass( 'mw-ck-iconbrowser-icon' ) - ); + radioChoices = []; + for ( i = 0; i < iconList.length; i++ ) { + divElm = $( '<div></div>' ) + .addClass( 'mw-ck-iconbrowser-iconcontainer' ) + .append( $( '<div></div>' ) + .addClass( 'mw-ck-icon-' + iconList[ i ] ) + .addClass( 'mw-ck-iconbrowser-icon' ) + ); - radioChoices.push( new OO.ui.RadioOptionWidget( { - label: divElm, - data: iconList[ i ] - } ) ); - } + radioChoices.push( new OO.ui.RadioOptionWidget( { + label: divElm, + data: iconList[ i ] + } ) ); + } - this.radioSelect = new OO.ui.RadioSelectWidget( { - name: 'iconChoice', - items: radioChoices, - classes: [ 'mw-ck-iconbrowser' ] - } ); + this.radioSelect = new OO.ui.RadioSelectWidget( { + name: 'iconChoice', + items: radioChoices, + classes: [ 'mw-ck-iconbrowser' ] + } ); - this.content.$element.append( this.radioSelect.$element ); + this.content.$element.append( this.radioSelect.$element ); - this.$body.append( this.content.$element ); - }; + this.$body.append( this.content.$element ); + }; // In the event "Select" is pressed ProcessDialog.prototype.getActionProcess = function ( action ) { - var dialog, toAppend, openItUp, windowManager, processDialog, iconBrowserButton; + var dialog, toAppend, openItUp, windowManager, processDialog, iconBrowserButton; - dialog = this; - if ( action ) { - return new OO.ui.Process( function () { - toAppend = dialog.radioSelect.getSelectedItem().getData(); + dialog = this; + if ( action ) { + return new OO.ui.Process( function () { + toAppend = dialog.radioSelect.getSelectedItem().getData(); - // Generate preview - $( '.iconPreview' ) - .addClass( 'mw-ck-icon-' + toAppend ) - .css( 'display', 'block' ); - // Set form value - $( '.mw-ck-icon-input input' ).val( toAppend ); + // Generate preview + $( '.iconPreview' ) + .addClass( 'mw-ck-icon-' + toAppend ) + .css( 'display', 'block' ); + // Set form value + $( '.mw-ck-icon-input input' ).val( toAppend ); - dialog.close( { action: action } ); - } ); - } - // Fallback to parent handler. - return ProcessDialog.super.prototype.getActionProcess.call( this, action ); - }; + dialog.close( { action: action } ); + } ); + } + // Fallback to parent handler. + return ProcessDialog.super.prototype.getActionProcess.call( this, action ); + }; // Get dialog height. ProcessDialog.prototype.getBodyHeight = function () { - return this.content.$element.outerHeight( true ); - }; + return this.content.$element.outerHeight( true ); + }; // Create and append the window manager. openItUp = function () { -- To view, visit https://gerrit.wikimedia.org/r/332734 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: Iadabee28535159241a41354d2f2762987b2c01fb Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/CollaborationKit Gerrit-Branch: master Gerrit-Owner: Isarra <zhoris...@gmail.com> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits