genres in place

Author: mikeckennedy

days/093-096-vuejs/movie_exploder/js/fake_data.js

@@ -194,4 +194,33 @@ movies_temp = {
         }
     ],
     "truncated_results": true
-}
+}
+
+genres_temp = [
+    "action",
+    "adventure",
+    "animation",
+    "biography",
+    "comedy",
+    "crime",
+    "documentary",
+    "drama",
+    "family",
+    "fantasy",
+    "film-noir",
+    "game-show",
+    "history",
+    "horror",
+    "music",
+    "musical",
+    "mystery",
+    "news",
+    "reality-tv",
+    "romance",
+    "sci-fi",
+    "short",
+    "sport",
+    "thriller",
+    "war",
+    "western"
+]

days/093-096-vuejs/movie_exploder/js/site.js

@@ -4,7 +4,9 @@ app = new Vue({
     el: '#app',
     data: {
         search_text: null,
-        movies: movies_temp.hits
+        movies: movies_temp.hits,
+        genres: genres_temp,
+        selected_genre: null
     },
     methods: {
         search: function() {

days/093-096-vuejs/movie_exploder/views/index.html

@@ -25,6 +25,10 @@ <h1>Movie Exploder</h1>
 
                 <a class="top_10" @click="top_10()">Top 10</a>
 
+                <select v-model="selected_genre">
+                    <option v-for="g in genres" :value="g">{{g}}</option>
+                </select>
+
             </div>
 
         </div>