litvinovg/vivo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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.

Browse source 
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 2011-01-31 17:40:06 +00:00
parent 5ee4bf2ac6
commit 5cacc57292
6 changed files with 179 additions and 185 deletions
Download patch file Download diff file Expand all files Collapse all files

227
productMods/css/visualization/personlevel/page.css
View file

@ -1,59 +1,59 @@
/* $This file is distributed under the terms of the license in /doc/license.txt$ */ /* $This file is distributed under the terms of the license in /doc/license.txt$ */
a.no_href_styles { 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 .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;*/ { /*color: white;*/
border: 0; border: 0;
} }
.vis_stats { .vis_stats {
background: #fff; background: #fff;
clear: right; clear: right;
width:67%; width:67%;
margin-left:33%; margin-left:33%;
} }
.vis-tables { .vis-tables {
padding: 10px; padding: 10px;
background-color: #FFF; background-color: #FFF;
border: 1px solid #ddebf1; border: 1px solid #ddebf1;
float:left; float:left;
font-size: 0.8em; font-size: 0.8em;
width: 44%; width: 44%;
margin: 0 10px 10px 0; margin: 0 10px 10px 0;
} }
p.datatable { p.datatable {
font-size: 12px; font-size: 12px;
display: block; display: block;
margin: 2px; margin: 2px;
padding: 0 padding: 0
} }
.datatable table { .datatable table {
text-align: left; text-align: left;
} }
.datatable img { .datatable img {
float: left; float: left;
cursor: pointer; cursor: pointer;
} }
#sparkline-container { #sparkline-container {
margin-left: 33%; margin-left: 33%;
width: 67%; width: 67%;
} }
#profileImage img{ #profileImage img{
width: 90px; width: 90px;
height: auto; height: auto;
} }
#body h1 { #body h1 {
margin:0.0em; margin:0.0em;
} }
#ego_profile h1 a { #ego_profile h1 a {
@ -61,58 +61,59 @@ p.datatable {
} }
.sparkline_wrapper_table { .sparkline_wrapper_table {
display: inline; display: inline;
vertical-align: bottom; vertical-align: bottom;
} }
.investigator_name, .investigator_name,
.author_name { .author_name {
color: #2485AE; color: #2485AE;
font-weight: bold; font-weight: bold;
} }
.neutral_investigator_name, .neutral_investigator_name,
.neutral_author_name { .neutral_author_name {
color: #2485AE; color: #2485AE;
font-weight: bold; font-weight: bold;
} }
.investigator_moniker, .investigator_moniker,
.author_moniker { .author_moniker {
color: #9C9C9C; color: #9C9C9C;
} }
.sub_headings { .sub_headings {
color: #121b3c; color: #121b3c;
padding-top: 10px; padding-top: 10px;
float:left; float:left;
margin-right: 10px; margin-right: 10px;
} }
.toggle_visualization { .toggle_visualization {
max-width: 180px; max-width: 180px;
float:right; float:right;
display:none;
} }
#grant-count-sparkline-include, #grant-count-sparkline-include,
#publication-count-sparkline-include { #publication-count-sparkline-include {
float: left; float: left;
width: 50%; width: 50%;
} }
#coinvestigator-count-sparkline-include, #coinvestigator-count-sparkline-include,
#coauthor-count-sparkline-include { #coauthor-count-sparkline-include {
float: right; float: right;
width: 50%; width: 50%;
} }
.sub_headings a { .sub_headings a {
font-size:0.7em; font-size:0.7em;
font-weight:normal; font-weight:normal;
} }
table.sparkline_wrapper_table td, th { table.sparkline_wrapper_table td, th {
vertical-align: bottom; vertical-align: bottom;
} }
#ego_profile { #ego_profile {
@ -124,7 +125,7 @@ table.sparkline_wrapper_table td, th {
} }
#ego_label { #ego_label {
font-size:1.1em; font-size:1.1em;
} }
#ego_profile_image { #ego_profile_image {
@ -138,130 +139,130 @@ table.sparkline_wrapper_table td, th {
} }
#ego_sparkline { #ego_sparkline {
cursor:pointer; cursor:pointer;
height:36px; height:36px;
width:471px; width:471px;
} }
#coauthorships_table th { #coauthorships_table th {
vertical-align: top; vertical-align: top;
} }
.sparkline_range{ .sparkline_range{
font-size: 0.9em; font-size: 0.9em;
font-weight: bold; font-weight: bold;
} }
.vis-tables table td{ .vis-tables table td{
padding-right: 10px; padding-right: 10px;
width: 50%; width: 50%;
} }
#visPanel { #visPanel {
float: right; float: right;
width: 600px; width: 600px;
} }
.vis-tables table caption{ .vis-tables table caption{
width: 100%; width: 100%;
padding-bottom: 10px; padding-bottom: 10px;
font-weight: bold; font-weight: bold;
font-size: 16px; font-size: 16px;
text-align: left; text-align: left;
} }
.vis-tables table{ .vis-tables table{
width: 100%; width: 100%;
} }
.vis-tables table thead{ .vis-tables table thead{
text-align: left; text-align: left;
} }
.vis-tables table thead tr th { .vis-tables table thead tr th {
background-color:#eaeaea; background-color:#eaeaea;
font-size:14px; font-size:14px;
padding:5px; padding:5px;
vertical-align:top; vertical-align:top;
text-align:left; text-align:left;
} }
.vis-tables table tbody { .vis-tables table tbody {
font-size:12px; font-size:12px;
} }
.vis-tables table tbody td { .vis-tables table tbody td {
text-align:left; text-align:left;
padding:5px; padding:5px;
} }
moniker{ moniker{
margin-top: 0px; margin-top: 0px;
} }
.spacer{ .spacer{
font-size:0; line-height:0; clear:both;} font-size:0; line-height:0; clear:both;}
/* ----------------- body start --------------------------- */ /* ----------------- body start --------------------------- */
#body{ #body{
max-width:900px; max-width:900px;
min-width:800px; min-width:800px;
margin:0 auto; margin:0 auto;
position:relative; position:relative;
background: white; background: white;
} }
#bodyPannel{ #bodyPannel{
background: #FFFFFF; background: #FFFFFF;
/* width:765px; /* width:765px;
float:left;*/ float:left;*/
/*padding-top: 0; /*padding-top: 0;
padding-right: 28px; padding-right: 28px;
padding-bottom: 0; padding-bottom: 0;
padding-left: 16px;*/ padding-left: 16px;*/
height: 840px; height: 840px;
} }
#dataPanel { #dataPanel {
/* margin-top: 50px; /* margin-top: 50px;
width: 25%; width: 25%;
background-color: #f7f9f9; background-color: #f7f9f9;
height: 80%; height: 80%;
padding-left: 10px; padding-left: 10px;
padding-bottom: 30px;*/ padding-bottom: 30px;*/
border-color: #DFE6E6; border-color: #DFE6E6;
border: 1px solid; border: 1px solid;
background: #F7F9F9; background: #F7F9F9;
width:250px; width:250px;
height:615px; height:615px;
margin-top: 15px; margin-top: 15px;
} }
#dataPanel div { #dataPanel div {
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
font-size: 11px; font-size: 11px;
} }
#dataPanel .italicize { #dataPanel .italicize {
font-style: italic; font-style: italic;
} }
#dataPanel .bold { #dataPanel .bold {
font-weight: bold; font-weight: bold;
color: #2485AE; color: #2485AE;
font-size: 14px; font-size: 14px;
} }
#dataPanel .investigator_stats .numbers, #dataPanel .investigator_stats .numbers,
#dataPanel .author_stats .numbers { #dataPanel .author_stats .numbers {
text-align: right; text-align: right;
width: 40px; width: 40px;
float:left; float:left;
} }
#data-panel-content h4 { #data-panel-content h4 {
padding-bottom: 0; padding-bottom: 0;
} }
#data-panel-content { #data-panel-content {
@ -271,18 +272,18 @@ moniker{
/* container override from liquid.css */ /* container override from liquid.css */
.container { .container {
width: inherit; width: inherit;
} }
#incomplete-data { #incomplete-data {
line-height: 150%; line-height: 150%;
margin-right: 15px; margin-right: 15px;
} }
.graphml-file-link { .graphml-file-link {
padding-top: 20px; padding-top: 20px;
height: 20px; height: 20px;
font-size: 0.9em; font-size: 0.9em;
} }
#profileTitle { #profileTitle {
@ -295,6 +296,6 @@ moniker{
} }
#table_heading{ #table_heading{
/* margin-bottom:20px; */ /* margin-bottom:20px; */
width: 80%; width: 80%;
} }

