nikola/data/themes/base/assets/js/gallery.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

function renderGallery(jsonContent, thumbnailSize) {
    var container = document.getElementById("gallery_container");
    container.innerHTML = '';
    var layoutGeometry = require('justified-layout')(jsonContent, {
    "containerWidth": container.offsetWidth,
    "targetRowHeight": thumbnailSize * 0.6,
    "boxSpacing": 5});
    container.style.height = layoutGeometry.containerHeight + 'px';
    var boxes = layoutGeometry.boxes;
    for (var i = 0; i < boxes.length; i++) {
        var img = document.createElement("img");
        img.setAttribute('src', jsonContent[i].url_thumb);
        img.setAttribute('alt', jsonContent[i].title);
        img.style.width = boxes[i].width + 'px';
        img.style.height = boxes[i].height + 'px';
        link = document.createElement("a");
        link.setAttribute('href', jsonContent[i].url);
        link.setAttribute('class', 'image-reference');
        div = document.createElement("div");
        div.setAttribute('class', 'image-block');
        div.setAttribute('title', jsonContent[i].title);
        div.setAttribute('data-toggle', "tooltip")
        div.style.width = boxes[i].width + 'px';
        div.style.height = boxes[i].height + 'px';
        div.style.top = boxes[i].top + 'px';
        div.style.left = boxes[i].left + 'px';
        link.appendChild(img);
        div.appendChild(link);
        container.appendChild(div);
    }
}