10ninox-labs
/
movie-web
1
0
Fork 0
Code Issues Pull Requests Releases Activity
Browse Source

init

master
sipp11 10 years ago
commit
016c15707d
10 changed files with 290 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      .gitignore
  2. 5
      README.md
  3. 10
      css/bootstrap-theme.min.css
  4. 10
      css/bootstrap.min.css
  5. 129
      index.html
  6. 108
      js/app.js
  7. 11
      js/bootstrap.min.js
  8. 2
      js/echo.min.js
  9. 8
      js/isotope.pkgd.min.js
  10. 4
      js/jquery-2.1.1.min.js

3
.gitignore vendored
Unescape View File

@ -0,0 +1,3 @@
vendor
*.zip
.DS_Store

5
README.md
Unescape View File

@ -0,0 +1,5 @@
Movies
This is a frontend for testing Movie API serving for #ShowtimesTH. Hopefully one day, this will turn out to be read/write wiki-style. At the beginning, it will depend on crawler.
Data crawled from TheMovieDB API and/or SF web page.

10
css/bootstrap-theme.min.css vendored
View File

File diff suppressed because one or more lines are too long

10
css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

129
index.html
Unescape View File

@ -0,0 +1,129 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Movies by #ShowtimesTH</title>
<meta name="description" content="Now Showing Movie Information, Thailand">
<meta name="keywords" content="Now showing, Movies, Theater, Thailand">
<meta name="google-play-app" content="app-id=co.zzyzx.showtimes.android">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<style>
.muted {
color:#989898;
}
li.thumbnail {
margin-left: 10px;
margin-bottom: 10px;
min-width: 250px;
max-width: 330px;
min-height: 150px;
}
li.thumbnail > img {
margin: 0 10px 5px 10px;
}
</style>
</head>
<body>
<script type="text/x-handlebars">
<div class="container-fluid">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-md-offset-3"><h1 class="text-center">Movies <small><a href="//showtimes.everyday.in.th">#ShowtimesTH</a></small></h1></div>
</div>
<div class="row-fluid">
{{outlet}}
</div>
{{outlet modal}}
<footer>
<hr/>
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-md-offset-3 text-center">
<small class="muted">Data gathered from TheMovieDB.org and/or SF and/or Major web page</small>
</div>
</div>
</footer>
</div>
</script>
<script type="text/x-handlebars" data-template-name="movies">
<ul id="container">
{{#each model}}
<li class="thumbnail">
{{#if backdrop_path}}
<img src="http://placehold.it/300x169" alt="" data-echo="http://image.tmdb.org/t/p/w300{{unbound backdrop_path}}" width="300" height="169" class="img-rounded" {{action 'openInfoModal' this}}>
{{else}}
{{#if poster_path}}
<img src="http://placehold.it/92x138" alt=""width="92" height="138" align="left" class="img-rounded" {{action 'openInfoModal' this}} data-echo="http://image.tmdb.org/t/p/w92{{unbound poster_path}}">
{{else}}
<img src="http://placehold.it/92x138" alt=""width="92" height="138" align="left" class="img-rounded" {{action 'openInfoModal' this}}>
{{/if}}
{{/if}}
<div class="caption">
<h4 {{action 'openInfoModal' this}}>{{title}}</h4>
{{#if tagline}}<blockquote class="blockquote-reverse"><footer>{{tagline}}</footer></blockquote>{{/if}}
{{#if vote_average}}<p class="small">TMDb rating: {{vote_average}} ({{vote_count}} votes)</p>{{/if}}
<p>{{#if imdb_id}}<a href="http://www.imdb.com/title/{{unbound imdb_id}}/" class="btn btn-default btn-xs" role="button">IMDb</a> {{/if}}<a href="http://www.themoviedb.org/movie/{{unbound movie_id}}/" class="btn btn-default btn-xs">TMDb</a></p>
</div>
</li>
{{/each}}
</ul>
</script>
<script type="text/x-handlebars" data-template-name="movie">
{{#base-modal close='closeModal'}}
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">{{original_title}}</h4>
</div>
<div class="modal-body">
<ul>
{{#if release_date}}<li><strong>Release Date</strong>: {{format-date release_date}}</li>{{/if}}
{{#if budget}}<li><strong>Budget</strong>: {{budget}}</li>{{/if}}
{{#if runtime}}<li><strong>Runtime</strong>: {{runtime}}</li>{{/if}}
</ul>
{{#if overview}}<p>{{overview}}</p>{{/if}}
<small class="muted">{{_id}}</small>
</div>
{{/base-modal}}
</script>
<script type="text/x-handlebars" data-template-name="components/base-modal">
<div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
{{yield}}
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</script>
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/isotope.pkgd.min.js"></script>
<script src="js/echo.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="//showtimes.everyday.in.th/bower_components/moment/moment.js"></script>
<script src="//showtimes.everyday.in.th/js/libs/handlebars-1.1.2.js"></script>
<script src="//showtimes.everyday.in.th/js/libs/ember-1.7.0.min.js"></script>
<script src="/js/app.js"></script>
<script>
echo.init({
offset: 100,
throttle: 250,
unload: false,
callback: function (element, op) {
$('#container').isotope();
}
});
</script>
</body>
</html>

108
js/app.js
Unescape View File

@ -0,0 +1,108 @@
App = Ember.Application.create();
App.ApplicationRoute = Ember.Route.extend({
setupController: function(controller) {
controller.set('title', "Hello World");
},
actions: {
openInfoModal: function(content) {
this.controllerFor('movie').set('content', content);
return this.render('movie', {
into: 'application',
outlet: 'modal'
});
},
closeModal: function() {
return this.disconnectOutlet({
outlet: 'modal',
parentView: 'application'
});
}
}
});
// var restUrl = 'http://showtimes.everyday.in.th/api';
var restUrl = 'http://localhost:8888';
var today = new Date();
App.ApplicationController = Ember.Controller.extend({
appName: '#Movies'
});
App.Router.map(function() {
this.resource('movies');
});
// redirect '/' to 'groups' by default
App.IndexRoute = Ember.Route.extend({
beforeModel: function() {
this.transitionTo('movies');
}
});
/*App.MovieRoute = Ember.Route.extend({
model: function(params) {
return $.getJSON(restUrl+'/movie/'+params+'/').then(function(data) {
return data.objects.map(function(item) {
console.log("get movie: " + item);
return item;
});
});
}
});*/
App.MovieController = Ember.ObjectController.extend({
actions: {
close: function() {
return this.send('closeModal');
}
}
});
/*
* ModalComponent
*/
App.BaseModalComponent = Ember.Component.extend({
actions: {
ok: function() {
this.$('.modal').modal('hide');
this.sendAction('ok');
}
},
show: function(params) {
this.$('.modal').modal().on('hidden.bs.modal', function() {
this.sendAction('close');
}.bind(this));
}.on('didInsertElement')
});
App.MoviesRoute = Ember.Route.extend({
model: function(params) {
return $.getJSON(restUrl+'/movies/').then(function(data) {
return data.objects.map(function(movies) {
return movies;
});
});
}
});
App.MoviesView = Ember.View.extend({
didInsertElement: function() {
Ember.run.next(this, function() {
this.$('#container').isotope({
layoutMode: 'masonry',
itemSelector: '.thumbnail',
transitionDuration: '0.7s',
isResizeBound: true
});
});
}
});
Ember.Handlebars.helper('format-date', function(date) {
return moment(date).format('ll');
});

11
js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
js/echo.min.js vendored
Unescape View File

@ -0,0 +1,2 @@
/*! echo.js v1.6.0 | (c) 2014 @toddmotto | https://github.com/toddmotto/echo */
!function(t,e){"function"==typeof define&&define.amd?define(function(){return e(t)}):"object"==typeof exports?module.exports=e:t.echo=e(t)}(this,function(t){"use strict";var e,n,o,r,c,i={},l=function(){},a=function(t,e){var n=t.getBoundingClientRect();return n.right>=e.l&&n.bottom>=e.t&&n.left<=e.r&&n.top<=e.b},d=function(){(r||!n)&&(clearTimeout(n),n=setTimeout(function(){i.render(),n=null},o))};return i.init=function(n){n=n||{};var a=n.offset||0,u=n.offsetVertical||a,f=n.offsetHorizontal||a,s=function(t,e){return parseInt(t||e,10)};e={t:s(n.offsetTop,u),b:s(n.offsetBottom,u),l:s(n.offsetLeft,f),r:s(n.offsetRight,f)},o=s(n.throttle,250),r=n.debounce!==!1,c=!!n.unload,l=n.callback||l,i.render(),document.addEventListener?(t.addEventListener("scroll",d,!1),t.addEventListener("load",d,!1)):(t.attachEvent("onscroll",d),t.attachEvent("onload",d))},i.render=function(){for(var n,o,r=document.querySelectorAll("img[data-echo]"),d=r.length,u={l:0-e.l,t:0-e.t,b:(t.innerHeight||document.documentElement.clientHeight)+e.b,r:(t.innerWidth||document.documentElement.clientWidth)+e.r},f=0;d>f;f++)o=r[f],a(o,u)?(c&&o.setAttribute("data-echo-placeholder",o.src),o.src=o.getAttribute("data-echo"),c||o.removeAttribute("data-echo"),l(o,"load")):c&&(n=o.getAttribute("data-echo-placeholder"))&&(o.src=n,o.removeAttribute("data-echo-placeholder"),l(o,"unload"));d||i.detach()},i.detach=function(){document.removeEventListener?t.removeEventListener("scroll",d):t.detachEvent("onscroll",d),clearTimeout(n)},i});

8
js/isotope.pkgd.min.js vendored
View File

File diff suppressed because one or more lines are too long

4
js/jquery-2.1.1.min.js vendored
View File

File diff suppressed because one or more lines are too long
Write Preview
Loading…
Cancel
Save