Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add minimize button to infowindow #2030

Open
wants to merge 8 commits into
base: master
Choose a base branch
from
+54 −0
Open

Add minimize button to infowindow #2030

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
4586b2a
Update _infowindow.scss
huggla Jun 19, 2024
420e239
Update infowindow.js
huggla Jun 19, 2024
e7f1b1d
Update infowindow.js
huggla Jun 25, 2024
ec02229
Update infowindow.js
huggla Jun 25, 2024
12f848d
Update infowindow.js
huggla Jul 2, 2024
4affbbf
Update infowindow.js
huggla Jul 2, 2024
22c45fe
Update infowindow.js
huggla Jul 2, 2024
4df67e9
Update infowindow.js
huggla Aug 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions scss/_infowindow.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,13 @@
top: 0;
}

.minimizebutton-svg-container {
cursor: pointer;
position: absolute;
right: 30px;
top: 0;
}


/**
* ============ List ==============
Expand Down
47 changes: 47 additions & 0 deletions src/infowindow.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,6 +109,44 @@ function createCloseButton() {
});
}

function createMinimizeButton() {
return Button({
cls: 'minimizebutton-svg-container small round small icon-smaller grey-lightest margin-top-small margin-right-small z-index-ontop-low ',
icon: '#ic_close_fullscreen_24px',
state: 'initial',
validStates: ['initial', 'hidden'],
ariaLabel: 'Minimera'
});
}

function resetInfowindow() {
const minimizeButtonUse = urvalContainer.querySelector('[aria-label="Minimera"]').querySelector('use');
urvalListContainer.style.display = null;
mainContainer.style.width = null;
urvalContainer.style.padding = null;
listContainer.style.display = null;
exportContainer.style.display = null;
minimizeButtonUse.setAttribute('xlink:href', '#ic_close_fullscreen_24px');
}

function minimizeInfowindow() {
const minimizeButtonUse = urvalContainer.querySelector('[aria-label="Minimera"]').querySelector('use');
urvalListContainer.style.display = 'none';
mainContainer.style.width = 'fit-content';
urvalContainer.style.padding = '0.5rem calc(38px + 2rem) 0 0.5rem';
listContainer.style.display = 'none';
exportContainer.style.display = 'none';
minimizeButtonUse.setAttribute('xlink:href', '#ic_open_in_full_24px');
}

function toggleInfowindow() {
if (urvalListContainer.style.display === 'none') {
resetInfowindow();
} else {
minimizeInfowindow();
}
}

function render(viewerId) {
mainContainer = document.createElement('div');
setInfowindowStyle();
Expand All @@ -126,6 +164,8 @@ function render(viewerId) {
urvalTextNodeContainer.appendChild(urvalTextNode);
urvalContainer.appendChild(urvalTextNodeContainer);
const closeButton = createCloseButton();
const minimizeButton = createMinimizeButton();
urvalContainer.appendChild(dom.html(minimizeButton.render()));
urvalContainer.appendChild(dom.html(closeButton.render()));
urvalContainer.appendChild(urvalListContainer);
listContainer = document.createElement('div');
Expand Down Expand Up @@ -157,6 +197,13 @@ function render(viewerId) {
viewer.dispatch('toggleClickInteraction', detail);
selectionManager.clearSelection();
hideInfowindow();
if (urvalListContainer.style.display === 'none') {
resetInfowindow();
}
});

document.getElementById(minimizeButton.getId()).addEventListener('click', () => {
toggleInfowindow();
});

// Make the DIV element draggagle:
Expand Down
Loading