Skip to content

Commit 816bfd7

Browse files
namedgraphnamedgraph
committed
View mode tabs replaced with a dropdown
Improved mode rendering templates
1 parent b385d45 commit 816bfd7

4 files changed

Lines changed: 83 additions & 167 deletions

File tree

‎src/main/webapp/static/com/atomgraph/linkeddatahub/css/bootstrap.css‎

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/main/webapp/static/com/atomgraph/linkeddatahub/xsl/bootstrap/2.3.2/client/block/view.xsl‎

Lines changed: 47 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -441,83 +441,46 @@ exclude-result-prefixes="#all"
441441
</xsl:if>
442442
</xsl:template>
443443

444-
<!-- view mode tabs -->
445-
446-
<xsl:template name="bs2:ViewModeTabs">
447-
<xsl:param name="active-mode" as="xs:anyURI"/>
448-
449-
<ul class="nav nav-tabs view-mode-nav-tabs">
450-
<li class="read-mode">
451-
<xsl:if test="$active-mode = '&ac;ReadMode'">
452-
<xsl:attribute name="class" select="'read-mode active'"/>
453-
</xsl:if>
444+
<!-- view mode dropdown -->
454445

455-
<a>
456-
<xsl:apply-templates select="key('resources', '&ac;ReadMode', document(ac:document-uri('&ac;')))" mode="ldh:logo"/>
457-
<xsl:apply-templates select="key('resources', '&ac;ReadMode', document(ac:document-uri('&ac;')))" mode="ac:label"/>
458-
</a>
459-
</li>
460-
<li class="list-mode">
461-
<xsl:if test="$active-mode = '&ac;ListMode'">
462-
<xsl:attribute name="class" select="'list-mode active'"/>
463-
</xsl:if>
464-
465-
<a>
466-
<xsl:apply-templates select="key('resources', '&ac;ListMode', document(ac:document-uri('&ac;')))" mode="ldh:logo"/>
467-
<xsl:apply-templates select="key('resources', '&ac;ListMode', document(ac:document-uri('&ac;')))" mode="ac:label"/>
468-
</a>
469-
</li>
470-
<li class="table-mode">
471-
<xsl:if test="$active-mode = '&ac;TableMode'">
472-
<xsl:attribute name="class" select="'table-mode active'"/>
473-
</xsl:if>
446+
<xsl:template name="bs2:ViewModeList">
447+
<xsl:param name="active-mode" as="xs:anyURI"/>
448+
<xsl:param name="id" select="'view-modes'" as="xs:string?"/>
449+
<xsl:param name="mode-button-classes" as="map(xs:string, xs:string)">
450+
<xsl:map>
451+
<xsl:map-entry key="'&ac;ReadMode'" select="'btn-read'"/>
452+
<xsl:map-entry key="'&ac;ListMode'" select="'btn-list'"/>
453+
<xsl:map-entry key="'&ac;TableMode'" select="'btn-table'"/>
454+
<xsl:map-entry key="'&ac;GridMode'" select="'btn-grid'"/>
455+
<xsl:map-entry key="'&ac;ChartMode'" select="'btn-chart'"/>
456+
<xsl:map-entry key="'&ac;MapMode'" select="'btn-map'"/>
457+
<xsl:map-entry key="'&ac;GraphMode'" select="'btn-graph'"/>
458+
</xsl:map>
459+
</xsl:param>
474460

475-
<a>
476-
<xsl:apply-templates select="key('resources', '&ac;TableMode', document(ac:document-uri('&ac;')))" mode="ldh:logo"/>
477-
<xsl:apply-templates select="key('resources', '&ac;TableMode', document(ac:document-uri('&ac;')))" mode="ac:label"/>
478-
</a>
479-
</li>
480-
<li class="grid-mode">
481-
<xsl:if test="$active-mode = '&ac;GridMode'">
482-
<xsl:attribute name="class" select="'grid-mode active'"/>
461+
<div class="btn-group pull-right">
462+
<button type="button" title="{ac:label(key('resources', '&ac;Mode', document(ac:document-uri('&ac;'))))}">
463+
<xsl:if test="$id">
464+
<xsl:attribute name="id" select="$id"/>
483465
</xsl:if>
484466

485-
<a>
486-
<xsl:apply-templates select="key('resources', '&ac;GridMode', document(ac:document-uri('&ac;')))" mode="ldh:logo"/>
487-
<xsl:apply-templates select="key('resources', '&ac;GridMode', document(ac:document-uri('&ac;')))" mode="ac:label"/>
488-
</a>
489-
</li>
490-
<li class="chart-mode">
491-
<xsl:if test="$active-mode = '&ac;ChartMode'">
492-
<xsl:attribute name="class" select="'chart-mode active'"/>
493-
</xsl:if>
467+
<xsl:attribute name="class" select="'btn dropdown-toggle ' || (map:get($mode-button-classes, string($active-mode)), 'btn-read')[1]"/>
494468

