Restyle search page to support smaller window size and Add Info button to show/hide Info_Panel

tmpl/SearchResults.tmpl

@@ -26,7 +26,7 @@ const USER_ID       = '<TMPL_VAR NAME="USER_ID">';
 <div id="bottom-panel" class="hidden" style="width:100%;">
 	<div style="float:right;width:225px;">
 		<span id="show_panel_button" onClick="show_top_panel();" class="link ui-icon ui-icon-plus hidden coge-border" style="float:right;margin-right:5px;"></span>
-
+		
 		<div id="info_panel" class="small panel coge-border-top" style="overflow:none;margin-left:10px;margin-top:29px;color:gray;">
 		</div>
 	</div>
@@ -42,6 +42,7 @@ const USER_ID       = '<TMPL_VAR NAME="USER_ID">';
 					<li><span data-type="experiment"><img src="picts/testtube-icon.png" width="15" height="15"/> Experiments </span></li>
 					<li><span data-type="notebook"><img src="picts/notebook-icon.png" width="15" height="15"/> Notebooks </span></li>
 					<li><span data-type="group"><img src="picts/group-icon.png" width="15" height="15"/> User Groups </span></li>
+					<li><span data-type="group"><img src="picts/info-icon.png" width="15" height="15"/> Info </span></li>
 				</ul>
             </div>
 		</div>
@@ -61,6 +62,7 @@ const USER_ID       = '<TMPL_VAR NAME="USER_ID">';
 			</TMPL_IF>
 			<span id="send_button" onClick="send_menu();" class="sendto coge-icon coge-disabled glyphicon glyphicon-arrow-right item-button invisible" style="margin-right:5px;" title="Send Selected Items to ..."></span>
 			<input id="search_input" type="search" placeholder="Filter" size="25" class="coge-border" style="float:right;margin-right:15px;vertical-align:top;" />
+			<input id="i_button" onClick="open_close_info();" class="info coge-icon coge-disabled glyphicon glyphicon-info-sign item-button invisible" style="margin-right:5px;" title="Hide/View Info"></span>
 			<span id="refresh_label" class="xsmall hidden info" style="float:right;padding-right:25px;">Refreshing...</span>
 		</div>
 		<div class="grid hidden noselect coge-border-top" style="overflow:auto;border-bottom:none !important;"></div>

tmpl/User.tmpl

@@ -95,7 +95,7 @@ div.deleted { display: none; }
 	</div>
 
 	<div id="contents_panel" class="small panel">
-		<div class="noselect" style="height:24px">
+		<div class="noselect" style="display: block; overflow: auto;">
 			<span id="contents_title" style="float:left;min-width:130px;font-weight:bold;margin-right:20px;"></span>
 			<span id="add_button" onClick="add_dialog();" class="add coge-icon glyphicon glyphicon-plus item-button invisible" style="margin-right:5px;" title="Create New Item"></span>
 			<span id="share_button" onClick="share_dialog();" class="share coge-icon coge-disabled glyphicon glyphicon-user item-button invisible" style="margin-right:5px;" title="Share Selected Items"></span>

web/js/pages/search-results.js

@@ -35,7 +35,7 @@ $(function () {
 			title: 'Experiments',
 			displayType: 'grid',
 			dataTypes: ['experiment'],
-			operations: ['share', 'organize', 'favorite', 'delete', 'sendto']
+			operations: ['share', 'organize', 'favorite', 'delete', 'sendto', 'info']
 		},
 		notebook: {
 			title: 'Notebooks',

web/js/pages/user-common.js

@@ -397,4 +397,9 @@ function toggle_star(img, id) {
 			$(img).attr({ src: (val == 0 ? "picts/star-hollow.png" : "picts/star-full.png") });
 		}
 	});
-}
+}
+
+
+function open_close_info() {
+	$( "#info_panel" ).toggle();
+}