NIHVIVO-592 Class group browse for home page. Still waiting on update to JSONServlet (NIHVIVO-1674) so classes in class group can be returned for AJAX requests. Introducing alternative bar graph in lieu of pie chart.
This commit is contained in:
parent
9f3a4343d2
commit
2be51ef25c
7 changed files with 795 additions and 28 deletions
|
@ -1,16 +1,14 @@
|
|||
<#-- $This file is distributed under the terms of the license in /doc/license.txt$ -->
|
||||
|
||||
<#-- Browse classgroups on the home page. Could potentially become a widget -->
|
||||
<#-- Browse class groups on the home page. Could potentially become a widget -->
|
||||
|
||||
<@allClassGroups />
|
||||
${stylesheets.add("/css/browseClassGroups.css")}
|
||||
|
||||
<#macro allClassGroups>
|
||||
<section id="browse" role="region">
|
||||
<h4>Browse by</h4>
|
||||
|
||||
<ul id="browse-classgroups" role="list">
|
||||
<#assign selected = 'class="selected" ' />
|
||||
<#list vClassGroups as group>
|
||||
<#macro allClassGroups classGroups>
|
||||
<#-- Loop through classGroups first so we can account for situations when all class groups are empty -->
|
||||
<#assign selected = 'class="selected" ' />
|
||||
<#assign classGroupList>
|
||||
<#list classGroups as group>
|
||||
<#-- Only display populated class groups -->
|
||||
<#if (group.individualCount > 0)>
|
||||
<#-- Catch the first populated class group. Will be used later as the default selected class group -->
|
||||
|
@ -30,28 +28,71 @@
|
|||
<#elseif classGroup.uri == group.uri>
|
||||
<#assign activeGroup = selected />
|
||||
</#if>
|
||||
<li role="listitem"><a ${activeGroup}href="${urls.base}/${currentPage}?classgroupUri=${group.uri?url}#browse">${group.publicName?capitalize} <span class="count-classes">(${group.individualCount})</span></a></li>
|
||||
<li role="listitem"><a data-uri="${group.uri}" ${activeGroup}href="${urls.base}/${currentPage}?classgroupUri=${group.uri?url}#browse">${group.publicName?capitalize} <span class="count-classes">(${group.individualCount})</span></a></li>
|
||||
</#if>
|
||||
</#list>
|
||||
</ul>
|
||||
</#assign>
|
||||
|
||||
<#-- Display the class group browse only if we have at least one populated class group -->
|
||||
<#if firstPopulatedClassGroup??>
|
||||
<section id="browse" role="region">
|
||||
<h4>Browse by</h4>
|
||||
|
||||
<ul id="browse-classgroups" role="list">
|
||||
${classGroupList}
|
||||
</ul>
|
||||
|
||||
<#-- If requesting the home page without any additional URL parameters, select the first populated class group-->
|
||||
<#assign defaultSelectedClassGroup = firstPopulatedClassGroup! />
|
||||
|
||||
<section id="browse-classes" role="navigation">
|
||||
<nav>
|
||||
<ul id="classgroup-list" class="vis" role="list">
|
||||
<#if classes??>
|
||||
<#-- We don't need to send parameters because the data we need is delivered as template variables -->
|
||||
<@classesInClassgroup />
|
||||
<#else>
|
||||
<#-- We need to pass the data to the macro because the only template variable provided by default is classGroups -->
|
||||
<@classesInClassgroup classes=defaultSelectedClassGroup.classes classGroup=defaultSelectedClassGroup />
|
||||
</#if>
|
||||
</ul>
|
||||
</nav>
|
||||
<#if classes??>
|
||||
<#-- We don't need to send parameters because the data we need is delivered as template variables -->
|
||||
<@visualGraph />
|
||||
<#else>
|
||||
<#-- We need to pass the data to the macro because the only template variable provided by default is classGroups -->
|
||||
<@visualGraph classes=defaultSelectedClassGroup.classes classGroup=defaultSelectedClassGroup />
|
||||
</#if>
|
||||
</section> <!-- #browse-classes -->
|
||||
</section> <!-- #browse -->
|
||||
<#else>
|
||||
<#-- Would be nice to update classgroups-checkForData.ftl with macro so it could be used here as well -->
|
||||
<#-- <#include "classgroups-checkForData.ftl"> -->
|
||||
<h3>There is currently no content in the system</h3>
|
||||
|
||||
<#-- If requesting the home page without any additional URL parameters, select the first populated class group-->
|
||||
<#assign defaultSelectedClassGroup = firstPopulatedClassGroup />
|
||||
|
||||
<section id="browse-classes" role="navigation">
|
||||
<nav>
|
||||
<ul id="classgroup-list" role="list">
|
||||
<#if classes??>
|
||||
<#-- We don't need to send parameters because the data we need is delivered as template variables -->
|
||||
<@classesInClassgroup />
|
||||
<#else>
|
||||
<#-- We need to pass the data to the macro because the only template variable provided by default is vClassGroups -->
|
||||
<@classesInClassgroup classes=defaultSelectedClassGroup.classes classGroup=defaultSelectedClassGroup />
|
||||
</#if>
|
||||
</ul>
|
||||
</nav>
|
||||
</section> <!-- #browse-classes -->
|
||||
</section> <!-- #browse -->
|
||||
<#if !user.loggedIn>
|
||||
<p>Please <a href="${urls.login}" title="log in to manage this site">log in</a> to manage content.</p>
|
||||
</#if>
|
||||
</#if>
|
||||
|
||||
<#----------------------------------------------------------------------------------
|
||||
requestedPage is currently provided by FreemarkerHttpServlet. Should this be moved
|
||||
to PageController? Maybe we should have Java provide the domain name directly
|
||||
instead of the full URL of the requested page? Chintan was also asking for a
|
||||
template variable with the domain name for an AJAX request with visualizations.
|
||||
------------------------------------------------------------------------------------>
|
||||
<#assign domainName = requestedPage?substring(0, requestedPage?index_of("/", 7)) />
|
||||
|
||||
<script type="text/javascript">
|
||||
var browseData = {
|
||||
baseUrl: '${domainName + urls.base}',
|
||||
dataServiceUrl: '${domainName + urls.base}/dataservice?getLuceneIndividualsByVClass=1&vclassId=',
|
||||
defaultBrowseClassGroupUri: '${firstPopulatedClassGroup.uri}'
|
||||
};
|
||||
</script>
|
||||
|
||||
${scripts.add("/js/browseClassGroups.js")}
|
||||
</#macro>
|
||||
|
||||
<#macro classesInClassgroup classes=classes classGroup=classGroup>
|
||||
|
@ -60,4 +101,44 @@
|
|||
<li role="listitem"><a href="${urls.base}/individuallist?vclassId=${class.uri?url}">${class.name} <span class="count-individuals"> (${class.individualCount})</span></a></li>
|
||||
</#if>
|
||||
</#list>
|
||||
</#macro>
|
||||
|
||||
<#macro pieChart classes=classes classGroup=classGroup>
|
||||
<section id="visual-graph" role="region">
|
||||
<table>
|
||||
<#list classes?sort_by("individualCount") as class>
|
||||
<#assign countPercentage = (class.individualCount / classGroup.individualCount) * 100 />
|
||||
<#if (class.individualCount > 0 && countPercentage?round > 0)>
|
||||
<tr>
|
||||
<th>${class.name}</th>
|
||||
<td>${countPercentage?round}%</td>
|
||||
</tr>
|
||||
</#if>
|
||||
</#list>
|
||||
</table>
|
||||
|
||||
<section id="pieViz" role="region"></section>
|
||||
</section>
|
||||
|
||||
${scripts.add("/themes/wilma/js/jquery_plugins/raphael/raphael.js", "/themes/wilma/js/jquery_plugins/raphael/pie.js")}
|
||||
</#macro>
|
||||
|
||||
<#macro visualGraph classes=classes classGroup=classGroup>
|
||||
<section id="visual-graph" class="barchart" role="region">
|
||||
<table class="graph-data">
|
||||
<#list classes as class>
|
||||
<#if (class.individualCount > 0)>
|
||||
<tr>
|
||||
<th data-uri="${class.uri}">${class.name} (${class.individualCount})</th>
|
||||
<td>${class.individualCount}</td>
|
||||
</tr>
|
||||
</#if>
|
||||
</#list>
|
||||
</table>
|
||||
|
||||
<section id="pieViz" role="region"></section>
|
||||
</section>
|
||||
|
||||
<#-- ${scripts.add("/themes/wilma/js/jquery_plugins/raphael/raphael.js", "/themes/wilma/js/jquery_plugins/raphael/pie.js")} -->
|
||||
${scripts.add("/js/raphael/raphael.js", "/js/raphael/g.raphael.js", "/js/raphael/g.bar.js")}
|
||||
</#macro>
|
Loading…
Add table
Add a link
Reference in a new issue