Fixes bug with floatingmenu's reading of configuration settings, and …

…fixes positioning of floatingmenu when the view port is scrolled.
alohaeditor · Feb 9, 2012 · b7c8920 · b7c8920
1 parent 2c13731
commit b7c8920
Show file tree

Hide file tree

Showing 4 changed files with 56 additions and 39 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,10 @@ All changes are categorized into one of the following keywords:
                usage, or intent of an existing one.
 
 ## 0.20.6 - SNAPSHOT
+- **BUG** floatingmenu: Fixed floating menu's reading of configuration values
+          so that they are parsed into numbers.
+- **BUG** floatingmenu: Fixed floating menu positioning when view port is
+          scrolled so that it takes into account the aligntopOffset setting.
 
 
 ## 0.20.5 - 2012/02/09

diff --git a/src/demo/boilerplate/index.html b/src/demo/boilerplate/index.html
@@ -35,7 +35,8 @@
 	                            common/abbr,
 	                            extra/wai-lang,
 	                            extra/browser,
-	                            extra/linkbrowser"></script>
+	                            extra/linkbrowser,
+								extra/cite"></script>
 	<script src="js/aloha-boilerplate.js"></script>
 </head>
 <body>

diff --git a/src/demo/boilerplate/js/aloha-config.js b/src/demo/boilerplate/js/aloha-config.js
@@ -7,8 +7,10 @@
 		ribbon: false,
 		locale: 'en',
 		floatingmenu: {
-			width: 630,
-			behaviour: 'topalign'
+			"horizontalOffset" : "5",
+			"behaviour" : "topalign",
+			"width" : "510",
+			"topalignOffset" : "110" 
 		},
 		repositories: {
 			linklist: {

diff --git a/src/lib/aloha/floatingmenu.js b/src/lib/aloha/floatingmenu.js
@@ -290,39 +290,39 @@ function(Aloha, jQuery, Ext, Class, console) {
 		var element = floatingmenu.obj;
 		var editablePos = Aloha.activeEditable.obj.offset();
 		var isTopAligned = floatingmenu.behaviour === 'topalign';
-		var isManuallyPinned = floatingmenu.pinned
-							 && ( parseInt( element.css( 'left' ), 10 )
-								  != ( editablePos.left
-									   + floatingmenu.horizontalOffset
-									 ) );
+		var isManuallyPinned = floatingmenu.pinned &&
+	                           ( parseInt( element.css( 'left' ), 10 ) !=
+		                           ( editablePos.left +
+		                               floatingmenu.horizontalOffset ) );
 
 		if ( isTopAligned && isManuallyPinned ) {
 			return;
 		}
 
 		var floatingmenuHeight = element.height();
-		var scrollTop = jQuery(document).scrollTop();
+		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.
+		// 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.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.
+		// 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.
+		// 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.marginTop +
+								   floatingmenu.topalignOffset
 								 : 0 );
 		}
 
@@ -455,38 +455,48 @@ 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.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) {
@@ -846,7 +856,7 @@ function(Aloha, jQuery, Ext, Class, console) {
 					var HORIZONTAL_PADDING = 10;
 					// Calculate by how much the floating menu is pocking
 					// outside the width of the viewport.  A positive number
-					// means that is is outside the viewport, negative means
+					// 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() );