← Back to gallery
Leaving Las Vegas poster

Project walkthrough

Leaving Las Vegas

Explore the concept, hints, and starter code for this Nic Cage inspired build.

Project Title: “Echoes of Vegas: Memory Box”

Description:

Inspired by “Leaving Las Vegas,” a film that explores themes of loss, memory, and self-destruction through the life of Ben Sanderson, played by Nicolas Cage, “Echoes of Vegas: Memory Box” is a web application designed to securely store and recall cherished memories. This project utilizes the Storage Access API to provide a safe and private way for users to store personal memories, photos, and notes in a digital format that emphasizes privacy and user consent.

This application is particularly aimed at those who want to keep their personal memories private or need a secure place to reflect on past experiences without fear of unauthorized access.

Starting Code:

Beginner Hints:

  • Create a single index.html file.
  • Copy the full HTML code block into that file.
  • Open index.html in your browser. If something doesn’t work, try a local server like python -m http.server.
  • Open DevTools Console to spot errors and typos quickly.
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Echoes of Vegas: Memory Box</title>
<style>
    body {
        font-family: 'Arial', sans-serif;
        background-color: #f2f2f2;
        color: #333;
        text-align: center;
        padding: 20px;
    }

    #memoryContainer {
        margin-top: 20px;
        width: 80%;
        padding: 10px;
        border: 1px solid #ccc;
        background-color: #fff;
    }
</style>
</head>
<body>
    <h1>Memory Box</h1>
    <div id="memoryContainer"></div>
    <button onclick="storeMemory()">Store New Memory</button>
<script>
    document.addEventListener('DOMContentLoaded', async () => {
        if (await document.hasStorageAccess()) {
            console.log('Storage access granted');
        } else {
            console.log('Storage access not granted');
        }
    });

    async function storeMemory() {
        if (await document.requestStorageAccess()) {
            const memory = prompt("Enter your memory:");
            localStorage.setItem('latestMemory', memory);
            document.getElementById('memoryContainer').textContent = 'Memory stored successfully!';
        } else {
            alert("Storage access denied.");
        }
    }
</script>
</body>
</html>

References:

“Echoes of Vegas: Memory Box” not only touches on the poignant themes of “Leaving Las Vegas” but also integrates these into a functional application that provides a private space for users to secure their personal histories, mirroring the character’s journey through the city and his life. This project blends emotional resonance with practical web technology, offering a unique tool for personal reflection and memory preservation.