Added collapsible metadata scripts
This commit is contained in:
parent
89e5911acc
commit
7c1d0457cf
4 changed files with 47 additions and 29 deletions
|
@ -3106,16 +3106,16 @@ label.switch {
|
|||
padding-left: 12px;
|
||||
padding-right: 12px;
|
||||
}
|
||||
#collapseTextControl:hover {
|
||||
.collapseTextControl:hover {
|
||||
color: #8B4513;
|
||||
}
|
||||
#expandTextControl:hover {
|
||||
.expandTextControl:hover {
|
||||
color: #8B4513;
|
||||
}
|
||||
label.switch >#expandTextControl >img {
|
||||
label.switch >.expandTextControl >img {
|
||||
padding-left: 6px;
|
||||
}
|
||||
label.switch >#collapseTextControl >img {
|
||||
label.switch >.collapseTextControl >img {
|
||||
padding-left: 6px;
|
||||
}
|
||||
.firstPub {
|
||||
|
@ -3615,4 +3615,4 @@ label.switch >#collapseTextControl >img {
|
|||
font-size: 0.8rem;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -41,44 +41,51 @@ function collapseNextElementOnClick(element){
|
|||
}
|
||||
|
||||
function applyExpandSettings() {
|
||||
if (localStorage.getItem('switchExpand') === true || localStorage.getItem('switchExpand') === 'true') {
|
||||
var expandSwitchCB = document.getElementById("expandCB");
|
||||
applyDocumentExpandSettings('switchExpand','expandCB','expandSettingsCB','.autoExpand');
|
||||
applyDocumentExpandSettings('metadataExpandSetting','metadataExpandCB','metadataExpandSettingCB','.autoMetadataExpand');
|
||||
}
|
||||
|
||||
function applyDocumentExpandSettings(settingName,buttonId,settingButtonId,targetElementsClass){
|
||||
if (localStorage.getItem(settingName) === true || localStorage.getItem(settingName) === 'true') {
|
||||
var expandSwitchCB = document.getElementById(buttonId);
|
||||
if ( expandSwitchCB != null ){
|
||||
expandSwitchCB.checked = true;
|
||||
}
|
||||
var expandSwitchSettingsCB = document.getElementById("expandSettingsCB");
|
||||
var expandSwitchSettingsCB = document.getElementById(settingButtonId);
|
||||
if ( expandSwitchSettingsCB != null ){
|
||||
expandSwitchSettingsCB.checked = true;
|
||||
}
|
||||
$('.autoExpand').show();
|
||||
showDocumentCollapseButton();
|
||||
$(targetElementsClass).show();
|
||||
showDocumentCollapseButton(buttonId);
|
||||
} else {
|
||||
$('.autoExpand').hide();
|
||||
showDocumentExpandButton();
|
||||
$(targetElementsClass).hide();
|
||||
showDocumentExpandButton(buttonId);
|
||||
}
|
||||
}
|
||||
|
||||
function switchExpand() {
|
||||
var checkBox = document.getElementById("expandCB");
|
||||
function switchExpand(inputID,elementsClass) {
|
||||
var checkBox = document.getElementById(inputID);
|
||||
if (checkBox.checked == true) {
|
||||
$('.autoExpand').show();
|
||||
showDocumentCollapseButton();
|
||||
$(elementsClass).show();
|
||||
showDocumentCollapseButton(inputID);
|
||||
} else {
|
||||
$('.autoExpand').hide();
|
||||
showDocumentExpandButton();
|
||||
$(elementsClass).hide();
|
||||
showDocumentExpandButton(inputID);
|
||||
}
|
||||
}
|
||||
function showDocumentCollapseButton(){
|
||||
var collapseTextControl = document.querySelector('#collapseTextControl');
|
||||
function showDocumentCollapseButton(inputID){
|
||||
var inputElement = document.getElementById(inputID);
|
||||
var collapseTextControl = inputElement.parentElement.querySelector('.collapseTextControl');
|
||||
collapseTextControl.style.display = "inline";
|
||||
var expandTextControl = document.querySelector('#expandTextControl');
|
||||
var expandTextControl = inputElement.parentElement.querySelector('.expandTextControl');
|
||||
expandTextControl.style.display = "none";
|
||||
}
|
||||
|
||||
function showDocumentExpandButton(){
|
||||
var collapseTextControl = document.querySelector('#collapseTextControl');
|
||||
function showDocumentExpandButton(inputID){
|
||||
var inputElement = document.getElementById(inputID);
|
||||
var collapseTextControl = inputElement.parentElement.querySelector('.collapseTextControl');
|
||||
collapseTextControl.style.display = "none";
|
||||
var expandTextControl = document.querySelector('#expandTextControl');
|
||||
var expandTextControl = inputElement.parentElement.querySelector('.expandTextControl');
|
||||
expandTextControl.style.display = "inline";
|
||||
}
|
||||
|
||||
|
|
|
@ -80,6 +80,7 @@ ${scripts.add('<script type="text/javascript" src="${urls.base}/themes/iph/js/to
|
|||
<button id="print"><img onclick="javascript:printPageContent();" src="${urls.base}/themes/iph/images/print.svg"></button>
|
||||
</div>
|
||||
<@expandSwitch />
|
||||
<@expandMetadataSwitch />
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
|
|
@ -162,7 +162,7 @@
|
|||
<div class="collapsible collapsed">
|
||||
<div class="collapsibleLink" style="display:inline;">Авторы:</div>
|
||||
</div>
|
||||
<div class="expandedAuthors" style="display:none;">
|
||||
<div class="expandedAuthors autoMetadataExpand" style="display:none;">
|
||||
<#list authors as author>
|
||||
<div class="affilation">
|
||||
<b><#if author.authorFamily??>${author.authorFamily} </#if><#if author.authorGivenName??>${author.authorGivenName}</#if></b>
|
||||
|
@ -199,12 +199,22 @@
|
|||
</div>
|
||||
</#macro>
|
||||
|
||||
<#macro expandMetadataSwitch>
|
||||
<div class="expandSwitch">
|
||||
<label class="switch">
|
||||
<div class="expandTextControl">Раскрыть метаданные<img src="${urls.base}/themes/iph/images/arrow-down.svg"/></div>
|
||||
<div class="collapseTextControl">Свернуть метаданные<img src="${urls.base}/themes/iph/images/arrow-top.svg"/></div>
|
||||
<input id="metadataExpandCB" type="checkbox" onclick="switchExpand('metadataExpandCB','.autoMetadataExpand');">
|
||||
</label>
|
||||
</div>
|
||||
</#macro>
|
||||
|
||||
<#macro expandSwitch>
|
||||
<div class="expandSwitch">
|
||||
<label class="switch">
|
||||
<div id="expandTextControl">Раскрыть документ<img src="${urls.base}/themes/iph/images/arrow-down.svg"/></div>
|
||||
<div id="collapseTextControl">Свернуть документ<img src="${urls.base}/themes/iph/images/arrow-top.svg"/></div>
|
||||
<input id="expandCB" type="checkbox" onclick="switchExpand();">
|
||||
<div class="expandTextControl">Раскрыть документ<img src="${urls.base}/themes/iph/images/arrow-down.svg"/></div>
|
||||
<div class="collapseTextControl">Свернуть документ<img src="${urls.base}/themes/iph/images/arrow-top.svg"/></div>
|
||||
<input id="expandCB" type="checkbox" onclick="switchExpand('expandCB','.autoExpand');">
|
||||
</label>
|
||||
</div>
|
||||
</#macro>
|
||||
</#macro>
|
||||
|
|
Loading…
Add table
Reference in a new issue