1. Made changes so that on individual pages the div containers for network links & sparkline image/text is only generated if there is content to be shown. This as opposed to always creating it first, hiding it & then shoing the container if there was any content.
2. Made sure that network link DIVs are separated by border & padding only if there is need. Now if a person only has grants, on it's profile page there is no longer border & padding on top of the co-investiogator link.
This commit is contained in:
cdtank
parent
5ee4bf2ac6
commit
5cacc57292
6 changed files with 179 additions and 185 deletions
|
|
@ -1,59 +1,59 @@
|
|||
/* $This file is distributed under the terms of the license in /doc/license.txt$ */
|
||||
a.no_href_styles {
|
||||
border: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.no_href_styles a:ACTIVE,.no_href_styles a:BEFORE,.no_href_styles a:FOCUS,.no_href_styles a:HOVER,.no_href_styles a:VISITED,.no_href_styles a:LINK
|
||||
{ /*color: white;*/
|
||||
border: 0;
|
||||
{ /*color: white;*/
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.vis_stats {
|
||||
background: #fff;
|
||||
clear: right;
|
||||
width:67%;
|
||||
margin-left:33%;
|
||||
background: #fff;
|
||||
clear: right;
|
||||
width:67%;
|
||||
margin-left:33%;
|
||||
}
|
||||
|
||||
.vis-tables {
|
||||
padding: 10px;
|
||||
background-color: #FFF;
|
||||
border: 1px solid #ddebf1;
|
||||
float:left;
|
||||
font-size: 0.8em;
|
||||
width: 44%;
|
||||
margin: 0 10px 10px 0;
|
||||
padding: 10px;
|
||||
background-color: #FFF;
|
||||
border: 1px solid #ddebf1;
|
||||
float:left;
|
||||
font-size: 0.8em;
|
||||
width: 44%;
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
|
||||
|
||||
p.datatable {
|
||||
font-size: 12px;
|
||||
display: block;
|
||||
margin: 2px;
|
||||
padding: 0
|
||||
font-size: 12px;
|
||||
display: block;
|
||||
margin: 2px;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
.datatable table {
|
||||
text-align: left;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.datatable img {
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#sparkline-container {
|
||||
margin-left: 33%;
|
||||
margin-left: 33%;
|
||||
width: 67%;
|
||||
}
|
||||
|
||||
#profileImage img{
|
||||
width: 90px;
|
||||
height: auto;
|
||||
width: 90px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#body h1 {
|
||||
margin:0.0em;
|
||||
margin:0.0em;
|
||||
}
|
||||
|
||||
#ego_profile h1 a {
|
||||
|
|
@ -61,58 +61,59 @@ p.datatable {
|
|||
}
|
||||
|
||||
.sparkline_wrapper_table {
|
||||
display: inline;
|
||||
vertical-align: bottom;
|
||||
display: inline;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.investigator_name,
|
||||
.author_name {
|
||||
color: #2485AE;
|
||||
font-weight: bold;
|
||||
color: #2485AE;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.neutral_investigator_name,
|
||||
.neutral_author_name {
|
||||
color: #2485AE;
|
||||
font-weight: bold;
|
||||
color: #2485AE;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.investigator_moniker,
|
||||
.author_moniker {
|
||||
color: #9C9C9C;
|
||||
color: #9C9C9C;
|
||||
}
|
||||
|
||||
.sub_headings {
|
||||
color: #121b3c;
|
||||
padding-top: 10px;
|
||||
float:left;
|
||||
margin-right: 10px;
|
||||
color: #121b3c;
|
||||
padding-top: 10px;
|
||||
float:left;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.toggle_visualization {
|
||||
max-width: 180px;
|
||||
float:right;
|
||||
max-width: 180px;
|
||||
float:right;
|
||||
display:none;
|
||||
}
|
||||
|
||||
#grant-count-sparkline-include,
|
||||
#publication-count-sparkline-include {
|
||||
float: left;
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
#coinvestigator-count-sparkline-include,
|
||||
#coauthor-count-sparkline-include {
|
||||
float: right;
|
||||
float: right;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.sub_headings a {
|
||||
font-size:0.7em;
|
||||
font-weight:normal;
|
||||
font-size:0.7em;
|
||||
font-weight:normal;
|
||||
}
|
||||
|
||||
table.sparkline_wrapper_table td, th {
|
||||
vertical-align: bottom;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
#ego_profile {
|
||||
|
|
@ -124,7 +125,7 @@ table.sparkline_wrapper_table td, th {
|
|||
}
|
||||
|
||||
#ego_label {
|
||||
font-size:1.1em;
|
||||
font-size:1.1em;
|
||||
}
|
||||
|
||||
#ego_profile_image {
|
||||
|
|
@ -138,130 +139,130 @@ table.sparkline_wrapper_table td, th {
|
|||
}
|
||||
|
||||
#ego_sparkline {
|
||||
cursor:pointer;
|
||||
height:36px;
|
||||
width:471px;
|
||||
cursor:pointer;
|
||||
height:36px;
|
||||
width:471px;
|
||||
}
|
||||
|
||||
#coauthorships_table th {
|
||||
vertical-align: top;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.sparkline_range{
|
||||
font-size: 0.9em;
|
||||
font-weight: bold;
|
||||
font-size: 0.9em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.vis-tables table td{
|
||||
padding-right: 10px;
|
||||
width: 50%;
|
||||
padding-right: 10px;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
#visPanel {
|
||||
float: right;
|
||||
width: 600px;
|
||||
float: right;
|
||||
width: 600px;
|
||||
}
|
||||
|
||||
.vis-tables table caption{
|
||||
width: 100%;
|
||||
padding-bottom: 10px;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
text-align: left;
|
||||
width: 100%;
|
||||
padding-bottom: 10px;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.vis-tables table{
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.vis-tables table thead{
|
||||
text-align: left;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.vis-tables table thead tr th {
|
||||
background-color:#eaeaea;
|
||||
font-size:14px;
|
||||
padding:5px;
|
||||
vertical-align:top;
|
||||
text-align:left;
|
||||
background-color:#eaeaea;
|
||||
font-size:14px;
|
||||
padding:5px;
|
||||
vertical-align:top;
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.vis-tables table tbody {
|
||||
font-size:12px;
|
||||
font-size:12px;
|
||||
}
|
||||
|
||||
.vis-tables table tbody td {
|
||||
text-align:left;
|
||||
padding:5px;
|
||||
text-align:left;
|
||||
padding:5px;
|
||||
}
|
||||
|
||||
moniker{
|
||||
margin-top: 0px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
|
||||
.spacer{
|
||||
font-size:0; line-height:0; clear:both;}
|
||||
font-size:0; line-height:0; clear:both;}
|
||||
|
||||
|
||||
/* ----------------- body start --------------------------- */
|
||||
#body{
|
||||
max-width:900px;
|
||||
min-width:800px;
|
||||
margin:0 auto;
|
||||
position:relative;
|
||||
background: white;
|
||||
max-width:900px;
|
||||
min-width:800px;
|
||||
margin:0 auto;
|
||||
position:relative;
|
||||
background: white;
|
||||
}
|
||||
#bodyPannel{
|
||||
background: #FFFFFF;
|
||||
/* width:765px;
|
||||
float:left;*/
|
||||
/*padding-top: 0;
|
||||
padding-right: 28px;
|
||||
padding-bottom: 0;
|
||||
padding-left: 16px;*/
|
||||
height: 840px;
|
||||
background: #FFFFFF;
|
||||
/* width:765px;
|
||||
float:left;*/
|
||||
/*padding-top: 0;
|
||||
padding-right: 28px;
|
||||
padding-bottom: 0;
|
||||
padding-left: 16px;*/
|
||||
height: 840px;
|
||||
}
|
||||
|
||||
#dataPanel {
|
||||
/* margin-top: 50px;
|
||||
width: 25%;
|
||||
background-color: #f7f9f9;
|
||||
height: 80%;
|
||||
padding-left: 10px;
|
||||
padding-bottom: 30px;*/
|
||||
/* margin-top: 50px;
|
||||
width: 25%;
|
||||
background-color: #f7f9f9;
|
||||
height: 80%;
|
||||
padding-left: 10px;
|
||||
padding-bottom: 30px;*/
|
||||
|
||||
border-color: #DFE6E6;
|
||||
border: 1px solid;
|
||||
background: #F7F9F9;
|
||||
width:250px;
|
||||
height:615px;
|
||||
border-color: #DFE6E6;
|
||||
border: 1px solid;
|
||||
background: #F7F9F9;
|
||||
width:250px;
|
||||
height:615px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
#dataPanel div {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 11px;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 11px;
|
||||
}
|
||||
#dataPanel .italicize {
|
||||
font-style: italic;
|
||||
font-style: italic;
|
||||
}
|
||||
#dataPanel .bold {
|
||||
font-weight: bold;
|
||||
color: #2485AE;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: #2485AE;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#dataPanel .investigator_stats .numbers,
|
||||
#dataPanel .author_stats .numbers {
|
||||
text-align: right;
|
||||
width: 40px;
|
||||
float:left;
|
||||
text-align: right;
|
||||
width: 40px;
|
||||
float:left;
|
||||
}
|
||||
|
||||
|
||||
#data-panel-content h4 {
|
||||
padding-bottom: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
#data-panel-content {
|
||||
|
|
@ -271,18 +272,18 @@ moniker{
|
|||
|
||||
/* container override from liquid.css */
|
||||
.container {
|
||||
width: inherit;
|
||||
width: inherit;
|
||||
}
|
||||
|
||||
#incomplete-data {
|
||||
line-height: 150%;
|
||||
margin-right: 15px;
|
||||
line-height: 150%;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.graphml-file-link {
|
||||
padding-top: 20px;
|
||||
height: 20px;
|
||||
font-size: 0.9em;
|
||||
padding-top: 20px;
|
||||
height: 20px;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
#profileTitle {
|
||||
|
|
@ -295,6 +296,6 @@ moniker{
|
|||
}
|
||||
|
||||
#table_heading{
|
||||
/* margin-bottom:20px; */
|
||||
width: 80%;
|
||||
/* margin-bottom:20px; */
|
||||
width: 80%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -48,11 +48,13 @@ span.incomplete-data-holder,
|
|||
}
|
||||
|
||||
.collaboratorship-link-container {
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
.collaboratorship-link-separator {
|
||||
margin-top: 20px;
|
||||
display: none;
|
||||
border-top: 1px dotted #A6B1B0;
|
||||
padding-top: 20px;
|
||||
width: 180px;
|
||||
}
|
||||
|
||||
.sparkline_text {
|
||||
|
|
|
|||
|
|
@ -21,10 +21,6 @@ var visualization = {
|
|||
if ($.trim(data) != "") {
|
||||
containerCoAuthor.html(data);
|
||||
containerCoAuthor.children("#pub_count_short_sparkline_vis");
|
||||
|
||||
/* Since there are publications there are chances that there will be co-authors as well, so show the
|
||||
* co-author network icon.*/
|
||||
$("#coauthorship_link_container").show();
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,81 +3,76 @@
|
|||
<#-- Template for sparkline visualization on individual profile page -->
|
||||
|
||||
<#-- Determine whether this person is an author -->
|
||||
<#assign authorship = propertyGroups.getProperty("${core}authorInAuthorship")!false>
|
||||
<#assign authorship = propertyGroups.getProperty("${core}authorInAuthorship")!>
|
||||
<#assign isAuthor = p.hasStatements(authorship)!false />
|
||||
<#-- Uncomment the following line for a quick confirmation on Publications logic -->
|
||||
<#-- <h1>Publications? <#if isAuthor>Ding Ding Ding!<#else>Wah Wuh!</#if></h1> -->
|
||||
|
||||
<#-- Determine whether this person is involved in any grants -->
|
||||
<#assign investigatorRole = propertyGroups.getProperty("${core}hasInvestigatorRole")!false>
|
||||
<#assign piRole = propertyGroups.getProperty("${core}hasPrincipalInvestigatorRole")!false>
|
||||
<#assign coPiRole = propertyGroups.getProperty("${core}hasCo-PrincipalInvestigatorRole")!false>
|
||||
<#if ( p.hasStatements(investigatorRole) || p.hasStatements(piRole) || p.hasStatements(coPiRole) )>
|
||||
<#assign investigatorRole = propertyGroups.getProperty("${core}hasInvestigatorRole")!>
|
||||
<#assign piRole = propertyGroups.getProperty("${core}hasPrincipalInvestigatorRole")!>
|
||||
<#assign coPiRole = propertyGroups.getProperty("${core}hasCo-PrincipalInvestigatorRole")!>
|
||||
<#if (p.hasStatements(investigatorRole) || p.hasStatements(piRole) || p.hasStatements(coPiRole))>
|
||||
<#assign isInvestigator = true />
|
||||
<#else>
|
||||
<#assign isInvestigator = false />
|
||||
</#if>
|
||||
<#-- Uncomment the following line for a quick confirmation on Grants logic -->
|
||||
<#-- <h1>Grants? <#if isInvestigator>Ding Ding Ding!<#else>Wah Wuh!</#if></h1> -->
|
||||
|
||||
<#-- NO LONGER NEEDED! GET RID OF THIS AND ANY OTHER VIVO REFERENCE IN IndividualTemplateModel.java -->
|
||||
<#-- <#if individual.visualizationUrl??> -->
|
||||
<#assign coAuthorIcon = '${urls.images}/visualization/co_author_icon.png'>
|
||||
<#assign coInvestigatorIcon = '${urls.images}/visualization/co_investigator_icon.png'>
|
||||
<#assign informationIcon = '${urls.images}/iconInfo.gif'>
|
||||
<#assign standardVisualizationURLRoot ="/visualization">
|
||||
<#assign googleJSAPI = 'https://www.google.com/jsapi?autoload=%7B%22modules%22%3A%5B%7B%22name%22%3A%22visualization%22%2C%22version%22%3A%221%22%2C%22packages%22%3A%5B%22imagesparkline%22%5D%7D%5D%7D'>
|
||||
<#assign coAuthorURL = '${urls.base}${standardVisualizationURLRoot}?vis=person_level&uri=${individual.uri}&vis_mode=coauthor'>
|
||||
<#assign coInvestigatorURL = '${urls.base}${standardVisualizationURLRoot}?vis=person_level&uri=${individual.uri}&vis_mode=copi'>
|
||||
<#assign visualizationHelperJavaScript = 'js/visualization/visualization-helper-functions.js'>
|
||||
|
||||
<#if (isAuthor || isInvestigator)>
|
||||
<#assign coAuthorIcon = '${urls.images}/visualization/co_author_icon.png'>
|
||||
<#assign coInvestigatorIcon = '${urls.images}/visualization/co_investigator_icon.png'>
|
||||
<#assign informationIcon = '${urls.images}/iconInfo.gif'>
|
||||
<#assign standardVisualizationURLRoot ="/visualization">
|
||||
<#assign googleJSAPI = 'https://www.google.com/jsapi?autoload=%7B%22modules%22%3A%5B%7B%22name%22%3A%22visualization%22%2C%22version%22%3A%221%22%2C%22packages%22%3A%5B%22imagesparkline%22%5D%7D%5D%7D'>
|
||||
<#assign coAuthorURL = '${urls.base}${standardVisualizationURLRoot}?vis=person_level&uri=${individual.uri}&vis_mode=coauthor'>
|
||||
<#assign coInvestigatorURL = '${urls.base}${standardVisualizationURLRoot}?vis=person_level&uri=${individual.uri}&vis_mode=copi'>
|
||||
<#assign visualizationHelperJavaScript = 'js/visualization/visualization-helper-functions.js'>
|
||||
|
||||
<section id="sparklines-publications" role="region">
|
||||
${stylesheets.add("css/visualization/visualization.css")}
|
||||
|
||||
<img class="infoIcon" src="${informationIcon}" alt="information icon" title="The publication information may be incomplete" />
|
||||
|
||||
<div id="vis_container_coauthor"> </div>
|
||||
<section id="visualization-container" role="region">
|
||||
|
||||
<div id="coauthorship_link_container" class="collaboratorship-link-container">
|
||||
<div class="collaboratorship-icon">
|
||||
<a href="${coAuthorURL}"><img src="${coAuthorIcon}" alt="Co-author Network icon" width="30px" height="30px" /></a>
|
||||
</div>
|
||||
<div class="collaboratorship-link"><a href="${coAuthorURL}">Co-Author Network</a></div>
|
||||
<#if isAuthor>
|
||||
|
||||
<img class="infoIcon" src="${informationIcon}" alt="information icon." title="The publication and grant information may be incomplete." width="20px" height="21px" />
|
||||
|
||||
<div id="vis_container_coauthor"> </div>
|
||||
|
||||
<div class="collaboratorship-link-separator"></div>
|
||||
|
||||
<div id="coauthorship_link_container" class="collaboratorship-link-container">
|
||||
<div class="collaboratorship-icon">
|
||||
<a href="${coAuthorURL}"><img src="${coAuthorIcon}" alt="Co-author Network icon" width="30px" height="30px" /></a>
|
||||
</div>
|
||||
<div class="collaboratorship-link"><a href="${coAuthorURL}">Co-Author Network</a></div>
|
||||
</div>
|
||||
|
||||
<div id="coinvestigator_link_container" class="collaboratorship-link-container">
|
||||
<div class="collaboratorship-icon">
|
||||
<a href="${coInvestigatorURL}"><img src="${coInvestigatorIcon}" alt="Co-investigator Network icon" width="30px" height="30px" /></a>
|
||||
</div>
|
||||
<div class="collaboratorship-link"><a href="${coInvestigatorURL}">Co-Investigator Network</a></div>
|
||||
${scripts.add(googleJSAPI)}
|
||||
${scripts.add(visualizationHelperJavaScript)}
|
||||
${scripts.add("/js/visualization/sparkline.js")}
|
||||
|
||||
<#-- Aside from the variable declarations, this should be moved to an external js file -->
|
||||
<script type="text/javascript">
|
||||
var visualizationUrl = '${individual.visualizationUrl}';
|
||||
</script>
|
||||
|
||||
<#if isInvestigator>
|
||||
<div class="collaboratorship-link-separator"></div>
|
||||
</#if>
|
||||
|
||||
</#if>
|
||||
|
||||
<#if isInvestigator>
|
||||
|
||||
<div id="coinvestigator_link_container" class="collaboratorship-link-container">
|
||||
<div class="collaboratorship-icon">
|
||||
<a href="${coInvestigatorURL}"><img src="${coInvestigatorIcon}" alt="Co-investigator Network icon" width="30px" height="30px" /></a>
|
||||
</div>
|
||||
<div class="collaboratorship-link"><a href="${coInvestigatorURL}">Co-Investigator Network</a></div>
|
||||
</div>
|
||||
|
||||
${stylesheets.add("css/visualization/visualization.css")}
|
||||
${scripts.add(googleJSAPI)}
|
||||
${scripts.add(visualizationHelperJavaScript)}
|
||||
${scripts.add("/js/visualization/sparkline.js")}
|
||||
</#if>
|
||||
|
||||
<#-- Aside from the variable declarations, this should be moved to an external js file -->
|
||||
<script type="text/javascript">
|
||||
var visualizationUrl = '${individual.visualizationUrl}';
|
||||
</section>
|
||||
|
||||
$(document).ready(function(){
|
||||
$.ajax({
|
||||
url: "${urls.base}/visualizationAjax",
|
||||
data: ({vis: "utilities", vis_mode: "SHOW_GRANTS_LINK", uri: '${individual.uri}'}),
|
||||
dataType: "json",
|
||||
success:function(data){
|
||||
/*
|
||||
Collaboratorship links do not show up by default. They should show up only if there any data to
|
||||
show on that page.
|
||||
*/
|
||||
if (data.numOfGrants !== undefined && data.numOfGrants > 0) {
|
||||
$("#coinvestigator_link_container").show();
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</section>
|
||||
</#if>
|
||||
|
|
@ -97,7 +97,7 @@ $(document).ready(function(){
|
|||
show on that page.
|
||||
*/
|
||||
if (data.numOfGrants !== undefined && data.numOfGrants > 0) {
|
||||
$("#coinvestigator_link_container").show();
|
||||
$(".toggle_visualization").show();
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@ $(document).ready(function(){
|
|||
show on that page.
|
||||
*/
|
||||
if (data.numOfPublications !== undefined && data.numOfPublications > 0) {
|
||||
$("#coauthorship_link_container").show();
|
||||
$(".toggle_visualization").show();
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue