Skip to content

Commit 9cb8759

Browse files
raihan-uddinraihan-uddin
committed
added a template named fresh_tomatoes.html
1 parent c6af7f0 commit 9cb8759

File tree

3 files changed

+333
-3
lines changed

3 files changed

+333
-3
lines changed

‎movie_website/entertainment_center.py

Lines changed: 27 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,40 @@
11
from movie_website import media
2+
from movie_website import fresh_tomatoes
23

34
toy_story = media.Movie("Toy Story",
45
"A story of a boy and his toys that come to life",
56
"https://upload.wikimedia.org/wikipedia/en/1/13/Toy_Story.jpg",
67
"https://www.youtube.com/watch?v=JcpWXaA2qeg")
78

8-
print(toy_story.storyline)
9+
#print(toy_story.storyline)
910

1011
avatar = media.Movie("Avatar",
1112
"A marine on an aline planet",
1213
"https://upload.wikimedia.org/wikipedia/en/b/b0/Avatar-Teaser-Poster.jpg",
1314
"https://www.youtube.com/watch?v=EzETGqZN6dU")
14-
print(avatar.storyline)
15+
#print(avatar.storyline)
16+
#avatar.show_trailer()
1517

16-
avatar.show_trailer()
18+
school_of_rock = media.Movie("School of Rock",
19+
"Using rock music to learn",
20+
"http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg",
21+
"https://www.youtube.com/watch?v=3PsUJFEBC74")
22+
23+
ratatouille = media.Movie("Rataouille",
24+
"Storyline",
25+
"http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg",
26+
"https://www.youtube.com/watch?v=3PsUJFEBC74")
27+
28+
midnight_in_paris = media.Movie("Midnight in paris",
29+
"Using rock music to learn",
30+
"http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg",
31+
"https://www.youtube.com/watch?v=3PsUJFEBC74")
32+
33+
hunger_games = media.Movie("Hunger games"
34+
"",
35+
"Using rock music to learn",
36+
"http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg",
37+
"https://www.youtube.com/watch?v=3PsUJFEBC74")
38+
39+
movies = [toy_story, avatar, school_of_rock, ratatouille, midnight_in_paris, hunger_games]
40+
fresh_tomatoes.open_movies_page(movies)

