WEBVTT

00:00:00.208 --> 00:00:04.771
Our colaboration starts with developers from Mozilla Labs and the Webmaker team.

00:00:04.771 --> 00:00:08.157
Webmaker runs events all over the world, we share what we know

00:00:08.157 --> 00:00:11.861
in schools, in homes, one and one, and everywhere!

00:00:11.876 --> 00:00:17.621
With ToghetherJS, two lines of JavaScript inserted into any web page

00:00:17.621 --> 00:00:20.877
gives you instant, feature-aware collaboration

00:00:20.877 --> 00:00:23.474
You can't get that with closed platforms or Skype!

00:00:23.474 --> 00:00:27.128
Out-of-the-box you get text chat, collaborative editing, and

00:00:27.128 --> 00:00:33.553
audio chat through WebRTC audio.
So we started experimenting using ToghetherJS

00:00:33.553 --> 00:00:36.105
and Thimble, WebMaker's code editor.

00:00:36.105 --> 00:00:39.714
Here's Ankit, in Brunei, and Amati, in Chennai, creating a postcard

00:00:39.714 --> 00:00:43.437
with HTML.
It says: "Hello Mozillians" in Hindi.

00:00:43.437 --> 00:00:46.887
Now listen to what happens when Paul Max in Vancouver and Michelle in Berlin

00:00:46.948 --> 00:00:49.017
get together to learn JavaScript.

00:00:49.017 --> 00:00:50.973
Powered by WebRTC audio.

00:00:52.695 --> 00:00:54.580
Pomax joined the session.

00:00:54.580 --> 00:00:57.027
Yeah, yeah, yeah... This rain dot js thing...

00:00:57.027 --> 00:01:03.131
Does really cool graphic stuff by just drawing rain drops in a picture

00:01:03.131 --> 00:01:09.182
and if you look on line 24 through 29, it'll tell you what it wants

00:01:09.182 --> 00:01:13.207
in terms of rain drops. So, you can see this, I'm gonna actually change the size

00:01:13.207 --> 00:01:18.199
of the rain drops, just by adding a couple of 1s.

00:01:18.199 --> 00:01:19.790
Oh yeah.

00:01:22.329 --> 00:01:27.549
And what it's actually doing is it's generating rain drops based on this array.

00:01:27.549 --> 00:01:31.393
If you've covered that in your JavaScript courses already, you can actually give it

00:01:31.393 --> 00:01:35.559
all kinds of different rain drops. So I can say I want this small rain drop

00:01:35.559 --> 00:01:40.493
and I want that to kick in half the time, and the other half of the time I want

00:01:40.493 --> 00:01:46.067
one big rain drop. So this should be a bit bigger.

00:01:46.067 --> 00:01:49.134
"So if you want to see..."
"Can I make it 150?"

00:01:49.134 --> 00:01:51.647
Go for it. Change that number.

00:01:51.647 --> 00:01:55.289
Hahaha. That's a huge rain drop.

00:01:56.473 --> 00:01:59.737
I'll just kick that back to 15 instead.

00:02:01.045 --> 00:02:05.833
You can also take the image URL which is right here.

00:02:05.833 --> 00:02:07.434
image URL!

00:02:07.434 --> 00:02:12.666
Well, I live in Berlin, so maybe I'll make it very... like a gray image of Berlin

00:02:15.374 --> 00:02:17.656
Oh, nice!

00:02:17.656 --> 00:02:21.173
That's my... there right around the corner from my house

00:02:21.173 --> 00:02:24.397
Oh so then according to that it's raining quite hard

00:02:24.397 --> 00:02:31.535
So let's just say... You know what? engine.preset(... big drops

00:02:31.535 --> 00:02:34.574
There we go! That's rain in Berlin