From 96fa010f58e934e733cbd6b9fe98c996e3fcfd1d Mon Sep 17 00:00:00 2001
From: Moriel Schottlender <moriel@gmail.com>
Date: Tue, 23 Jul 2013 19:13:28 -0400
Subject: [PATCH] Image insertion alignment fix

This removes the initial alignment (either left or right) from new
inserted images, letting the wiki decide the default positioning.
Also, it makes sure that VisualEditor positions the image properly
(according to wiki defaults tright/tleft for ltr/rtl) when editing.

Bug: 51851
Change-Id: I25b966cf6f2736437509ea7e70bfda1bdbc79021
---
 .../ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js  | 27 ++++++++++++++++---
 .../ui/dialogs/ve.ui.MWMediaInsertDialog.js   |  2 +-
 2 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js b/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js
index e52dfbc3c1..fa9fcbbee8 100644
--- a/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js
+++ b/modules/ve-mw/ce/nodes/ve.ce.MWBlockImageNode.js
@@ -63,9 +63,6 @@ ve.ce.MWBlockImageNode = function VeCeMWBlockImageNode( model, config ) {
 		// Type "frame", "thumb" and the default
 		this.$image.addClass( 'thumbimage' );
 		this.$thumb
-			.addClass(
-				ve.ce.MWBlockImageNode.static.cssClasses[ 'default' ][ this.model.getAttribute( 'align' ) ]
-			)
 			.addClass( 'thumb' );
 		this.$a.appendTo( this.$thumbInner );
 		this.$thumbInner.appendTo( this.$thumb );
@@ -118,7 +115,8 @@ ve.ce.MWBlockImageNode.static.cssClasses = {
 		'right': 'tright',
 		'center' : 'tnone',
 		'none' : 'tnone',
-		'default': 'tright'
+		// Default is different between RTL and LTR wikis:
+		'default': ['tright', 'tleft']
 	},
 	'none': {
 		'left': 'floatleft',
@@ -130,6 +128,27 @@ ve.ce.MWBlockImageNode.static.cssClasses = {
 
 /* Methods */
 
+/**
+ * Override the default onSetup to add direction-dependent
+ * classes to the image thumbnail.
+ *
+ * @method
+ */
+ve.ce.MWBlockImageNode.prototype.onSetup = function ( ) {
+	var type = this.model.getAttribute( 'type' ),
+		isRTL;
+
+	if ( type !== 'none' && type !=='frameless' ) {
+		// get the proper alignment for the image inside the editor
+		isRTL = ( this.$.css( 'direction' ) === 'rtl' ) ? 1 : 0;
+		this.$thumb
+			.addClass(
+				ve.ce.MWBlockImageNode.static.cssClasses[ 'default' ][ this.model.getAttribute( 'align' ) ][ isRTL ]
+			);
+	}
+
+};
+
 ve.ce.MWBlockImageNode.prototype.onAttributeChange = function ( key, from, to ) {
 	var $element, type;
 
diff --git a/modules/ve-mw/ui/dialogs/ve.ui.MWMediaInsertDialog.js b/modules/ve-mw/ui/dialogs/ve.ui.MWMediaInsertDialog.js
index 5e28613522..d836f7401f 100644
--- a/modules/ve-mw/ui/dialogs/ve.ui.MWMediaInsertDialog.js
+++ b/modules/ve-mw/ui/dialogs/ve.ui.MWMediaInsertDialog.js
@@ -68,7 +68,7 @@ ve.ui.MWMediaInsertDialog.prototype.onClose = function ( action ) {
 				'type': 'mwBlockImage',
 				'attributes': {
 					'type': 'thumb',
-					'align': 'right',
+					'align': 'default',
 					//'href': info.descriptionurl,
 					'href': './' + this.item.title,
 					'src': info.thumburl,