495-
<a>
496-
<xsl:apply-templates select="key('resources', '&ac;ChartMode', document(ac:document-uri('&ac;')))" mode="ldh:logo"/>
497-
<xsl:apply-templates select="key('resources', '&ac;ChartMode', document(ac:document-uri('&ac;')))" mode="ac:label"/>
498-
</a>
499-
</li>
500-
<li class="map-mode">
501-
<xsl:if test="$active-mode = '&ac;MapMode'">
502-
<xsl:attribute name="class" select="'map-mode active'"/>
503-
</xsl:if>
469+
<xsl:text> </xsl:text>
470+
<span class="caret"></span>
471+
</button>
504472

505-
<a>
506-
<xsl:apply-templates select="key('resources', '&ac;MapMode', document(ac:document-uri('&ac;')))" mode="ldh:logo"/>
507-
<xsl:apply-templates select="key('resources', '&ac;MapMode', document(ac:document-uri('&ac;')))" mode="ac:label"/>
508-
</a>
509-
</li>
510-
<li class="graph-mode">
511-
<xsl:if test="$active-mode = '&ac;GraphMode'">
512-
<xsl:attribute name="class" select="'graph-mode active'"/>
513-
</xsl:if>
514-
515-
<a>
516-
<xsl:apply-templates select="key('resources', '&ac;GraphMode', document(ac:document-uri('&ac;')))" mode="ldh:logo"/>
517-
<xsl:apply-templates select="key('resources', '&ac;GraphMode', document(ac:document-uri('&ac;')))" mode="ac:label"/>
518-
</a>
519-
</li>
520-
</ul>
473+
<ul class="dropdown-menu view-mode-list">
474+
<xsl:for-each select="('&ac;ReadMode', '&ac;ListMode', '&ac;TableMode', '&ac;GridMode', '&ac;ChartMode', '&ac;MapMode', '&ac;GraphMode')">
475+
<xsl:for-each select="key('resources', ., document(ac:document-uri('&ac;')))">
476+
<xsl:apply-templates select="." mode="bs2:ModeListItem">
477+
<xsl:with-param name="active" select="@rdf:about = $active-mode"/>
478+
<xsl:with-param name="href" select="()"/>
479+
</xsl:apply-templates>
480+
</xsl:for-each>
481+
</xsl:for-each>
482+
</ul>
483+
</div>
521484
</xsl:template>
522485

523486
<!-- render view -->
@@ -748,6 +711,10 @@ exclude-result-prefixes="#all"
748711
<xsl:value-of select="$container/descendant::*[@property = '&dct;title']"/>
749712
</h2>
750713

714+
<xsl:call-template name="bs2:ViewModeList">
715+
<xsl:with-param name="active-mode" select="$active-mode"/>
716+
</xsl:call-template>
717+
751718
<div class="pull-right">
752719
<form class="form-inline">
753720
<label for="{$order-by-container-id}">
@@ -790,10 +757,6 @@ exclude-result-prefixes="#all"
790757
<div>
791758
<p id="{$result-count-container-id}" class="result-count"/>
792759

793-
<xsl:call-template name="bs2:ViewModeTabs">
794-
<xsl:with-param name="active-mode" select="$active-mode"/>
795-
</xsl:call-template>
796-
797760
<div id="{$container-results-id}" class="container-results"></div>
798761
</div>
799762
</xsl:result-document>
@@ -1146,9 +1109,9 @@ exclude-result-prefixes="#all"
11461109

11471110
<!-- EVENT LISTENERS -->
11481111

