<div style="font-weight:bold; text-decoration:underline;">Popcorn Hack 1 SOLUTIONS🍿😈</div>

%%html

<html>
<body>
  <h2>Popcorn Hack 1 Output</h2>
  <div id="output1"></div>

  <script>
    (() => {

        let name = "Alex";
        const age = 25;

        // In practice, you shouldn't use var. This is just for the purposes of teaching :)
        var city = "New York"; 
        let hobby = "painting";

        // Change vars here
        name = "Bessie";
        //age = 2;   // Uncommenting this line raised an ERROR as you can't redefine constants
        city = "Anishiapolis";

        // Message variable not required
        let message = name + " is " + age + " years old, lives in " + city + ", and likes " + hobby + "." 
        document.getElementById("output1").innerText = message;
        console.log(message);

        // Step 7: say data types
        let typesMessage = "name is a " + typeof name + ", age is a " + typeof age + ", city is a " + typeof city + ", and hobby is a " + typeof hobby + ".";
        document.getElementById("output1").innerText += "\n" + typesMessage;
        console.log(typesMessage);
    })();
  </script>
</body>
</html>

Popcorn Hack 1 Output

Presented by the

TINKERERS

<div style="font-weight:bold; text-decoration:underline;">Popcorn Hack 2 SOLUTIONS🍿😈</div>

%%html

<html>
<body>

    <p>Solution: Click the button after entering your magic number!</p>

    <input type="number" id="magicInput" placeholder="Enter magic number">
    <button id="magicButton">Calculate</button>

    <div id="output2">Your results will appear here.</div>

    <script>
    (() => {

    const button = document.getElementById("magicButton");
    const input = document.getElementById("magicInput");
    const output = document.getElementById("output2");

    button.addEventListener("click", () => {
        // ^^ DO NOT MODIFY ANY ABOVE CODE ^^

        // Set the Magic Number variable to input.value
        let magicNumber = input.value

        // Convert the input to a number using Number()
        magicNumber = Number(input.value); 

        // Calculate doubled, squared, and tripled
        let doubled = magicNumber * 2;
        let squared = magicNumber * magicNumber;
        let tripled = magicNumber * 3;

        // Display results in the DOM and console
        let message = "Doubled: " + doubled + ", Squared: " + squared + ", Tripled: " + tripled

        output.innerText = message;
        console.log(message);

    // vv DO NOT MODIFY ANY BELOW CODE vv
    });

    })();

    </script>

</body>
</html>

Solution: Click the button to enter your magic number!

Your results will appear here.