Trailer
This commit is contained in:
@@ -21,19 +21,20 @@ var MovieDetails = new Class({
|
|||||||
),
|
),
|
||||||
self.content = new Element('div.content').grab(
|
self.content = new Element('div.content').grab(
|
||||||
new Element('h1', {
|
new Element('h1', {
|
||||||
'text': 'Title'
|
'text': parent.getTitle() + (parent.get('year') ? ' (' + parent.get('year') + ')' : '')
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|
||||||
self.addSection('description', new Element('div', {
|
self.addSection('description', new Element('div', {
|
||||||
'text': 'Description'
|
'text': parent.get('plot')
|
||||||
}));
|
}));
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
addSection: function(name, section_el){
|
addSection: function(name, section_el){
|
||||||
var self = this;
|
var self = this;
|
||||||
|
name = name.toLowerCase();
|
||||||
|
|
||||||
self.content.grab(
|
self.content.grab(
|
||||||
self.sections[name] = new Element('div', {
|
self.sections[name] = new Element('div', {
|
||||||
|
|||||||
@@ -311,7 +311,7 @@ var MovieList = new Class({
|
|||||||
['thumb', 'list'].each(function(view){
|
['thumb', 'list'].each(function(view){
|
||||||
var current = self.current_view == view;
|
var current = self.current_view == view;
|
||||||
new Element('a', {
|
new Element('a', {
|
||||||
'class': 'button icon-' + view + (current ? ' active ' : ''),
|
'class': 'icon-' + view + (current ? ' active ' : ''),
|
||||||
'data-view': view
|
'data-view': view
|
||||||
}).inject(self.navigation_actions, current ? 'top' : 'bottom');
|
}).inject(self.navigation_actions, current ? 'top' : 'bottom');
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -424,49 +424,35 @@ MA.Trailer = new Class({
|
|||||||
|
|
||||||
Extends: MovieAction,
|
Extends: MovieAction,
|
||||||
id: null,
|
id: null,
|
||||||
|
label: 'Trailer',
|
||||||
|
|
||||||
create: function(){
|
getDetails: function(){
|
||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
self.el = new Element('a.trailer', {
|
if(!self.player_container){
|
||||||
'title': 'Watch the trailer of ' + self.getTitle(),
|
var id = 'trailer-'+randomString();
|
||||||
'events': {
|
self.player_container = new Element('div.icon-play[id='+id+']', {
|
||||||
'click': self.watch.bind(self)
|
'events': {
|
||||||
}
|
'click': function(e){
|
||||||
});
|
self.watch(id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
self.container = new Element('div.trailer_container')
|
||||||
|
.grab(self.player_container);
|
||||||
|
}
|
||||||
|
|
||||||
|
return self.player_container;
|
||||||
},
|
},
|
||||||
|
|
||||||
watch: function(offset){
|
watch: function(){
|
||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
var data_url = 'https://gdata.youtube.com/feeds/videos?vq="{title}" {year} trailer&max-results=1&alt=json-in-script&orderby=relevance&sortorder=descending&format=5&fmt=18';
|
var data_url = 'https://gdata.youtube.com/feeds/videos?vq="{title}" {year} trailer&max-results=1&alt=json-in-script&orderby=relevance&sortorder=descending&format=5&fmt=18',
|
||||||
var url = data_url.substitute({
|
url = data_url.substitute({
|
||||||
'title': encodeURI(self.getTitle()),
|
'title': encodeURI(self.getTitle()),
|
||||||
'year': self.get('year'),
|
'year': self.get('year')
|
||||||
'offset': offset || 1
|
});
|
||||||
}),
|
|
||||||
size = $(self.movie).getSize(),
|
|
||||||
height = self.options.height || (size.x/16)*9,
|
|
||||||
id = 'trailer-'+randomString();
|
|
||||||
|
|
||||||
self.player_container = new Element('div[id='+id+']');
|
|
||||||
self.container = new Element('div.hide.trailer_container')
|
|
||||||
.adopt(self.player_container)
|
|
||||||
.inject($(self.movie), 'top');
|
|
||||||
|
|
||||||
self.container.setStyle('height', 0);
|
|
||||||
self.container.removeClass('hide');
|
|
||||||
|
|
||||||
self.close_button = new Element('a.hide.hide_trailer', {
|
|
||||||
'text': 'Hide trailer',
|
|
||||||
'events': {
|
|
||||||
'click': self.stop.bind(self)
|
|
||||||
}
|
|
||||||
}).inject(self.movie);
|
|
||||||
|
|
||||||
self.container.setStyle('height', height);
|
|
||||||
$(self.movie).setStyle('height', height);
|
|
||||||
|
|
||||||
new Request.JSONP({
|
new Request.JSONP({
|
||||||
'url': url,
|
'url': url,
|
||||||
@@ -486,8 +472,6 @@ MA.Trailer = new Class({
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
self.close_button.removeClass('hide');
|
|
||||||
|
|
||||||
var quality_set = false;
|
var quality_set = false;
|
||||||
var change_quality = function(state){
|
var change_quality = function(state){
|
||||||
if(!quality_set && (state.data == 1 || state.data || 2)){
|
if(!quality_set && (state.data == 1 || state.data || 2)){
|
||||||
@@ -505,6 +489,8 @@ MA.Trailer = new Class({
|
|||||||
}
|
}
|
||||||
}).send();
|
}).send();
|
||||||
|
|
||||||
|
return self.container;
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
stop: function(){
|
stop: function(){
|
||||||
|
|||||||
@@ -26,8 +26,8 @@ var Movie = new Class({
|
|||||||
|
|
||||||
self.addEvents();
|
self.addEvents();
|
||||||
|
|
||||||
//if(data.identifiers.imdb == 'tt0948470')
|
if(data.identifiers.imdb == 'tt1228705')
|
||||||
// self.openDetails();
|
self.openDetails();
|
||||||
},
|
},
|
||||||
|
|
||||||
openDetails: function(){
|
openDetails: function(){
|
||||||
|
|||||||
@@ -214,13 +214,17 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.section {
|
.section {
|
||||||
padding: $padding/2 $padding;
|
padding: $padding $padding;
|
||||||
border-bottom: 1px solid rgba(0,0,0,.1);
|
border-top: 1px solid rgba(0,0,0,.1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.releases {
|
.releases {
|
||||||
|
|
||||||
|
.buttons {
|
||||||
|
margin-bottom: $padding/2;
|
||||||
|
}
|
||||||
|
|
||||||
.item span {
|
.item span {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
@@ -237,7 +241,7 @@
|
|||||||
.size { min-width: 40px; max-width: 40px; }
|
.size { min-width: 40px; max-width: 40px; }
|
||||||
.age { min-width: 40px; max-width: 40px; }
|
.age { min-width: 40px; max-width: 40px; }
|
||||||
.score { min-width: 45px; max-width: 45px; }
|
.score { min-width: 45px; max-width: 45px; }
|
||||||
.provider { min-width: 100px; max-width: 100px; }
|
.provider { min-width: 110px; max-width: 110px; }
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -15,7 +15,7 @@ var BlockMenu = new Class({
|
|||||||
self.wrapper = new Element('div.wrapper').adopt(
|
self.wrapper = new Element('div.wrapper').adopt(
|
||||||
self.more_option_ul = new Element('ul')
|
self.more_option_ul = new Element('ul')
|
||||||
),
|
),
|
||||||
self.button = new Element('a.button' + (self.options.button_class ? '.' + self.options.button_class : ''), {
|
self.button = new Element('a' + (self.options.button_class ? '.' + self.options.button_class : ''), {
|
||||||
'text': self.options.button_text || '',
|
'text': self.options.button_text || '',
|
||||||
'events': {
|
'events': {
|
||||||
'click': function(){
|
'click': function(){
|
||||||
|
|||||||
@@ -38,6 +38,21 @@ input, textarea, select {
|
|||||||
border: 1px solid #f2f2f2;
|
border: 1px solid #f2f2f2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
color: $primary_color;
|
||||||
|
font-weight: 300;
|
||||||
|
padding: $padding/4;
|
||||||
|
cursor: pointer;
|
||||||
|
border: 1px solid $primary_color;
|
||||||
|
border-radius: $border_radius;
|
||||||
|
margin: 0 $padding/4;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: $primary_color;
|
||||||
|
color: $background_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* Header */
|
/* Header */
|
||||||
.header {
|
.header {
|
||||||
width: $header_width;
|
width: $header_width;
|
||||||
@@ -357,7 +372,6 @@ input, textarea, select {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Messages */
|
/* Messages */
|
||||||
|
|
||||||
.messages {
|
.messages {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 0;
|
right: 0;
|
||||||
|
|||||||
Reference in New Issue
Block a user