The Rest – A Temporary Holding Area (Probably)

Not every project demands a grand entrance—some prefer to lurk in the wings, content to exist without making a fuss. Too small, too old, too weird, or just too perfectly happy being wallflowers, these are the projects that never elbowed their way to center stage. And so, they gather here, in a kind of creative purgatory—waiting, lingering, or maybe just enjoying the quiet.

Some are relics of past obsessions, little snapshots of whatever was rattling around in my brain at the time. Others are the result of good intentions gone slightly astray—side quests that became more interesting than the main objective, only to fizzle out before they found a purpose.

Yet others are fully functional but too odd, too niche, or too stubbornly themselves to fit anywhere else. Maybe one day, one of them will rise up, demand attention, and claim its rightful place in the spotlight. Or maybe they’ll all just stay here, forming an ever-growing museum of creative leftovers.

Just too perfectly happy being wallflowers

Perfectly Flawed, Happily Forgotten.

Either way, I like knowing they exist. A quiet, mismatched archive of past ideas, waiting (or not) for whatever comes next.

Automating the Chaos: JSON, Masonry, and a Smarter Gallery

For rendering this gallery, I use masonry.pkgd.js by David DeSandro, just like everywhere else on this website. However, instead of manually placing grid items, I use a JavaScript function to loop through a JSON file that contains references to all gallery objects—extracted from an InDesign file. I took this approach because I wasn’t about to place 65 images by hand.

// Function to initialize the dynamic gallery
function initializeGallery() {
    const gallery = document.querySelector("#TheRest");

    if (gallery) {
        // Clear the gallery before adding new items
        gallery.innerHTML = '<div class="grid-sizer"></div>';

        // Fetch image data from the JSON file
        fetch('/src/js/theRest.json')
            .then(response => response.json())
            .then(imageData => {
                // Loop through the array and create gallery items
                imageData.forEach(item => {
                    let div = document.createElement("div");
                    div.className = "grid-item";
                    div.innerHTML = `
                        <div class="retro-frame" data-title="${item.title}">
                            <img src="/images/projects/the_rest/the_rest_${item.num}.jpg" alt="${item.title}" class="desaturate"/>
                            <span class="tooltip">${item.tooltip}</span>
                        </div>`;
                    gallery.appendChild(div);
                });

                // Reinitialize Masonry after adding new gallery items
                initializeMasonry();
            })
            .catch(error => {
                console.error('Error loading gallery data:', error);
            });
    }
}