locomotive-aloha-rails 0.20.1.2 → 0.20.1.3

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

@@ -86,19 +86,22 @@ function( Aloha, Registry, Engine, Dom, ContentHandlerManager ) {
 			}
 
 			Engine.execCommand( commandId, showUi, value, range );
-			
-			// Read range after engine modification
-			range = Aloha.getSelection().getRangeAt( 0 );
-
-			// FIX: doCleanup should work with W3C range
-			var startnode = range.commonAncestorContainer.parentNode;
-			var rangeObject = new window.GENTICS.Utils.RangeObject();
-			rangeObject.startContainer = range.startContainer;
-			rangeObject.startOffset = range.startOffset;
-			rangeObject.endContainer = range.endContainer;
-			rangeObject.endOffset = range.endOffset;
-			Dom.doCleanup({merge:true, removeempty: false}, rangeObject, startnode);
-			rangeObject.select();
+
+			if ( Aloha.getSelection().getRangeCount() ) {
+				// Read range after engine modification
+				range = Aloha.getSelection().getRangeAt( 0 );
+
+				// FIX: doCleanup should work with W3C range
+				var startnode = range.commonAncestorContainer.parentNode;
+				var rangeObject = new window.GENTICS.Utils.RangeObject();
+				rangeObject.startContainer = range.startContainer;
+				rangeObject.startOffset = range.startOffset;
+				rangeObject.endContainer = range.endContainer;
+				rangeObject.endOffset = range.endOffset;
+				Dom.doCleanup({merge:true, removeempty: false}, rangeObject, startnode);
+				rangeObject.select();
+			}
+
 			Aloha.trigger('aloha-command-executed', commandId);
 		},
 		

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

@@ -28,6 +28,12 @@ define(
 function ( jQuery, PluginManager ) {
 	
 
+	// Aloha Editor does not support Internet Explorer 6.  ExtJS style fixes for
+	// IE6 which are applied through the "ext-ie6" class cause visual bugs in
+	// IE9, and so we remove it so that IE6 fixes are not applied.
+	Aloha.ready(function() {
+		jQuery('.ext-ie6').removeClass('ext-ie6');
+	});
 
 	//----------------------------------------
 	// Private variables
@@ -227,6 +233,8 @@ function ( jQuery, PluginManager ) {
 		 * Fetches plugins the user wants to have loaded. Returns all plugins the user
 		 * has specified with the data-plugins property as array, with the bundle
 		 * name in front.
+		 * It's also possible to use 'Aloha.settings.plugins.load' to define the plugins
+		 * to load.
 		 *
 		 * @return array
 		 * @internal
@@ -236,13 +244,20 @@ function ( jQuery, PluginManager ) {
 			var
 				plugins = jQuery('[data-aloha-plugins]').data('aloha-plugins');
 
+			// load aloha plugins from config
+			if ( typeof Aloha.settings.plugins != 'undefined' && typeof Aloha.settings.plugins.load != 'undefined' ) {
+				plugins = Aloha.settings.plugins.load;
+				if (plugins instanceof Array) {
+					return plugins;
+				}
+			}
+
 			// Determine Plugins
 			if ( typeof plugins === 'string' && plugins !== "") {
 				return plugins.replace(/\s+/g, '').split(',');
 			}
 			// Return
 			return [];
-			
 		},
 
 		/**
@@ -521,6 +536,7 @@ function ( jQuery, PluginManager ) {
 
 		/**
 		 * Determines the Aloha Url
+		 * Uses Aloha.settings.baseUrl if set.
 		 * @method
 		 * @return {String} alohaUrl
 		 */
@@ -528,7 +544,11 @@ function ( jQuery, PluginManager ) {
 			// aloha base path is defined by a script tag with 2 data attributes
 			var requireJs = jQuery('[data-aloha-plugins]'),
 				baseUrl = ( requireJs.length ) ? requireJs[0].src.replace( /\/?aloha.js$/ , '' ) : '';
-				
+			
+			if ( typeof Aloha.settings.baseUrl === "string" ) {
+				baseUrl = Aloha.settings.baseUrl;
+			}
+			
 			return baseUrl;
 		},
 
@@ -557,4 +577,4 @@ function ( jQuery, PluginManager ) {
 	});
 
 	return Aloha;
-});
+});

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

