Mooeypoo has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/112041

Change subject: Revamp media edit dialog's position widget
......................................................................

Revamp media edit dialog's position widget

Added checkbox to set position (left/center/right) or none if unchecked.

Change-Id: Iddd78c98929759a13d2dc5a774e72b59cbe28c36
---
M VisualEditor.php
M modules/ve-mw/i18n/en.json
M modules/ve-mw/i18n/qqq.json
M modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
4 files changed, 46 insertions(+), 17 deletions(-)


  git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/VisualEditor 
refs/changes/41/112041/1

diff --git a/VisualEditor.php b/VisualEditor.php
index 97cc95a..eb16645 100644
--- a/VisualEditor.php
+++ b/VisualEditor.php
@@ -651,11 +651,7 @@
                        'visualeditor-dialog-media-page-advanced',
                        'visualeditor-dialog-media-page-general',
                        'visualeditor-dialog-media-position-center',
-                       'visualeditor-dialog-media-type-border',
-                       'visualeditor-dialog-media-type-frame',
-                       'visualeditor-dialog-media-type-frameless',
-                       'visualeditor-dialog-media-type-section',
-                       'visualeditor-dialog-media-type-thumb',
+                       'visualeditor-dialog-media-position-checkbox',
                        'visualeditor-dialog-media-position-left',
                        'visualeditor-dialog-media-position-none',
                        'visualeditor-dialog-media-position-right',
@@ -663,6 +659,11 @@
                        'visualeditor-dialog-media-size-originalsize-error',
                        'visualeditor-dialog-media-size-section',
                        'visualeditor-dialog-media-title',
+                       'visualeditor-dialog-media-type-border',
+                       'visualeditor-dialog-media-type-frame',
+                       'visualeditor-dialog-media-type-frameless',
+                       'visualeditor-dialog-media-type-section',
+                       'visualeditor-dialog-media-type-thumb',
                        'visualeditor-dialog-meta-categories-category',
                        'visualeditor-dialog-meta-categories-data-label',
                        'visualeditor-dialog-meta-categories-defaultsort-label',
diff --git a/modules/ve-mw/i18n/en.json b/modules/ve-mw/i18n/en.json
index be2bc7b..8bccc89 100644
--- a/modules/ve-mw/i18n/en.json
+++ b/modules/ve-mw/i18n/en.json
@@ -44,11 +44,7 @@
     "visualeditor-dialog-media-page-advanced": "Advanced settings",
     "visualeditor-dialog-media-page-general": "General settings",
     "visualeditor-dialog-media-position-center": "Center",
-    "visualeditor-dialog-media-type-border": "Border",
-    "visualeditor-dialog-media-type-frame": "Frame",
-    "visualeditor-dialog-media-type-frameless": "Frameless",
-    "visualeditor-dialog-media-type-section": "Image type",
-    "visualeditor-dialog-media-type-thumb": "Thumbnail",
+    "visualeditor-dialog-media-position-checkbox": "Use set floating 
direction",
     "visualeditor-dialog-media-position-left": "Left",
     "visualeditor-dialog-media-position-none": "None",
     "visualeditor-dialog-media-position-right": "Right",
@@ -56,6 +52,11 @@
     "visualeditor-dialog-media-size-originalsize-error": "Could not retrieve 
original file size.",
     "visualeditor-dialog-media-size-section": "Image size",
     "visualeditor-dialog-media-title": "Media settings",
+    "visualeditor-dialog-media-type-border": "Border",
+    "visualeditor-dialog-media-type-frame": "Frame",
+    "visualeditor-dialog-media-type-frameless": "Frameless",
+    "visualeditor-dialog-media-type-section": "Image type",
+    "visualeditor-dialog-media-type-thumb": "Thumbnail",
     "visualeditor-dialog-meta-categories-category": "Category",
     "visualeditor-dialog-meta-categories-data-label": "Categories",
     "visualeditor-dialog-meta-categories-defaultsort-label": "Sort this page 
by default as",
diff --git a/modules/ve-mw/i18n/qqq.json b/modules/ve-mw/i18n/qqq.json
index 7e2f85c..dfee329 100644
--- a/modules/ve-mw/i18n/qqq.json
+++ b/modules/ve-mw/i18n/qqq.json
@@ -49,18 +49,19 @@
     "visualeditor-dialog-media-page-advanced": "Label for the advanced 
settings page in the media edit dialog",
     "visualeditor-dialog-media-page-general": "Label for the general settings 
page in the media edit dialog.\n{{Identical|General settings}}",
     "visualeditor-dialog-media-position-center": "Label for the image position 
option for aligning to the center.",
+    "visualeditor-dialog-media-position-checkbox": "Label for the position 
checkbox, denoting whether to use a set float position.",
     "visualeditor-dialog-media-position-left": "Label for the image position 
option for aligning to the left.",
     "visualeditor-dialog-media-position-none": "Label for the image position 
option for no alignment.",
     "visualeditor-dialog-media-position-right": "Label for the image position 
option for aligning to right.",
     "visualeditor-dialog-media-position-section": "Label for the image 
