Fix #886: Add ColumnHider trigger node to domNode to always be visible

dgrid 0.3.14 introduced a regression where the trigger node to open the menu
would no longer appear on browsers with no/hidden scrollbars.  This resolves it
by adding the node as a direct child of the grid's domNode instead, so it is
always visible regardless.

Added support for an rtl query parameter to the ColumnHider test page.

Thanks @treasonx for the initial investigation on this.

css/extensions/ColumnHider.css

@@ -8,6 +8,11 @@
 	top: 0;
 }
 
+.dgrid-rtl-swap .dgrid-hider-toggle {
+	right: auto;
+	left: 0;
+}
+
 .dgrid-hider-menu {
 	position: absolute;
 	top: 0;
@@ -21,6 +26,11 @@
 	overflow-y: auto;
 }
 
+.dgrid-rtl-swap .dgrid-hider-menu {
+	right: auto;
+	left: 17px;
+}
+
 .dgrid-hider-menu-row {
 	position: relative;
 	padding: 2px;

extensions/ColumnHider.js

@@ -129,7 +129,7 @@ function(declare, has, listen, miscUtil, put, i18n){
 				// Assume that if this plugin is used, then columns are hidable.
 				// Create the toggle node.
 				hiderToggleNode = this.hiderToggleNode =
-					put(this.headerScrollNode, "button.ui-icon.dgrid-hider-toggle[type=button]");
+					put(this.domNode, "button.ui-icon.dgrid-hider-toggle[type=button]");
 
 				this._listeners.push(listen(hiderToggleNode, "click", function(e){
 					grid._toggleColumnHiderMenu(e);

test/extensions/ColumnHider.html

@@ -6,6 +6,9 @@
 		<meta name="viewport" content="width=570">
 		<style>
 			@import "../../../dojo/resources/dojo.css";
+			@import "../../../dojo/resources/dnd.css";
+			@import "../../css/dgrid.css";
+			@import "../../css/dgrid_rtl.css";
 			@import "../../css/skins/claro.css";
 			.dgrid {
 				width: 750px;
@@ -55,10 +58,18 @@
 						{ field: "col1", label: "Col1" },
 						{ field: "col5" } // no label, to test fallback to field
 					],
+					body = document.body,
+					rtl = location.search.indexOf("rtl") !== -1,
 					grid,
 					gridResize,
 					gridReorder;
 
+				if(rtl) {
+					document.documentElement.setAttribute("dir", "rtl");
+				}
+				body.insertBefore(put('a[href="ColumnHider.html' + (rtl ? '' : '?rtl') + '"]',
+					"Switch to " + (rtl ? "LTR" : "RTL")), body.firstChild);
+
 				getColumns = function(){
 					return lang.clone(columns);
 				};