1149-
<!-- view mode tabs -->
1150-
1151-
<xsl:template match="*[@typeof]//div/ul[contains-token(@class, 'view-mode-nav-tabs')]/li[not(contains-token(@class, 'active'))]/a" mode="ixsl:onclick">
1112+
<!-- view mode dropdown -->
1113+
1114+
<xsl:template match="*[@typeof]//ul[contains-token(@class, 'view-mode-list')]/li[not(contains-token(@class, 'active'))]/a" mode="ixsl:onclick">
11521115
<xsl:variable name="block" select="ancestor::div[contains-token(@class, 'block')][1]" as="element()"/>
11531116
<xsl:variable name="block-uri" select="xs:anyURI($block/@about)" as="xs:anyURI"/>
11541117
<xsl:variable name="container" select="ancestor::div[@typeof][1]" as="element()"/>
@@ -1203,7 +1166,7 @@ exclude-result-prefixes="#all"
12031166
<xsl:variable name="block" select="ancestor::div[contains-token(@class, 'block')][1]" as="element()"/>
12041167
<xsl:variable name="container" select="ancestor::div[@typeof][1]" as="element()"/>
12051168
<xsl:variable name="block-uri" select="xs:anyURI($block/@about)" as="xs:anyURI"/>
1206-
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-nav-tabs')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
1169+
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-list')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
12071170
<xsl:variable name="active-mode" select="map:get($class-modes, $active-class)" as="xs:anyURI"/>
12081171
<xsl:variable name="select-string" select="ixsl:get(ixsl:get(ixsl:get(ixsl:window(), 'LinkedDataHub.contents'), '`' || $block-uri || '`'), 'select-query')" as="xs:string"/>
12091172
<xsl:variable name="select-xml" select="ixsl:get(ixsl:get(ixsl:get(ixsl:window(), 'LinkedDataHub.contents'), '`' || $block-uri || '`'), 'select-xml')" as="document-node()"/>
@@ -1253,7 +1216,7 @@ exclude-result-prefixes="#all"
12531216
<xsl:variable name="block" select="ancestor::div[contains-token(@class, 'block')][1]" as="element()"/>
12541217
<xsl:variable name="container" select="ancestor::div[@typeof][1]" as="element()"/>
12551218
<xsl:variable name="block-uri" select="xs:anyURI($block/@about)" as="xs:anyURI"/>
1256-
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-nav-tabs')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
1219+
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-list')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
12571220
<xsl:variable name="active-mode" select="map:get($class-modes, $active-class)" as="xs:anyURI"/>
12581221
<xsl:variable name="select-string" select="ixsl:get(ixsl:get(ixsl:get(ixsl:window(), 'LinkedDataHub.contents'), '`' || $block-uri || '`'), 'select-query')" as="xs:string"/>
12591222
<xsl:variable name="select-xml" select="ixsl:get(ixsl:get(ixsl:get(ixsl:window(), 'LinkedDataHub.contents'), '`' || $block-uri || '`'), 'select-xml')" as="document-node()"/>
@@ -1302,7 +1265,7 @@ exclude-result-prefixes="#all"
13021265
<xsl:variable name="block" select="ancestor::div[contains-token(@class, 'block')][1]" as="element()"/>
13031266
<xsl:variable name="container" select="ancestor::div[@typeof][1]" as="element()"/>
13041267
<xsl:variable name="block-uri" select="xs:anyURI($block/@about)" as="xs:anyURI"/>
1305-
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-nav-tabs')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
1268+
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-list')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
13061269
<xsl:variable name="active-mode" select="map:get($class-modes, $active-class)" as="xs:anyURI"/>
13071270
<xsl:variable name="predicate" select="ixsl:get(., 'value')" as="xs:anyURI?"/>
13081271
<xsl:variable name="select-string" select="ixsl:get(ixsl:get(ixsl:get(ixsl:window(), 'LinkedDataHub.contents'), '`' || $block-uri || '`'), 'select-query')" as="xs:string"/>
@@ -1352,7 +1315,7 @@ exclude-result-prefixes="#all"
13521315
<xsl:variable name="block" select="ancestor::div[contains-token(@class, 'block')][1]" as="element()"/>
13531316
<xsl:variable name="container" select="ancestor::div[@typeof][1]" as="element()"/>
13541317
<xsl:variable name="block-uri" select="xs:anyURI($block/@about)" as="xs:anyURI"/>
1355-
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-nav-tabs')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
1318+
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-list')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
13561319
<xsl:variable name="active-mode" select="map:get($class-modes, $active-class)" as="xs:anyURI"/>
13571320
<xsl:variable name="desc" select="contains(@class, 'btn-order-by-desc')" as="xs:boolean"/>
13581321
<xsl:variable name="select-string" select="ixsl:get(ixsl:get(ixsl:get(ixsl:window(), 'LinkedDataHub.contents'), '`' || $block-uri || '`'), 'select-query')" as="xs:string"/>
@@ -1498,7 +1461,7 @@ exclude-result-prefixes="#all"
14981461
<xsl:variable name="block" select="ancestor::div[contains-token(@class, 'block')][1]" as="element()"/>
14991462
<xsl:variable name="container" select="ancestor::div[@typeof][1]" as="element()"/>
15001463
<xsl:variable name="block-uri" select="xs:anyURI($block/@about)" as="xs:anyURI"/>
1501-
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-nav-tabs')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
1464+
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-list')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
15021465
<xsl:variable name="active-mode" select="map:get($class-modes, $active-class)" as="xs:anyURI"/>
15031466
<xsl:variable name="var-name" select="@name" as="xs:string"/>
15041467
<!-- collect the values/types/datatypes of all checked inputs within this facet and build an array of maps -->
@@ -1549,7 +1512,7 @@ exclude-result-prefixes="#all"
15491512
<xsl:variable name="block" select="ancestor::div[contains-token(@class, 'block')][1]" as="element()"/>
15501513
<xsl:variable name="container" select="ancestor::div[@typeof][1]" as="element()"/>
15511514
<xsl:variable name="block-uri" select="xs:anyURI($block/@about)" as="xs:anyURI"/>
1552-
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-nav-tabs')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
1515+
<xsl:variable name="active-class" select="tokenize($container//ul[contains-token(@class, 'view-mode-list')]/li[contains-token(@class, 'active')]/@class, ' ')[not(. = 'active')]" as="xs:string"/>
15531516
<xsl:variable name="active-mode" select="map:get($class-modes, $active-class)" as="xs:anyURI"/>
15541517
<xsl:variable name="predicate" select="input/@value" as="xs:anyURI"/>
15551518
<xsl:variable name="select-string" select="ixsl:get(ixsl:get(ixsl:get(ixsl:window(), 'LinkedDataHub.contents'), '`' || $block-uri || '`'), 'select-query')" as="xs:string"/>

0 commit comments

Comments
 (0)