Movie trailer files created and modified

README.md

@@ -1,2 +1,41 @@
-# ud036_StarterCode
-Source code for a Movie Trailer website.
+# Movie Trailer Center
+This project is used to create a website displaying all of your favoite movies. It allows the user to click a movie poster displayed on the site and plays the movie's trailer.
+
+## Geting Started
+The instructions given below will help you setup The Movie Trailer project on your local machine. All requirements including software installations needed to run this project will be mentioned in this guide.
+
+### Prerequisites
+To run this program, you'll first need to install python. Visit https://www.python.org/ and download the latest version of python.
+
+Once installation is done, type the following command in a command line window: "python". You should see an output like the one below
+
+```
+Python 2.7.13 (v2.7.13:, Dec 17 2016, 20:42:59) [MSC v.1500 32 bit (Intel)] on win32
+Type "help", "copyright", "credits" or "license" for more information.
+```
+
+### Installing
+To get the project's files, you can clone the repo [here](https://github.com/nanatech/Movie_TrailerCenter/tree/movie_branch) or you can download the zip file. 
+
+Once you have the project setup you should have a directory that looks like the following:
+
+>/pics
+</br>README.md
+</br>entertainment_center.py
+</br>fresh_tomatoes.html
+</br>fresh_tomatoes.py
+</br>fresh_tomatoes.pyc
+</br>media.py
+</br>media.pyc
+
+## Modifying Files
+By default the project is setup to display my favorite movies. To display your favorite movies instead modify the <b>"entertainment_center.py"</b>file in your Python IDLE editor.
+> You will notice that this file stores an array of the movies specified at the beginning of the file. This array is then used by the open_movies_page() method. This method is called from the fresh_tomatoes module, which is the file that renders a html page to display all of your favorite movies.
+
+If your are familiar with HTML and would like to chnage the style of the HTML page rendered from the fresh_tomatoes.py module, feel free to modify this file as well.
+
+## Running the Program
+Now that you have added your favorite movies in the <b>entertainment_center.py</b> file, go ahead and run the program by clicking <b>Run --> Run Module</b> or by clicking F5 on the keyboard in your python IDLE.
+
+## Acknowledgments
+Thanks to Udacity Nanodegree program for providing a starter code repository that contains the main code to generate the movie site. Repository found [here](https://github.com/adarsh0806/ud036_StarterCode)

entertainment_center.py

@@ -0,0 +1,34 @@
+import media
+import fresh_tomatoes
+
+"""The entertainment center module is used to initalize instance of the Movie class"""
+
+
+toy_story = media.Movie("Toy Story",
+                        "A story of a boy and hist toys that come to life",
+                        "pics//toystory.jpeg","https://youtu.be/KYz2wyBy3kc")
+
+home_alone = media.Movie("Home Alone",
+           "An eight-year-old is accidentally left home alone by his family",
+           "pics//homeAlone.jpg", "https://www.youtube.com/watch?v=CK2Btk6Ybm0")
+
+princess_frog = media.Movie("Princess & The Frog",
+                            "A story of a disnet princess and a prince frog",
+                            "pics//PAF.jpg", "https://www.youtube.com/watch?v=uQBy6jqbmlU")
+it = media.Movie("IT", "Stephen Kings horror Classic",
+                            "pics//It.JPG", "https://www.youtube.com/watch?v=FnCdOQsX5kc")
+think_like_a_man = media.Movie("Think Like A Man",
+                            "Based on Steve Harvey's best selling book 'Think Like A Man' ",
+                            "pics//thinkLAM.jpg", "https://www.youtube.com/watch?v=F7VmU8aHAtw")
+scream = media.Movie("Scream","A horror classic.","pics//scream.jpg",
+                     "https://www.youtube.com/watch?v=AWm_mkbdpCA")
+
+#Create an array of the movie objects created 
+movies = [toy_story, home_alone, princess_frog, it, think_like_a_man, scream]
+
+# This method passes the movie array as an argument to the
+# open_movies_page() method. This method is called from the
+# fresh_tomatoes module which which will create a HTML file
+# that will display all movies listed in the movie array
+fresh_tomatoes.open_movies_page(movies)
+

fresh_tomatoes.html

@@ -0,0 +1,143 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>Najah's Favorite Movies</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;
+            background-image: url(https://i.ytimg.com/vi/5OFBTo7c0P0/maxresdefault.jpg);
+        }
+        #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;
+            color:#e6e600;
+            text-shadow: 4px 2px 5px #1ad1ff;
+
+        }
+        .movie-tile:hover {
+            background-color: #000000;
+            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="#">Najah's Favorite 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="KYz2wyBy3kc" data-toggle="modal" data-target="#trailer">
+    <img src="pics//toystory.jpeg" 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="CK2Btk6Ybm0" data-toggle="modal" data-target="#trailer">
+    <img src="pics//homeAlone.jpg" width="220" height="342">
+    <h2>Home Alone</h2>
+</div>
+
+<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="uQBy6jqbmlU" data-toggle="modal" data-target="#trailer">
+    <img src="pics//PAF.jpg" width="220" height="342">
+    <h2>Princess & The Frog</h2>
+</div>
+
+<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="FnCdOQsX5kc" data-toggle="modal" data-target="#trailer">
+    <img src="pics//It.JPG" width="220" height="342">
+    <h2>IT</h2>
+</div>
+
+<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="F7VmU8aHAtw" data-toggle="modal" data-target="#trailer">
+    <img src="pics//thinkLAM.jpg" width="220" height="342">
+    <h2>Think Like A Man</h2>
+</div>
+
+<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="AWm_mkbdpCA" data-toggle="modal" data-target="#trailer">
+    <img src="pics//scream.jpg" width="220" height="342">
+    <h2>Scream</h2>
+</div>
+
+    </div>
+  </body>
+</html>

fresh_tomatoes.py

@@ -9,7 +9,7 @@
 <html lang="en">
 <head>
     <meta charset="utf-8">
-    <title>Fresh Tomatoes!</title>
+    <title>Najah's Favorite Movies</title>
 
     <!-- Bootstrap 3 -->
     <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css">
@@ -19,6 +19,7 @@
     <style type="text/css" media="screen">
         body {
             padding-top: 80px;
+            background-image: url(https://i.ytimg.com/vi/5OFBTo7c0P0/maxresdefault.jpg);
         }
         #trailer .modal-dialog {
             margin-top: 200px;
@@ -38,9 +39,12 @@
         .movie-tile {
             margin-bottom: 20px;
             padding-top: 20px;
+            color:#e6e600;
+            text-shadow: 4px 2px 5px #1ad1ff;
+
         }
         .movie-tile:hover {
-            background-color: #EEE;
+            background-color: #000000;
             cursor: pointer;
         }
         .scale-media {
@@ -107,7 +111,7 @@
       <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>
+            <a class="navbar-brand" href="#">Najah's Favorite Movie Trailers</a>
           </div>
         </div>
       </div>

media.py

@@ -0,0 +1,14 @@
+import webbrowser
+
+class Movie():
+    """This is Najah's Movie class used by instances of this class to initialize
+    common variables that all movies share"""
+    VALID_RATINGS = ["R", "PG"]
+    def __init__(self,title,storyline,poster_image_url,trailer_youtube_url):
+        self.title = title
+        self.storyline = storyline
+        self.poster_image_url = poster_image_url
+        self.trailer_youtube_url = trailer_youtube_url
+
+    def show_trailer(self):
+        webbrowser.open(self.trailer_youtube_url)