basics

var myHeading = document.querySelector('h1'); // grabs a reference to the heading specified by the string h1
//myHeading.innerHTML = 'Hello world!';

// Comparing arrays to see if both are identical
function compareEquality(a, b) {
    if (a === b) return true;
    if (a == null || b == null) return false;
    if (a.length != b.length) return false;

    // If order of array elements is not important, sort them here.
    for (var i =0; i < a.length; i++) {
        if (a[i] !== b[i]) return false;
    }
    return true;
};

var iceCream = "Strawberry";

function isFavFlav(flavor) {
    var favorites = [ "coconut", "pineapple", "rocky road", "french vanilla", "blueberry" ];

    for (i = 0; i < favorites.length; i++) {
        if (flavor === favorites[i]) {
            var inCommon = "The flavor of " + favorites[i] + " is my favorite!";
        }
    };

    if (!inCommon) {
        console.log("We won't get along since we have little in common.");
    }
    else { console.log(inCommon); }
};

/* Events
Events allow for the development of real on-site interactivity. Events are
code structures that listen for things that happen to the browser, and then
allow you to run code in response to those triggers.
 */

 document.querySelector('h1').onclick = function() {
    alert('Event triggered: <h1> element has been clicked.');
 };

 // Image Changer
 var myImage = document.querySelector('img');

 myImage.onclick = function() {
    var myImageSource = myImage.getAttribute('src');
    // Note that the images src attribute is retrieved once per click
    if (myImageSource === "images/firefox-icon.png") {
        myImage.setAttribute('src', 'images/firefox-icon-1.png');
    } else {
        myImage.setAttribute('src', 'images/firefox-icon.png');
    }
 };

 // Change User
 var myButton = document.querySelector('button');

 function setUserName() {
    var myName = prompt("Enter a Username: ");
    localStorage.setItem('name', myName);
    myHeading.innerHTML = 'Welcome, ' + myName;
 };

 // Initialization Code
 if(!localStorage.getItem('name')) {
    setUserName();
 } else {
    var storedName = localStorage.getItem('name');
    myHeading.innerHTML = "Welcome back, " + storedName;
 }