6
productMods/css/visualization/visualization.css
View file

@ -48,11 +48,13 @@ span.incomplete-data-holder,
} }
.collaboratorship-link-container { .collaboratorship-link-container {
width: 180px;
}
.collaboratorship-link-separator {
margin-top: 20px; margin-top: 20px;
display: none;
border-top: 1px dotted #A6B1B0; border-top: 1px dotted #A6B1B0;
padding-top: 20px; padding-top: 20px;
width: 180px;
} }
.sparkline_text { .sparkline_text {

4
productMods/js/visualization/sparkline.js
View file

@ -21,10 +21,6 @@ var visualization = {
if ($.trim(data) != "") { if ($.trim(data) != "") {
containerCoAuthor.html(data); containerCoAuthor.html(data);
containerCoAuthor.children("#pub_count_short_sparkline_vis"); 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();
} }
} }

109
productMods/templates/freemarker/body/partials/individual/individual-sparklineVisualization.ftl
View file

@ -3,81 +3,76 @@
<#-- Template for sparkline visualization on individual profile page --> <#-- Template for sparkline visualization on individual profile page -->
<#-- Determine whether this person is an author --> <#-- 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 /> <#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 --> <#-- Determine whether this person is involved in any grants -->
<#assign investigatorRole = propertyGroups.getProperty("${core}hasInvestigatorRole")!false> <#assign investigatorRole = propertyGroups.getProperty("${core}hasInvestigatorRole")!>
<#assign piRole = propertyGroups.getProperty("${core}hasPrincipalInvestigatorRole")!false> <#assign piRole = propertyGroups.getProperty("${core}hasPrincipalInvestigatorRole")!>
<#assign coPiRole = propertyGroups.getProperty("${core}hasCo-PrincipalInvestigatorRole")!false> <#assign coPiRole = propertyGroups.getProperty("${core}hasCo-PrincipalInvestigatorRole")!>
<#if ( p.hasStatements(investigatorRole) || p.hasStatements(piRole) || p.hasStatements(coPiRole) )> <#if (p.hasStatements(investigatorRole) || p.hasStatements(piRole) || p.hasStatements(coPiRole))>
<#assign isInvestigator = true /> <#assign isInvestigator = true />
<#else> <#else>
<#assign isInvestigator = false /> <#assign isInvestigator = false />
</#if> </#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 --> <#assign coAuthorIcon = '${urls.images}/visualization/co_author_icon.png'>
<#-- <#if individual.visualizationUrl??> --> <#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)> <#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">&nbsp;</div> <section id="visualization-container" role="region">
<div id="coauthorship_link_container" class="collaboratorship-link-container"> <#if isAuthor>
<div class="collaboratorship-icon">
<a href="${coAuthorURL}"><img src="${coAuthorIcon}" alt="Co-author Network icon" width="30px" height="30px" /></a> <img class="infoIcon" src="${informationIcon}" alt="information icon." title="The publication and grant information may be incomplete." width="20px" height="21px" />
</div>
<div class="collaboratorship-link"><a href="${coAuthorURL}">Co-Author Network</a></div> <div id="vis_container_coauthor">&nbsp;</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>
<div class="collaboratorship-link"><a href="${coAuthorURL}">Co-Author Network</a></div>
</div>
<div id="coinvestigator_link_container" class="collaboratorship-link-container"> ${scripts.add(googleJSAPI)}
<div class="collaboratorship-icon"> ${scripts.add(visualizationHelperJavaScript)}
<a href="${coInvestigatorURL}"><img src="${coInvestigatorIcon}" alt="Co-investigator Network icon" width="30px" height="30px" /></a> ${scripts.add("/js/visualization/sparkline.js")}
</div>
<div class="collaboratorship-link"><a href="${coInvestigatorURL}">Co-Investigator Network</a></div> <#-- 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>
<div class="collaboratorship-link"><a href="${coInvestigatorURL}">Co-Investigator Network</a></div>
</div>
${stylesheets.add("css/visualization/visualization.css")} </#if>
${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 --> </section>
<script type="text/javascript">
var visualizationUrl = '${individual.visualizationUrl}';
$(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> </#if>

2
productMods/templates/freemarker/visualization/personlevel/coAuthorPersonLevel.ftl
View file

@ -97,7 +97,7 @@ $(document).ready(function(){
show on that page. show on that page.
*/ */
if (data.numOfGrants !== undefined && data.numOfGrants > 0) { if (data.numOfGrants !== undefined && data.numOfGrants > 0) {
$("#coinvestigator_link_container").show(); $(".toggle_visualization").show();
} }
} }

2
productMods/templates/freemarker/visualization/personlevel/coPIPersonLevel.ftl
View file

@ -96,7 +96,7 @@ $(document).ready(function(){
show on that page. show on that page.
*/ */
if (data.numOfPublications !== undefined && data.numOfPublications > 0) { if (data.numOfPublications !== undefined && data.numOfPublications > 0) {
$("#coauthorship_link_container").show(); $(".toggle_visualization").show();
} }
} }