Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 9cb8759

Browse files
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)

AltStyle によって変換されたページ (->オリジナル) /