Add message when there is no items in Getting Started

Expose noDataText property in TileView (reference #65)
Moonshine-IDE · Nov 20, 2024 · cc60936 · cc60936
1 parent b04ed1a
commit cc60936
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 3 deletions.
diff --git a/...rtal_Royale/views/modules/DocumentationForm/DocumentationFormViews/DocumentationForm.mxml b/...rtal_Royale/views/modules/DocumentationForm/DocumentationFormViews/DocumentationForm.mxml
@@ -308,7 +308,14 @@
   					itemRenderer="Super.Human.Portal_Royale.views.renderers.DocumentationTileRenderer"
   					includeIn="dataGridState" clickItemTileView="onDocClickItem(event)" />
 <tileView:TileView localId="tileGettingStarted" className="tileViewJS" direction="vertical"
-						percentWidth="100" baseItemHeight="360" baseItemWidth="300" itemMargin="10" 
+						percentWidth="100" minWidth="350" baseItemHeight="360" baseItemWidth="300" itemMargin="10" 
 						dataProvider="{proxy.mainItems}" includeIn="startview" 
-						itemRenderer="Super.Human.Portal_Royale.views.renderers.CategoryTileRenderer"/>
+						itemRenderer="Super.Human.Portal_Royale.views.renderers.CategoryTileRenderer"
+						visible="{proxy.mainItems &amp;&amp; proxy.mainItems.length > 0}"/>
+<html:H3 text="Welcome to Super.Human.Portal. Select an option from the sidebar." 
+		 includeIn="startview" visible="{proxy.mainItems == null || proxy.mainItems.length == 0}" percentWidth="100">
+	<html:style>
+		<js:AllCSSStyles textAlign="center"/>
+	</html:style>
+</html:H3>
 </j:VGroup>
diff --git a/...al_Royale/src/net/apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/TileView.as b/...al_Royale/src/net/apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/TileView.as
@@ -50,6 +50,24 @@ package classes.com.devexpress.js.tileView
 		{
 			model["dataSource"] = value;
 		}
+
+		/**
+		 *  
+		 
+		 *  @royaleignorecoercion classes.com.devexpress.js.tileView.interfaces.ITileViewModel
+		 */
+		public function get noDataText():String
+		{
+			return model["noDataText"];
+		}
+
+		/**
+		 * @royaleignorecoercion classes.com.devexpress.js.tileView.interfaces.ITileViewModel
+		 */
+		public function set noDataText(value:String):void
+		{
+			model["noDataText"] = value;
+		}
 
 		/**
 		 *  

diff --git a/...src/net/apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/beads/TileViewView.as b/...src/net/apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/beads/TileViewView.as
@@ -112,7 +112,8 @@ package classes.com.devexpress.js.tileView.beads
 				width: "100%",
 				baseItemWidth: _model.baseItemWidth,
 				baseItemHeight: _model.baseItemHeight,
-				itemMargin: _model.itemMargin
+				itemMargin: _model.itemMargin,
+				noDataText: _model.noDataText
 			});
 		}
 	}

diff --git a/...apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/beads/models/TileViewModel.as b/...apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/beads/models/TileViewModel.as
@@ -29,6 +29,23 @@ package classes.com.devexpress.js.tileView.beads.models
 			}				
 		}
 
+		private var _noDataText:String = "No data to display";
+
+		public function get noDataText():String
+		{
+			return _noDataText;
+		}
+
+		public function set noDataText(value:String):void
+		{
+			if (this._noDataText != value)
+			{
+				this._noDataText = value;	
+
+				dispatchEvent(new Event("optionsChanged"));
+			}				
+		}
+
 		private var _itemRenderer:IFactory;
 
 		public function get itemRenderer():IFactory

diff --git a/.../apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/interfaces/ITileViewModel.as b/.../apacheRoyaleTemplatedApp/classes/com/devexpress/js/tileView/interfaces/ITileViewModel.as
@@ -10,6 +10,9 @@ package classes.com.devexpress.js.tileView.interfaces
 		function get dataSource():Object;
 		function set dataSource(value:Object):void;
 
+		function get noDataText():String;
+		function set noDataText(value:String):void;
+
 		function get itemRenderer():IFactory;
 		function set itemRenderer(value:IFactory):void;