nonlinear slider

This commit is contained in:
JeLuF 2023-08-14 01:47:24 +02:00
parent 6941c30cbe
commit 33f4f63068
2 changed files with 5 additions and 3 deletions

View File

@ -524,7 +524,7 @@
<input id="gallery-model-search" type="text" onkeydown="gallery_keyDown_handler(event)" placeholder="Search for a model..."></input>
<label for="gallery-page">Page:</label>
<input id="gallery-page" name="Page" value="0" size="1" onkeypress="gallery_keyDown_handler(event)">
<input id="gallery-thumbnail-size" name="gallery-thumbnail-size" class="editor-slider" type="range" value="300" min="50" max="800">
<input id="gallery-thumbnail-size" name="gallery-thumbnail-size" class="editor-slider" type="range" value="5.5" min="3" max="20" step="0.05">
<button class="primaryButton" id="gallery-refresh" onclick="refreshGallery(true)">Load</button>
<button class="primaryButton" onclick="incrementGalleryPage()"><i class="fa-solid fa-arrow-right"></i></button>
</div>

View File

@ -3244,13 +3244,15 @@ window.addEventListener("resize", layoutGallery)
function layoutGallery() {
let container = document.getElementById("imagecontainer")
let thumbSize = parseInt(galleryThumbnailSize.value)
let thumbSize = parseFloat(galleryThumbnailSize.value)
thumbSize = (10*thumbSize*thumbSize)>>>0
let root = document.querySelector(':root')
root.style.setProperty('--gallery-width', thumbSize + "px")
let msnry = new Masonry( container, {
gutter: 10,
itemSelector: '.gallery-image',
columnWidth: thumbSize
columnWidth: thumbSize,
fitWidth: true,
})
}