Commit ee1c3154 authored by Maxime Chaillet's avatar Maxime Chaillet

move DOI badge in a side box.

parent 6611e880
......@@ -78,7 +78,9 @@ body {
margin-bottom:auto;
}
/* ########################################### */
/* the padding */
/* ########################################### */
.padding-top-15 {
padding-top:15px;
......@@ -92,12 +94,44 @@ body {
padding-left:15px;
}
.padding-bottom-10 {
padding-bottom:10px;
}
.padding10 {
padding:10px;
}
.padding-left-0 {
padding-left:0;
}
.padding-right-0 {
padding-right:0;
}
.padding-right-2{
padding-right:2px;
}
.padding-left-2{
padding-left:2px;
}
/* ########################################### */
/* the margin */
/* ########################################### */
.marging-right-10 {
marging-right:10px;
}
.padding-bottom-10 {
padding-bottom:10px;
.margin-left-0{
margin-left:0px;
}
.margin-right-0{
margin-right:0px;
}
/* ######################## For DOI badge ################ */
......@@ -152,21 +186,11 @@ label {
.scroll-box {
overflow-y: auto;
overflow-x: hidden;
height: 175px;
height: 140px;
}
/* ######################## For welcome page ############# */
.padding10 {
padding:10px;
}
.padding-left-0 {
padding-left:0;
}
.padding-right-0 {
padding-right:0;
}
.whiteBackground {
background-color: #ffffff;
......
......@@ -51,8 +51,9 @@
<div class="container-fluid">
<div class="row align-items-center blueBackground">
<div class="col-12 col-sm-4" > <img id="logo" style="height:80px;" src="/src/images/esrflogo.png" alt="the ESRF logo"> </img> </div>
<div class="col-12 col-sm-8">
<div id="doiBadge" class="row">
<div class="col"> </div>
<div class="col-auto">
<div class="whiteFont font-3p2rem" id="doiValue">
<!-- filled by the js code -->
</div>
</div>
......
......@@ -36,8 +36,9 @@
<div class="container-fluid">
<div class="row align-items-center blueBackground">
<div class="col-12 col-sm-4" > <img id="logo" style="height:80px;" src="/src/images/esrflogo.png" alt="the ESRF logo"> </img> </div>
<div class="col-12 col-sm-8">
<div id="doiBadge" class="row">
<div class="col"> </div>
<div class="col-auto">
<div class="whiteFont font-3p2rem" id="doiValue">
<!-- filled by the js code -->
</div>
</div>
......
......@@ -42,8 +42,9 @@
<div class="container-fluid">
<div class="row align-items-center blueBackground">
<div class="col-12 col-sm-4" > <img id="logo" style="height:80px;" src="/src/images/esrflogo.png" alt="the ESRF logo"> </img> </div>
<div class="col-12 col-sm-8">
<div id="doiBadge" class="row">
<div class="col"> </div>
<div class="col-auto">
<div class="whiteFont font-3p2rem" id="doiValue">
<!-- filled by the js code -->
</div>
......
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -38,7 +38,7 @@ DOIController.prototype.isValidDOIData = function(doiData) {
DOIController.prototype.getData = function(doi) {
var _this = this;
this.view.setDOI(doi);
this.view.setDOILink(_this.doiServer + doi);
//this.view.setDOILink(_this.doiServer + doi);
if (this.hasAcceptedPrefix(doi)) {
$.ajax({
......@@ -65,6 +65,7 @@ DOIController.prototype.getData = function(doi) {
} else {
var doiData = new DoiData();
doiData.title = data.title;
doiData.doi = data.doi.toUpperCase();
doiData.publisher = data.publisher;
doiData.creator = data.creator;
......
......@@ -23,22 +23,20 @@ DOIView.prototype.setLoading = function( message ) {
*
*/
DOIView.prototype.setDOI = function( doiCode ) {
// $( "#doiPanel" ).text( doiCode.toUpperCase() );
$( "#doiBadge" ).html(
"<div class='col'> </div> " +
"<div class='col-auto mr-3 borderRadius-5 whiteBackground' style='padding:5px;'>" +
"<span class='doiBadge borderRadius-5 fontSize-20'> <a id='doiLink' href=''>" +
doiCode.toUpperCase() +
"</a> </span> </div>" );
$( "#doiValue" ).text( "DOI > " + doiCode.toUpperCase() );
// $( "#doiBadge" ).html(
// "<span class='doiBadge borderRadius-5 fontSize-20'> <a id='doiLink' href=''>" +
// doiCode.toUpperCase() +
// "</a> </span>" );
};
/**
* Set the doi http link in the doi landing page. It is the http address at datacite server which will redirect to the DOI landing page.
*
*/
DOIView.prototype.setDOILink = function( doiLink ) {
$( "#doiLink" ).attr( "href", doiLink.toUpperCase() );
};
//DOIView.prototype.setDOILink = function( doiLink ) {
// $( "#doiLink" ).attr( "href", doiLink.toUpperCase() );
//};
/**
* Render experimental Report data
......
<div class="card-body">
<div class="row">
<div class="row margin-left-0 margin-right-0">
{@eq key=data.resourceTypeGeneral value="Dataset"}
<div class="col-auto">
<span class="badge badge-secondary font-1p4rem marging-right-10"> Dataset </span>
<div class="col"> </div>
<div class="col-auto padding-right-2 padding-left-2">
<span class="badge badge-secondary font-1p4rem"> Dataset </span>
</div>
{/eq}
{@eq key=data.resourceType value="Experiment Session"}
<div class="col-auto">
<span class="badge badge-secondary font-1p4rem marging-right-10" > Session </span>
<div class="col-auto padding-right-2 padding-left-2">
<span class="badge badge-secondary font-1p4rem " > Session </span>
</div>
{/eq}
{@eq key=data.accessibility value="Open access"}
<div class="col-auto">
<span class="badge badge-success font-1p4rem marging-right-10"> Open access </span>
<div class="col-auto padding-right-2 padding-left-2">
<span class="badge badge-success font-1p4rem "> Open access </span>
</div>
{/eq}
{@eq key=data.accessibility value="Restricted access"}
<div class="col-auto">
<span class="badge badge-warning font-1p4rem marging-right-10"> Restricted access </span>
<div class="col-auto padding-right-2 padding-left-2">
<span class="badge badge-warning font-1p4rem "> Restricted access </span>
</div>
{/eq}
</div>
</div>
\ No newline at end of file
</div>
\ No newline at end of file
<div class="container-fluid">
<div class="row padding-top-15">
<div class="col-9">
<div class="row">
<div class="col-12">
<div id="badges"> </div>
</div>
</div>
<div class="row">
<div class="col-12 fontSize-20 text-center text-uppercase font-weight-bold py-3">{data.title}</div>
</div>
<div class="row">
<div class="col-12">
<div class="myBorder-left">
<div>
<cite>
{#data.creator} {?.givenName} {.givenName} {.familyName} ; {:else} {.name} ; {/.givenName} {/data.creator}
</cite>
</div>
</div>
</div>
</div>
</div>
<div class="col-3">
<div id="badges" class="card"> </div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="myBorder-left">
<div>
<cite>
{#data.creator} {?.givenName} {.givenName} {.familyName} ; {:else} {.name} ; {/.givenName} {/data.creator}
</cite>
<div class="card">
<div class="card-body">
<div class="card-text">
<label> DOI </label>
<div>
<span class="doiBadge borderRadius-5 font-1p4rem">
<a id="doiLink" href=""> {data.doi} </a>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<hr>
<div class="row">
<div class="col">
<div class="myBorder-left">
......@@ -110,51 +127,52 @@
</div>
</div>
</div>
</div>
</div>
<br>
<br>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header text-center">
<label>Experimental data </label>
</div>
<div class="card-body padding10">
<p class="card-text" >{data.accessMessage|s}</p>
</div>
<div class="card-footer">
<div class="row">
<div class="col-2"> </div>
<div class="col-8">
<form action="https://icat.esrf.fr/#/browse/facility/ESRF/proposal/{data.proposalNumber}/investigation/{data.investigationId}/dataset" target="_blank">
<button type="submit" class="btn btn-primary btn-lg btn-block"> Access data </button>
</form>
</div>
<div class="col-2"> </div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header text-center">
<label>Experimental data </label>
</div>
<div class="card-body padding10">
<p class="card-text" >{data.accessMessage|s}</p>
</div>
<div class="card-footer">
<div class="row">
<div class="col-1"> </div>
<div class="col-10">
<form action="https://icat.esrf.fr/#/browse/facility/ESRF/proposal/{data.proposalNumber}/investigation/{data.investigationId}/dataset" target="_blank">
<button type="submit" class="btn btn-primary btn-lg btn-block"> Access data </button>
</form>
</div>
<div class="col-1"> </div>
</div>
</div>
</div>
</div>
</div>
<hr>
<hr>
<div class="row">
<div class="col-12">
<div class="myBorder-left">
<label> Citation </label>
<div class="padding-left-15">
<p> Below is the recommended format for citing this work in a research publication.</p>
<div class="padding-left-15">
<cite> {data.citation|s} </cite>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="myBorder-left">
<label class="greyGradientToRight padding-left-10 padding-right-20"> Citation </label>
<a data-toggle="collapse" href="#citation" role="button" aria-expanded="false" aria-controls="citation">
&nbsp; +/-
</a>
<div class="padding-left-25 collapse" id="citation">
<p> Below is the recommended format for citing this work in a research publication.</p>
<div class="padding-left-25">
<cite> {data.citation|s} </cite>
</div>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
</div>
</div>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment