Merge pull request #4 from vivo-project/feature/search-download

Feature/search download

webapp/web/css/search.css

@@ -79,7 +79,22 @@ ul.searchTips li {
 }
 span#searchHelp {
     float:right;
-    margin-top:-45px;
+    margin-top:10px;
     font-size:.825em;
     padding-right:32px
+}
+
+span#downloadResults {
+    float:left;
+    margin-top:10px;
+    font-size:.825em;
+    padding-left:10px
+}
+
+img#downloadIcon {
+    cursor: pointer;
+}
+
+.download-url {
+	padding: 5px 25px 5px;
 }

webapp/web/css/vitro.css

@@ -133,10 +133,17 @@
     border-bottom: none
 }
 .searchTOC ul a {
-    display: block;
+    display: inline;
     padding-left: 25px;
 }
 
+.searchTOC ul span {
+	float:right;
+	padding-right: 10px;
+	color:grey;
+	font-size:smaller;
+}
+
 /* ------------------------------------------------->  */
 /* DROP DOWN USER MENU  ---------------------------->  */
 /* ------------------------------------------------->  */

webapp/web/js/searchDownload.js

@@ -0,0 +1,70 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+$(document).ready(function(){
+    // This function creates and styles the "qTip" tooltip that displays the resource uri and the rdf link when the user clicks the uri/rdf icon.
+	
+	$('span#downloadResults').children('img#downloadIcon').each(function()
+    {
+        $(this).qtip(
+        {
+            content: {
+                prerender: true, // We need this for the .click() event listener on 'a.close'
+                text:  '<div style="float:right; width:150px">'
+	            	+'<p><label for="amount" style="font-size:14px;">Maximum Records:</label>'
+	            	+'<input disabled type="text" id="amount" style="margin-left:35px; border: 0; color: #f6931f; font-weight: bold; width:45px" /></p>'
+	            	+'<div id="slider-vertical" style="margin-left:60px; margin-top: -20px; height: 100px; background-color:white"></div>'
+	            	+'</div>'
+                	+'<div style="float:left; width:300px"><h5>Download the results from this search</h5> '
+                	+'<h5 class ="download-url"><a id=xmlDownload href="' + urlsBase + '/search?' + queryText +'&amp;xml=1&amp;hitsPerPage=500">download results in XML format</a></h5>'
+                	+'<h5 class ="download-url"><a id=csvDownload href="' + urlsBase + '/search?' + queryText +'&amp;csv=1&amp;hitsPerPage=500">download results in CSV format</a></h5>'
+                	+'<br /><a class="close" href="#">close</a></div>'
+
+            },
+            position: {
+                corner: {
+                    target: 'bottomLeft',
+                    tooltip: 'topLeft'
+                }
+            },
+            show: {
+                when: {event: 'click'}
+            },
+            hide: {
+                fixed: true, // Make it fixed so it can be hovered over and interacted with
+                when: {
+                    target: $('a.close'),
+                    event: 'click'
+                }
+            },
+            style: {
+                padding: '1em',
+                width: 500,
+                backgroundColor: '#f1f2ee'
+            }
+        });
+
+    });
+
+    $( "#slider-vertical" ).slider({
+	      orientation: "vertical",
+	      range: "min",
+	      min: 10,
+	      max: 1000,
+	      value: 500,
+	      slide: function( event, ui ) {
+	        $( "#amount" ).val( ui.value );
+	        $('#csvDownload').attr("href", urlsBase + '/search?' + queryText +'&csv=1&hitsPerPage=' + ui.value);
+	        $('#xmlDownload').attr("href", urlsBase + '/search?' + queryText +'&xml=1&hitsPerPage=' + ui.value);
+	      }
+	    });
+	    $( "#amount" ).val( $( "#slider-vertical" ).slider( "value" ) );
+	
+
+    // Prevent close link for URI qTip from requesting bogus '#' href
+    $('a.close').click(function() {
+        $('#downloadIcon').qtip("hide");
+        return false;
+    });
+    
+
+});

webapp/web/templates/freemarker/body/search/search-csvResults.ftl

@@ -0,0 +1,9 @@
+<#-- $This file is distributed under the terms of the license in /doc/license.txt$ -->
+<#assign today = .now >
+<#assign todayDate = today?date>
+Results from ${siteName} for ${querytext} on ${todayDate}
+
+Name, URI, URL
+<#list individuals as individual>                 
+"${individual.name}","${individual.uri}","${individual.profileUrl}"
+</#list>

webapp/web/templates/freemarker/body/search/search-pagedResults.ftl

@@ -2,13 +2,32 @@
 
 <#-- Template for displaying paged search results -->
 
-<h2>
+
+
+
+<h2 style="float:left">
 <#escape x as x?html>
     ${i18n().search_results_for} '${querytext}'
     <#if classGroupName?has_content>${i18n().limited_to_type} '${classGroupName}'</#if>
     <#if typeName?has_content>${i18n().limited_to_type} '${typeName}'</#if>
 </#escape>
+<script type="text/javascript">
+	var url = window.location.toString();	
+	if (url.indexOf("?") == -1){
+		var queryText = 'querytext=${querytext}';
+	} else {
+		var urlArray = url.split("?");
+		var queryText = urlArray[1];
+	}
+	
+	var urlsBase = '${urls.base}';
+</script>
 </h2>
+
+<span id="downloadResults" title="Download Results">
+	<img id="downloadIcon" src="images/download-icon.png" alt="Download Results"  />
+</span>
+
 <span id="searchHelp"><a href="${urls.base}/searchHelp" title="${i18n().search_help}">${i18n().not_expected_results}</a></span>
 <div class="contentsBrowseGroup">
 
@@ -18,7 +37,7 @@
             <h4>${i18n().display_only}</h4>           
             <ul>           
             <#list classGroupLinks as link>
-                <li><a href="${link.url}" title="${i18n().class_group_link}">${link.text}</a></li>
+                <li><a href="${link.url}" title="${i18n().class_group_link}">${link.text}</a><span>(${link.count})</span></li>
             </#list>
             </ul>           
         </div>
@@ -33,7 +52,7 @@
             </#if>
             <ul>           
             <#list classLinks as link>
-                <li><a href="${link.url}" title="${i18n().class_link}">${link.text}</a></li>
+                <li><a href="${link.url}" title="${i18n().class_link}">${link.text}</a><span>(${link.count})</span></li>
             </#list>
             </ul>
         </div>
@@ -93,4 +112,12 @@
 
 </div> <!-- end contentsBrowseGroup -->
 
-${stylesheets.add('<link rel="stylesheet" href="${urls.base}/css/search.css" />')}
+${stylesheets.add('<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />',
+  				  '<link rel="stylesheet" href="${urls.base}/css/search.css" />')}
+
+${headScripts.add('<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>',
+				  '<script type="text/javascript" src="${urls.base}/js/jquery_plugins/qtip/jquery.qtip-1.0.0-rc3.min.js"></script>',
+                  '<script type="text/javascript" src="${urls.base}/js/tiny_mce/tiny_mce.js"></script>'
+                  )}
+
+${scripts.add('<script type="text/javascript" src="${urls.base}/js/searchDownload.js"></script>')}

webapp/web/templates/freemarker/body/search/search-xmlResults.ftl

@@ -14,6 +14,7 @@
         <doc>
           <str name="uri">${individual.uri?xml}</str>                      
           <str name="name">${individual.name?xml}</str>
+          <str name="vivo-url">${individual.profileUrl?xml}"</str>
         </doc>
     </#list>
   </result>