Flask 構建微電影視訊網站(七)
阿新 • • 發佈:2018-11-27
電影模組實現
上映預告
@home.route("/animation/")
def animation():
"""
首頁輪播動畫
"""
data = Preview.query.all()
for v in data:
v.id = v.id - 1
return render_template("home/animation.html", data=data)
修改app/templates/home/animation.html
{% for v in data %} <li id="imgCard{{ v.id }}"> <a href=""><span style="opacity:0;"></span></a> <img src="{{ url_for('static',filename='uploads/'+v.logo) }}" alt=""> <p style="bottom:0">{{ v.title }}</p> </li> {% endfor %}
標籤篩選-電影分頁
@home.route("/<int:page>/", methods=["GET"]) @home.route("/", methods=["GET"]) def index(page=None): """ 首頁電影列表 """ tags = Tag.query.all() page_data = Movie.query # 標籤 tid = request.args.get("tid", 0) if int(tid) != 0: page_data = page_data.filter_by(tag_id=int(tid)) # 星級 star = request.args.get("star", 0) if int(star) != 0: page_data = page_data.filter_by(star=int(star)) # 時間 time = request.args.get("time", 0) if int(time) != 0: if int(time) == 1: page_data = page_data.order_by( Movie.addtime.desc() ) else: page_data = page_data.order_by( Movie.addtime.asc() ) # 播放量 pm = request.args.get("pm", 0) if int(pm) != 0: if int(pm) == 1: page_data = page_data.order_by( Movie.playnum.desc() ) else: page_data = page_data.order_by( Movie.playnum.asc() ) # 評論量 cm = request.args.get("cm", 0) if int(cm) != 0: if int(cm) == 1: page_data = page_data.order_by( Movie.commentnum.desc() ) else: page_data = page_data.order_by( Movie.commentnum.asc() ) if page is None: page = 1 page_data = page_data.paginate(page=page, per_page=8) p = dict( tid=tid, star=star, time=time, pm=pm, cm=cm, ) return render_template( "home/index.html", tags=tags, p=p, page_data=page_data)
修改index.html
<section id="movielist"> <div class="container"> <div class="row wow fadeIn" data-wow-delay="0.6s"> <div class="col-md-12 table-responsive"> <table class="table text-left table-bordered" id="movietags"> <tr> <td style="width:10%;">電影標籤</td> <td style="width:90%;"> {% for v in tags %} <a href="{{ url_for('home.index',page=1) }}?tid={{ v.id }}&star={{ p['star'] }}&time={{ p['time'] }}&pm={{ p['pm'] }}&cm={{ p['cm'] }}" class="label label-info"><span class="glyphicon glyphicon-tag"></span> {{ v.name }}</a> {% endfor %} </tr> <tr> <td>電影星級</td> <td> {% for v in range(1,6) %} <a href="{{ url_for('home.index',page=1) }}?tid={{ p['tid'] }}&star={{ v }}&time={{ p['time'] }}&pm={{ p['pm'] }}&cm={{ p['cm'] }}" class="label label-warning"><span class="glyphicon glyphicon-star"></span> {{ v }}星</a> {% endfor %} </td> </tr> <tr> <td>上映時間</td> <td> <a href="{{ url_for('home.index',page=1) }}?tid={{ p['tid'] }}&star={{ p['star'] }}&time=1&pm={{ p['pm'] }}&cm={{ p['cm'] }}" class="label label-default"><span class="glyphicon glyphicon-time"></span> 最近 </a> <a href="{{ url_for('home.index',page=1) }}?tid={{ p['tid'] }}&star={{ p['star'] }}&time=2&pm={{ p['pm'] }}&cm={{ p['cm'] }}" class="label label-default"><span class="glyphicon glyphicon-time"></span> 更早 </a> </td> </tr> <tr> <td>播放數量</td> <td> <a href="{{ url_for('home.index',page=1) }}?tid={{ p['tid'] }}&star={{ p['star'] }}&time={{ p['time'] }}&pm=1&cm={{ p['cm'] }}" class="label label-success"><span class="glyphicon glyphicon-arrow-down"></span> 從高到底</a> <a href="{{ url_for('home.index',page=1) }}?tid={{ p['tid'] }}&star={{ p['star'] }}&time={{ p['time'] }}&pm=2&cm={{ p['cm'] }}" class="label label-danger"><span class="glyphicon glyphicon-arrow-up"></span> 從低到高</a> </td> </tr> <tr> <td>評論數量</td> <td> <a href="{{ url_for('home.index',page=1) }}?tid={{ p['tid'] }}&star={{ p['star'] }}&time={{ p['time'] }}&pm={{ p['pm'] }}&cm=1" class="label label-success"><span class="glyphicon glyphicon-arrow-down"></span> 從高到底</a> <a href="{{ url_for('home.index',page=1) }}?tid={{ p['tid'] }}&star={{ p['star'] }}&time={{ p['time'] }}&pm={{ p['pm'] }}&cm=2" class="label label-danger"><span class="glyphicon glyphicon-arrow-up"></span> 從低到高</a> </td> </tr> </table> </div> {% for v in page_data.items %} <div class="col-md-3"> <div class="movielist text-center"> <!--<img data-original="holder.js/262x166" class="img-responsive lazy center-block" alt="">--> <img src="{{ url_for('static',filename='uploads/'+v.logo) }}" class="img-responsive center-block" alt=""> <div class="text-left" style="margin-left:auto;margin-right:auto;width:210px;"> <span style="color:#999;font-style: italic;">{{ v.title }}</span><br> <div> {% for val in range(1,v.star+1) %} <span class="glyphicon glyphicon-star" style="color:#FFD119"></span> {% endfor %} {% for val in range(1,5-v.star+1) %} <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span> {% endfor %} </div> </div> <a href="{{ url_for('home.play',id=v.id) }}" class="btn btn-primary" target="_blank" role="button"><span class="glyphicon glyphicon-play"></span> 播放</a> </div> </div> {% endfor %} <div class="col-md-12"> {{ pg.page(page_data,'home.index') }} </div> </div> </div> </section>
電影搜尋-搜尋分頁
@home.route("/search/<int:page>/")
def search(page=None):
"""
搜尋
"""
if page is None:
page = 1
key = request.args.get("key", "")
movie_count = Movie.query.filter(
Movie.title.ilike('%' + key + '%')
).count()
page_data = Movie.query.filter(
Movie.title.ilike('%' + key + '%')
).order_by(
Movie.addtime.desc()
).paginate(page=page, per_page=10)
page_data.key = key
return render_template("home/search.html", movie_count=movie_count, key=key, page_data=page_data)
修改search.html
<div class="row">
<div class="col-md-12">
<ol class="breadcrumb" style="margin-top:6px;">
<li>與"{{ key }}"有關的電影,共{{ movie_count }}部</li>
</ol>
</div>
<div class="col-md-12">
{% for v in page_data.items %}
<div class="media">
<div class="media-left">
<a href="{{ url_for('home.play',id=v.id,page=1) }}">
<img class="media-object" style="width:131px;height:83px;"
src="{{ url_for('static',filename='uploads/'+v.logo) }}" alt="{{ v.title }}">
</a>
</div>
<div class="media-body">
<h4 class="media-heading">{{ v.title }}<a href="{{ url_for('home.play',id=v.id) }}"
class="label label-primary pull-right"><span
class="glyphicon glyphicon-play"></span>播放影片</a></h4>
{{ v.info }}
</div>
</div>
{% endfor %}
</div>
<div class="col-md-12 text-center">
{{ pg.page(page_data,'home.search') }}
</div>
</div>
電影詳情-電影播放
@home.route("/play/<int:id>/", methods=["GET", "POST"])
def play(id=None):
"""
播放電影
"""
movie = Movie.query.join(Tag).filter(
Tag.id == Movie.tag_id,
Movie.id == int(id)
).first_or_404()
return render_template("home/play.html", movie=movie, )
<div class="panel-body" style="height:459px;overflow:scroll;">
<table class="table">
<tr>
<td style="width:30%;color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-film"></span> 片名
</td>
<td>{{ movie.title }}</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-tag"></span> 標籤
</td>
<td>{{ movie.tag.name }}</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-time"></span> 片長
</td>
<td>{{ movie.length }}</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-map-marker"></span> 地區
</td>
<td>{{ movie.area }}</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-star"></span> 星級
</td>
<td>
<div>
{% for val in range(1,movie.star+1) %}
<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
{% endfor %}
{% for val in range(1,5-movie.star+1) %}
<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
{% endfor %}
</div>
</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-calendar"></span> 上映時間
</td>
<td>{{ movie.release_time }}</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-play"></span> 播放數量
</td>
<td>{{ movie.playnum }}</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-comment"></span> 評論數量
</td>
<td>{{ movie.commentnum }}</td>
</tr>
<tr>
<td style="color:#ccc;font-weight:bold;font-style:italic;">
<span class="glyphicon glyphicon-picture"></span> 影片介紹
</td>
<td>
{{ movie.info }}
</td>
</tr>
</table>
</div>
<script type="text/javascript">
jwplayer("moviecontainer").setup({
flashplayer: "{{ url_for('static',filename='jwplayer/jwplayer.flash.swf') }}",
playlist: [{
file: "{{ url_for('static',filename='uploads/'+movie.url) }}",
title: "{{ movie.title }}"
}],
modes: [{
type: "html5"
}, {
type: "flash",
src: "{{ url_for('static',filename='jwplayer/jwplayer.flash.swf') }}"
}, {
type: "download"
}],
skin: {
name: "vapor"
},
"playlist.position": "left",
"playlist.size": 400,
height: 500,
width: 774,
});
</script>