Project: Organize Searches: Minor changes

Add Search name to tooltip. Add draggable icon to Folder List
yeastrc · Sep 19, 2018 · 6852b4d · 6852b4d
1 parent c0aaa49
commit 6852b4d
Show file tree

Hide file tree

Showing 4 changed files with 60 additions and 6 deletions.
diff --git a/proxl_web_app/WebRoot/WEB-INF/jsp-includes/projectOrganizeSearches.jsp b/proxl_web_app/WebRoot/WEB-INF/jsp-includes/projectOrganizeSearches.jsp
@@ -39,6 +39,7 @@
 		     	style="cursor: move; margin-bottom: 15px; font-weight: bold; font-size: 16px;"
 		     	class="tool_tip_attached_jq" data-tooltip="Drag to move Folder List" 
 		     	>
+		     	<img src="${ contextPath }/images/icon-draggable-small.png" >
 		     	Folder List
 		     </div>
 		     <div class=" outer-item-container clickable folder_display_order_item_jq tool_tip_attached_jq " 
@@ -106,5 +107,11 @@
 	 <%@ include file="/WEB-INF/jsp_template_fragments/For_jsp_includes/srchDsplyOrderAdmin/srchDsplyOrdrSrchAdminTmpl.jsp" %>
 	</script>
 
+	<%--  Tooltip for Single Search Entry HTML Template --%>
+	<script id="organize_searches_single_search_tooltip_template"  type="text/x-handlebars-template">
+	 <%--  include the template text  --%>
+	 <%@ include file="/WEB-INF/jsp_template_fragments/For_jsp_includes/srchDsplyOrderAdmin/srchTooltipDsplyOrdrSrchAdminTmpl.jsp" %>
+	</script>
+
   </div> <%-- Organize searches block   <div id="explore_data_organize_searches_data_block">  --%>
 
diff --git a/proxl_web_app/WebRoot/WEB-INF/jsp-pages/viewProject.jsp b/proxl_web_app/WebRoot/WEB-INF/jsp-pages/viewProject.jsp
@@ -900,7 +900,7 @@
 
 			<%--  Public access Management --%>			
 
-			<div class="top-level-container collapsable_container_jq" >
+			<div id="public_access_data_top_level_container" class="top-level-container collapsable_container_jq" >
 
 				<div  class="collapsable-link-container top-level-collapsable-link-container collapsable_link_container_jq" style="">
 					<a href="javascript:" id="public_access_collapse_link_jq" class="top-level-collapsable-link " style="display: none;" <%-- collapsable_collapse_link_jq --%>

diff --git a/...late_fragments/For_jsp_includes/srchDsplyOrderAdmin/srchTooltipDsplyOrdrSrchAdminTmpl.jsp b/...late_fragments/For_jsp_includes/srchDsplyOrderAdmin/srchTooltipDsplyOrdrSrchAdminTmpl.jsp
@@ -0,0 +1,18 @@
+
+		<%-- !!!   Handlebars template   !!!!!!!!!   --%>
+
+<%--  srchTooltipDsplyOrdrSrchAdminTmpl.jsp 
+
+  Display order of folders and searches
+
+  Tooltip for Single Search entry
+
+Containing element: <script id="organize_searches_single_search_tooltip_template"  type="text/x-handlebars-template">
+ --%>
+
+
+<div style="">
+	<div style="margin-top: 5px; padding-right: 10px; white-space: nowrap;">Drag Search to a folder to move to that folder</div>
+	<div style="margin-top: 20px;">Search Name:</div>
+	<div style="margin-top: 5px;">{{name}} ({{ searchId }})</div>
+</div>   		  
diff --git a/proxl_web_app/WebRoot/js/viewProject_OrganizeSearchesAndFoldersAdmin.js b/proxl_web_app/WebRoot/js/viewProject_OrganizeSearchesAndFoldersAdmin.js
@@ -153,7 +153,13 @@ var OrganizeSearches = function() {
 
 	this.startSearchesOrganize = function() {
 		var objectThis = this;
-		$("#explore_data_main_data_block").hide();
+
+		//  Remove other blocks from project page
+		$("#view_searches_project_admin_div").remove();
+		$("#public_access_data_top_level_container").remove();
+		$("#upload_data_top_level_container").remove();
+		$("#explore_data_main_data_block").remove();
+
 		$("#organize_searches_data_block").show();
 
 		var callback = function( params ) {
@@ -357,6 +363,16 @@ var OrganizeSearches = function() {
 			throw Error( '$("#organize_searches_single_search_template").html() === null' );
 		}
 		var organize_searches_single_search_template = Handlebars.compile(organize_searches_single_search_template_html);
+
+		//  Get Search Tooltip Handlebars template and parse it
+		var organize_searches_single_search_tooltip_template_html = $("#organize_searches_single_search_tooltip_template").html();
+		if ( organize_searches_single_search_tooltip_template_html === undefined ) {
+			throw Error( '$("#organize_searches_single_search_tooltip_template").html() === undefined' );
+		}
+		if ( organize_searches_single_search_tooltip_template_html === null ) {
+			throw Error( '$("#organize_searches_single_search_tooltip_template").html() === null' );
+		}
+		var organize_searches_single_search_tooltip_template = Handlebars.compile(organize_searches_single_search_tooltip_template_html);
 
 		// Reposition the Folder list at the top of the draggable space
 		var $organize_searches_folder_total_block = $("#organize_searches_folder_total_block");
@@ -369,8 +385,21 @@ var OrganizeSearches = function() {
 		for ( var searchDataListIndex = 0; searchDataListIndex < searchesToDisplay.length; searchDataListIndex++ ) {
 			var searchDataEntry = searchesToDisplay[ searchDataListIndex ];
 			var html = organize_searches_single_search_template(searchDataEntry);
-//			var $addedItem = 
-			$( html ).appendTo( $organize_searches_search_entries_block );
+			var $addedItem = 
+				$( html ).appendTo( $organize_searches_search_entries_block );
+
+			var tooltipHTML = organize_searches_single_search_tooltip_template( searchDataEntry )
+
+			$addedItem.qtip( {
+		        content: {
+		            text: tooltipHTML
+		        },
+				position: {
+					target: 'mouse',
+					adjust: { x: 5, y: 5 }, // Offset it slightly from under the mouse
+		            viewport: $(window)
+		         }
+		    });	
 		}
 
 		//   Add Search events and handling	    
@@ -511,8 +540,8 @@ var OrganizeSearches = function() {
 	    $( "#organize_searches_search_entries_block" ).disableSelection();		
 
 
-		//  Add tooltips
-		addToolTips( $organize_searches_search_entries_block );
+		//  Add tooltips - Already added above
+		// addToolTips( $organize_searches_search_entries_block );
 
 	};