‎movie_website/fresh_tomatoes.html

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
2+
<!DOCTYPE html>
3+
<html lang="en">
4+
<head>
5+
<meta charset="utf-8">
6+
<title>Fresh Tomatoes!</title>
7+
8+
<!-- Bootstrap 3 -->
9+
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css">
10+
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap-theme.min.css">
11+
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
12+
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
13+
<style type="text/css" media="screen">
14+
body {
15+
padding-top: 80px;
16+
}
17+
#trailer .modal-dialog {
18+
margin-top: 200px;
19+
width: 640px;
20+
height: 480px;
21+
}
22+
.hanging-close {
23+
position: absolute;
24+
top: -12px;
25+
right: -12px;
26+
z-index: 9001;
27+
}
28+
#trailer-video {
29+
width: 100%;
30+
height: 100%;
31+
}
32+
.movie-tile {
33+
margin-bottom: 20px;
34+
padding-top: 20px;
35+
}
36+
.movie-tile:hover {
37+
background-color: #EEE;
38+
cursor: pointer;
39+
}
40+
.scale-media {
41+
padding-bottom: 56.25%;
42+
position: relative;
43+
}
44+
.scale-media iframe {
45+
border: none;
46+
height: 100%;
47+
position: absolute;
48+
width: 100%;
49+
left: 0;
50+
top: 0;
51+
background-color: white;
52+
}
53+
</style>
54+
<script type="text/javascript" charset="utf-8">
55+
// Pause the video when the modal is closed
56+
$(document).on('click', '.hanging-close, .modal-backdrop, .modal', function (event) {
57+
// Remove the src so the player itself gets removed, as this is the only
58+
// reliable way to ensure the video stops playing in IE
59+
$("#trailer-video-container").empty();
60+
});
61+
// Start playing the video whenever the trailer modal is opened
62+
$(document).on('click', '.movie-tile', function (event) {
63+
var trailerYouTubeId = $(this).attr('data-trailer-youtube-id')
64+
var sourceUrl = 'http://www.youtube.com/embed/' + trailerYouTubeId + '?autoplay=1&html5=1';
65+
$("#trailer-video-container").empty().append($("<iframe></iframe>", {
66+
'id': 'trailer-video',
67+
'type': 'text-html',
68+
'src': sourceUrl,
69+
'frameborder': 0
70+
}));
71+
});
72+
// Animate in the movies when the page loads
73+
$(document).ready(function () {
74+
$('.movie-tile').hide().first().show("fast", function showNext() {
75+
$(this).next("div").show("fast", showNext);
76+
});
77+
});
78+
</script>
79+
</head>
80+
81+
<body>
82+
<!-- Trailer Video Modal -->
83+
<div class="modal" id="trailer">
84+
<div class="modal-dialog">
85+
<div class="modal-content">
86+
<a href="#" class="hanging-close" data-dismiss="modal" aria-hidden="true">
87+
<img src="https://lh5.ggpht.com/v4-628SilF0HtHuHdu5EzxD7WRqOrrTIDi_MhEG6_qkNtUK5Wg7KPkofp_VJoF7RS2LhxwEFCO1ICHZlc-o_=s0#w=24&h=24"/>
88+
</a>
89+
<div class="scale-media" id="trailer-video-container">
90+
</div>
91+
</div>
92+
</div>
93+
</div>
94+
95+
<!-- Main Page Content -->
96+
<div class="container">
97+
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
98+
<div class="container">
99+
<div class="navbar-header">
100+
<a class="navbar-brand" href="#">Fresh Tomatoes Movie Trailers</a>
101+
</div>
102+
</div>
103+
</div>
104+
</div>
105+
<div class="container">
106+
107+
<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="JcpWXaA2qeg" data-toggle="modal" data-target="#trailer">
108+
<img src="https://upload.wikimedia.org/wikipedia/en/1/13/Toy_Story.jpg" width="220" height="342">
109+
<h2>Toy Story</h2>
110+
</div>
111+
112+
<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="EzETGqZN6dU" data-toggle="modal" data-target="#trailer">
113+
<img src="https://upload.wikimedia.org/wikipedia/en/b/b0/Avatar-Teaser-Poster.jpg" width="220" height="342">
114+
<h2>Avatar</h2>
115+
</div>
116+
117+
<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="3PsUJFEBC74" data-toggle="modal" data-target="#trailer">
118+
<img src="http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg" width="220" height="342">
119+
<h2>School of Rock</h2>
120+
</div>
121+
122+
<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="3PsUJFEBC74" data-toggle="modal" data-target="#trailer">
123+
<img src="http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg" width="220" height="342">
124+
<h2>Rataouille</h2>
125+
</div>
126+
127+
<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="3PsUJFEBC74" data-toggle="modal" data-target="#trailer">
128+
<img src="http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg" width="220" height="342">
129+
<h2>Midnight in paris</h2>
130+
</div>
131+
132+
<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="3PsUJFEBC74" data-toggle="modal" data-target="#trailer">
133+
<img src="http://upload.wikimedia.org/wikipedia/en/1/11/School_of_Rock_Poster.jpg" width="220" height="342">
134+
<h2>Hunger games</h2>
135+
</div>
136+
137+
</div>
138+
</body>
139+
</html>

‎movie_website/fresh_tomatoes.py

