diff --git a/www/css/vertnet.css b/www/css/vertnet.css index e764bc79..82580f84 100644 --- a/www/css/vertnet.css +++ b/www/css/vertnet.css @@ -9,7 +9,7 @@ position: relative; min-height: 20px; padding-left: 20px; - margin-top: 7px; +/* margin-top: 7px;*/ margin-bottom: 0px; vertical-align: top } @@ -18,17 +18,31 @@ position: relative; min-height: 1px; margin-top: 10px; - padding-right: -30px; - padding-left: -25px; + padding-right: -15px; + padding-left: -10px; float: left; } +.col-lg-2 { + padding-right: 5px; + padding-left: 5px +} + .vn-col-md-2 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; - /*width: 16.666666666666664%;*/ + width: 15.75%; +/* width: 16.666666666666664%;*/ + float: left; +} +.vn-col-md-2-ckbx { + position: relative; + min-height: 1px; + padding-right: 15px; + padding-left: 15px; +/* width: 16.666666666666664%;*/ float: left; } @@ -530,10 +544,9 @@ h7 small, .h7 small { VNlegend { display: block; width: 100%; - padding: 0; + padding-bottom: 5px; margin-bottom: 5px; font-size: 20px; - /*line-height: inherit;*/ color: #333; border: 0; border-bottom: 1px solid #e5e5e5 @@ -544,15 +557,44 @@ VNlegend { } .infotipDisplay { - text-align:left !important; font-weight:lighter !important; - width: 0; - height: 0; - margin-top: -50px; + /*width: auto !important; + height: auto !important; + margin-left: 0 !important;*/ border-top: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 0 dotted; border-left: 4px solid transparent; - content: "" + content: ""; +} + +.tooltip { + position: absolute; + z-index: 1030; + display: inline; + font-size: 12px; + line-height: 1.25; + opacity: 0; + filter: alpha(opacity=0); + visibility: visible +} + +.tooltip-inner { + max-width: 300px; + padding: 5px 5px; + color: #fff; + text-align: left; + text-decoration: none; + background-color: #000; + border-radius: 4px +} + +.btn-pub { + padding: 10px 16px; + font-size: 16px; + border-radius: 6px; } +table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after { + content: " \25B4\25BE" +} \ No newline at end of file diff --git a/www/js/app/router.js b/www/js/app/router.js index 6204f428..1bee7a71 100644 --- a/www/js/app/router.js +++ b/www/js/app/router.js @@ -204,7 +204,7 @@ define([ if (!this.publisherCache) { map.init(_.bind(function() { var sql = new cartodb.SQL({ user: 'vertnet' }); - var query = "SELECT orgname,icode,sum(count) AS records,count(title) AS resources,citation,contact,count,description,dwca,email,eml,emlrights,pubdate,title,url,license,migrator,lastindexed FROM resource GROUP BY orgname,icode,citation,contact,count,description,dwca,email,eml,emlrights,pubdate,title,url,license,migrator,lastindexed ORDER BY title"; + var query = "SELECT orgname,icode,sum(count) AS records,count(title) AS resources,citation,contact,count,description,dwca,email,eml,emlrights,pubdate,title,url,license,migrator,lastindexed,gbifdatasetid,gbifpublisherid,source_url FROM resource GROUP BY orgname,icode,citation,contact,count,description,dwca,email,eml,emlrights,pubdate,title,url,license,migrator,lastindexed,gbifdatasetid,gbifpublisherid,source_url ORDER BY title"; sql.execute(query, {}) .done(_.bind(function(data) { this.publisherCache = _.groupBy(data.rows, _.bind(function(row) { diff --git a/www/js/app/views/detail.html b/www/js/app/views/detail.html index 6b73a7c4..9a21cdbc 100644 --- a/www/js/app/views/detail.html +++ b/www/js/app/views/detail.html @@ -370,7 +370,7 @@

<% var occid = this.model.getOccIdentifier() %> <%= occid %> <%= this
<% if (this.model.get('emlrights')) { %> <%= this.model.getRights() %> <% } else { %> - Please contact the data publisher for details concerning the use of these data. + Please contact the data publisher for details concerning the use of these data. <% } %>

Citation
@@ -391,7 +391,7 @@

<% var occid = this.model.getOccIdentifier() %> <%= occid %> <%= this
<%= this.model.get('pubdate') %>

Source URL
-
<%= this.model.get('url') %>
+
<%= this.model.get('source_url') %>
diff --git a/www/js/app/views/detailrow.html b/www/js/app/views/detailrow.html index 60166aee..4a42983c 100644 --- a/www/js/app/views/detailrow.html +++ b/www/js/app/views/detailrow.html @@ -24,10 +24,13 @@ <% var occid = this.model.getOccIdentifier() %> <%= occid %> <%= this.model.get('class') + ': ' + this.model.get('scientificname')%> <% var loc = this.model.getLocation() %> <%= loc %> -<% var year = this.model.getYear() %> <%= year %> -<% if (this.model.isMappable()) { %> +<%= this.model.get('recordedby')%> +<%= this.model.get('sex')%> + +<%= this.model.get('eventdate')%> +<% if (this.model.isMappable()) { %> <% } %> -<% if (this.model.get('associatedmedia')) { %> +<% if (this.model.get('associatedmedia')) { %> <% } %> \ No newline at end of file diff --git a/www/js/app/views/publisher.html b/www/js/app/views/publisher.html index d8755fec..011830eb 100644 --- a/www/js/app/views/publisher.html +++ b/www/js/app/views/publisher.html @@ -32,23 +32,29 @@

Publisher <%= this.model.get('orgname')%>

-
- -

+

+ + Pro tip! Click the metadata icon to view details about a single resource or click the search icon to search a single resource in the portal. +
+

+ - - - - - + + + + + + + diff --git a/www/js/app/views/publisherrow.html b/www/js/app/views/publisherrow.html index f91bfc9b..7a10c105 100644 --- a/www/js/app/views/publisherrow.html +++ b/www/js/app/views/publisherrow.html @@ -21,5 +21,5 @@ - - + + diff --git a/www/js/app/views/publishers.html b/www/js/app/views/publishers.html index 6c221385..f93d34a1 100644 --- a/www/js/app/views/publishers.html +++ b/www/js/app/views/publishers.html @@ -32,15 +32,16 @@

Publishers VertNet

Pro tip! Click on a table row to view the publisher detail page. + -
ResourceLicenseMigratedPublishedIndexedRecordsLicenseMigratedPublishedIndexedRecordsMetadataSearch
<%= this.model.get('orgname')%> <%= this.model.get('icode')%> <%= this.model.get('location')%><%= this.model.records()%><%= this.model.get('resources')%><%= this.model.records()%><%= this.model.get('resources')%>
+
- - + + diff --git a/www/js/app/views/resourcerow.html b/www/js/app/views/resourcerow.html index 00d26ba5..e5d2a2df 100644 --- a/www/js/app/views/resourcerow.html +++ b/www/js/app/views/resourcerow.html @@ -19,8 +19,10 @@ sourcecode without minification. --> - - - - - + + + + + + + diff --git a/www/js/app/views/resourcerow.js b/www/js/app/views/resourcerow.js index 46aecb80..a83d3ffc 100644 --- a/www/js/app/views/resourcerow.js +++ b/www/js/app/views/resourcerow.js @@ -51,12 +51,12 @@ define([ }, // Open the occurrence detail page. - _clickHandler: function(e) { - e.preventDefault(); - var sel = getSelection().toString(); - if (!sel) { - window.open(this.model.get('url'), '_self'); - } - } + //_clickHandler: function(e) { + //e.preventDefault(); + //var sel = getSelection().toString(); + //if (!sel) { + //window.open(this.model.get('source_url'), '_self'); + //} + //} }); }); diff --git a/www/js/app/views/search.html b/www/js/app/views/search.html index c59bc650..6d172798 100644 --- a/www/js/app/views/search.html +++ b/www/js/app/views/search.html @@ -23,7 +23,7 @@

Search VertNet

-

Need Help? 

+

Need Help?   Institution Codes 

Search is a little slow right now. Automatically retrying ... @@ -34,54 +34,39 @@

Search VertNet

Find records with... -
- +
- -
-
-
@@ -99,35 +84,35 @@

Search VertNet

- +
- +
- +
- +
- +
+ +
+ +
+ +
+
- -
- + +
+
-
+
   
-
+
-
+
   
-
+
-
-
- -
- -
-
-
+
   
-
- -
-
+
+ +
+
   
-
- -
+
+ +
-
+
+ +
+
+     +
+
-
+
   
-
+
-
+
   
-
+
+
+     +
+
+ +
+
+ +
+ +
+
+     +
+
+ +
+
+     +
+
+ +
+
+     +
+
+ +
+
+     +
+
+ +
+
- -
+ +
- to + to
-
+
- - - +
+
+ +
+ +
+
+ to +
+
+ +
+
+
@@ -289,12 +317,14 @@

Search VertNet

Publisher Code LocationRecordsResourcesRecordsResources
<%= this.model.get('title')%><%= this.model.get('license')%><%= this.model.get('migrator')%><%= this.model.getDate()%><%= this.model.get('lastindexed')%><%= this.model.records()%><%= this.model.get('license')%><%= this.model.get('migrator')%><%= this.model.getDate()%><%= this.model.get('lastindexed')%><%= this.model.records()%>
- - - - - - + + + + + + + + diff --git a/www/js/app/views/search.js b/www/js/app/views/search.js index a4e8b08f..c726c8c5 100644 --- a/www/js/app/views/search.js +++ b/www/js/app/views/search.js @@ -282,7 +282,130 @@ define([ } store.set('search-carat-closed', true); }, this)); - + + //Tooltips + this.$('#show-thesefilters-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Use filters to find records that are or contain fossils, types, tissues, media, mappable or located within a custom area on a map.

Read more...', + container: '#thesefilters-tip' + }); + this.$('#thesefilters-tip').mouseover(_.bind(function(e) { + this.$('#show-thesefilters-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-thesefilters-tip').tooltip('hide'); + }, this)); + + this.$('#show-hasTissues-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'This filter searches the preparations field in each record.

There is no standardized vocabulary for this field, so the VertNet team has identified 24 terms that are very likely to be, or contain, a tissue sample.

For more information about the tissues, click to see "Why can’t I find tissue information using the tissue filter?"', + container: '#hasTissues-tip' + }); + this.$('#hasTissues-tip').mouseover(_.bind(function(e) { + this.$('#show-hasTissues-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-hasTissues-tip').tooltip('hide'); + }, this)); + + this.$('#show-allTheseWords-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Search will identify all records containing ALL of the terms submitted.

Read more...', + container: '#allTheseWords-tip' + }); + this.$('#allTheseWords-tip').mouseover(_.bind(function(e) { + this.$('#show-allTheseWords-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-allTheseWords-tip').tooltip('hide'); + }, this)); + + this.$('#show-exactPhrase-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Search will identify all records that contain the exact phrase submitted.

Quotation marks ("") are required to identify the extent of the phrase.

Read more...', + container: '#exactPhrase-tip' + }); + this.$('#exactPhrase-tip').mouseover(_.bind(function(e) { + this.$('#show-exactPhrase-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-exactPhrase-tip').tooltip('hide'); + }, this)); + + this.$('#show-anyWords-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Search will identify all records that contain at least one of the terms submitted. Operators OR and AND can help to focus queries.

Read more...', + container: '#anyWords-tip' + }); + this.$('#anyWords-tip').mouseover(_.bind(function(e) { + this.$('#show-anyWords-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-anyWords-tip').tooltip('hide'); + }, this)); + + this.$('#show-noneWords-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Search will identify all records that do NOT contain the terms submitted.

Read more...', + container: '#noneWords-tip' + }); + this.$('#noneWords-tip').mouseover(_.bind(function(e) { + this.$('#show-noneWords-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-noneWords-tip').tooltip('hide'); + }, this)); + + this.$('#show-recordType-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Search will identify all records of the selected type: specimen, observation, or both specimen and observation.

Read more...', + container: '#recordType-tip' + }); + this.$('#recordType-tip').mouseover(_.bind(function(e) { + this.$('#show-recordType-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-recordType-tip').tooltip('hide'); + }, this)); + + this.$('#show-dcTerms-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Search will identify all records with the exact terms contained within the specified Darwin Core field(s).

Read more...', + container: '#dcTerms-tip' + }); + this.$('#dcTerms-tip').mouseover(_.bind(function(e) { + this.$('#show-dcTerms-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-dcTerms-tip').tooltip('hide'); + }, this)); + + this.$('#show-years-tip').tooltip({ + placement: 'top', + html: 'true', + title: 'Search will identify all records contained within the range of years submitted.

Read more...', + container: '#years-tip' + }); + this.$('#years-tip').mouseover(_.bind(function(e) { + this.$('#show-years-tip').tooltip('show'); + }, this)).mouseout(_.bind(function(e) { + this.$('#show-years-tip').tooltip('hide'); + }, this)); + + //Get List of institutions and institutionCodes for institutionCode select + $.getJSON("http://vertnet.cartodb.com/api/v2/sql?q=SELECT icode, orgname, concat(icode,': ',orgname) AS instcombo FROM resource where ipt=TRUE AND networks LIKE %27%25VertNet%25%27 GROUP BY icode, orgname ORDER BY orgname, icode",function(institutions) { + var listItems = ''; + + $.each(institutions.rows, function(key, val) { + + listItems += ""; + + $("#inst-dropdown").html(listItems); + }); + }); + + //end institution list + this.$('#close-advanced-search').click(_.bind(function(e) { e.preventDefault(); e.stopPropagation(); @@ -428,7 +551,7 @@ define([ this._executeSearch(null, true); } }, - + _getQuery: function() { var query = ''; var all = this.$('#allwords').val(); @@ -437,9 +560,13 @@ define([ var none = this.$('#nonewords').val(); var start = this.$('#datestart').val(); var end = this.$('#dateend').val(); + var mstart = this.$('#monthstart').val(); + var mend = this.$('#monthend').val(); + var dstart = this.$('#daystart').val(); + var dend = this.$('#dayend').val(); + var inst = this.$('#inst-dropdown :selected').val(); var type = this.$('#recordtype :selected').val(); - if (type === 'Specimen or Observation') { type = 'both'; } @@ -481,6 +608,38 @@ define([ query += [ ' year >= ', start, ' year <= ', end].join(''); } + if (mstart && !mend) { + mstart = Number(mstart); + query += [ ' month >= ', mstart].join(''); + } + if (!mstart && mend) { + mend = Number(mend); + query += [' month <= ', mend].join(''); + } + if (mstart && mend) { + mstart = Number(mstart); + mend = Number(mend); + query += [ ' month >= ', mstart, ' month <= ', mend].join(''); + } + + if (dstart && !dend) { + dstart = Number(dstart); + query += [ ' day >= ', dstart].join(''); + } + if (!dstart && dend) { + dend = Number(dend); + query += [' day <= ', dend].join(''); + } + if (dstart && dend) { + dstart = Number(dstart); + dend = Number(dend); + query += [ ' day >= ', dstart, ' day <= ', dend].join(''); + } + + if (inst !== '') { + query += [' institutioncode:', inst].join(''); + } + query += _.reduce(this.$('#filters input'), function(memo, input) { var input = $(input); if (input.attr('id') === 'spatialfilter') { diff --git a/www/js/lib/sorttable.js b/www/js/lib/sorttable.js new file mode 100644 index 00000000..38b0fc62 --- /dev/null +++ b/www/js/lib/sorttable.js @@ -0,0 +1,495 @@ +/* + SortTable + version 2 + 7th April 2007 + Stuart Langridge, http://www.kryogenix.org/code/browser/sorttable/ + + Instructions: + Download this file + Add to your HTML + Add class="sortable" to any table you'd like to make sortable + Click on the headers to sort + + Thanks to many, many people for contributions and suggestions. + Licenced as X11: http://www.kryogenix.org/code/browser/licence.html + This basically means: do what you want with it. +*/ + + +var stIsIE = /*@cc_on!@*/false; + +sorttable = { + init: function() { + // quit if this function has already been called + if (arguments.callee.done) return; + // flag this function so we don't do the same thing twice + arguments.callee.done = true; + // kill the timer + if (_timer) clearInterval(_timer); + + if (!document.createElement || !document.getElementsByTagName) return; + + sorttable.DATE_RE = /^(\d\d?)[\/\.-](\d\d?)[\/\.-]((\d\d)?\d\d)$/; + + forEach(document.getElementsByTagName('table'), function(table) { + if (table.className.search(/\bsortable\b/) != -1) { + sorttable.makeSortable(table); + } + }); + + }, + + makeSortable: function(table) { + if (table.getElementsByTagName('thead').length == 0) { + // table doesn't have a tHead. Since it should have, create one and + // put the first table row in it. + the = document.createElement('thead'); + the.appendChild(table.rows[0]); + table.insertBefore(the,table.firstChild); + } + // Safari doesn't support table.tHead, sigh + if (table.tHead == null) table.tHead = table.getElementsByTagName('thead')[0]; + + if (table.tHead.rows.length != 1) return; // can't cope with two header rows + + // Sorttable v1 put rows with a class of "sortbottom" at the bottom (as + // "total" rows, for example). This is B&R, since what you're supposed + // to do is put them in a tfoot. So, if there are sortbottom rows, + // for backwards compatibility, move them to tfoot (creating it if needed). + sortbottomrows = []; + for (var i=0; i5' : ' ▴'; + this.appendChild(sortrevind); + return; + } + if (this.className.search(/\bsorttable_sorted_reverse\b/) != -1) { + // if we're already sorted by this column in reverse, just + // re-reverse the table, which is quicker + sorttable.reverse(this.sorttable_tbody); + this.className = this.className.replace('sorttable_sorted_reverse', + 'sorttable_sorted'); + this.removeChild(document.getElementById('sorttable_sortrevind')); + sortfwdind = document.createElement('span'); + sortfwdind.id = "sorttable_sortfwdind"; + sortfwdind.innerHTML = stIsIE ? ' 6' : ' ▾'; + this.appendChild(sortfwdind); + return; + } + + // remove sorttable_sorted classes + theadrow = this.parentNode; + forEach(theadrow.childNodes, function(cell) { + if (cell.nodeType == 1) { // an element + cell.className = cell.className.replace('sorttable_sorted_reverse',''); + cell.className = cell.className.replace('sorttable_sorted',''); + } + }); + sortfwdind = document.getElementById('sorttable_sortfwdind'); + if (sortfwdind) { sortfwdind.parentNode.removeChild(sortfwdind); } + sortrevind = document.getElementById('sorttable_sortrevind'); + if (sortrevind) { sortrevind.parentNode.removeChild(sortrevind); } + + this.className += ' sorttable_sorted'; + sortfwdind = document.createElement('span'); + sortfwdind.id = "sorttable_sortfwdind"; + sortfwdind.innerHTML = stIsIE ? ' 6' : ' ▾'; + this.appendChild(sortfwdind); + + // build an array to sort. This is a Schwartzian transform thing, + // i.e., we "decorate" each row with the actual sort key, + // sort based on the sort keys, and then put the rows back in order + // which is a lot faster because you only do getInnerText once per row + row_array = []; + col = this.sorttable_columnindex; + rows = this.sorttable_tbody.rows; + for (var j=0; j 12) { + // definitely dd/mm + return sorttable.sort_ddmm; + } else if (second > 12) { + return sorttable.sort_mmdd; + } else { + // looks like a date, but we can't tell which, so assume + // that it's dd/mm (English imperialism!) and keep looking + sortfn = sorttable.sort_ddmm; + } + } + } + } + return sortfn; + }, + + getInnerText: function(node) { + // gets the text we want to use for sorting for a cell. + // strips leading and trailing whitespace. + // this is *not* a generic getInnerText function; it's special to sorttable. + // for example, you can override the cell text with a customkey attribute. + // it also gets .value for fields. + + if (!node) return ""; + + hasInputs = (typeof node.getElementsByTagName == 'function') && + node.getElementsByTagName('input').length; + + if (node.getAttribute("sorttable_customkey") != null) { + return node.getAttribute("sorttable_customkey"); + } + else if (typeof node.textContent != 'undefined' && !hasInputs) { + return node.textContent.replace(/^\s+|\s+$/g, ''); + } + else if (typeof node.innerText != 'undefined' && !hasInputs) { + return node.innerText.replace(/^\s+|\s+$/g, ''); + } + else if (typeof node.text != 'undefined' && !hasInputs) { + return node.text.replace(/^\s+|\s+$/g, ''); + } + else { + switch (node.nodeType) { + case 3: + if (node.nodeName.toLowerCase() == 'input') { + return node.value.replace(/^\s+|\s+$/g, ''); + } + case 4: + return node.nodeValue.replace(/^\s+|\s+$/g, ''); + break; + case 1: + case 11: + var innerText = ''; + for (var i = 0; i < node.childNodes.length; i++) { + innerText += sorttable.getInnerText(node.childNodes[i]); + } + return innerText.replace(/^\s+|\s+$/g, ''); + break; + default: + return ''; + } + } + }, + + reverse: function(tbody) { + // reverse the rows in a tbody + newrows = []; + for (var i=0; i=0; i--) { + tbody.appendChild(newrows[i]); + } + delete newrows; + }, + + /* sort functions + each sort function takes two parameters, a and b + you are comparing a[0] and b[0] */ + sort_numeric: function(a,b) { + aa = parseFloat(a[0].replace(/[^0-9.-]/g,'')); + if (isNaN(aa)) aa = 0; + bb = parseFloat(b[0].replace(/[^0-9.-]/g,'')); + if (isNaN(bb)) bb = 0; + return aa-bb; + }, + sort_alpha: function(a,b) { + if (a[0]==b[0]) return 0; + if (a[0] 0 ) { + var q = list[i]; list[i] = list[i+1]; list[i+1] = q; + swap = true; + } + } // for + t--; + + if (!swap) break; + + for(var i = t; i > b; --i) { + if ( comp_func(list[i], list[i-1]) < 0 ) { + var q = list[i]; list[i] = list[i-1]; list[i-1] = q; + swap = true; + } + } // for + b++; + + } // while(swap) + } +} + +/* ****************************************************************** + Supporting functions: bundled here to avoid depending on a library + ****************************************************************** */ + +// Dean Edwards/Matthias Miller/John Resig + +/* for Mozilla/Opera9 */ +if (document.addEventListener) { + document.addEventListener("DOMContentLoaded", sorttable.init, false); +} + +/* for Internet Explorer */ +/*@cc_on @*/ +/*@if (@_win32) + document.write("
IdentificationTaxonomyLocationYearMapMediaIdentificationTaxonomyLocationRecorded BySexDateMapMedia