Mooeypoo has uploaded a new change for review.

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


Change subject: [WIP] Adding alternate text to media edit dialog
......................................................................

[WIP] Adding alternate text to media edit dialog

Adding an option to add or edit alt text to images in the media edit dialog.

** This is blocked by a Parsoid bug,
   see https://bugzilla.wikimedia.org/show_bug.cgi?id=56400 ***

Change-Id: I6d339781822175c40c66a4689ec6e1a873cb081d
---
M VisualEditor.i18n.php
M VisualEditor.php
M modules/ve-mw/dm/nodes/ve.dm.MWBlockImageNode.js
M modules/ve-mw/i18n/en.json
M modules/ve-mw/i18n/qqq.json
M modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
6 files changed, 46 insertions(+), 6 deletions(-)


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

diff --git a/VisualEditor.i18n.php b/VisualEditor.i18n.php
index 0875c2e..2258172 100644
--- a/VisualEditor.i18n.php
+++ b/VisualEditor.i18n.php
@@ -135,6 +135,7 @@
   'visualeditor-dialog-beta-welcome-content' => 'This is our new, easier way 
to edit. It\'s still in beta, which means you might find parts of the page you 
can\'t edit, or encounter issues that need to be fixed. We encourage you to 
review your changes, and we welcome reports about any issues you might 
encounter in using VisualEditor (click the "{{int:visualeditor-help-tool}}" 
button to submit feedback). You can keep using the wikitext editor by clicking 
the "$1" tab instead – unsaved changes will be lost.',
   'visualeditor-dialog-beta-welcome-title' => '{{GENDER:$1|Welcome}} to 
VisualEditor',
   'visualeditor-dialog-media-content-section' => 'Caption',
+  'visualeditor-dialog-media-alttext-section' => 'Alternative Text',
   'visualeditor-dialog-media-insert-button' => 'Insert media',
   'visualeditor-dialog-media-insert-title' => 'Insert media',
   'visualeditor-dialog-media-title' => 'Media settings',
@@ -462,6 +463,8 @@
 * $1 - username or empty string, for GENDER support',
   'visualeditor-dialog-media-content-section' => 'Label for the image content 
sub-section.
 {{Identical|Caption}}',
+  'visualeditor-dialog-media-alttext-section' => 'Label for the image 
alternative text sub-section.
+{{Identical|Caption}}',
   'visualeditor-dialog-media-size-section' => 'Label for the image size 
sub-section.',
   'visualeditor-dialog-media-size-width' => 'Label for the image width.',
   'visualeditor-dialog-media-size-height' => 'Label for the image height.',
diff --git a/VisualEditor.php b/VisualEditor.php
index 8c06d41..d08ffe3 100644
--- a/VisualEditor.php
+++ b/VisualEditor.php
@@ -616,6 +616,7 @@
                        'visualeditor-dialog-beta-welcome-content',
                        'visualeditor-dialog-beta-welcome-title',
                        'visualeditor-dialog-media-content-section',
+                       'visualeditor-dialog-media-alttext-section',
                        'visualeditor-dialog-media-insert-button',
                        'visualeditor-dialog-media-insert-title',
                        'visualeditor-dialog-media-title',
diff --git a/modules/ve-mw/dm/nodes/ve.dm.MWBlockImageNode.js 
b/modules/ve-mw/dm/nodes/ve.dm.MWBlockImageNode.js
index 5f03062..4b140dd 100644
--- a/modules/ve-mw/dm/nodes/ve.dm.MWBlockImageNode.js
+++ b/modules/ve-mw/dm/nodes/ve.dm.MWBlockImageNode.js
@@ -77,7 +77,12 @@
                        originalClasses: classes
                },
                width = $img.attr( 'width' ),
-               height = $img.attr( 'height' );
+               height = $img.attr( 'height' ),
+               alttext = $img.attr( 'alt' );
+
+       if ( alttext !== undefined ) {
+               attributes.alt = alttext;
+       }
 
        attributes.width = width !== undefined && width !== '' ? Number( width 
) : null;
        attributes.height = height !== undefined && height !== '' ? Number( 
height ) : null;
@@ -193,6 +198,9 @@
        img.setAttribute( 'width', dataElement.attributes.width );
        img.setAttribute( 'height', dataElement.attributes.height );
        img.setAttribute( 'resource', dataElement.attributes.resource );
+       if ( dataElement.attributes.alt !== undefined ) {
+               img.setAttribute( 'alt', dataElement.attributes.alt );
+       }
        figure.appendChild( imgWrapper );
        imgWrapper.appendChild( img );
 
diff --git a/modules/ve-mw/i18n/en.json b/modules/ve-mw/i18n/en.json
index 5e76be1..0c2f445 100644
--- a/modules/ve-mw/i18n/en.json
+++ b/modules/ve-mw/i18n/en.json
@@ -38,6 +38,7 @@
     "visualeditor-dialog-beta-welcome-content": "This is our new, easier way 
