- tethys favicon also in oai: oai2_style.xslt

- zenodo search: adapted search_style.css, App.vue, dataservice.ts, vs-results.vue
This commit is contained in:
Arno Kaimbacher 2020-04-17 17:55:18 +02:00
parent 8208558e8c
commit 578021e07e
7 changed files with 142 additions and 101 deletions

View File

@ -17,14 +17,87 @@ section.search {
} }
/* zenodo */
.label-success {
background-color: #5cb85c;
}
.label-default {
background-color: #777;
}
.label-info {
background-color: #6aa3d5;
}
.label {
display: inline-block;
padding: .2em .12em .3em;
font-size: 75%;
color: #fff;
border-radius: .25em;
margin-right:1.25em;
/* margin-left: 10px; */
}
/* .record-elem .h4, record-elem h4 {
font-size: 18px;
} */
.record-elem p a {
color: #000;
}
/* .record-elem h4 a {
color: #000;
} */
a.ng-binding {
cursor: pointer;
}
.record-elem h4 a {
cursor: pointer;
color: #000;
text-decoration: none;
font-weight: bold;
/* margin-left: 10px; */
font-size: 16px;
}
.record-elem h4 a:hover {
color: #777;
text-decoration: none;
}
/* .search-detail a:hover {
color: rgb(0, 128, 0);
} */
.record-elem .h4, .record-elem h4 {
font-size: 16px;
letter-spacing: .05em;
}
.record-detail h1, .record-detail p,
.record-elem h4,
.record-elem p, .well {
word-wrap: break-word;
}
.record-elem p span {
color: #000;
font-size: 14px;
}
.post {
position: relative;
min-height: 1px;
padding-left: 15px;
padding-right: 15px;
/* Seasrch items */ box-sizing: border-box;
margin-bottom:10px;
margin-top: 15px;
}
.record-elem{
border-top: 1px solid rgb(238, 238, 238);
}
.search-items { /* Search items */
/* .search-items {
list-style: none; list-style: none;
width: 100%; width: 100%;
display: inline-block; display: inline-block;
@ -33,8 +106,6 @@ section.search {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
height: 360px; height: 360px;
/* important because we need to overwrite the default skeleton */
margin: 0!important; margin: 0!important;
width: 50%; width: 50%;
border: 10px solid white; border: 10px solid white;
@ -50,51 +121,23 @@ section.search {
width: auto; width: auto;
height: 100%; height: 100%;
display: block; display: block;
} */
}
/* Work detail */ /* Work detail */
.search-detail { /* .search-detail {
position: absolute; position: absolute;
top: 0; bottom: 0; left: 0; right: 0; top: 0; bottom: 0; left: 0; right: 0;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
align-items: center; align-items: center;
/* box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; */
/* box-shadow: 3px 3px red, -1em 0 0.4em olive; */
box-shadow: inset rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; box-shadow: inset rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
opacity: 1; opacity: 1;
border: 1px solid rgb(238, 238, 238); border: 1px solid rgb(238, 238, 238);
box-sizing: border-box; box-sizing: border-box;
min-height: 300px; min-height: 300px;
/* background: rgba(0,0,0,.75); */
/* color: white; */
font-size: 16px; font-size: 16px;
padding:20px; padding:20px;
} */
}
.search-detail a {
cursor: pointer;
color: mediumseagreen;
text-decoration: none;
font-weight: bold;
margin-left: 20px;
font-size: 16px;
}
.search-detail a:hover {
color: rgb(0, 128, 0);
}
.search-detail h3 {
font-size: 16px;
letter-spacing: .05em;
}
.search-detail p {
font-size: 15px;
/* text-transform: capitalize; */
/* padding-left: 20px;
padding-right: 20px; */
}
/* Larger than mobile */ /* Larger than mobile */

File diff suppressed because one or more lines are too long

View File

