/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this file,
 * You can obtain one at http://mozilla.org/MPL/2.0/. */

define(["jquery"], function ($) {
  // This isn't really a "module" since it just patches jQuery itself

  // walkthrough animations go here

  // animate avatar popping into the dock when they enter the session / telescope in the avatar
  // $.fn.avatarEnter = function (y) {
  //   return this.animate({
  //     scrollTop: y
  //   }, {
  //     duration: 400,
  //     easing: "swing"
  //   });
  // };

  // animate participant cursor and box popping in when they enter the session

  // animate avatar exiting the dock when the exit the session/ telescope out the avatar
  // animate participant cursor and box popping out when they leave the session

  // animate the participant cursor -> rotate down when they're down the page
  // animate the participant cursor -> rotate up when they're on the same frame as the user

  // animate participant typing

  /* Pop in window from dock button: */
  $.fn.popinWindow = function () {

    //start scale small
    //set css width small

    //starting position
    this.css({
      left: "+=74px",
      opacity: 1,
      "zIndex": 8888
    });
    //this.show( { effect: "scale", origin: ['bottom' , 'right'] } );
    //scale larger
    //set css height large
    //this.show( "scale", {percent: 200, direction: 'horizontal' }, 2000 );

    //animate window out
    this.animate({
      opacity: 1,
      left: "-=78px",
      }, {
        duration:60, easing:"linear"
      });
    this.queue();

    //bounce window back
    this.animate({
      left:'+=4px'
      }, {
        duration:60, easing:"linear"
    });
  };

  /* Slide in notification window: */
  $.fn.slideIn = function () {
    this.css({
      //top: "240px",
      left: "+=74px",
      opacity: 0,
      "zIndex": 8888
    });
    return this.animate({
      "left": "-=74px",
       opacity: 1,
       "zIndex": 9999
      }, "fast");
  };

  /* Move notification when another notification slides in */

  /* Used to fade away notification windows + flip the bottom of them out: */
  $.fn.fadeOut = function (time) {

    $(this).css('-moz-perspective:200');
    this.animate({  borderSpacing: -90 }, {
        step: function(now,fx) {
          $(this).css('-webkit-transform','rotateX('+now+'deg)');
          $(this).css('-moz-transform','rotateX('+now+'deg)');
          $(this).css('-ms-transform','rotateX('+now+'deg)');
          $(this).css('-o-transform','rotateX('+now+'deg)');
          $(this).css('transform','rotateX('+now+'deg)');
        },
        duration: "slow"
    },'linear');

    // this.animate({
    //   opacity: 0
    // }, {
    //   duration: time || 1000,
    //   easing: "linear"
    // });

  };

  /* used when user goes down to participant cursor location on screen */
  $.fn.easeTo = function (y) {
    return this.animate({
      scrollTop: y
    }, {
      duration: 400,
      easing: "swing"
    });
  };

  $.fn.animateDockEntry = function () {

    // scale from Center is not working.  it scales from the Top Left
    this.hide();
    this.show( { effect: "scale", origin: ['middle' , 'center'] } );
    // expand avatar into place

  };

  $.fn.animateDockExit = function () {
    return this.animate({});
  };

  $.fn.animateCursorEntry = function () {
    // Make the cursor bubble pop in
  };

  $.fn.animateKeyboard = function () {
    var count = 0;
    var interval = setInterval((function () {
      count++;
      this.text(count);
    }).bind(this), 1000);
    this.data("animateKeyboard", interval);
  };

  $.fn.stopKeyboardAnimation = function () {
    clearTimeout(this.data("animateKeyboard"));
    this.data("animateKeyboard", null);
  };


});

@@ -1572,20 +1572,17 @@
 %22-=78px%22
-,%0A  
+%0A
     %7D, %7B
@@ -1574,34 +1574,32 @@
 =78px%22%0A    %7D, %7B%0A
-  
       duration:6
@@ -1617,18 +1617,16 @@
 linear%22%0A
-  
     %7D);%0A
@@ -1711,25 +1711,21 @@
 px'%0A    
-  
 %7D, %7B%0A
-  
       du
@@ -1992,25 +1992,24 @@
 4px%22,%0A      
- 
 opacity: 1,%0A
@@ -2004,25 +2004,24 @@
 opacity: 1,%0A
- 
       %22zInde
@@ -2029,18 +2029,16 @@
 %22: 9999%0A
-  
     %7D, %22
@@ -2287,18 +2287,16 @@
 nimate(%7B
-  
 borderSp
@@ -2305,24 +2305,21 @@
 ing: -90
- 
 %7D, %7B%0A
-  
       st
@@ -2339,16 +2339,15 @@
 now,
+ 
 fx) %7B%0A
-  
     
@@ -2374,32 +2374,33 @@
 bkit-transform',
+ 
 'rotateX('+now+'
@@ -2407,34 +2407,32 @@
 deg)');%0A        
-  
 $(this).css('-mo
@@ -2436,32 +2436,33 @@
 -moz-transform',
+ 
 'rotateX('+now+'
@@ -2469,34 +2469,32 @@
 deg)');%0A        
- 
- 
 $(this).css('-ms
@@ -2497,32 +2497,33 @@
 '-ms-transform',
+ 
 'rotateX('+now+'
@@ -2522,34 +2522,32 @@
 ('+now+'deg)');%0A
-  
         $(this).
@@ -2557,32 +2557,33 @@
 ('-o-transform',
+ 
 'rotateX('+now+'
@@ -2586,26 +2586,24 @@
 ow+'deg)');%0A
-  
         $(th
@@ -2622,16 +2622,17 @@
 nsform',
+ 
 'rotateX
@@ -2656,16 +2656,259 @@
     
+ 
+%7D,%0A      always: function () %7B%0A        $(this).css('-webkit-transform', '');%0A        $(this).css('-moz-transform', '');%0A        $(this).css('-ms-transform', '');%0A        $(this).css('-o-transform', '');%0A        $(this).css('transform', '');%0A   
    %7D,%0A
-  
     
@@ -2932,16 +2932,17 @@
 %22%0A    %7D,
+ 
 'linear'

Reset fadeOut animation once it is over