Lines changed: 167 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,167 @@
1+
import webbrowser
2+
import os
3+
import re
4+
5+
6+
# Styles and scripting for the page
7+
main_page_head = '''
8+
<!DOCTYPE html>
9+
<html lang="en">
10+
<head>
11+
<meta charset="utf-8">
12+
<title>Fresh Tomatoes!</title>
13+
14+
<!-- Bootstrap 3 -->
15+
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css">
16+
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap-theme.min.css">
17+
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
18+
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
19+
<style type="text/css" media="screen">
20+
body {
21+
padding-top: 80px;
22+
}
23+
#trailer .modal-dialog {
24+
margin-top: 200px;
25+
width: 640px;
26+
height: 480px;
27+
}
28+
.hanging-close {
29+
position: absolute;
30+
top: -12px;
31+
right: -12px;
32+
z-index: 9001;
33+
}
34+
#trailer-video {
35+
width: 100%;
36+
height: 100%;
37+
}
38+
.movie-tile {
39+
margin-bottom: 20px;
40+
padding-top: 20px;
41+
}
42+
.movie-tile:hover {
43+
background-color: #EEE;
44+
cursor: pointer;
45+
}
46+
.scale-media {
47+
padding-bottom: 56.25%;
48+
position: relative;
49+
}
50+
.scale-media iframe {
51+
border: none;
52+
height: 100%;
53+
position: absolute;
54+
width: 100%;
55+
left: 0;
56+
top: 0;
57+
background-color: white;
58+
}
59+
</style>
60+
<script type="text/javascript" charset="utf-8">
61+
// Pause the video when the modal is closed
62+
$(document).on('click', '.hanging-close, .modal-backdrop, .modal', function (event) {
63+
// Remove the src so the player itself gets removed, as this is the only
64+
// reliable way to ensure the video stops playing in IE
65+
$("#trailer-video-container").empty();
66+
});
67+
// Start playing the video whenever the trailer modal is opened
68+
$(document).on('click', '.movie-tile', function (event) {
69+
var trailerYouTubeId = $(this).attr('data-trailer-youtube-id')
70+
var sourceUrl = 'http://www.youtube.com/embed/' + trailerYouTubeId + '?autoplay=1&html5=1';
71+
$("#trailer-video-container").empty().append($("<iframe></iframe>", {
72+
'id': 'trailer-video',
73+
'type': 'text-html',
74+
'src': sourceUrl,
75+
'frameborder': 0
76+
}));
77+
});
78+
// Animate in the movies when the page loads
79+
$(document).ready(function () {
80+
$('.movie-tile').hide().first().show("fast", function showNext() {
81+
$(this).next("div").show("fast", showNext);
82+
});
83+
});
84+
</script>
85+
</head>
86+
'''
87+
88+
89+
# The main page layout and title bar
90+
main_page_content = '''
91+
<body>
92+
<!-- Trailer Video Modal -->
93+
<div class="modal" id="trailer">
94+
<div class="modal-dialog">
95+
<div class="modal-content">
96+
<a href="#" class="hanging-close" data-dismiss="modal" aria-hidden="true">
97+
<img src="https://lh5.ggpht.com/v4-628SilF0HtHuHdu5EzxD7WRqOrrTIDi_MhEG6_qkNtUK5Wg7KPkofp_VJoF7RS2LhxwEFCO1ICHZlc-o_=s0#w=24&h=24"/>
98+
</a>
99+
<div class="scale-media" id="trailer-video-container">
100+
</div>
101+
</div>
102+
</div>
103+
</div>
104+
105+
<!-- Main Page Content -->
106+
<div class="container">
107+
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
108+
<div class="container">
109+
<div class="navbar-header">
110+
<a class="navbar-brand" href="#">Fresh Tomatoes Movie Trailers</a>
111+
</div>
112+
</div>
113+
</div>
114+
</div>
115+
<div class="container">
116+
{movie_tiles}
117+
</div>
118+
</body>
119+
</html>
120+
'''
121+
122+
123+
# A single movie entry html template
124+
movie_tile_content = '''
125+
<div class="col-md-6 col-lg-4 movie-tile text-center" data-trailer-youtube-id="{trailer_youtube_id}" data-toggle="modal" data-target="#trailer">
126+
<img src="{poster_image_url}" width="220" height="342">
127+
<h2>{movie_title}</h2>
128+
</div>
129+
'''
130+
131+
132+
def create_movie_tiles_content(movies):
133+
# The HTML content for this section of the page
134+
content = ''
135+
for movie in movies:
136+
# Extract the youtube ID from the url
137+
youtube_id_match = re.search(
138+
r'(?<=v=)[^&#]+', movie.trailer_youtube_url)
139+
youtube_id_match = youtube_id_match or re.search(
140+
r'(?<=be/)[^&#]+', movie.trailer_youtube_url)
141+
trailer_youtube_id = (youtube_id_match.group(0) if youtube_id_match
142+
else None)
143+
144+
# Append the tile for the movie with its content filled in
145+
content += movie_tile_content.format(
146+
movie_title=movie.title,
147+
poster_image_url=movie.poster_image_url,
148+
trailer_youtube_id=trailer_youtube_id
149+
)
150+
return content
151+
152+
153+
def open_movies_page(movies):
154+
# Create or overwrite the output file
155+
output_file = open('fresh_tomatoes.html', 'w')
156+
157+
# Replace the movie tiles placeholder generated content
158+
rendered_content = main_page_content.format(
159+
movie_tiles=create_movie_tiles_content(movies))
160+
161+
# Output the file
162+
output_file.write(main_page_head + rendered_content)
163+
output_file.close()
164+
165+
# open the output file in the browser (in a new tab, if possible)
166+
url = os.path.abspath(output_file.name)
167+
webbrowser.open('file://' + url, new=2)

0 commit comments

Comments
 (0)