Create dropdown using JSdialog

- Temp commit to for JsDialog

Signed-off-by: Darshan-upadhyay1110 <[email protected]>
Change-Id: Ic9271aaf42b87e7e34c10a40eb6e5a83671c1ad2

Author: Darshan-upadhyay1110

browser/src/control/Control.Sidebar.ts

@@ -143,7 +143,7 @@ class Sidebar extends SidebarBase {
 				this.builder.build(this.container, [this.model.getSnapshot()], false);
 
 				if (!this.isVisible()) {
-					if ((this.builder as any).windowId === WindowId.Sidebar)
+					if (this.isCoreBased())
 						$('#sidebar-dock-wrapper').addClass('coreBased');
 					$('#sidebar-dock-wrapper').addClass('visible');
 

browser/src/control/Control.SidebarBase.ts

@@ -79,26 +79,40 @@ abstract class SidebarBase extends JSDialogComponent {
 		return node.hasClass('visible') && node.hasClass('coreBased');
 	}
 
-	closeSidebar() {
-		$(`#${this.type}-dock-wrapper`).removeClass('visible');
-		$(`#${this.type}-dock-wrapper`).removeClass('coreBased');
+	/// checks if this sidebar is core-based (uses WindowId.Sidebar)
+	protected isCoreBased(): boolean {
+		return this.builder && (this.builder as any).windowId === WindowId.Sidebar;
+	}
+
+	/// shared implementation for showing/hiding sidebar
+	protected showSidebarImpl(show: boolean) {
+		const wrapper = $(`#${this.type}-dock-wrapper`);
 
-		if (!this.map.editorHasFocus()) {
-			this.map.fire('editorgotfocus');
-			this.map.focus();
+		if (show) {
+			wrapper.addClass('visible');
+			if (this.isCoreBased()) {
+				wrapper.addClass('coreBased');
+			}
+		} else {
+			wrapper.removeClass('visible');
+			wrapper.removeClass('coreBased');
+
+			if (!this.map.editorHasFocus()) {
+				this.map.fire('editorgotfocus');
+				this.map.focus();
+			}
 		}
 
 		const upperCaseType = this.type[0].toUpperCase() + this.type.slice(1);
-		this.map.uiManager.setDocTypePref('Show' + upperCaseType, false);
+		this.map.uiManager.setDocTypePref('Show' + upperCaseType, show);
 	}
 
-	showSidebar() {
-		$(`#${this.type}-dock-wrapper`).addClass('visible');
-		if (this.builder && (this.builder as any).windowId === WindowId.Sidebar)
-			$(`#${this.type}-dock-wrapper`).addClass('coreBased');
+	closeSidebar() {
+		this.showSidebarImpl(false);
+	}
 
-		const upperCaseType = this.type[0].toUpperCase() + this.type.slice(1);
-		this.map.uiManager.setDocTypePref('Show' + upperCaseType, true);
+	showSidebar() {
+		this.showSidebarImpl(true);
 	}
 
 	protected onJSUpdate(e: FireEvent) {