@@ -1,6 +1,18 @@
+/**
+ * ecma5schims.js - Shim for ECMA5 compatibility
+ * (http://en.wikipedia.org/wiki/Shim_%28computing%29)
+ *
+ * A shim library that implements common functions that are missing on some
+ * environments in order to complete ECMA5 compatibility across all major
+ * browsers.
+ *
+ * TODO: This code needs to be refactored so as to conform to Aloha coding
+ *       standards.  It is also severly lacking in documentation.  Please take
+ *       note of: https://github.com/alohaeditor/Aloha-Editor/wiki/Commit-Checklist .
+ */
 
-define([],
-function(){
+define([], function(){
+  
 
   var shims = {
     // Function bind
@@ -236,12 +248,16 @@ function(){
     if (node2 != useNode2) useNode2.parentNode.removeChild(useNode2);
     return result;
 
-
     //node.ownerDocument gives the document object, which isn't the right info for a disconnect
-    function getRootParent(node) {
-      do { var parent = node; }
-      while (node = node.parentNode);
-      return parent;
+    function getRootParent( node ) {
+		var parent = null;
+
+		if ( node ) {
+			do { parent = node; }
+			while ( node = node.parentNode );
+		}
+
+		return parent;
     }
 
     //Compare Position - MIT Licensed, John Resig; http://ejohn.org/blog/comparing-document-position/

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

@@ -52,6 +52,12 @@ define( [
 		Aloha.settings.contentHandler = {};
 	}
 
+	var defaultContentSerializer = function(editableElement){
+		return jQuery(editableElement).html();
+	};
+
+	var contentSerializer = defaultContentSerializer;
+
 	/**
 	 * Editable object
 	 * @namespace Aloha
@@ -76,8 +82,9 @@ define( [
 
 			// delimiters, timer and idle for smartContentChange
 			// smartContentChange triggers -- tab: '\u0009' - space: '\u0020' - enter: 'Enter'
+			// backspace: U+0008 - delete: U+007F
 			this.sccDelimiters = [ ':', ';', '.', '!', '?', ',',
-				unescape( '%u0009' ), unescape( '%u0020' ), 'Enter' ];
+				unescape( '%u0009' ), unescape( '%u0020' ), unescape( '%u0008' ), unescape( '%u007F' ), 'Enter' ];
 			this.sccIdle = 5000;
 			this.sccDelay = 500;
 			this.sccTimerIdle = false;
@@ -200,8 +207,13 @@ define( [
 				// if it does not handle the keyStroke it returns true and therefore all other
 				// events (incl. browser's) continue
 				me.obj.keydown( function( event ) {
+					var letEventPass = Markup.preProcessKeyStrokes( event );
 					me.keyCode = event.which;
-					return Markup.preProcessKeyStrokes( event );
+					if (!letEventPass) {
+						// the event will not proceed to key press, therefore trigger smartContentChange
+						me.smartContentChange( event );
+					}
+					return letEventPass;
 				} );
 
 				// handle keypress
@@ -688,19 +700,32 @@ define( [
 			this.removePlaceholder( clonedObj );
 			PluginManager.makeClean( clonedObj );
 
-			/*
-			//also deactivated for now. like initEditable. just in case ...
-			var content = clonedObj.html()
-			if ( typeof Aloha.settings.contentHandler.getContents === 'undefined' ) {
-				Aloha.settings.contentHandler.getContents = Aloha.defaults.contentHandler.getContents;
+			return asObject ? clonedObj.contents() : contentSerializer(clonedObj[0]);
+		},
+
+		/**
+		 * Set the contents of this editable as a HTML string
+		 * @param content as html
+		 * @param return as object or html string
+		 * @return contents of the editable
+		 */
+		setContents: function( content, asObject ) {
+			var reactivate = null;
+
+			if ( Aloha.getActiveEditable() === this ) {
+				Aloha.deactivateEditable();
+				reactivate = this;
+			}
+
+			this.obj.html( content );
+
+			if ( null !== reactivate ) {
+				reactivate.activate();
 			}
-			content = ContentHandlerManager.handleContent( content, {
-				contenthandler: Aloha.settings.contentHandler.getContents
-			} );
-			clonedObj.html( content );
-			*/
 
-			return asObject ? clonedObj.contents() : clonedObj.html();
+			this.smartContentChange({type : 'set-contents'});
+
+			return asObject ? this.obj.contents() : contentSerializer(this.obj[0]);
 		},
 
 		/**
@@ -849,6 +874,24 @@ define( [
 			this.snapshotContent = this.getContents();
 			return ret;
 		}
-
 	} );
+
+	/**
+	 * Sets the serializer function to be used for the contents of all editables.
+	 *
+	 * The default content serializer will just call the jQuery.html()
+	 * function on the editable element (which gets the innerHTML property).
+	 *
+	 * This method is a static class method and will affect the result
+	 * of editable.getContents() for all editables that have been or
+	 * will be constructed.
+	 *
+	 * @param serializerFunction
+	 *        A function that accepts a DOM element and returns the serialized
+	 *        XHTML of the element contents (excluding the start and end tag of
+	 *        the passed element).
+	 */
+	Aloha.Editable.setContentSerializer = function( serializerFunction ) {
+		contentSerializer = serializerFunction;
+	};
 } );

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

@@ -6252,6 +6252,7 @@ commands["delete"] = {
 
 		// collapse whitespace sequences
 		collapseWhitespace(node, range);
+		offset = range.startOffset;
 
 		// "If node is a Text node and offset is not zero, call collapse(node,
 		// offset) on the Selection. Then delete the contents of the range with
@@ -6845,6 +6846,7 @@ commands.forwarddelete = {
 
 		// collapse whitespace in the node, if it is a text node
 		collapseWhitespace(node, range);
+		offset = range.startOffset;
 
 		// "If node is a Text node and offset is not node's length:"
 		if (node.nodeType == $_.Node.TEXT_NODE
@@ -7641,11 +7643,13 @@ commands.insertparagraph = {
 		// container name) on the context object."
 		var newContainer = document.createElement(newContainerName);
 
-		// "Copy all attributes of container to new container."
-		for (var i = 0; i < container.attributes.length; i++) {
-			if (typeof newContainer.setAttributeNS === 'function') {
+		// "Copy all non empty attributes of the container to new container."
+		for ( var i = 0; i < container.attributes.length; i++ ) {
+			if ( typeof newContainer.setAttributeNS === 'function' ) {
 				newContainer.setAttributeNS(container.attributes[i].namespaceURI, container.attributes[i].name, container.attributes[i].value);
-			} else {
+			} else if ( container.attributes[i].value.length > 0 
+						&& container.attributes[i].value != 'null'
+						&& container.attributes[i].value > 0) {
 				newContainer.setAttribute(container.attributes[i].name, container.attributes[i].value);
 			}
 		}
@@ -8303,4 +8307,4 @@ return {
 	queryCommandSupported: myQueryCommandSupported
 }
 }); // end define
-// vim: foldmarker=@{,@} foldmethod=marker
+// vim: foldmarker=@{,@} foldmethod=marker

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

@@ -64,8 +64,7 @@ function(Aloha, jQuery, Ext, Class, console) {
 		getExtComponent: function () {
 			var that = this;
 
-			if (typeof this.extPanel === 'undefined') {
-				// generate the panel here
+			if (!this.extPanel) {
 				this.extPanel = new Ext.Panel({
 					'tbar' : [],
 					'title' : this.label,
@@ -73,13 +72,15 @@ function(Aloha, jQuery, Ext, Class, console) {
 					'bodyStyle': 'display:none',
 					'autoScroll': true
 				});
+			}
 
-				// add the groups
-				jQuery.each(this.groups, function(index, group) {
-					// let each group generate its ext component and add them to the panel
+			jQuery.each(this.groups, function(index, group) {
+				// let each group generate its ext component and add them to
+				// the panel once.
+				if (!group.extButtonGroup) {
 					that.extPanel.getTopToolbar().add(group.getExtComponent());
-				});
-			}
+				}
+			});
 
 			return this.extPanel;
 		},
@@ -192,6 +193,7 @@ function(Aloha, jQuery, Ext, Class, console) {
 					'columns' : columnCount,
 					'items': items
 				});
+
 	//			jQuery.each(this.fields, function(id, field){
 	//				that.buttons.push(field);
 	//			});
@@ -265,6 +267,73 @@ function(Aloha, jQuery, Ext, Class, console) {
 		}
 	});
 
+	//=========================================================================
+	//
+	// Floating Menu
+	//
+	//=========================================================================
+
+	var lastFloatingMenuPos = {
+		top: null,
+		left: null
+	};
+
+	/**
+	 * Handler for window scroll event.  Positions the floating menu
+	 * appropriately.
+	 *
+	 * @param {Aloha.FloatingMenu} floatingmenu
+	 */
+	function onWindowScroll( floatingmenu ) {
+		if ( !Aloha.activeEditable ) {
+			return;
+		}
+
+		var element = floatingmenu.obj;
+		var editablePos = Aloha.activeEditable.obj.offset();
+		var isTopAligned = floatingmenu.behaviour === 'topalign';
+		var isAppended = floatingmenu.behaviour === 'append';
+		var isManuallyPinned = floatingmenu.pinned
+							 && ( parseInt( element.css( 'left' ), 10 )
+								  != ( editablePos.left
+									   + floatingmenu.horizontalOffset
+									 ) );
+
+		// no calculation when pinned manually or has behaviour 'append'
+		if ( isTopAligned && isManuallyPinned || isAppended ) {
+			return;
+		}
+
+		var floatingmenuHeight = element.height();
+		var scrollTop = jQuery( document ).scrollTop();
+
+		// This value is what the top position of the floating menu *would* be
+		// if we tried to position it above the active editable.
+		var floatingmenuTop = editablePos.top - floatingmenuHeight
+		                    + floatingmenu.marginTop
+		                    - floatingmenu.topalignOffset;
+
+		// The floating menu does not fit in the space between the top of the
+		// viewport and the editable, so position it at the top of the viewport
+		// and over the editable.
+		if ( scrollTop > floatingmenuTop ) {
+			editablePos.top = isTopAligned
+							? scrollTop + floatingmenu.marginTop
+							: floatingmenu.marginTop;
+
+		// There is enough space on top of the editable to fit the entire
+		// floating menu, so we do so.
+		} else if ( scrollTop <= floatingmenuTop ) {
+			editablePos.top -= floatingmenuHeight
+							 + ( isTopAligned
+								 ? floatingmenu.marginTop +
+								   floatingmenu.topalignOffset
+								 : 0 );
+		}
+
+		floatingmenu.floatTo( editablePos );
+	}
+
 	/**
 	 * Aloha's Floating Menu
 	 * @namespace Aloha
@@ -344,16 +413,30 @@ function(Aloha, jQuery, Ext, Class, console) {
 		window: jQuery(window),
 
 		/**
-		 * define floating menu float behaviour. meant to be adjusted via
-		 * GENTICS.Aloha.settings.floatingmenu.behaviour
-		 * set it to 'float' for standard behaviour, or 'topalign' for a fixed fm 
+		 * Aloha.settings.floatingmenu.behaviour
+		 * 
+		 * Is used to define the floating menu (fm) float behaviour.
+		 *
+		 * available: 
+		 *  'float' (default) the fm will float next to the position where the caret is,
+		 *  'topalign' the fm is fixed above the contentEditable which is active,
+		 *  'append' the fm is appended to the defined 'element' element position (top/left)
 		 */
 		behaviour: 'float',
 
+		/**
+		 * Aloha.settings.floatingmenu.element
+		 *
+		 * Is used to define the element where the floating menu is positioned when
+		 * Aloha.settings.floatingmenu.behaviour is set to 'append'
+		 * 
+		 */
+		element: 'floatingmenu',
+
 		/**
 		 * topalign offset to be used for topalign behavior
 		 */
-		topalignOffset: 90,
+		topalignOffset: 0,
 		
 		/**
 		 * topalign offset to be used for topalign behavior
@@ -364,7 +447,7 @@ function(Aloha, jQuery, Ext, Class, console) {
 		 * will only be hounoured when behaviour is set to 'topalign'. Adds a margin,
 		 * so the floating menu is not directly attached to the top of the page
 		 */
-		marginTop: 0,
+		marginTop: 10,
 		
 		/**
 		 * Define whether the floating menu shall be draggable or not via Aloha.settings.floatingmanu.draggable
@@ -372,6 +455,12 @@ function(Aloha, jQuery, Ext, Class, console) {
 		 */
 		draggable: true,
 		
+		/**
+		 * Define whether the floating menu shall be pinned or not via Aloha.settings.floatingmanu.pin
+		 * Default is: false 
+		 */
+		pin: false,
+		
 		/**
 		 * A list of all buttons that have been added to the floatingmenu
 		 * This needs to be tracked, as adding buttons twice will break the fm
@@ -391,38 +480,58 @@ function(Aloha, jQuery, Ext, Class, console) {
 		init: function() {
 
 			// check for behaviour setting of the floating menu
-		    if (Aloha.settings.floatingmenu) {
-		    	
-		    	if (typeof Aloha.settings.floatingmenu.draggable === 'boolean') {
+		    if ( Aloha.settings.floatingmenu ) {
+		    	if ( typeof Aloha.settings.floatingmenu.draggable ===
+				         'boolean' ) {
 		    		this.draggable = Aloha.settings.floatingmenu.draggable;
 		    	}
-				if (typeof Aloha.settings.floatingmenu.behaviour === 'string') {
+
+				if ( typeof Aloha.settings.floatingmenu.behaviour ===
+				         'string' ) {
 					this.behaviour = Aloha.settings.floatingmenu.behaviour;
 				}
-				if (typeof Aloha.settings.floatingmenu.topalignOffset !== 'undefined') {
-					this.topalignOffset = Aloha.settings.floatingmenu.topalignOffset;
+
+				if ( typeof Aloha.settings.floatingmenu.topalignOffset !==
+					    'undefined' ) {
+					this.topalignOffset = parseInt(
+						Aloha.settings.floatingmenu.topalignOffset, 10 );
 				}
-				if (typeof Aloha.settings.floatingmenu.horizontalOffset !== 'undefined') {
-					this.horizontalOffset = Aloha.settings.floatingmenu.horizontalOffset;
+
+				if ( typeof Aloha.settings.floatingmenu.horizontalOffset !==
+				         'undefined' ) {
+					this.horizontalOffset = parseInt(
+						Aloha.settings.floatingmenu.horizontalOffset , 10 );
 				}
-				if (typeof Aloha.settings.floatingmenu.marginTop === 'number') {
-				    this.marginTop = Aloha.settings.floatingmenu.marginTop;
+
+				if ( typeof Aloha.settings.floatingmenu.marginTop ===
+				         'number' ) {
+				    this.marginTop = parseInt(
+						Aloha.settings.floatingmenu.marginTop , 10 );
 				}
-				//We just check for undefined
-				if (typeof Aloha.settings.floatingmenu.width !== 'undefined') {
-					//Try to pars it
-					try {
-						var parsed = parseInt(Aloha.settings.floatingmenu.width);
-						this.width = Aloha.settings.floatingmenu.width;
-					} catch(e) {
-						//do nothing.
-					}
+
+				if ( typeof Aloha.settings.floatingmenu.element ===
+						'string' ) {
+					this.element = Aloha.settings.floatingmenu.element;
+				}
+				if ( typeof Aloha.settings.floatingmenu.pin ===
+						'boolean' ) {
+					this.pin = Aloha.settings.floatingmenu.pin;
+				}
+
+
+				if ( typeof Aloha.settings.floatingmenu.width !==
+				         'undefined' ) {
+					this.width = parseInt( Aloha.settings.floatingmenu.width,
+						10 );
 				}
 		    }
 
 			jQuery.storage = new jQuery.store();
+
 			this.currentScope = 'Aloha.global';
+
 			var that = this;
+
 			this.window.unload(function () {
 				// store fm position if the panel is pinned to be able to restore it next time
 				if (that.pinned) {
@@ -462,7 +571,7 @@ function(Aloha, jQuery, Ext, Class, console) {
 			});
 			
 			if (typeof Aloha.settings.toolbar === 'object') {
-				this.fromConfig = true;				
+				this.fromConfig = true;
 			}
 		},
 
@@ -580,6 +689,10 @@ function(Aloha, jQuery, Ext, Class, console) {
 							that.left = this.x;
 							that.top = top;
 
+							// store the last floating menu position when the floating menu was dragged around
+							lastFloatingMenuPos.left = that.left;
+							lastFloatingMenuPos.top = that.top;
+
 							this.panel.setPosition(this.x, top);
 							that.refreshShadow();
 							this.panel.shadow.show();
@@ -630,8 +743,10 @@ function(Aloha, jQuery, Ext, Class, console) {
 								});
 						
 								// adapt the shadow
-								that.extTabPanel.shadow.show();
-								that.refreshShadow();
+								if (that.extTabPanel.isVisible()) {
+									that.extTabPanel.shadow.show();
+									that.refreshShadow();
+								}
 							}
 						}
 					},
@@ -640,6 +755,7 @@ function(Aloha, jQuery, Ext, Class, console) {
 		
 		
 			}
+
 			// add the tabs
 			jQuery.each(this.tabs, function(index, tab) {
 				// let each tab generate its ext component and add them to the panel
@@ -651,8 +767,10 @@ function(Aloha, jQuery, Ext, Class, console) {
 			});
 
 			// add the dropshadow
-			this.extTabPanel.shadow = jQuery('<div id="aloha-floatingmenu-shadow" class="aloha-shadow">&#160;</div>');
-			jQuery('body').append(this.extTabPanel.shadow);
+			if (!this.extTabPanel.shadow) {
+				this.extTabPanel.shadow = jQuery('<div id="aloha-floatingmenu-shadow" class="aloha-shadow">&#160;</div>').hide();
+				jQuery('body').append(this.extTabPanel.shadow);
+			}
 
 			// add an empty pin tab item, store reference
 			pinTab = this.extTabPanel.add({
@@ -686,7 +804,7 @@ function(Aloha, jQuery, Ext, Class, console) {
 			this.obj = jQuery(this.extTabPanel.getEl().dom);
 
 			if (jQuery.storage.get('Aloha.FloatingMenu.pinned') == 'true') {
-				this.togglePin();
+				//this.togglePin();
 
 				this.top = parseInt(jQuery.storage.get('Aloha.FloatingMenu.top'),10);
 				this.left = parseInt(jQuery.storage.get('Aloha.FloatingMenu.left'),10);
@@ -715,13 +833,26 @@ function(Aloha, jQuery, Ext, Class, console) {
 			this.obj.mousedown(function (e) {
 				e.originalEvent.stopSelectionUpdate = true;
 				Aloha.eventHandled = true;
-		//		e.stopSelectionUpdate = true;
+				//e.stopSelectionUpdate = true;
 			});
+
 			this.obj.mouseup(function (e) {
 				e.originalEvent.stopSelectionUpdate = true;
 				Aloha.eventHandled = false;
 			});
 
+			jQuery( window ).scroll(function() {
+				onWindowScroll( that );
+			});
+
+			// don't display the drag handle bar / pin when floating menu is not draggable
+			if ( !that.draggable ) {
+				jQuery('.aloha-floatingmenu').hover( function() {
+					jQuery(this).css({background: 'none'});
+					jQuery('.aloha-floatingmenu-pin').hide();
+				});
+			}
+
 			// adjust float behaviour
 			if (this.behaviour === 'float') {
 				// listen to selectionChanged event
@@ -733,56 +864,85 @@ function(Aloha, jQuery, Ext, Class, console) {
 						}
 					}
 				});
-		    } else if (this.behaviour === 'topalign') {
+			} else if (this.behaviour === 'append' ) {
+				var p = jQuery( "#" + that.element );
+				var position = p.offset();
+
+				if ( !position ) {
+					Aloha.Log.warn(that, 'Invalid element HTML ID for floating menu: ' + that.element);
+					return false;
+				}
+
+				// set the position so that it does not float on the first editable activation
+				this.floatTo( position );
+				
+				if ( this.pin ) {
+					this.togglePin( true );
+				}
+
+				Aloha.bind( 'aloha-editable-activated', function( event, data ) {
+					if ( that.pinned ) {
+						return;
+					}
+					that.floatTo( position );
+				});
+				
+		    } else if ( this.behaviour === 'topalign' ) {
 				// topalign will retain the user's pinned status
 				// TODO maybe the pin should be hidden in that case?
-				this.togglePin(false);
-
-				// float the fm to each editable that is activated
-				Aloha.bind('aloha-editable-activated', function(event, data) {
-					var p = data.editable.obj.offset();
-					p.top -= that.topalignOffset;
-					p.left += that.horizontalOffset;
-			    if (p.top < jQuery(document).scrollTop()) {
-					// scrollpos is below top of editable
-					that.obj.css('top', jQuery(document).scrollTop() + that.marginTop);
-					that.obj.css('left', p.left);
-					that.togglePin(true);
-			    } else {
-					// scroll pos is above top of editable
-					that.floatTo(p);
-			    }
-			});
+				this.togglePin( false );
 
-				// fm scroll behaviour
-			jQuery(window).scroll(function () {
-			    if (!Aloha.activeEditable) {
-					return;
-			    }
-			    var pos = Aloha.activeEditable.obj.offset(),
-					fmHeight = that.obj.height(),
-					scrollTop = jQuery(document).scrollTop();
-
-				if (scrollTop > (pos.top - fmHeight - 6 - that.marginTop)) {
-					// scroll pos is lower than top of editable
-					that.togglePin(true);
-					that.obj.css('top', that.marginTop);
-			    } else if (scrollTop <= (pos.top - fmHeight - 6 - that.marginTop)) {
-					// scroll pos is above top of editable
-					if (that.behaviour === 'topalign') {
-						pos.top = Aloha.activeEditable.obj.offset().top - that.topalignOffset;
-						pos.left = Aloha.activeEditable.obj.offset().left + that.horizontalOffset;
+				// Float the menu to the editable that is activated.
+				Aloha.bind( 'aloha-editable-activated', function( event, data ) {
+					if ( that.pinned ) {
+						return;
+					}
+
+					// FIXME: that.obj.height() does not return the correct
+					//        height of the editable.  We need to fix this, and
+					//        not hard-code the height as we currently do.
+					var editable = data.editable.obj;
+					var floatingmenuHeight = 90;
+					var editablePos = editable.offset();
+					var isFloatingmenuAboveViewport = ( (
+						editablePos.top - floatingmenuHeight )
+						    < jQuery( document ).scrollTop() );
+
+					if ( isFloatingmenuAboveViewport ) {
+						// Since we don't have space to place the floatingmenu
+						// above the editable, we want to place it over the
+						// editable instead.  But if the editable is shorter
+						// than the floatingmenu, it would be completely
+						// covered by it, and so, in such cases, we position
+						// the editable at the bottom of the short editable.
+						editablePos.top = ( editable.height()
+						         < floatingmenuHeight )
+							? editablePos.top + editable.height()
+							: jQuery( document ).scrollTop();
+
+						editablePos.top += that.marginTop;
 					} else {
-						pos.top -= fmHeight + 6;
+						editablePos.top -= floatingmenuHeight
+						                 + that.topalignOffset;
 					}
-					that.togglePin(false);
-					that.floatTo(pos);
-			    } else if (scrollTop > pos.top + Aloha.activeEditable.obj.height() - fmHeight) {
-					// scroll pos is below editable
-					that.togglePin(false);
-			    }
-			});
-		    }
+
+					editablePos.left += that.horizontalOffset;
+
+					var HORIZONTAL_PADDING = 10;
+					// Calculate by how much the floating menu is pocking
+					// outside the width of the viewport.  A positive number
+					// means that it is outside the viewport, negative means
+					// it is within the viewport.
+					var overhang = ( ( editablePos.left + that.width
+						+ HORIZONTAL_PADDING ) - jQuery(window).width() );
+
+					if ( overhang > 0 ) {
+						editablePos.left -= overhang;	
+					}
+
+					that.floatTo( editablePos );
+				});
+			}
 		},
 
 		/**
@@ -961,6 +1121,11 @@ function(Aloha, jQuery, Ext, Class, console) {
 				Aloha.Log.debug(this, 'doLayout called for FloatingMenu, scope is ' + this.currentScope);
 			}
 
+			// if there's no floatingmenu don't do anything
+			if ( typeof this.extTabPanel === 'undefined' ) {
+				return false;
+			}
+
 			var that = this,
 				firstVisibleTab = false,
 				activeExtTab = this.extTabPanel.getActiveTab(),
@@ -1186,7 +1351,10 @@ function(Aloha, jQuery, Ext, Class, console) {
 
 			// if the floating menu would be placed higher than the top of the screen...
 			if ( top < scrollTop) {
-				top += 50 + GENTICS.Utils.Position.ScrollCorrection.top;
+				top += 80 + GENTICS.Utils.Position.ScrollCorrection.top;
+				// 80px if editable element is eg h1; 50px was fine for p;
+				// todo: maybe just use GENTICS.Utils.Position.ScrollCorrection.top with a better value?
+				// check where this is also used ...
 			}
 
 			// if the floating menu would float off the bottom of the screen
@@ -1220,24 +1388,47 @@ function(Aloha, jQuery, Ext, Class, console) {
 				return;
 			}
 
-			var that = this,
-			    fmpos = this.obj.offset();
+			var floatingmenu = this,
+			    fmpos = this.obj.offset(),
+				lastLeft,
+				lastTop;
+			
+			if ( lastFloatingMenuPos.left === null ) {
+				lastLeft = fmpos.left;
+				lastTop = fmpos.top;
+			} else {
+				lastLeft = lastFloatingMenuPos.left;
+				lastTop = lastFloatingMenuPos.top;
+			}
 
-			// move to the new position
-			if (fmpos.left != position.left || fmpos.top != position.top) {
-				this.obj.animate({
-					top:  position.top,
+			// Place the floatingmenu to the last place the user had seen it,
+			// then animate it into its new position.
+			if ( lastLeft != position.left || lastTop != position.top ) {
+				this.obj.offset({
+					left: lastLeft,
+					top: lastTop
+				});
+
+				this.obj.animate( {
+					top: position.top,
 					left: position.left
 				}, {
 					queue : false,
-					step : function (step, props) {
+					step : function( step, props ) {
 						// update position reference
-						if (props.prop == 'top') {
-							that.top = props.now;
-						} else if (props.prop == 'left') {
-							that.left = props.now;
+						if ( props.prop === 'top' ) {
+							floatingmenu.top = props.now;
+						} else if ( props.prop === 'left' ) {
+							floatingmenu.left = props.now;
 						}
-						that.refreshShadow(false);
+
+						floatingmenu.refreshShadow( false );
+					},
+					complete: function() {
+						// When the animation is over, remember the floatingmenu's
+						// final resting position.
+						lastFloatingMenuPos.left = floatingmenu.left;
+						lastFloatingMenuPos.top = floatingmenu.top;
 					}
 				});
 			}
@@ -1302,3 +1493,4 @@ function(Aloha, jQuery, Ext, Class, console) {
 	
 	return menu;
 });
+