@ -162,6 +162,14 @@ p.intro {
<head> <head>
<title>TETHYS OAI 2.0 Request Results</title> <title>TETHYS OAI 2.0 Request Results</title>
<style><xsl:call-template name="style"/></style> <style><xsl:call-template name="style"/></style>
<!-- Favicon
-->
<link rel="apple-touch-icon" sizes="180x180" href="/images/favicon/apple-touch-icon.png"/>
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon/favicon-32x32.png"/>
<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon/favicon-16x16.png"/>
<link rel="manifest" href="/images/favicon/site.webmanifest"/>
<link rel="mask-icon" href="/images/favicon/safari-pinned-tab.svg" color="#5bbad5"/>
<link rel="shortcut icon" href="/images/favicon/favicon.ico"/>
</head> </head>
<body> <body>
<h1>TETHYS OAI 2.0 Request Results</h1> <h1>TETHYS OAI 2.0 Request Results</h1>
@ -219,7 +227,6 @@ p.intro {
<!-- ERROR --> <!-- ERROR -->
<xsl:template match="/oai:OAI-PMH/oai:error"> <xsl:template match="/oai:OAI-PMH/oai:error">
<table class="values"> <table class="values">
<tr><td class="key">Error Code</td> <tr><td class="key">Error Code</td>
@ -229,7 +236,6 @@ p.intro {
</xsl:template> </xsl:template>
<!-- IDENTIFY --> <!-- IDENTIFY -->
<xsl:template match="/oai:OAI-PMH/oai:Identify"> <xsl:template match="/oai:OAI-PMH/oai:Identify">
<table class="values"> <table class="values">
<tr><td class="key">Repository Name</td> <tr><td class="key">Repository Name</td>
@ -258,7 +264,6 @@ p.intro {
<!-- <!--
Identify / Unsupported Description Identify / Unsupported Description
--> -->
<xsl:template match="oai:description/*" priority="-100"> <xsl:template match="oai:description/*" priority="-100">
<h2>Unsupported Description Type</h2> <h2>Unsupported Description Type</h2>
<p>The XSL currently does not support this type of description.</p> <p>The XSL currently does not support this type of description.</p>
@ -271,7 +276,6 @@ p.intro {
<!-- <!--
Identify / OAI-Identifier Identify / OAI-Identifier
--> -->
<xsl:template match="id:oai-identifier" xmlns:id="http://www.openarchives.org/OAI/2.0/oai-identifier"> <xsl:template match="id:oai-identifier" xmlns:id="http://www.openarchives.org/OAI/2.0/oai-identifier">
<h2>OAI-Identifier</h2> <h2>OAI-Identifier</h2>
<table class="values"> <table class="values">
@ -290,7 +294,6 @@ p.intro {
<!-- <!--
Identify / EPrints Identify / EPrints
--> -->
<xsl:template match="ep:eprints" xmlns:ep="http://www.openarchives.org/OAI/1.1/eprints"> <xsl:template match="ep:eprints" xmlns:ep="http://www.openarchives.org/OAI/1.1/eprints">
<h2>EPrints Description</h2> <h2>EPrints Description</h2>
<h3>Content</h3> <h3>Content</h3>
@ -328,7 +331,6 @@ p.intro {
<!-- <!--
Identify / Friends Identify / Friends
--> -->
<xsl:template match="fr:friends" xmlns:fr="http://www.openarchives.org/OAI/2.0/friends/"> <xsl:template match="fr:friends" xmlns:fr="http://www.openarchives.org/OAI/2.0/friends/">
<h2>Friends</h2> <h2>Friends</h2>
<ul> <ul>
@ -346,7 +348,6 @@ p.intro {
<!-- <!--
Identify / Branding Identify / Branding
--> -->
<xsl:template match="br:branding" xmlns:br="http://www.openarchives.org/OAI/2.0/branding/"> <xsl:template match="br:branding" xmlns:br="http://www.openarchives.org/OAI/2.0/branding/">
<h2>Branding</h2> <h2>Branding</h2>
<xsl:apply-templates select="br:collectionIcon"/> <xsl:apply-templates select="br:collectionIcon"/>
@ -382,7 +383,6 @@ p.intro {
<!-- <!--
Identify / Gateway Identify / Gateway
--> -->
<xsl:template match="gw:gateway" xmlns:gw="http://www.openarchives.org/OAI/2.0/gateway/x"> <xsl:template match="gw:gateway" xmlns:gw="http://www.openarchives.org/OAI/2.0/gateway/x">
<h2>Gateway Information</h2> <h2>Gateway Information</h2>
<table class="values"> <table class="values">
@ -409,27 +409,23 @@ p.intro {
<!-- GetRecord --> <!-- GetRecord -->
<xsl:template match="oai:GetRecord"> <xsl:template match="oai:GetRecord">
<xsl:apply-templates select="oai:record" /> <xsl:apply-templates select="oai:record" />
</xsl:template> </xsl:template>
<!-- ListRecords --> <!-- ListRecords -->
<xsl:template match="oai:ListRecords"> <xsl:template match="oai:ListRecords">
<xsl:apply-templates select="oai:record" /> <xsl:apply-templates select="oai:record" />
<xsl:apply-templates select="oai:resumptionToken" /> <xsl:apply-templates select="oai:resumptionToken" />
</xsl:template> </xsl:template>
<!-- ListIdentifiers --> <!-- ListIdentifiers -->
<xsl:template match="oai:ListIdentifiers"> <xsl:template match="oai:ListIdentifiers">
<xsl:apply-templates select="oai:header" /> <xsl:apply-templates select="oai:header" />
<xsl:apply-templates select="oai:resumptionToken" /> <xsl:apply-templates select="oai:resumptionToken" />
</xsl:template> </xsl:template>
<!-- ListSets --> <!-- ListSets -->
<xsl:template match="oai:ListSets"> <xsl:template match="oai:ListSets">
<xsl:apply-templates select="oai:set" /> <xsl:apply-templates select="oai:set" />
<xsl:apply-templates select="oai:resumptionToken" /> <xsl:apply-templates select="oai:resumptionToken" />
@ -445,7 +441,6 @@ p.intro {
</xsl:template> </xsl:template>
<!-- ListMetadataFormats --> <!-- ListMetadataFormats -->
<xsl:template match="oai:ListMetadataFormats"> <xsl:template match="oai:ListMetadataFormats">
<xsl:choose> <xsl:choose>
<xsl:when test="$identifier"> <xsl:when test="$identifier">
@ -484,7 +479,6 @@ p.intro {
</xsl:template> </xsl:template>
<!-- record object --> <!-- record object -->
<xsl:template match="oai:record"> <xsl:template match="oai:record">
<h2 class="oaiRecordTitle">OAI Record: <xsl:value-of select="oai:header/oai:identifier"/></h2> <h2 class="oaiRecordTitle">OAI Record: <xsl:value-of select="oai:header/oai:identifier"/></h2>
<div class="oaiRecord"> <div class="oaiRecord">
@ -512,7 +506,6 @@ p.intro {
</xsl:if> </xsl:if>
</xsl:template> </xsl:template>
<xsl:template match="oai:about"> <xsl:template match="oai:about">
<p>"about" part of record container not supported by the XSL</p> <p>"about" part of record container not supported by the XSL</p>
</xsl:template> </xsl:template>
@ -524,11 +517,7 @@ p.intro {
</div> </div>
</xsl:template> </xsl:template>
<!-- oai setSpec object --> <!-- oai setSpec object -->
<xsl:template match="oai:setSpec"> <xsl:template match="oai:setSpec">
<tr><td class="key">setSpec</td> <tr><td class="key">setSpec</td>
<td class="value"><xsl:value-of select="."/> <td class="value"><xsl:value-of select="."/>
@ -537,10 +526,7 @@ p.intro {
</td></tr> </td></tr>
</xsl:template> </xsl:template>
<!-- oai resumptionToken --> <!-- oai resumptionToken -->
<xsl:template match="oai:resumptionToken"> <xsl:template match="oai:resumptionToken">
<p>There are more results.</p> <p>There are more results.</p>
<table class="values"> <table class="values">
@ -552,7 +538,6 @@ p.intro {
</xsl:template> </xsl:template>
<!-- unknown metadata format --> <!-- unknown metadata format -->
<xsl:template match="oai:metadata/*" priority='-100'> <xsl:template match="oai:metadata/*" priority='-100'>
<h3>Unknown Metadata Format</h3> <h3>Unknown Metadata Format</h3>
<div class="xmlSource"> <div class="xmlSource">
@ -561,7 +546,6 @@ p.intro {
</xsl:template> </xsl:template>
<!-- oai_dc record --> <!-- oai_dc record -->
<xsl:template match="oai_dc:dc" xmlns:oai_dc="http://www.openarchives.org/OAI/2.0/oai_dc/" > <xsl:template match="oai_dc:dc" xmlns:oai_dc="http://www.openarchives.org/OAI/2.0/oai_dc/" >
<div class="dcdata"> <div class="dcdata">
<h3>Dublin Core Metadata (oai_dc)</h3> <h3>Dublin Core Metadata (oai_dc)</h3>
@ -634,7 +618,6 @@ p.intro {
<tr><td class="key">Rights Management</td><td class="value"><xsl:value-of select="."/></td></tr></xsl:template> <tr><td class="key">Rights Management</td><td class="value"><xsl:value-of select="."/></td></tr></xsl:template>
<!-- XML Pretty Maker --> <!-- XML Pretty Maker -->
<xsl:template match="node()" mode='xmlMarkup'> <xsl:template match="node()" mode='xmlMarkup'>
<div class="xmlBlock"> <div class="xmlBlock">
&lt;<span class="xmlTagName"><xsl:value-of select='name(.)' /></span><xsl:apply-templates select="@*" mode='xmlMarkup'/>&gt;<xsl:apply-templates select="node()" mode='xmlMarkup' />&lt;/<span class="xmlTagName"><xsl:value-of select='name(.)' /></span>&gt; &lt;<span class="xmlTagName"><xsl:value-of select='name(.)' /></span><xsl:apply-templates select="@*" mode='xmlMarkup'/>&gt;<xsl:apply-templates select="node()" mode='xmlMarkup' />&lt;/<span class="xmlTagName"><xsl:value-of select='name(.)' /></span>&gt;
@ -670,4 +653,3 @@ p.intro {
</xsl:template> </xsl:template>
</xsl:stylesheet> </xsl:stylesheet>

View File

@ -40,7 +40,7 @@
<span v-if="value && value.length > 0">{{ value.join(', ') }}</span> <span v-if="value && value.length > 0">{{ value.join(', ') }}</span>
</a> </a>
</div> --> </div> -->
<div class="twelve columns"> <div class="twelve columns resultheader">
<span class="active-filter-items" v-for="(values, key, index) in activeFilterCategories" :key="index"> <span class="active-filter-items" v-for="(values, key, index) in activeFilterCategories" :key="index">
<active-facet-category :data="values" :categoryName="key" @clearFacetCategory="onClearFacetCategory"></active-facet-category> <active-facet-category :data="values" :categoryName="key" @clearFacetCategory="onClearFacetCategory"></active-facet-category>
</span> </span>
@ -84,6 +84,9 @@ export default App;
</script> </script>
<style lang="scss"> <style lang="scss">
.resultheader {
padding-left: 4%;
}
#app { #app {
color: #56b983; color: #56b983;
} }

View File

@ -184,7 +184,7 @@ export default class App extends Vue {
this.loaded = true; this.loaded = true;
} }
getParameterByName(name: string, url?: string) { private getParameterByName(name: string, url?: string) {
if (!url) url = window.location.href; if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&"); name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),

View File

@ -3,7 +3,7 @@ import axios from "axios";
var SOLR_CONFIG = { var SOLR_CONFIG = {
"server": "https://arcticdata.io/metacat/d1/mn/v2/query/solr?", // Solr server "server": "https://arcticdata.io/metacat/d1/mn/v2/query/solr?", // Solr server
"filter": "knb-lter-bnz", // Filter results for an organization or user "filter": "knb-lter-bnz", // Filter results for an organization or user
"limit": 4, // Max number of results to retrieve per page "limit": 10, // Max number of results to retrieve per page
"resultsElementId": "searchResults", // Element to contain results "resultsElementId": "searchResults", // Element to contain results
"urlElementId": "searchUrl", // Element to display search URL "urlElementId": "searchUrl", // Element to display search URL
"countElementId": "resultCount", // Element showing number of results "countElementId": "resultCount", // Element showing number of results
@ -28,7 +28,7 @@ export default {
"title_output", "title_output",
"title_additional", "title_additional",
"author", "author",
"subject"].toString(); "subject", "doctype"].toString();
var limit = "&rows=" + SOLR_CONFIG["limit"]; var limit = "&rows=" + SOLR_CONFIG["limit"];
// var limit = solrConfig.limit; // var limit = solrConfig.limit;
@ -86,7 +86,7 @@ export default {
"title_output", "title_output",
"title_additional", "title_additional",
"author", "author",
"subject"].toString(); "subject", "doctype"].toString();
//var dismaxFields = "title^3 abstract^2 subject^1"; //var dismaxFields = "title^3 abstract^2 subject^1";

View File

@ -17,25 +17,34 @@
</div> </div>
</div> --> </div> -->
<section class="result-list-container"> <section class="normal result-list-container">
<div class="row">
<ul class="search-items isotope js-isotope u-cf"> <div v-for="document in results" :key="document.id" class="row record-elem">
<li v-for="document in results" :key="document.id" class="six columns post"> <div class="twelve columns post">
<div class="search-detail">
<div> <span class="label label-info" data-container="div" data-title="Publication date">
<a
v-bind:href="'dataset/' + document.id"
>{{ document.title_output }}</a>
</div>
{{ convert(document.server_date_published) }} {{ convert(document.server_date_published) }}
</span>
<span class="label label-default ng-binding">{{ document.doctype }}</span>
<span class="label label-success titlecase">Open Access</span>
<p v-if="document.title_additional && document.title_additional.length > 0">
<em>Additional Title:{{ document.title_additional.join(', ') }}</em>
</p>
<div v-if="document.author && document.author.length > 0"> <h4>
<em>Author: {{ document.author.join(', ') }}</em> <a target="_self" v-bind:href="'dataset/' + document.id" class="ng-binding">
</div> {{ document.title_output }}
</a>
</h4>
<p>
<span v-if="document.author && document.author.length > 0" v-for="author in document.author">
<!-- <span>Author: {{ document.author.join(', ') }}</span> -->
<span>{{ author }}; </span>
</span>
<!-- <p v-if="document.title_additional && document.title_additional.length > 0">
<span>Additional Title:{{ document.title_additional.join(', ') }}</span>
</p> -->
<p class="clamped clamped-2"> <p class="clamped clamped-2">
<span class="text"> <span class="text">
@ -44,20 +53,24 @@
<span class="fill"></span> <span class="fill"></span>
</span> </span>
</p> </p>
<div class="css-subject" v-if="document.subject && document.subject.length > 0">
<div v-for="(item, index) in document.subject" :key="index" class="css-keyword">#{{ item }}</div> <!-- <div class="css-subject" v-if="document.subject && document.subject.length > 0"> -->
<!-- <div class="css-keyword">#graphql</div> --> <span class="label label-success titlecase" v-for="(item, index) in document.subject" :key="index">
#{{ item }}
</span>
<!-- <p>
<small class="text-muted hidden-xs ng-binding">
Uploaded on March 15, 2019
</small>
</p> -->
</div> </div>
</div> </div>
</li>
</ul>
</div>
</section> </section>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import VgResults from "./vs-results-class"; import VgResults from "./vs-results-class";
export default VgResults; export default VgResults;
</script> </script>