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

Added user modal settings

Browse source
This commit is contained in:
Georgy Litvinov 2021-04-26 12:35:06 +02:00
parent d5721d1d48
commit 0db7f7906a
6 changed files with 91 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
webapp/src/main/webapp/themes/iph/css/iph.css
View file

@ -3398,6 +3398,32 @@ label.switch >.collapseTextControl >img {
padding-left: 4px;
padding-right: 12px;
}
/* Modal windows */
#userSettingsModal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
/* Modal Content */
.modal-content {
background-color: #fefefe;
margin: auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
}
/* -------------------------------------------------> */
/* FONTS --------------------------------> */
/* -------------------------------------------------> */

62
webapp/src/main/webapp/themes/iph/js/collapsible_elements.js
View file

@ -1,21 +1,37 @@
document.addEventListener('DOMContentLoaded', addCollapsibleOnClick(), false);
document.addEventListener('DOMContentLoaded', applyExpandSettings(), false);
document.addEventListener('DOMContentLoaded', hideUserSettingsModal(), false);
function showUserSettingsModal() {
var modalElement = document.getElementById("userSettingsModal");
if (modalElement != null) {
modalElement.style.display = 'block';
}
}
function hideUserSettingsModal() {
window.onclick = function(event) {
var modalElement = document.getElementById("userSettingsModal");
if (event.target == modalElement) {
modalElement.style.display = 'none';
}
}
}
function addCollapsibleOnClick() {
var coll = document.getElementsByClassName("collapsible");
var i;
for (i = 0; i < coll.length; i++) {
var collapsibleLink = coll[i].querySelector('.collapsibleLink');
if (collapsibleLink === null){
collapseNextElementOnClick(coll[i]);
var collapsibleLink = coll[i].querySelector('.collapsibleLink');
if (collapsibleLink === null) {
collapseNextElementOnClick(coll[i]);
} else {
expandableNextOuterElementOnClick(collapsibleLink);
expandableNextOuterElementOnClick(collapsibleLink);
}
}
}
function expandableNextOuterElementOnClick(element){
function expandableNextOuterElementOnClick(element) {
element.addEventListener("click", function() {
this.parentElement.classList.toggle("expanded");
this.parentElement.classList.toggle("collapsed");
@ -28,7 +44,7 @@ function expandableNextOuterElementOnClick(element){
});
}
function collapseNextElementOnClick(element){
function collapseNextElementOnClick(element) {
element.addEventListener("click", function() {
this.classList.toggle("active");
var content = this.nextElementSibling;
@ -41,19 +57,19 @@ function collapseNextElementOnClick(element){
}
function applyExpandSettings() {
applyDocumentExpandSettings('switchExpand','expandCB','expandSettingsCB','.autoExpand');
applyDocumentExpandSettings('metadataExpandSetting','metadataExpandCB','metadataExpandSettingCB','.autoMetadataExpand');
applyDocumentExpandSettings('switchExpand', 'expandCB', 'expandSettingsCB', '.autoExpand');
applyDocumentExpandSettings('metadataExpandSetting', 'metadataExpandCB', 'metadataExpandSettingCB', '.autoMetadataExpand');
}
function applyDocumentExpandSettings(settingName,buttonId,settingButtonId,targetElementsClass){
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;
if (expandSwitchCB != null) {
expandSwitchCB.checked = true;
}
var expandSwitchSettingsCB = document.getElementById(settingButtonId);
if ( expandSwitchSettingsCB != null ){
expandSwitchSettingsCB.checked = true;
if (expandSwitchSettingsCB != null) {
expandSwitchSettingsCB.checked = true;
}
$(targetElementsClass).show();
showDocumentCollapseButton(buttonId);
@ -63,7 +79,7 @@ function applyDocumentExpandSettings(settingName,buttonId,settingButtonId,target
}
}
function switchExpand(inputID,elementsClass) {
function switchExpand(inputID, elementsClass) {
var checkBox = document.getElementById(inputID);
if (checkBox.checked == true) {
$(elementsClass).show();
@ -73,9 +89,9 @@ function switchExpand(inputID,elementsClass) {
showDocumentExpandButton(inputID);
}
}
function showDocumentCollapseButton(inputID){
function showDocumentCollapseButton(inputID) {
var inputElement = document.getElementById(inputID);
if (inputElement === null){
if (inputElement === null) {
return;
}
var collapseTextControl = inputElement.parentElement.querySelector('.collapseTextControl');
@ -84,9 +100,9 @@ function showDocumentCollapseButton(inputID){
expandTextControl.style.display = "none";
}
function showDocumentExpandButton(inputID){
function showDocumentExpandButton(inputID) {
var inputElement = document.getElementById(inputID);
if (inputElement === null){
if (inputElement === null) {
return;
}
var collapseTextControl = inputElement.parentElement.querySelector('.collapseTextControl');
@ -95,11 +111,11 @@ function showDocumentExpandButton(inputID){
expandTextControl.style.display = "inline";
}
function switchExpandSettings() {
var checkBox = document.getElementById("expandSettingsCB");
function switchExpandSettings(checkboxID, settingName) {
var checkBox = document.getElementById(checkboxID);
if (checkBox.checked == true) {
localStorage.setItem('switchExpand', true);
localStorage.setItem(settingName, true);
} else {
localStorage.setItem('switchExpand', false);
localStorage.setItem(settingName, false);
}
}

1
webapp/src/main/webapp/themes/iph/templates/compilation.ftl
View file

@ -84,6 +84,7 @@ ${scripts.add('<script type="text/javascript" src="${urls.base}/themes/iph/js/to
<#if editable && profilePageTypesEnabled >
<#include "individual-profilePageTypes.ftl">
</#if>
<@userSettingsModal />
<button id="print"><img onclick="javascript:printPageContent();" src="${urls.base}/themes/iph/images/print.svg"></button>
</div>
<@expandSwitch />

2
webapp/src/main/webapp/themes/iph/templates/elenphAritcle.ftl
View file

@ -84,6 +84,8 @@ ${scripts.add('<script type="text/javascript" src="${urls.base}/themes/iph/js/to
<#if editable && profilePageTypesEnabled >
<#include "individual-profilePageTypes.ftl">
</#if>
<@userSettingsModal />
<button id="print"><img onclick="javascript:printPageContent();" src="${urls.base}/themes/iph/images/print.svg"></button>
</div>
<@expandSwitch />

1
webapp/src/main/webapp/themes/iph/templates/elenphExcerpt.ftl
View file

@ -84,6 +84,7 @@ ${scripts.add('<script type="text/javascript" src="${urls.base}/themes/iph/js/to
<#if editable && profilePageTypesEnabled >
<#include "individual-profilePageTypes.ftl">
</#if>
<@userSettingsModal />
<button id="print"><img onclick="javascript:printPageContent();" src="${urls.base}/themes/iph/images/print.svg"></button>
</div>
</div>

22
webapp/src/main/webapp/themes/iph/templates/text-lib.ftl
View file

@ -234,3 +234,25 @@
</label>
</div>
</#macro>
<#macro userSettingsModal>
<button id="userViewSettings">
<img onclick="javascript:showUserSettingsModal();" src="${urls.base}/themes/iph/images/print.svg">
</button>
<div id="userSettingsModal" class="modal" style="display:none;">
<div class="modal-content">
<label>
<div>раскрывать документ</div>
<input id="expandSettingsCB" type="checkbox" onclick="switchExpandSettings('expandSettingsCB','switchExpand');">
</label>
<label>
<div>раскрывать метаданные</div>
<input id="metadataExpandSettingsCB" type="checkbox" onclick="switchExpandSettings('metadataExpandSettingsCB','metadataExpandSetting');">
</label>
</div>
</div>
</#macro>