to edit. It's still in beta, which means you might find parts of the page you 
can't edit, or encounter issues that need to be fixed. We encourage you to 
review your changes, and we welcome reports about any issues you might 
encounter in using VisualEditor (click the \"{{int:visualeditor-help-tool}}\" 
button to submit feedback). You can keep using the wikitext editor by clicking 
the \"$1\" tab instead – unsaved changes will be lost.",
     "visualeditor-dialog-beta-welcome-title": "{{GENDER:$1|Welcome}} to 
VisualEditor",
     "visualeditor-dialog-media-content-section": "Caption",
+    "visualeditor-dialog-media-alttext-section": "Alternative Text",
     "visualeditor-dialog-media-insert-button": "Insert media",
     "visualeditor-dialog-media-insert-title": "Insert media",
     "visualeditor-dialog-media-title": "Media settings",
diff --git a/modules/ve-mw/i18n/qqq.json b/modules/ve-mw/i18n/qqq.json
index 0c26c0d..65ef1e2 100644
--- a/modules/ve-mw/i18n/qqq.json
+++ b/modules/ve-mw/i18n/qqq.json
@@ -41,6 +41,7 @@
     "visualeditor-dialog-beta-welcome-content": "Text explaining VisualEditor 
is in beta.\n\nRefers to {{msg-mw|Visualeditor-help-tool}}.\n\nParameters:\n* 
$1 - {{msg-mw|Edit}}",
     "visualeditor-dialog-beta-welcome-title": "Title of the beta welcome 
dialog. Parameters:\n* $1 - username or empty string, for GENDER support",
     "visualeditor-dialog-media-content-section": "Label for the image content 
sub-section.\n{{Identical|Caption}}",
+    "visualeditor-dialog-media-alttext-section": "Label for the image 
alternative text sub-section.\n{{Identical|Caption}}",
     "visualeditor-dialog-media-insert-button": "Used as label for the 
button.\n{{Identical|Insert media}}",
     "visualeditor-dialog-media-insert-title": "Media insert dialog title 
text.\n{{Identical|Insert media}}",
     "visualeditor-dialog-media-title": "Title for the editing dialog to set 
how a media item is displayed on the page",
diff --git a/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js 
b/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
index a4c4291..f0bb8ae 100644
--- a/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
+++ b/modules/ve-mw/ui/dialogs/ve.ui.MWMediaEditDialog.js
@@ -22,6 +22,10 @@
        // Properties
        this.mediaNode = null;
        this.captionNode = null;
+       // Gui properties
+       this.fieldsets = {};
+       this.inputs = { 'size': {} };
+       this.labels = { 'size': {} };
 };
 
 /* Inheritance */
@@ -95,10 +99,6 @@
 
        this.hasError = false;
 
-       this.fieldsets = {};
-       this.inputs = { 'size': {} };
-       this.labels = { 'size': {} };
-
        // Set up the booklet layout
        this.bookletLayout = new OO.ui.BookletLayout( {
                '$': this.$,
@@ -129,6 +129,21 @@
                'label': ve.msg( 'visualeditor-dialog-media-content-section' ),
                'icon': 'parameter'
        } );
+
+       // Alt text
+       this.fieldsets.alttext = new OO.ui.FieldsetLayout( {
+               '$': this.$,
+               'label': ve.msg( 'visualeditor-dialog-media-alttext-section' ),
+               'icon': 'parameter'
+       } );
+
+       this.inputs.alttext = new OO.ui.TextInputWidget( {
+               '$': this.$
+       } );
+
+       // Build alt text fieldset
+       this.fieldsets.alttext.$element
+               .append( this.inputs.alttext.$element );
 
        // Size
        this.fieldsets.size = new OO.ui.FieldsetLayout( {
@@ -192,7 +207,10 @@
        this.inputs.size.height.$input.on( 'keyup', { 'dir': 'height' }, 
OO.ui.bind( this.onSizeKeydown, this ) );
 
        // Initialization
-       this.generalSettingsPage.$element.append( 
this.fieldsets.caption.$element );
+       this.generalSettingsPage.$element.append( [
+               this.fieldsets.caption.$element,
+               this.fieldsets.alttext.$element
+       ] );
        this.advancedSettingsPage.$element.append( this.fieldsets.size.$element 
);
 
        this.$body.append( this.bookletLayout.$element );
@@ -324,6 +342,10 @@
        this.inputs.size.width.setValue( attrs.width );
        this.inputs.size.height.setValue( attrs.height );
 
+       // Set initial alt text
+       if ( attrs.alt !== undefined ) {
+               this.inputs.alttext.setValue( attrs.alt );
+       }
        // Initialization
        this.fieldsets.caption.$element.append( this.captionSurface.$element );
        this.captionSurface.initialize();
@@ -367,6 +389,10 @@
                if ( attr ) {
                        attrs.width = attr;
                }
+               attr = this.inputs.alttext.getValue();
+               if ( attr ) {
+                       attrs.alt = attr;
+               }
                surfaceModel.change(
                        ve.dm.Transaction.newFromAttributeChanges( doc, 
this.mediaNode.getOffset(), attrs )
                );

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

Gerrit-MessageType: newchange
Gerrit-Change-Id: I6d339781822175c40c66a4689ec6e1a873cb081d
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