Merge pull request #56 from richardrissanen/v1.0.0

V1.0.0
richardrissanen · Feb 17, 2018 · 2ddbe2c · 2ddbe2c
2 parents 9d5985c + 74db8ce
commit 2ddbe2c
Show file tree

Hide file tree

Showing 7 changed files with 52 additions and 55 deletions.
diff --git a/css/site.css b/css/site.css
@@ -1,10 +1,6 @@
-a:hover {
-  text-decoration: none !important;
-}
+a:hover { text-decoration: none !important; }
 
-body {
-  padding-top: 5rem;
-}
+body { padding-top: 5em; }
 
 form {
   margin-top: 20px;
@@ -20,9 +16,7 @@ main.container {
   max-width: 960px;
 }
 
-nav {
-  max-width: 960px;
-}
+nav { max-width: 960px; }
 
 p {
   color: #222;
@@ -66,22 +60,15 @@ small { font-size: 70%; }
   border-bottom: 2px solid transparent;
 }
 
-#tools a.active {
-  border-bottom-color: #007bff;
-}
+#tools a.active { border-bottom-color: #007bff; }
 
 .list-group-item a.accordion-toggle {
-  /* float: none; */
   margin-top: -19px;
   margin-right: 15px;
 }
 
-.accordion-toggle:after { 
-  content: "\25b2";
-}
-.accordion-toggle.expand:after {
-  content: "\25BC";
-}
+.accordion-toggle:after { content: "\25b2"; }
+.accordion-toggle.expand:after { content: "\25BC"; }
 
 .big-star:after {
   background-color: #e9ecef;
@@ -95,9 +82,7 @@ small { font-size: 70%; }
 
 .hide { display: none; }
 
-.list-group {
-  width: 100%;
-}
+.list-group { width: 100%; }
 
 .list-group-item {
   padding-bottom: 15px;
@@ -110,19 +95,16 @@ small { font-size: 70%; }
   margin-top: -25px;
 }
 
-.past-event h6, .past-event h6 small, .past-event a, .past-event p {
-  color: #ccc !important;
-}
-
-.star:after {
-  content: "\2605";
-}
+.past-event h6, .past-event h6 small, .past-event a, .past-event p { color: #ccc !important; }
 
-.star.empty:after, #favorite.empty {
-  content: "\2606";
-}
 .star {
-  font-size: 1.45em;
-  margin-left: 10px;
-  padding: 0 10px;
-}
+  background-image: url("../images/active_favorite_star.png");
+  background-repeat: no-repeat;
+  background-size: contain;
+  position: relative;
+  left: -12px;
+  padding: 9px;
+}
+.star.empty { background-image: url("../images/active_empty_star.png"); }
+.past-event .star { background-image: url("../images/disabled_favorite_star.png"); }
+.past-event .star.empty { background-image: url("../images/disabled_empty_star.png"); }
diff --git a/images/active_empty_star.png b/images/active_empty_star.png
diff --git a/images/active_favorite_star.png b/images/active_favorite_star.png
diff --git a/images/disabled_empty_star.png b/images/disabled_empty_star.png
diff --git a/images/disabled_favorite_star.png b/images/disabled_favorite_star.png
diff --git a/index.html b/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
     <meta name="description" content="Mutable Mobile Events Web Template">
     <meta name="author" content="Richard Rissanen">
 

diff --git a/js/modules/events_module.js b/js/modules/events_module.js
@@ -67,25 +67,39 @@ define(
 
       hideSearch(true);
 
-      var favorites = localStorage.getItem('favorites');
-
-      if (!isThisBlank(favorites)) {
-        var favoritesArray = JSON.parse(favorites);
-        var emptyStateHtml = document.getElementById("empty-state-container");
-        var favoriteToggles = document.getElementsByClassName("favorite-toggle");
-
-        if (favoritesArray.length < 1) {
-          emptyStateHtml.parentNode.classList.remove('hide');
-          Array.prototype.forEach.call(favoriteToggles, function(favoriteToggle, i) {
-            favoriteToggle.parentNode.parentNode.classList.add('hide')
-          });
-        } else {
-          Array.prototype.forEach.call(favoriteToggles, function(toggle, i) {
-            updateFavoriteToggleClass(favoritesArray, toggle)
-          });
-        }
+      displayFavorites();
+
+    });
+  }
+
+  function displayFavorites() {
+    var favorites = localStorage.getItem('favorites');
+    var emptyStateHtml = document.getElementById("empty-state-container");
+    var favoriteToggles = document.getElementsByClassName("favorite-toggle");
+
+    if (!isThisBlank(favorites)) {
+      var favoritesArray = JSON.parse(favorites);
+
+      if (favoritesArray.length < 1) {
+        showEmptyState(emptyStateHtml, favoriteToggles);
+      } else {
+        emptyStateHtml.parentNode.classList.add("hide");
+        Array.prototype.forEach.call(favoriteToggles, function(toggle, i) {
+          updateFavoriteToggleClass(favoritesArray, toggle);
+        });
       }
+    } else { // favorites is blank on first visit
+      showEmptyState(emptyStateHtml, favoriteToggles);
+    }
+
+  }
 
+  function showEmptyState(emptyStateHtml, favoriteToggles) {
+    console.log("showEmpty")
+    console.log("emptyStateHtml = " + emptyStateHtml + "favoriteToggles = " + favoriteToggles)
+    emptyStateHtml.parentNode.classList.remove('hide');
+    Array.prototype.forEach.call(favoriteToggles, function(favoriteToggle, i) {
+      favoriteToggle.parentNode.parentNode.classList.add('hide');
     });
   }
 
@@ -227,7 +241,8 @@ define(
     setAllLinkListener();
     setEventsFavoriteToggles();
     populateFavorites();
-    setAccordionToggles()
+    setAccordionToggles();
+    displayFavorites();
   }
 
   function initializeNoLocalStorageState(eventsUnorderedList) {