0:00:00.443,0:00:03.599
Welcome back to Emacs Rocks

0:00:03.599,0:00:10.016
Today we're taking a look at the glorious stuff to be done with swank-js

0:00:10.016,0:00:13.849
It's a REPL for JavaScript

0:00:13.849,0:00:15.748
I found it a little hard to install,

0:00:15.748,0:00:19.899
and I've added some convenient functions to set it up for myself.

0:00:19.899,0:00:24.820
but now I can jack into the JavaScript REPL

0:00:28.066,0:00:32.082
It has autocompletion, which is nice

0:00:32.082,0:00:35.248
But I can also run JavaScript straight from the buffer.

0:00:35.248,0:00:38.915
Eval is C-x C-e like in elisp

0:00:38.915,0:00:41.198
and the results are at the bottom

0:00:41.198,0:00:44.641
Let's square these numbers.

0:00:52.287,0:00:56.882
And I can eval-and-replace

0:00:56.882,0:00:59.032
That's pretty sweet

0:00:59.032,0:01:01.748
Okay, now for the awesome part ...

0:01:01.748,0:01:07.100
I made a little bouncy ball in Canvas

0:01:07.100,0:01:09.165
I am now connecting to it,

0:01:09.165,0:01:14.922
and I can do stuff with the browser from the REPL

0:01:25.137,0:01:26.840
But check it out -

0:01:26.840,0:01:30.036
I can write code straight in my editor too

0:01:30.036,0:01:35.550
Like setting the vertical and horizontal speed of the ball.

0:01:43.703,0:01:48.235
Both at the same time, please ... yeah!

0:01:52.696,0:01:55.406
Or I can change the elasticity of the ball,

0:01:55.406,0:02:00.567
to the point where it's gaining speed as it's bouncing.

0:02:03.459,0:02:07.298
whoa! - come back here!

0:02:28.236,0:02:30.377
Okay, let's check out the CSS

0:02:30.377,0:02:34.373
what about a nice red background?

0:02:36.403,0:02:38.148
nah ..

0:02:38.148,0:02:41.594
some stars then

0:02:43.748,0:02:47.252
yeah! cool

0:02:53.514,0:02:55.295
Now, time for some fun ...

0:02:55.295,0:02:58.865
Change the opacity, I'll make a new ball every time,

0:02:58.865,0:03:02.474
and then loop the anim 200 times.

0:03:24.028,0:03:26.721
See? There's the bouncy pattern.

0:03:26.721,0:03:31.769
Now we can change the entry speed ...

0:03:37.492,0:03:40.596
or the bounciness ...

0:03:40.596,0:03:43.700
This should dampen it quickly.

0:03:43.700,0:03:46.577
And this should make for some serious bouncing.

0:03:49.377,0:03:53.710
I can even change the gravity.

0:04:02.787,0:04:06.655
Okay, back to real animation

0:04:13.901,0:04:18.172
See, there's the pattern we just made

0:04:18.726,0:04:21.726
That's it for Emacs Rocks this time around

0:04:21.726,0:04:24.727
Swank-js is some pretty awesome stuff

0:04:24.727,0:04:29.058
If you can get it up and running that is

0:04:30.227,0:04:34.325
Till next time!