udacity · patricklindev · Apr 19, 2017 · Apr 19, 2017 · Apr 19, 2017 · Apr 19, 2017
diff --git a/README.md b/README.md
@@ -1,2 +1,32 @@
-# ud036_StarterCode
-Source code for a Movie Trailer website.
+# Movie Trailer website
+
+This is a project to let user to create a Movie Trailer website.
+
+## Guidelines
+
+Install [Python](https://www.python.org/)(if you don't have one).
+
+Download or clone this repository. 
+
+Edit **entertainment_center.py** with the editor you like：
+* Create your Movie object like the following example:
+
+```
+toy_story = media.Movie("Toy Story",                                              // title
+			"A story of a boy and his toys that come to life",        // story line
+			"https://upload.wikimedia.com/200px-ToyStory4poster.jpg", // poster image URL
+			"https://youtu.be/Bj4gS1JQzjk" //trailer URL )            // trailer URL
+```
+* Store those Movie object in a list like the following example:
+```
+movies = [toy_story, avatar, warcraft]
+```
+* Call open_movies_page() function to take in your list of movies and generate an HTML file including this content, and produce website to showcase your favorite movies.
+```
+fresh_tomatoes.open_movies_page(movies)
+```
+* Build entertainment_center.py with python.
+
+## License
+
+The content of this repository is licensed under a [MIT License](https://choosealicense.com/licenses/mit/)
diff --git a/entertainment_center.py b/entertainment_center.py
@@ -0,0 +1,37 @@
+'''
+Project_name: movie_website
+Author: Yuhan Lin
+Description: This is a main fuction.
+             Allow user to create instances of Movie.
+             And use open_movies_page(movies) to create movie website
+Last_update:4/18/2017
+'''
+import media
+import fresh_tomatoes
+
+# create instances of Movie
+toy_story = media.Movie("Toy Story",
+                        "A story of a boy and his toys that come to life",
+                        "https://upload.wikimedia.org/wikipedia/en/thumb/f/f9/"
+                        "ToyStory4poster.jpg/200px-ToyStory4poster.jpg",
+                        "https://youtu.be/Bj4gS1JQzjk")
+
+avatar = media.Movie("Avatar",
+                     "A marine on an alien planet",
+                     "https://upload.wikimedia.org/wikipedia/en/thumb/b/b0/"
+                     "Avatar-Teaser-Poster.jpg/220px-Avatar-Teaser-Poster.jpg",
+                     "https://youtu.be/H9S-K71JD_E")
+
+warcraft = media.Movie("Warcraft",
+                       "Draenor, the homeworld of the orcs, is being torn"
+                       "apart by a mysterious force known as fel magic.",
+                       "https://upload.wikimedia.org/wikipedia/en/thumb/5/"
+                       "56/Warcraft_Teaser_Poster.jpg/"
+                       "220px-Warcraft_Teaser_Poster.jpg",
+                       "https://youtu.be/RhFMIRuHAL4")
+
+# create a list to store the movies
+movies = [toy_story, avatar, warcraft]
+
+# use open_movies_page(movies) to create movie website
+fresh_tomatoes.open_movies_page(movies)
diff --git a/fresh_tomatoes.html b/fresh_tomatoes.html
@@ -0,0 +1,124 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>Fresh Tomatoes!</title>
+
+    <!-- Bootstrap 3 -->
+    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css">
+    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap-theme.min.css">
+    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
+    <script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
+    <style type="text/css" media="screen">
+        body {
+            padding-top: 80px;
+        }
+        #trailer .modal-dialog {
+            margin-top: 200px;
+            width: 640px;
+            height: 480px;
+        }
+        .hanging-close {
+            position: absolute;
+            top: -12px;
+            right: -12px;
+            z-index: 9001;
+        }
+        #trailer-video {
+            width: 100%;
+            height: 100%;
+        }
+        .movie-tile {
+            margin-bottom: 20px;
+            padding-top: 20px;
+        }
+        .movie-tile:hover {
+            background-color: #EEE;
+            cursor: pointer;
+        }
+        .scale-media {
+            padding-bottom: 56.25%;
+            position: relative;
+        }
+        .scale-media iframe {
+            border: none;
+            height: 100%;
+            position: absolute;
+            width: 100%;
+            left: 0;
+            top: 0;
+            background-color: white;
+        }
+    </style>
+    <script type="text/javascript" charset="utf-8">
+        // Pause the video when the modal is closed
+        $(document).on('click', '.hanging-close, .modal-backdrop, .modal', function (event) {
+            // Remove the src so the player itself gets removed, as this is the only
+            // reliable way to ensure the video stops playing in IE
+            $("#trailer-video-container").empty();
+        });
+        // Start playing the video whenever the trailer modal is opened
+        $(document).on('click', '.movie-tile', function (event) {
+            var trailerYouTubeId = $(this).attr('data-trailer-youtube-id')
+            var sourceUrl = 'http://www.youtube.com/embed/' + trailerYouTubeId + '?autoplay=1&html5=1';
+            $("#trailer-video-container").empty().append($("<iframe></iframe>", {
+              'id': 'trailer-video',
+              'type': 'text-html',
+              'src': sourceUrl,
+              'frameborder': 0
+            }));
+        });
+        // Animate in the movies when the page loads
+        $(document).ready(function () {
+          $('.movie-tile').hide().first().show("fast", function showNext() {
+            $(this).next("div").show("fast", showNext);
+          });
+        });
+    </script>
+</head>
+
+  <body>
+    <!-- Trailer Video Modal -->
+    <div class="modal" id="trailer">
+      <div class="modal-dialog">
+        <div class="modal-content">
+          <a href="#" class="hanging-close" data-dismiss="modal" aria-hidden="true">
+            <img src="https://lh5.ggpht.com/v4-628SilF0HtHuHdu5EzxD7WRqOrrTIDi_MhEG6_qkNtUK5Wg7KPkofp_VJoF7RS2LhxwEFCO1ICHZlc-o_=s0#w=24&h=24"/>
+          </a>
+          <div class="scale-media" id="trailer-video-container">
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Main Page Content -->
+    <div class="container">
+      <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+        <div class="container">
+          <div class="navbar-header">
+            <a class="navbar-brand" href="#">Fresh Tomatoes Movie Trailers</a>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="container">
+
+<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="Bj4gS1JQzjk" data-toggle="modal" data-target="#trailer">
+    <img src="https://upload.wikimedia.org/wikipedia/en/thumb/f/f9/ToyStory4poster.jpg/200px-ToyStory4poster.jpg" width="220" height="342">
+    <h2>Toy Story</h2>
+</div>
+
+<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="H9S-K71JD_E" data-toggle="modal" data-target="#trailer">
+    <img src="https://upload.wikimedia.org/wikipedia/en/thumb/b/b0/Avatar-Teaser-Poster.jpg/220px-Avatar-Teaser-Poster.jpg" width="220" height="342">
+    <h2>Avatar</h2>
+</div>
+
+<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="RhFMIRuHAL4" data-toggle="modal" data-target="#trailer">
+    <img src="https://upload.wikimedia.org/wikipedia/en/thumb/5/56/Warcraft_Teaser_Poster.jpg/220px-Warcraft_Teaser_Poster.jpg" width="220" height="342">
+    <h2>Warcraft</h2>
+</div>
+
+    </div>
+  </body>
+</html>
diff --git a/fresh_tomatoes.pyc b/fresh_tomatoes.pyc
diff --git a/media.py b/media.py
@@ -0,0 +1,28 @@
+'''
+Project_name: movie_website
+Author: Yuhan Lin
+Description: this is a Movie class. Allow user to create instances of Movie.
+Last_update:4/18/2017
+'''
+
+import webbrowser
+
+
+class Movie():
+    """ this is a Movie class. Allow user to create instances of Movie.  """
+    def __init__(self, movie_title, movie_storyline, poster_image, trailer_youtube):
+        """
+        Args:
+            param1(str): movie_title.
+            param2(str): movie_storyline.
+            param3(str): poster_image URL.
+            param4(str): movie_storyline URL.
+        """
+        self.title = movie_title
+        self.storyline = movie_storyline
+        self.poster_image_url = poster_image
+        self.trailer_youtube_url = trailer_youtube
+
+    def show_trailer(self):
+        """ open browser to load the URL """
+        webbrowser.open(self.trailer_youtube_url)
diff --git a/media.pyc b/media.pyc