position sub-section.",
     "visualeditor-dialog-media-size-originalsize-error": "Error message for 
failing to retrieve original file size from the API.",
+    "visualeditor-dialog-media-size-section": "Label for the image size 
sub-section.\n{{Identical|Image size}}",
+    "visualeditor-dialog-media-title": "Title for the editing dialog to set 
how a media item is displayed on the page",
     "visualeditor-dialog-media-type-border": "Label for the image type option 
for bordered image.",
     "visualeditor-dialog-media-type-frame": "Label for the image type option 
for framed image.",
     "visualeditor-dialog-media-type-frameless": "Label for the image type 
option for frameless.",
     "visualeditor-dialog-media-type-section": "Label for the image type 
sub-section.",
     "visualeditor-dialog-media-type-thumb": "Label for the image type option 
for thumbnail.",
-    "visualeditor-dialog-media-size-section": "Label for the image size 
sub-section.\n{{Identical|Image size}}",
-    "visualeditor-dialog-media-title": "Title for the editing dialog to set 
how a media item is displayed on the page",
     "visualeditor-dialog-meta-categories-category": "Title of popup for 
editing category options.\n{{Identical|Category}}",
     "visualeditor-dialog-meta-categories-data-label": "Label for the 
categories sub-section.\n{{Identical|Category}}",
     "visualeditor-dialog-meta-categories-defaultsort-label": "Label for field 
setting the category default sort",
diff --git a/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js 
b/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
index bbb2f9c..9843f80 100644
--- a/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
+++ b/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
@@ -169,6 +169,11 @@
                .append( this.altTextInput.$element );
 
        // Position
+       this.positionCheckbox = new OO.ui.CheckboxWidget( {
+               '$': this.$,
+               'label': ve.msg( 'visualeditor-dialog-media-position-checkbox' )
+       } );
+
        positionFieldset = new OO.ui.FieldsetLayout( {
                '$': this.$,
                'label': ve.msg( 'visualeditor-dialog-media-position-section' ),
@@ -181,10 +186,13 @@
                new OO.ui.ButtonOptionWidget( 'left', { '$': this.$, 'label': 
ve.msg( 'visualeditor-dialog-media-position-left' ) } ),
                new OO.ui.ButtonOptionWidget( 'center', { '$': this.$, 'label': 
ve.msg( 'visualeditor-dialog-media-position-center' ) } ),
                new OO.ui.ButtonOptionWidget( 'right', { '$': this.$, 'label': 
ve.msg( 'visualeditor-dialog-media-position-right' ) } ),
-               new OO.ui.ButtonOptionWidget( 'none', { '$': this.$, 'label': 
ve.msg( 'visualeditor-dialog-media-position-none' ) } )
        ], 0 );
+
        // Build position fieldset
-       positionFieldset.$element.append( this.positionInput.$element );
+       positionFieldset.$element.append( [
+               this.positionCheckbox.$element,
+               this.positionInput.$element
+       ] );
 
        // Type
        this.typeFieldset = new OO.ui.FieldsetLayout( {
@@ -250,6 +258,7 @@
 
        // Events
        this.applyButton.connect( this, { 'click': [ 'close', { 'action': 
'apply' } ] } );
+       this.positionInput.connect( this, { 'select': 'onPositionInputSelect' } 
);
 
        // Initialization
        this.generalSettingsPage.$element.append( [
@@ -265,6 +274,14 @@
 
        this.$body.append( this.bookletLayout.$element );
        this.$foot.append( this.applyButton.$element );
+};
+
+/**
+ * Handle select event on the positionInput element. If an option
+ * is selected, mark the checkbox
+ */
+ve.ui.MWMediaEditDialog.prototype.onPositionInputSelect = function () {
+       this.positionCheckbox.setValue( true );
 };
 
 /**
@@ -323,7 +340,14 @@
        this.altTextInput.setValue( this.mediaNode.getAttribute( 'alt' ) || '' 
);
 
        // Set initial position
-       if ( this.mediaNode.getAttribute( 'align' ) !== undefined ) {
+       if (
+               this.mediaNode.getAttribute( 'align' ) === undefined ||
+               this.mediaNode.getAttribute( 'align' ) === 'none'
+       ) {
+               this.positionCheckbox.setValue( false );
+               this.positionInput.intializeSelection();
+       } else {
+               this.positionCheckbox.setValue( true );
                this.positionInput.selectItem(
                        this.positionInput.getItemFromData( 
this.mediaNode.getAttribute( 'align' ) )
                );
@@ -392,8 +416,10 @@
                        attrs.alt = attr;
                }
 
-               attr = this.positionInput.getSelectedItem();
-               if ( attr ) {
+               if ( !this.positionCheckbox.getValue() ) {
+                       attrs.align = 'none';
+               } else {
+                       attr = this.positionInput.getSelectedItem();
                        attrs.align = attr.getData();
                }
 

-- 
To view, visit https://gerrit.wikimedia.org/r/112041
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: Iddd78c98929759a13d2dc5a774e72b59cbe28c36
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Mooeypoo <mor...@gmail.com>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to