locomotive-aloha-rails 0.20.1.2 → 0.20.1.3

data/vendor/assets/javascripts/aloha/lib/aloha/selection.js

@@ -352,8 +352,18 @@ function(Aloha, jQuery, FloatingMenu, Class, Range) {
 					// the start of the selection was not yet found, so look for it now
 					// check whether the start of the selection is found here
 
+					// Try to read the nodeType property and return if we do not have permission
+					// ie.: frame document to an external URL
+					var nodeType;
+					try {
+						nodeType = this.nodeType;
+					}
+					catch (e) {
+						return;
+					}
+
 					// check is dependent on the node type
-					switch(this.nodeType) {
+					switch(nodeType) {
 					case 3: // text node
 						if (this === rangeObject.startContainer) {
 							// the selection starts here
@@ -603,8 +613,17 @@ function(Aloha, jQuery, FloatingMenu, Class, Range) {
 		standardAttributesComparator: function(domobj, markupObject) {
 			var i, attr, classString, classes, classes2, classLength, attrLength, domAttrLength;
 
+			// Cloning the domobj works around an IE7 bug that crashes
+			// the browser. The exact place where IE7 crashes is when
+			// the domobj.attribute[i] is read below.
+			// The bug can be reproduced with an editable that contains
+			// some text and and image, by clicking inside and outside the
+			// editable a few times.
+			domobj = domobj.cloneNode(false);
+
 			if (domobj.attributes && domobj.attributes.length && domobj.attributes.length > 0) {
 				for (i = 0, domAttrLength = domobj.attributes.length; i < domAttrLength; i++) {
+					// Dereferencing attributes[i] here would crash IE7 if domobj were not cloned above
 					attr = domobj.attributes[i];
 					if (attr.nodeName.toLowerCase() == 'class' && attr.nodeValue.length > 0) {
 						classString = attr.nodeValue;

data/vendor/assets/javascripts/aloha/lib/aloha/sidebar.js

@@ -185,6 +185,7 @@ define( [
 				sidebar.init( opts );
 			}
 		} );
+		
 	};
 	
 	// ------------------------------------------------------------------------
@@ -447,7 +448,16 @@ define( [
 			if (this.opened) {
 				this.rotateHandleArrow(isRight ? 0 : 180, 0);
 			}
-			
+
+			// configure the position of the sidebar handle
+			jQuery( function () {
+				if ( typeof Aloha.settings.sidebar != 'undefined' &&
+						Aloha.settings.sidebar.handle &&
+						Aloha.settings.sidebar.handle.top ) {
+					jQuery(bar.find(nsSel('handle'))).get(0).style.top = Aloha.settings.sidebar.handle.top;
+				}
+			} );
+
 			bar.find(nsSel('handle'))
 				.click(function () {
 					if (bounceTimer) {

data/vendor/assets/javascripts/aloha/lib/jquery-plugin.js

@@ -1,3 +1,4 @@
+/*global define: true */
 /*!
 * This file is part of Aloha Editor Project http://aloha-editor.org
 * Copyright © 2010-2011 Gentics Software GmbH, aloha@gentics.com
@@ -26,18 +27,20 @@
 		load: function (name, require, load, config) {
 			var url = require.toUrl(name + '.js');
 
-			require(['aloha/jquery'], function(value) {
+			require(['aloha/jquery'], function (value) {
 				var $ = value;
 				$.ajax({
 					type: 'GET',
-				  	url: url,
-				  	cache: true,
-				  	dataType: 'text',
-				  	success: function(plugin) {
+					url: url,
+					cache: true,
+					dataType: 'text',
+					success: function (plugin) {
 //						plugin = '(function(jQuery) { var $ = jQuery;\n' + plugin + '}(window.alohaQuery));';
-						plugin = 'define([\'aloha/jquery\'], function(jQuery) { var $ = jQuery;\n' + plugin + '});'
+						plugin = 'define([\'aloha/jquery\'], function(jQuery) { var $ = jQuery;\n' + plugin + '});';
 						load.fromText(name, plugin);
-						load(null);
+						require([name], function (value) {
+							load(value);
+						});
 					}
 				});
 			});

data/vendor/assets/javascripts/aloha/lib/util/dom.js

@@ -103,22 +103,22 @@ var Dom = Class.extend({
 	 */
 	tags: {
 		'flow' : [ 'a', 'abbr', 'address', 'area', 'article', 'aside', 'audio',
-				'b', 'bdo', 'blockquote', 'br', 'button', 'canvas', 'cite', 'code',
+				'b', 'bdi','bdo', 'blockquote', 'br', 'button', 'canvas', 'cite', 'code',
 				'command', 'datalist', 'del', 'details', 'dfn', 'div', 'dl', 'em',
 				'embed', 'fieldset', 'figure', 'footer', 'form', 'h1', 'h2', 'h3',
 				'h4', 'h5', 'h6', 'header', 'hgroup', 'hr', 'i', 'iframe', 'img',
 				'input', 'ins', 'kbd', 'keygen', 'label', 'map', 'mark', 'math',
 				'menu', 'meter', 'nav', 'noscript', 'object', 'ol', 'output', 'p',
-				'pre', 'progress', 'q', 'ruby', 'samp', 'script', 'section',
+				'pre', 'progress', 'q', 'ruby', 's', 'samp', 'script', 'section',
 				'select', 'small', 'span', 'strong', 'style', 'sub', 'sup', 'svg',
-				'table', 'textarea', 'time', 'ul', 'var', 'video', 'wbr', '#text' ],
-		'phrasing' : [ 'a', 'abbr', 'area', 'audio', 'b', 'bdo', 'br', 'button',
+				'table', 'textarea', 'time', 'u', 'ul', 'var', 'video', 'wbr', '#text' ],
+		'phrasing' : [ 'a', 'abbr', 'area', 'audio', 'b', 'bdi', 'bdo', 'br', 'button',
 				'canvas', 'cite', 'code', 'command', 'datalist', 'del', 'dfn',
 				'em', 'embed', 'i', 'iframe', 'img', 'input', 'ins', 'kbd',
 				'keygen', 'label', 'map', 'mark', 'math', 'meter', 'noscript',
 				'object', 'output', 'progress', 'q', 'ruby', 'samp', 'script',
 				'select', 'small', 'span', 'strong', 'sub', 'sup', 'svg',
-				'textarea', 'time', 'var', 'video', 'wbr', '#text' ]
+				'textarea', 'time', 'u', 'var', 'video', 'wbr', '#text' ]
 	},
 
 	/**
@@ -231,6 +231,7 @@ var Dom = Class.extend({
 		'title' : '#text',
 		'tr' : ['th', 'td'],
 		'track' : 'empty',
+		'u' : 'phrasing',
 		'ul' : 'li',
 		'var' : 'phrasing',
 		'video' : 'source', // transparent
@@ -668,8 +669,19 @@ var Dom = Class.extend({
 
 		// iterate through all sub nodes
 		startObject.contents().each(function(index) {
+
+			// Try to read the nodeType property and return if we do not have permission
+			// ie.: frame document to an external URL
+			var nodeType;
+			try {
+				nodeType = this.nodeType;
+			}
+			catch (e) {
+				return;
+			}
+
 			// decide further actions by node type
-			switch(this.nodeType) {
+			switch(nodeType) {
 			// found a non-text node
 			case 1:
 				if (prevNode && prevNode.nodeName == this.nodeName) {

data/vendor/assets/javascripts/aloha/lib/util/range.js

@@ -139,7 +139,6 @@ GENTICS.Utils.RangeObject = Class.extend({
 			// sometimes it's cached (or was set)
 			return this.commonAncestorContainer;
 		}
-
 		// if it's not cached, calculate and then cache it
 		this.updateCommonAncestorContainer();
 
@@ -225,13 +224,13 @@ GENTICS.Utils.RangeObject = Class.extend({
 	 * @hide
 	 */
 	updateCommonAncestorContainer: function(commonAncestorContainer) {
-		// this will be needed either right now for finding the CAC or later for the crossing index
-		var parentsStartContainer = this.getStartContainerParents(),
-			parentsEndContainer = this.getEndContainerParents(),
-			i;
-
 		// if no parameter was passed, calculate it
 		if (!commonAncestorContainer) {
+			// this will be needed either right now for finding the CAC or later for the crossing index
+			var parentsStartContainer = this.getStartContainerParents(),
+				parentsEndContainer = this.getEndContainerParents(),
+				i;
+
 			// find the crossing between startContainer and endContainer parents (=commonAncestorContainer)
 			if (!(parentsStartContainer.length > 0 && parentsEndContainer.length > 0)) {
 				console.warn('could not find commonAncestorContainer');
@@ -412,6 +411,7 @@ GENTICS.Utils.RangeObject = Class.extend({
 	 */
 	update: function(event) {
 		console.debug('now updating rangeObject');
+		
 		this.initializeFromUserSelection(event);
 		this.updateCommonAncestorContainer();
 	},

data/vendor/assets/javascripts/aloha/lib/vendor/ext-3.2.1/ext-all-debug.js

@@ -188,14 +188,38 @@ Ext.DomHelper = function(){
                 setStart = 'setStart' + (endRe.test(where) ? 'After' : 'Before');
                 if (hash[where]) {
                     range[setStart](el);
-                    frag = range.createContextualFragment(html);
+
+                    // Workaround for IE9, because it does not have this method anymore
+                    // When we have moved to jQuery we won't need this anymore
+                    if (typeof range.createContextualFragment === 'function') {
+                    	frag = range.createContextualFragment(html);
+                    }
+                    else {
+                    	frag = document.createDocumentFragment(), 
+                        div = document.createElement("div");
+                        frag.appendChild(div);
+                        div.outerHTML = html;
+                    }
+
                     el.parentNode.insertBefore(frag, where == beforebegin ? el : el.nextSibling);
                     return el[(where == beforebegin ? 'previous' : 'next') + 'Sibling'];
                 } else {
                     rangeEl = (where == afterbegin ? 'first' : 'last') + 'Child';
                     if (el.firstChild) {
                         range[setStart](el[rangeEl]);
-                        frag = range.createContextualFragment(html);
+
+                        // Workaround for IE9, because it does not have this method anymore
+                        // When we have moved to jQuery we won't need this anymore
+                        if (typeof range.createContextualFragment === 'function') {
+                        	frag = range.createContextualFragment(html);
+                        }
+                        else {
+                        	frag = document.createDocumentFragment(), 
+                            div = document.createElement("div");
+                            frag.appendChild(div);
+                            div.outerHTML = html;
+                        }
+
                         if(where == afterbegin){
                             el.insertBefore(frag, el.firstChild);
                         }else{

data/vendor/assets/javascripts/aloha/lib/vendor/jquery.store.js

@@ -34,9 +34,9 @@
 define(
 [
  'aloha/jquery',
- 'vendor/jquery.json-2.2.min'
+ 'util/json2'
 ],
-function($, _1, undefined) {
+function($, __unused_json, undefined) {
 
 /**********************************************************************************
  * $.store base and convinience accessor
@@ -46,19 +46,6 @@ $.store = function( driver, serializers )
 {
 	var JSON = window.JSON
 		that = this;
-	
-	// IE fix
-	if (typeof JSON === 'undefined' || !JSON) {
-		/*
-		 * The GENTICS global namespace object. If GENTICS is already defined, the
-		 * existing GENTICS object will not be overwritten so that defined
-		 * namespaces are preserved.
-		 */
-		var JSON = function () {
-			this.stringigy = function () {};
-			this.parse = function () {};
-		};
-	}
 
 	if( typeof driver == 'string' )
 	{
@@ -443,4 +430,41 @@ $.store.serializers = {
 	}
 };
 
+
+	// We don't want to use window storage for ie7 with aloha because this causes massive issues when dealing with frames. 
+	// Window.name will change the framename and this will cause links with target attribute to stop working properly. 
+	// We remove the windowName driver and add the void driver which won't store any information.
+	if ( $.browser.msie && $.browser.version  == "7.0" ) {
+		delete($.store.drivers.windowName);
+		var voidDriver = {
+				ident: "$.store.drivers.voidDriver",
+				scope: 'void',
+				cache: {},
+				encodes: true,
+				available: function()
+				{
+					return true;
+				},
+				init: function()
+				{
+				},
+				save: function()
+				{
+				},
+				get: function( key )
+				{
+				},
+				set: function( key, value )
+				{
+				},
+				del: function( key )
+				{
+				},
+				flush: function()
+				{
+				}
+			};
+		$.store.drivers.voidDriver=voidDriver;
+	} 
+
 });

data/vendor/assets/javascripts/aloha/plugins/common/abbr/lib/abbr-plugin.js

@@ -143,6 +143,7 @@ define( [
 			Aloha.bind( 'aloha-selection-changed', function ( event, rangeObject ) {
 		        if ( Aloha.activeEditable ) {
 		        	// show/hide the button according to the configuration
+					// @todo this part should be done at aloha-editable-activated event
 		        	var config = me.getEditableConfig( Aloha.activeEditable.obj );
 
 		        	if ( jQuery.inArray( 'abbr', config ) != -1 ) {

data/vendor/assets/javascripts/aloha/plugins/common/align/lib/align-plugin.js

@@ -8,338 +8,348 @@
 define(
 ['aloha', 'aloha/plugin', 'aloha/floatingmenu', 'i18n!align/nls/i18n', 'i18n!aloha/nls/i18n', 'aloha/jquery', 'css!align/css/align.css'],
 function(Aloha, Plugin, FloatingMenu, i18n, i18nCore, jQuery) {
-	
-
-	var
-		GENTICS = window.GENTICS;
-	
-	/**
-	 * register the plugin with unique name
-	 */
-	 return Plugin.create('align', {
-		_constructor: function(){
-			this._super('align');
-		},
-
-		/**
-		 * Configure the available languages
-		 */
-		languages: ['en', 'fr'],
-		
-		/**
-		 * Configuration (available align options)
-		 */
-		config: {
-			alignment: ['right','left','center','justify']
-		},
-		
-		/**
-		 * Alignment wanted by the user
-		 */
-		alignment: '',
-
-		/**
-		 * Alignment of the selection before modification
-		 */
-		lastAlignment: '',
-		
-		/**
-		 * Initialize the plugin and set initialize flag on true
-		 */
-		init: function () {
-			this.createButtons();
-
-			var that = this;
-
-			// apply specific configuration if an editable has been activated
-			Aloha.bind('aloha-editable-activated', function (e, params) {
-				that.applyButtonConfig(params.editable.obj);
-			});
-
-			// add the event handler for selection change
-		    Aloha.bind('aloha-selection-changed', function(event, rangeObject) {
-		    	if (Aloha.activeEditable) {
-		    		that.buttonPressed(rangeObject);
-		    	}
-		    });
-		},
-
-		buttonPressed: function (rangeObject) {
-
-			var that = this;
-
-			rangeObject.findMarkup(function() {
-		        that.alignment = jQuery(this).css('text-align');
-		    }, Aloha.activeEditable.obj);
-
-			if(this.alignment != this.lastAlignment)
-			{
-				switch(this.lastAlignment)
-				{
-					case 'right':
-						this.alignRightButton.setPressed(false);
-						break;
-
-					case 'left':
-						this.alignLeftButton.setPressed(false);
-						break;
-
-					case 'center':
-						this.alignCenterButton.setPressed(false);
-						break;
-
-					case 'justify':
-						this.alignJustifyButton.setPressed(false);
-						break;
-				}
-
-				switch(this.alignment)
-				{
-					case 'right':
-						this.alignRightButton.setPressed(true);
-						break;
-
-					case 'center':
-						this.alignCenterButton.setPressed(true);
-						break;
-
-					case 'justify':
-						this.alignJustifyButton.setPressed(true);
-						break;
-
-					default:
-						this.alignLeftButton.setPressed(true);
-						this.alignment  = 'left';
-						break;
-				}
-			}
-
-			this.lastAlignment = this.alignment;
-		},
-
-		/**
-		 * applys a configuration specific for an editable
-		 * buttons not available in this configuration are hidden
-		 * @param {Object} id of the activated editable
-		 * @return void
-		 */
-		applyButtonConfig: function (obj) {
-			
-			if (typeof this.settings.alignment === 'undefined') {
-				var config = this.config.alignment;
-			} else {
-				var config = this.settings.alignment;
-			}
-			
-			if ( jQuery.inArray('right', config) != -1) {
-				this.alignRightButton.show();
-			} else {
-				this.alignRightButton.hide();
-			}
-
-			if ( jQuery.inArray('left', config) != -1) {
-				this.alignLeftButton.show();
-			} else {
-				this.alignLeftButton.hide();
-			}
-
-			if ( jQuery.inArray('center', config) != -1) {
-				this.alignCenterButton.show();
-			} else {
-				this.alignCenterButton.hide();
-			}
-
-			if ( jQuery.inArray('justify', config) != -1) {
-				this.alignJustifyButton.show();
-			} else {
-				this.alignJustifyButton.hide();
-			}
-		},
-
-		createButtons: function () {
-		    var that = this;
-
-		    // create a new button
-		    this.alignLeftButton = new Aloha.ui.Button({
-			  'name' : 'alignLeft',
-		      'iconClass' : 'aloha-button-align aloha-button-align-left',
-		      'size' : 'small',
-		      'onclick' : function () { that.align('left'); },
-		      'tooltip' : i18n.t('button.alignleft.tooltip'),
-		      'toggle' : true
-		    });
-
-		    // add it to the floating menu
-		    FloatingMenu.addButton(
-		      'Aloha.continuoustext',
-		      this.alignLeftButton,
-		      i18nCore.t('floatingmenu.tab.format'),
-		      1
-		    );
-
-		    // create a new button
-		    this.alignCenterButton = new Aloha.ui.Button({
-		      'name' : 'alignCenter',
-		      'iconClass' : 'aloha-button-align aloha-button-align-center',
-		      'size' : 'small',
-		      'onclick' : function () { that.align('center'); },
-		      'tooltip' : i18n.t('button.aligncenter.tooltip'),
-		      'toggle' : true
-		    });
-
-		    // add it to the floating menu
-		    FloatingMenu.addButton(
-		      'Aloha.continuoustext',
-		      this.alignCenterButton,
-		      i18nCore.t('floatingmenu.tab.format'),
-		      1
-		    );
-
-		    // create a new button
-		    this.alignRightButton = new Aloha.ui.Button({
-		      'name' : 'alignRight',
-		      'iconClass' : 'aloha-button-align aloha-button-align-right',
-		      'size' : 'small',
-		      'onclick' : function () { that.align('right'); },
-		      'tooltip' : i18n.t('button.alignright.tooltip'),
-		      'toggle' : true
-		    });
-
-		    // add it to the floating menu
-		    FloatingMenu.addButton(
-		      'Aloha.continuoustext',
-		      this.alignRightButton,
-		      i18nCore.t('floatingmenu.tab.format'),
-		      1
-		    );
-
-		    // create a new button
-		    this.alignJustifyButton = new Aloha.ui.Button({
-		      'name' : 'alignJustify',
-		      'iconClass' : 'aloha-button-align aloha-button-align-justify',
-		      'size' : 'small',
-		      'onclick' : function () { that.align('justify'); },
-		      'tooltip' : i18n.t('button.alignjustify.tooltip'),
-		      'toggle' : true
-		    });
-
-		    // add it to the floating menu
-		    FloatingMenu.addButton(
-		      'Aloha.continuoustext',
-		      this.alignJustifyButton,
-		      i18nCore.t('floatingmenu.tab.format'),
-		      1
-		    );
-
-		},
-
-		/**
-		 * Check whether inside a align tag 
-		 * @param {GENTICS.Utils.RangeObject} range range where to insert the object (at start or end)
-		 * @return markup
-		 * @hide
-		 */
-		findAlignMarkup: function ( range ) {
-
-			var that = this;
-
-			if ( typeof range === 'undefined' ) {
-		        var range = Aloha.Selection.getRangeObject();   
-		    }
-			if ( Aloha.activeEditable ) {
-				return range.findMarkup(function() {
-					return jQuery(this).css('text-align') == that.alignment;
-			    }, Aloha.activeEditable.obj);
-			} else {
-				return null;
-			}
-		},
-
-		/**
-		 * Align the selection or remove it
-		 */
-		align: function ( tempAlignment ) {
-
-			var range = Aloha.Selection.getRangeObject();
-
-			this.lastAlignment = this.alignment;
-			this.alignment = tempAlignment;
-
-		    if (Aloha.activeEditable) {
-		        if ( this.findAlignMarkup( range ) ) {
-		            this.removeAlign();
-		        } else {
-		        	this.insertAlign();
-		        }
-		    }
-		},
-
-		/**
-		 * Align the selection
-		 */
-		insertAlign: function () {
-
-			var that = this;
-
-			// do not align the range
-		    if ( this.findAlignMarkup( range ) ) {
-		        return;
-		    }
-		    // current selection or cursor position
-		    var range = Aloha.Selection.getRangeObject();
-
-		    // Iterates the whole selectionTree and align
-			jQuery.each(Aloha.Selection.getRangeObject().getSelectionTree(), function () {
-				if(this.selection !== 'none' && this.domobj.nodeType !== 3) {
-					jQuery(this.domobj).css('text-align', that.alignment);
-				}
-			});
-
-			if(this.alignment != this.lastAlignment)
-			{
-				switch(this.lastAlignment)
-				{
-					case 'right':
-						this.alignRightButton.setPressed(false);
-						break;
-
-					case 'left':
-						this.alignLeftButton.setPressed(false);
-						break;
-
-					case 'center':
-						this.alignCenterButton.setPressed(false);
-						break;
-
-					case 'justify':
-						this.alignJustifyButton.setPressed(false);
-						break;
-				}
-			}
-
-		    // select the (possibly modified) range
-		    range.select();
-		},
-
-		/**
-		 * Remove the alignment
-		 */
-		removeAlign: function () {
-
-		    var range = Aloha.Selection.getRangeObject();
-
-		    if ( this.findAlignMarkup( range ) ) {
-
-		    	// Remove the alignment
-		    	range.findMarkup(function() {
-		            jQuery(this).css('text-align', '');
-		        }, Aloha.activeEditable.obj);
-
-		        // select the (possibly modified) range
-		        range.select();
-		    }
-		}
-		
-	});
-	
+
+
+  var
+    GENTICS = window.GENTICS;
+
+  /**
+   * register the plugin with unique name
+   */
+   return Plugin.create('align', {
+    _constructor: function(){
+      this._super('align');
+    },
+
+    /**
+     * Configure the available languages
+     */
+    languages: ['en', 'fr'],
+
+    /**
+     * Configuration (available align options)
+     */
+    config: {
+      alignment: ['right','left','center','justify']
+    },
+
+    /**
+     * Alignment wanted by the user
+     */
+    alignment: '',
+
+    /**
+     * Alignment of the selection before modification
+     */
+    lastAlignment: '',
+
+    /**
+     * Initialize the plugin and set initialize flag on true
+     */
+    init: function () {
+      this.createButtons();
+
+      var that = this;
+
+      // apply specific configuration if an editable has been activated
+      Aloha.bind('aloha-editable-activated', function (e, params) {
+        that.applyButtonConfig(params.editable.obj);
+      });
+
+      // add the event handler for selection change
+        Aloha.bind('aloha-selection-changed', function(event, rangeObject) {
+          if (Aloha.activeEditable) {
+            that.buttonPressed(rangeObject);
+          }
+        });
+    },
+
+    buttonPressed: function (rangeObject) {
+
+      var that = this;
+
+      rangeObject.findMarkup(function() {
+            that.alignment = jQuery(this).css('text-align');
+        }, Aloha.activeEditable.obj);
+
+      if(this.alignment != this.lastAlignment)
+      {
+        switch(this.lastAlignment)
+        {
+          case 'right':
+            this.alignRightButton.setPressed(false);
+            break;
+
+          case 'left':
+            this.alignLeftButton.setPressed(false);
+            break;
+
+          case 'center':
+            this.alignCenterButton.setPressed(false);
+            break;
+
+          case 'justify':
+            this.alignJustifyButton.setPressed(false);
+            break;
+        }
+
+        switch(this.alignment)
+        {
+          case 'right':
+            this.alignRightButton.setPressed(true);
+            break;
+
+          case 'center':
+            this.alignCenterButton.setPressed(true);
+            break;
+
+          case 'justify':
+            this.alignJustifyButton.setPressed(true);
+            break;
+
+          default:
+            this.alignLeftButton.setPressed(true);
+            this.alignment  = 'left';
+            break;
+        }
+      }
+
+      this.lastAlignment = this.alignment;
+    },
+
+    /**
+     * applys a configuration specific for an editable
+     * buttons not available in this configuration are hidden
+     * @param {Object} id of the activated editable
+     * @return void
+     */
+    applyButtonConfig: function (obj) {
+
+      if (typeof this.settings.alignment === 'undefined') {
+        var config = this.config.alignment;
+      } else {
+        var config = this.settings.alignment;
+      }
+
+      if ( jQuery.inArray('right', config) != -1) {
+        this.alignRightButton.show();
+      } else {
+        this.alignRightButton.hide();
+      }
+
+      if ( jQuery.inArray('left', config) != -1) {
+        this.alignLeftButton.show();
+      } else {
+        this.alignLeftButton.hide();
+      }
+
+      if ( jQuery.inArray('center', config) != -1) {
+        this.alignCenterButton.show();
+      } else {
+        this.alignCenterButton.hide();
+      }
+
+      if ( jQuery.inArray('justify', config) != -1) {
+        this.alignJustifyButton.show();
+      } else {
+        this.alignJustifyButton.hide();
+      }
+    },
+
+    createButtons: function () {
+        var that = this;
+
+        // create a new button
+        this.alignLeftButton = new Aloha.ui.Button({
+        'name' : 'alignLeft',
+          'iconClass' : 'aloha-button-align aloha-button-align-left',
+          'size' : 'small',
+          'onclick' : function () { that.align('left'); },
+          'tooltip' : i18n.t('button.alignleft.tooltip'),
+          'toggle' : true
+        });
+
+        // add it to the floating menu
+        FloatingMenu.addButton(
+          'Aloha.continuoustext',
+          this.alignLeftButton,
+          i18nCore.t('floatingmenu.tab.format'),
+          1
+        );
+
+        // create a new button
+        this.alignCenterButton = new Aloha.ui.Button({
+          'name' : 'alignCenter',
+          'iconClass' : 'aloha-button-align aloha-button-align-center',
+          'size' : 'small',
+          'onclick' : function () { that.align('center'); },
+          'tooltip' : i18n.t('button.aligncenter.tooltip'),
+          'toggle' : true
+        });
+
+        // add it to the floating menu
+        FloatingMenu.addButton(
+          'Aloha.continuoustext',
+          this.alignCenterButton,
+          i18nCore.t('floatingmenu.tab.format'),
+          1
+        );
+
+        // create a new button
+        this.alignRightButton = new Aloha.ui.Button({
+          'name' : 'alignRight',
+          'iconClass' : 'aloha-button-align aloha-button-align-right',
+          'size' : 'small',
+          'onclick' : function () { that.align('right'); },
+          'tooltip' : i18n.t('button.alignright.tooltip'),
+          'toggle' : true
+        });
+
+        // add it to the floating menu
+        FloatingMenu.addButton(
+          'Aloha.continuoustext',
+          this.alignRightButton,
+          i18nCore.t('floatingmenu.tab.format'),
+          1
+        );
+
+        // create a new button
+        this.alignJustifyButton = new Aloha.ui.Button({
+          'name' : 'alignJustify',
+          'iconClass' : 'aloha-button-align aloha-button-align-justify',
+          'size' : 'small',
+          'onclick' : function () { that.align('justify'); },
+          'tooltip' : i18n.t('button.alignjustify.tooltip'),
+          'toggle' : true
+        });
+
+        // add it to the floating menu
+        FloatingMenu.addButton(
+          'Aloha.continuoustext',
+          this.alignJustifyButton,
+          i18nCore.t('floatingmenu.tab.format'),
+          1
+        );
+
+    },
+
+    /**
+     * Check whether inside a align tag
+     * @param {GENTICS.Utils.RangeObject} range range where to insert the object (at start or end)
+     * @return markup
+     * @hide
+     */
+    findAlignMarkup: function ( range ) {
+
+      var that = this;
+
+      if ( typeof range === 'undefined' ) {
+            var range = Aloha.Selection.getRangeObject();
+        }
+      if ( Aloha.activeEditable ) {
+        return range.findMarkup(function() {
+          return jQuery(this).css('text-align') == that.alignment;
+          }, Aloha.activeEditable.obj);
+      } else {
+        return null;
+      }
+    },
+
+    /**
+     * Align the selection or remove it
+     */
+    align: function ( tempAlignment ) {
+
+      var range = Aloha.Selection.getRangeObject();
+
+      this.lastAlignment = this.alignment;
+      this.alignment = tempAlignment;
+
+        if (Aloha.activeEditable) {
+            if ( this.findAlignMarkup( range ) ) {
+                this.removeAlign();
+            } else {
+              this.insertAlign();
+            }
+        }
+    },
+
+    /**
+     * Align the selection
+     */
+    insertAlign: function () {
+
+      var that = this;
+
+      // do not align the range
+        if ( this.findAlignMarkup( range ) ) {
+            return;
+        }
+        // current selection or cursor position
+        var range = Aloha.Selection.getRangeObject();
+
+        // Iterates the whole selectionTree and align
+      jQuery.each(Aloha.Selection.getRangeObject().getSelectionTree(), function () {
+        if(this.selection !== 'none' && this.domobj.nodeType !== 3) {
+          jQuery(this.domobj).css('text-align', that.alignment);
+        }
+      });
+
+      // FIXME: https://github.com/alohaeditor/Aloha-Editor/pull/362
+      if (!GENTICS.Utils.Dom.isEditingHost(range.getCommonAncestorContainer()))
+        jQuery(range.getCommonAncestorContainer()).css('text-align', this.alignment);
+      else
+        jQuery.each(Aloha.Selection.getRangeObject().getSelectionTree(), function () {
+          if(this.selection !== 'none' && this.domobj.nodeType !== 3) {
+            jQuery(this.domobj).css('text-align', that.alignment);
+          }
+        });
+
+      if(this.alignment != this.lastAlignment)
+      {
+        switch(this.lastAlignment)
+        {
+          case 'right':
+            this.alignRightButton.setPressed(false);
+            break;
+
+          case 'left':
+            this.alignLeftButton.setPressed(false);
+            break;
+
+          case 'center':
+            this.alignCenterButton.setPressed(false);
+            break;
+
+          case 'justify':
+            this.alignJustifyButton.setPressed(false);
+            break;
+        }
+      }
+
+        // select the (possibly modified) range
+        range.select();
+    },
+
+    /**
+     * Remove the alignment
+     */
+    removeAlign: function () {
+
+        var range = Aloha.Selection.getRangeObject();
+
+        if ( this.findAlignMarkup( range ) ) {
+
+          // Remove the alignment
+          range.findMarkup(function() {
+                jQuery(this).css('text-align', '');
+            }, Aloha.activeEditable.obj);
+
+            // select the (possibly modified) range
+            range.select();
+        }
+    }
+
+  });
+
 });