Examples

Web page with images

Let’s say you want to make a web page that displays images for all records with the word 'pelagic' in their text. Below is a script that will do the work:


var url = "v1/records?communities=biosyslit&type=image&summary=false&images=true&q=nymphalidae&size=30";

var x = new XMLHttpRequest();

x.onload = function(event) {
    if (x.readyState === 4) {
        if (x.status === 200) {
            var res = JSON.parse(x.responseText);
            var html = "";
            for (var record in res) {
                html += "<figure>";
                var images = res[record];
                var j = images.length;
                for (var i = 0; i < j; i++) {
                    html += `<img src='${images[i]}'>`;
                }

                html += `<figcaption>
                    rec ID: <a href='https://zenodo.org/record/${record.split('/').pop()} target='_blank'>
                        ${record.split('/').pop()}</a>
                    </figcaption>
                </figure>`;
            }
            var imageDiv = document.getElementById('images');
            imageDiv.innerHTML = html;
            
            event.preventDefault();
            event.stopPropagation();
            return false;
        }
    }
};

x.onerror = function(e) {
    console.error(x.statusText);
};

x.open("GET", url, true);
x.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
x.send();