Exhibition view cluster II. Wallpaper, prints on paper, portrait animation loop (Galactic Ripple), print on textile.
Cluster I. Detail.
Cluster I.
Exhibition view cluster I. Wallpaper, prints on paper, portrait animation loop, cases.
Overview case, leporello, broken external hard disc, miniature hand axe 3d print in bronze
Karawan, leporello, unique, 2017
Exhibition view cluster I. Wallpaper, prints on paper, portrait animation loop
// script.js
document.addEventListener("DOMContentLoaded", function() {
// Check if the body has the specific page class
if (document.body.classList.contains('page-id-400605')) {
const container = document.getElementById("container");
// Function to create and position images
function createImage(src) {
const img = document.createElement("img");
img.src = src;
img.classList.add("image");
// Set random width and rotation
const randomWidth = Math.random() * (150 - 50) + 50; // Random width between 50px and 150px
const randomRotation = Math.random() * 30 - 15; // Random rotation between -15deg and 15deg
img.style.width = `${randomWidth}px`;
img.style.transform = `rotate(${randomRotation}deg)`;
// Random position within the container
img.style.top = Math.random() * (container.clientHeight - randomWidth) + 'px';
img.style.left = Math.random() * (container.clientWidth - randomWidth) + 'px';
img.draggable = true;
// Event listeners for dragging
img.addEventListener("dragstart", function(e) {
e.dataTransfer.setData("text/plain", null); // For Firefox compatibility
img.style.transition = 'none'; // Disable transition during drag
});
img.addEventListener("dragend", function() {
img.style.transition = 'transform 0.1s'; // Re-enable transition after drag
});
img.addEventListener("drag", function(e) {
const x = e.clientX - container.getBoundingClientRect().left - randomWidth / 2; // Adjust for image width
const y = e.clientY - container.getBoundingClientRect().top - randomWidth / 2; // Adjust for image height
img.style.transform = `translate(${x}px, ${y}px) rotate(${randomRotation}deg)`; // Keep rotation
});
container.appendChild(img);
}
// Load images from a specified folder
const imageFolder = 'https://yourwebsite.com/path/to/your/images/'; // Update with your image folder path
let i = 1; // Initialize the counter
while (true) { // Infinite loop to keep trying to load images
const imageUrl = `${imageFolder}image${i}.jpg`; // Adjust this to match your image naming convention
const img = new Image();
img.src = imageUrl;
// Check if the image exists before creating it
img.onload = function() {
createImage(imageUrl);
};
img.onerror = function() {
console.log(`Image ${imageUrl} does not exist. Stopping further attempts.`);
break; // Stop loading more images if one doesn't exist
};
i++; // Increment the counter
}
}
});
