Advertisement
arkader

Productions.js trouble

Apr 25th, 2013
240
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. (function(){
  2.  
  3.     var productions = {
  4.  
  5.         init: function() {
  6.  
  7.             this.iso();
  8.             this.fetch();
  9.  
  10.             $('.prod').on('mouseenter',this.mouseenter)
  11.                       .on('mouseleave',this.mouseleave);
  12.                       //.on('click',this.dim);
  13.             $('.titre-projet').find('a').on('click',this.dim);
  14.             console.log('after fetch call');
  15.  
  16.  
  17.         },// init()
  18.  
  19.  
  20.         fetch: function() {
  21.  
  22.             $.ajax({
  23.                 url: '../assets/json/productions.json',
  24.                 type: 'GET',
  25.                 dataType: 'json',
  26.                 success: productions.fetchSucceed,
  27.                 error: function(xhr, status, error) {
  28.                     console.log(xhr.status);
  29.                 }
  30.             });
  31.  
  32.             console.log("fetch");
  33.  
  34.         },
  35.  
  36.         fetchSucceed: function(data) {
  37.            
  38.             var template = Handlebars.compile( $('#productions-template').html() );
  39.             var temp = template(data.productions);
  40.        
  41.             $('#productions').append(temp);
  42.         },
  43.  
  44.  
  45.  
  46.         iso: function() {
  47.  
  48.             var container = $('#productions');
  49.  
  50.             // initialize isotope
  51.             container.isotope();
  52.  
  53.             //On affiche seulement la catégorie selectionnée
  54.             $('ul#rubriques-filters li a').on('click',function() {
  55.                 var selector = $(this).data('filter');
  56.                 container.isotope({ filter: selector });
  57.                 return false;
  58.                
  59.             });
  60.  
  61.         },// iso()
  62.  
  63.         mouseenter: function() {
  64.             //On cache l'image principale pour afficher la descriptions du projet
  65.             $this = $(this);
  66.             $this.find('div.prod-img').animate({'margin-top': '-320px'}, 300);//hide
  67.             $this.find('div.prod-hover').animate({'top': '0'},300);//show
  68.            
  69.         },// mouseenter()
  70.  
  71.         mouseleave: function() {
  72.            
  73.             $this = $(this);
  74.             $this.find('div.prod-img').animate({'margin-top': '0px'}, 250);
  75.             $this.find('div.prod-hover').animate({'top': '320px'},250);
  76.            
  77.         },// mouseenter()
  78.  
  79.         dim: function() {
  80.  
  81.             var dim = $('#dim'),
  82.                 video = dim.find('.dim-video-projet');
  83.  
  84.             dim.css("height",$(document).height());
  85.  
  86.             if( dim.is(':hidden') ) {
  87.                 $('<iframe src="http://player.vimeo.com/video/55767554?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff" width="960" height="540" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>')
  88.                 .appendTo(video);
  89.                 dim.fadeIn(500);
  90.             }
  91.            
  92.             dim.find('img').on('click',function(){
  93.                 if( dim.is(':visible') ) {
  94.                     dim.fadeOut(500);
  95.                     video.empty();
  96.                 }
  97.             });
  98.  
  99.            
  100.  
  101.             return false;
  102.         }
  103.            
  104.  
  105.     };
  106.  
  107.     productions.init();
  108.  
  109.    
  110. })();
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement