TOMAS Reimers: Cool. So hi, almal. My naam se Tomas. Ek is 'n TF en dit is ARMAGHAN BEHLUM: Armi. Nice om jou te sien ouens. TOMAS Reimers: Cool. So ons gaan praat oor Leap Motion vandag. So Leap Motion is 'n regtig cool produk wat kan jy interaksie met 'n rekenaar in 'n ander manier. So het die hele idee agter sprong beweging is dat jy kan jou hande gebruik om te interaksie met die rekenaar. So hier het ek iets opgestel. Ek sal praat oor dit in 'n bietjie. Maar die basiese weergawe is dat jy kan sien dat Ek het my hande in die voorkant van my rekenaar en toe ek beweeg hulle, jy die analoog op die rekenaar en jy kan analiseer hierdie. Jy kan gebare maak. Jy kan jou hande gebruik om te interaksie met die rekenaar in 'n nuwe en interessante manier. 

Wel, ek het eintlik eerste wil om te slaag om af te Armi om jou te wys n paar cool demos van wat sommige mense het met dit gedoen. En dan sal ons praat oor hoe jy eintlik kode met hierdie. ARMAGHAN BEHLUM: Ja. Hello. So as ons sien, min data hier, maar laat ons sien wat sommige mense het met dit gedoen. So laat my net oop hierdie voorbeeld. En dan, so, byvoorbeeld, jy kan sien my hand analoog daar, maar nou is dit tyd sommige mense met behulp van Eenheid het besluit om 'n bietjie meer vel te sit en dinge rondom die hand. So ek kan, laat ons gaan met hierdie een, seker nie, het my hande interaksie. En jy kan waarskynlik dink 'n paar ander cool nuttige dinge wat jy kan doen met hierdie. So, dit is ten minste een voorbeeld. En dan laat spring uit hierdie. 

En dan nog 'n koel een is, laat ons gaan met hierdie een. Plasmo bal. Weereens, sou ons nie noodwendig verwag dat hierdie vlak van kompleksiteit van 'n finale projek vir CS50. Dit is net om jou te wys sommige van die, jy gee ouens 'n bietjie inspirasie vir wat julle ouens kan doen met Leap Motion. So byvoorbeeld hier is 'n koel fisika byvoorbeeld, wat daar gaan ons. Het beide my hande so nou het jy het hierdie klein plasma bal. En die bal is in reaksie op die fisika van my beweeg my hand om die bal. Nou is dit al asof die gebruik van eenheid, gebruik van soort gereedskap en raamwerke dat ons nie geleer julle ouens in die klas, maar soos jy kan 'n paar mooi sien koel run throughs met dit. 

Maar een ding wat julle kan doen die begin af nou met Leap Motion is die werk in JavaScript. Sprong Motion het 'n JavaScript API wat julle ouens kan gebruik en ons hoogs, hoogs beveel aan dat jy ouens bou jou projekte met behulp van die. So met dit, laat my slaag dit terug te Tomas om te praat oor Leap Beweging en JavaScript. TOMAS Reimers: Cool. Of wil jy om te wys hulle die Visualizer eerste? 

ARMAGHAN BEHLUM: O ja. Ja. Kom ons praat meer oor wat Visualizer. 

TOMAS Reimers: So op 'n mees basiese vlak, wanneer jy die eerste keer te spring Motion jy gaan hierdie boks te hê. Hier wil my om beheer te neem? 

ARMAGHAN BEHLUM: Ja, gaan vir dit. 

TOMAS Reimers: So wanneer jy eers te spring Motion jy gaan hierdie boks te hê. Dit het 'n toestel wat lyk iets soos hierdie. Jy prop dit in jou rekenaar, die nodige bestuurders installeer, en dan sal dit basies opgestel word. So die maklikste manier om te sorteer van ooreenkoms met Leap Motion is oop hierdie program is dit installeer genoem die sprong Motion Visualizer. En die Visualizer is letterlik wat ek hier wys. Dit laat jou toe om te sien die skeletale uiteensetting van jou hande. En wat die sprong Motion is hulle interpretasie as. So het die sprong Motion gebruik van die kamera te sorteer van kyk na jou hande en dan is dit probeer om te raai wat die basiese skelet komposisie wat jy sien op die skerm is. En dit is wat dit wys jou. ARMAGHAN BEHLUM: Elke enkele puntjie en alles wat jy sien daar is data wat beskikbaar is vir julle ouens sowel te gebruik. So jy sien dat dit vaslegging dat Tomas het vyf vingers, elk van daardie verskillende vingers is ook beskikbaar vir jou as data punte te gebruik in alles wat aansoek wat jy dalk wil. As jy wil om te sien of iemand doen 'n thumbs up jy kan sien as hul vingers krul en of hulle is duim vinger wys boontoe, of waar hul pols of palm is en dat die tipe van dinge. TOMAS Reimers: Cool. Sodat jy kan sien 'n paar gebare dit verstaan ​​beter as ander. Onthou, dat dit is op soek na jou hand van 'n kamera van die onderkant, so wanneer jy jou hande soos hierdie is dit verstaan ​​dit ten volle, maar sodra jy begin om te probeer en doen 'n thumbs up, soms is dit lees dit, soms is dit kan raai, maar eerlik die kamera kan net nie sien die duim. So dit is nie regtig seker wat gebeur. Net 'n paar beperkings in gedagte te hou wanneer jy die ontwikkeling van hierdie. 

In elk geval, so terug na hierdie gaan. Die Visualizer eintlik het 'n baie nuttige gereedskap. So het die sprong Motion is op so 'n manier dat hulle nie verwag nie om jou te interaksie met die beeld data. Hulle het nie regtig verwag om te verstaan wat gebeur agter die skerms. Wat hulle doen is bloot 'n klomp van die API's vir jou sodanig dat jy kan interaksie met hierdie data direk sonder om te verstaan wat gaan aan onder die enjinkap. 

So as ons getref H hier in die Visualizer jy sal 'n baie opsies sien. Die belangrikste een hier al is as jy getref O en dan getref H, jy sal sien dat dit kan jy trek gebare. So 'n gebaar, sal jy sien dit trek 'n pyl dwarsoor. A gebaar is een van die maniere waarop Leap Motion soort kan jy by die data sonder om dit te verwerk. So eerder as my nodig om uit te vind uit, o, was die hand beweeg, selfs as ek punt toegang, die API sal soort van net vir my, hey, hulle het hierdie gebaar. So jy kan maak basiese pyl gebare. Jy kan maak sirkel gebare. Jy kan maak afluister gebare. En jy kan maak sleutel pers gebare. Ja. En dat die soort dinge. So nou dat ons soort gesien wat Leap Motion kan doen, jy kan sien dit kan 'n lees hele klomp van gebare. Ek dink ek gaan slaag dit terug na Armi en hy gaan praat oor hoe jy by hierdie met JavaScript, hoe jy selfs begin om 'n projek met hierdie. En dan sal ons praat oor 'n paar koel plekke wat jy kan gaan met dit. ARMAGHAN BEHLUM: Ja. Klink goed. So ja, die heel eerste ding wat ons sal wil hê jy moet doen natuurlik, is na jy die sprong Motion is om gaan na leapmotion.com, stel, installeer die bestuurders en dinge. Nadat dit te doen wat jy kan gaan maak seker dat dit gekoppel. As jy sien in jou klein skinkbord die Sprong Motion ikoon en dit is groen, dan weet jy jy is al te stel. En natuurlik check presies wat Tomas net gewys het met die gebare en doen die skerm krane, en sleutel krane, en dat die tipe van dinge. 

Na dat, hoewel ons, weer, soos ek gesê het, ons het toegang tot al hierdie dinge in JavaScript sowel. Die ideale opgestel wat ons sou aanbeveel jy ouens is om te gaan in jou vhost gids, plaaslike gasheer, publiek in jou CS50 toestel. En as jy daar gaan wat jy sal sien, is 'n indeks dot HTML-lêer. Nou dat indeks dot HTML-lêer of indeks dot PHP lêer, wat ook al fyn, wat jy dan kan doen is om te gaan na jou hoof bedryfstelsel. En as jy gaan na die IP adres dit is wat in die onderste regterkantste hoek van jou toestel reg hier, soos jy kan sien, dan wat gebeur is jy gaan na die bladsy wat verwys deur die indeks dot HTML-lêer. So al die kode wat jy kan sit in daar kry gestuur en is bruikbaar hier. 

TOMAS Reimers: So is dit ook belangrik net vir verwysing dat as jy ouens eintlik weet hoe om 'n bediener jouself, of jy wil dit op die wêreldwye te sit web, jy is welkom om alles te doen. Onthou dat hierdie net JavaScript-lêers en al die sprong verwerking word op die kliënt. Daarom is dit nie regtig saak nie waar jou bediener lewens so lank as wat die rekenaar jy lees die webwerf op het Leap Motion geïnstalleer. ARMAGHAN BEHLUM: Absoluut. Soos Tomas gesê, ja, wat werk vir julle ouens. Dit is net een van ons aanbevelings. Nou begin gebruik Leap Beweging wat jy sou doen is jy die invoer van die JavaScript-lêer uit Leap Motion. En dan van daar af wat wat jy kan doen is, nou Ek het net hierdie paragraaf tag opgestel met 'n ID van die teks. Dinge wat ons sou aanbeveel is besig kontroleerder opsies vir Leap Motion met die in staat stel om gebare om waar te wees. So by verstek diegene gebare wat ons gewys het ouens, die sirkel, en die sleutel kraan, en die dunbier, dit is nie te vertoon julle ouens by verstek. Maar ons raai die gebruik van die sodat jy nie die wiel weer uitvind. In staat stel om die waar, verby die kontroleerder opsies dot lus om te spring en jy is gereed om te gaan. Want dan moet jy net gedefinieer n anonieme funksie wat sal neem in 'n raam van Leap Motion en dat raam het al die inligting wat jy gaan nodig. 

TOMAS Reimers: So net om te herhaling, jy het 'n voorwerp. Jy het hierdie funksie genoem sprong dot lus. En jy noem dit met twee argumente. Jy noem dit met een, die kontroles opsies. En daar is 'n baie opsies wat jy kan sit in daar. Die een wat ons gaan beklemtoon word sodat gebare. En as jy stel dit gelyk aan ware dan jy kan toegang op hierdie gebare kry dat ons het wat jy in die Visualizer. 

En dan is die tweede argument is 'n funksie, dit is soort van soos 'n oproep terug wat elke genoem word tyd elke raam van Leap, so elke keer sprong registers wat jou hand te beweeg, het dit 'n nuwe raam. En dit noem hierdie funksie met een argument, wat is die raam voorwerp. En dat raam voorwerp beskryf die raam as Leap dit sien. ARMAGHAN BEHLUM: Presies. So hierdie bevat al die nuttige stukkies van inligting dat ons praat oor vroeër. Nagaan raam dot gebare is 'n verskeidenheid van gebare dat die sprong beweging gevang jou hande doen in die laaste raam. So byvoorbeeld, wat ons is doen hier is ons nagaan, hey, spring, in die laaste raam het u enige gebare wat ek gedoen het vang? En indien wel, wat ons besluit om te doen is Itereer deur diegene gebare en probeer en kry 'n paar nuttige inligting van hulle. Elke gebaar het 'n unieke ID wat verband hou met dit. Hulle het tipes. Jy kan kyk na wat vingers was betrokke by die gebare deur uitcheck hierdie pointable dinge. So as wanneer jy gaan deur middel van die Sprong Motion JavaScript API dinge, wanneer hulle noem pointables, hulle praat oor hierdie vingers. En dan hande is, natuurlik, die hele hand voorwerp. 

Wat anders? Jy kan kyk hoe lank die beweging het op vir en, ja, al die nuttige dinge. So, wat ek nou doen hier is ek aangemeld die raam, en dan het ek my HTML werk te vertoon al hierdie stukkies van inligting uit die raam. So laat ons seker maak dat uit. 

So hier is dit. Hier is die indeks dot HTML-lêer. En as jy nou net gesien het toe ek net verskuif my hand Leap gevang 'n sirkel beweging. Sodat jy kan sien my doen 'n sirkel oor hier, updates met sirkel inligting. Doen dunbier, vang dunbier. Kom ons probeer om 'n blad skerm. Daar gaan ons. Skerm kraan en 'n sleutel kraan. So sleutel krane ook, deur die manier, is wanneer jy druk af. So jy kan dink Miskien speel 'n klavier. 

En dan die skerm krane is wanneer jy druk op die skerm. So kan jy dalk dink jy eintlik 'n touch screen in die voorkant van jou en jy slaan die touch skerm voor jou. En dan kan ons een gryp van hierdie voorwerpe in hier. So onthou ek het gesê dat ek verby die raam in konsole log. En so kan ons kyk na al die stukkies van inligting wat beskikbaar is in die raam as om goed te gebruik. 

Soos ek vroeër gesê het, pointables is die vingers. Op daardie oomblik het ons nie ons hande in die voorkant van die sprong Motion sodat dit geregistreer nul, maar dit is hoe jy sal begin om uit te vind miskien hoeveel vingers op die skerm. En dat die tipe van inligting. TOMAS Reimers: En onthou dit is net 'n voorwerp. So alles kan verkry word soort van soos 'n struct in C. Jy het die voorwerp noem dot die eiendom naam. En dan binne wat jy het skikkings en jy het ander voorwerpe, maar onthou dit is net 'n voorwerp. Daar is niks spesiaals want ons is met behulp van spring. ARMAGHAN BEHLUM: Ja. Cool. Moet ons kyk na 'n paar JavaScript voorbeelde? 

TOMAS Reimers: So vinnig onthou dat ons gesê dat die sprong kan eintlik loop op 'n webwerf. LeapJS net gedien om 'n kliënt. En so saam as die kliënt het Sprong Motion aangeheg dit sal werk. So Leap Motion het 'n webwerf waar mense hul voorbeelde kan deel van die dinge wat hulle gemaak het. So ons is maar net gaan om te gaan deur 'n paar van hulle om te sien wat moontlik voor duik in meer besonderhede oor hoe dit is moontlik. So ARMAGHAN BEHLUM: Kom ons kyk. TOMAS Reimers: Nou is dit moet werk. ARMAGHAN BEHLUM: So nou voordat ons sien 'n voorbeeld gebruik van Eenheid wat ons hande gelewer met 'n mooi indrukwekkende grafiese velle, maar nou kan jy sien wat jy kan doen om die dieselfde ding in 'n webblaaier. Dit is almal binne Chrome net die gebruik van JavaScript. En dan die ander mooi ding is as jy wil om te weet hoe hulle dit gedoen het, die voorbeelde op JavaScript ook code opsies sluit wat jy kan check en dan sien hoe hierdie persoon is gryp hande en kodes en so. 

So dit is al wat jy kan vind by developer.leapmotion.com. Jy kan gaan kyk JavaScript voorbeelde wat hulle daar. So ja. Hier is hierdie, oops jammer. Kom ons probeer dit weer. Oh. Ek het twee regte hande. So ja. 

TOMAS Reimers: So en weer, onthou soms Leap rommel op. Net gee dit 'n tweede. Dit is nie volmaak nie, maar dit is redelik goed. ARMAGHAN BEHLUM: Een ander aanbeveling ook is om dit nie doen nie in direkte sonlig. So die manier Leap Motion werke is, eintlik As ek wys die kamera hierdie sowel, infrarooi lig. So dit stuur diegene uit en dan lees wanneer hulle kom terug. So as jy probeer om te doen dit direkte sonlig, byvoorbeeld, is dit waarskynlik gaan nie werk nie, of dit gaan om te vereis sommige kalibrasie om dit te doen. 

Ook 'n ander aanbeveling is om te duidelik die ruimte agter die sprong en in die voorkant van spring. Dink aan dit as die werk binnekant van 'n koepel wat rondom hierdie Leap Motion voorwerp. As daar dinge reg agter dit so goed, wat gaan ook om in te meng met hoe die sprong Motion se probeer jou hand te erken en dat die tipe van dinge. 

So, byvoorbeeld, ek dink in hierdie geval is dit my laptop eintlik dit is soort van die maak van die sprong Motion. Ja, daar gaan ons. So as ek duidelik uit my laptop uit daaragter die hand wys redelik goed. So ja. Daar is dit. So, wat anders het ons hulle. TOMAS Reimers: Ek dink nou die tyd wees te sorteer van duik in en laat ons net 'n demo heeltemal van nuuts af. Dit gaan om te wees regtig eenvoudig. Basies wat ons gaan om te probeer om te doen is om dit sodat wanneer jy krap jou hand, die agtergrond gaan om te begin as rooi, en wanneer jy krap jou hand, die agtergrond gaan groen te draai. OK? Regtig eenvoudig. En dit is basies net gaan om te gaan deur 'n baie van die konsepte agter Sprong sodat ons kan kry in hierdie ideologie van hoe Leap werk en hoe ons dinge kan bou met dit. En dan van daar het ons sal waarskynlik net jou wys die API Docs en waar jy Meer hieroor kan lees. En dan sal ons dit noem dag. So wil jy Kode of wil jy my te-kode? ARMAGHAN BEHLUM: Ja. Wel, ek dink ons ​​kan werk saam op hierdie en probeer 

TOMAS Reimers: So ons sal doen 'n paar paar kodering. ARMAGHAN BEHLUM: Daar gaan ons. Dit is presies wat ek wou sien. Cool. So byvoorbeeld hier, laat ons sien. Terwyl ons iterating deur die gebare reeds, TOMAS Reimers: Wil te maak net 'n heeltemal nuwe lêer? ARMAGHAN BEHLUM: Heeltemal nuwe lêer? Ja, seker. 

TOMAS Reimers: Ja. 

ARMAGHAN BEHLUM: So laat doen. 

TOMAS Reimers: So ons gaan maak 'n heeltemal lêer. Ons sal noem dit inhandig dot HTML. Dit is cool met my. So onthou jy doen 'n HTML tag, dan binne dat jy 'n kop. Dit kop het 'n titel in dit. So blad na die ander kant. Daar gaan jy. Titel, sal ons dit noem Leap Voorbeeld. Yep. 

ARMAGHAN BEHLUM: Oops. Titel. 

TOMAS Reimers: Yep. 

ARMAGHAN BEHLUM: Daar is ons. 

TOMAS Reimers: En dan laat ons 'n liggaam. 

ARMAGHAN BEHLUM: Wag, laat ons ook seker maak om in te voer. TOMAS Reimers: Ag, natuurlik. My sleg. So maak altyd seker dat jy die sprong script so dit is 'n script wat aan jou gegee deur Leap Motion wat basies laat die webblaaier te koppel na die toestel op die gebruiker se rekenaar. En dan in hierdie ons ook moet 'n liggaam en laat ons net maak die liggaam hi sê so dat ons studente kan wys hoe om met hierdie nuwe webblad wat hulle gemaak het. ARMAGHAN BEHLUM: Natuurlik. So laat ons net sit another-- 

TOMAS Reimers: Hi, hello world. So 'n baie basiese voorbeeld. Regtig net 'n demo. 

ARMAGHAN BEHLUM: En dan hier ons kan gaan, ons noem dit hand dot HTML, reg? En oh! So ek wonder wat is verkeerd met hierdie reg nou. Kom ons voeg leesregte dot HTML te handig. TOMAS Reimers: Wil jy om dit te doen in die groot terminale sodat ons kan net wys dit op the-- 

ARMAGHAN BEHLUM: Ja, dit maak sin. Alle regte. So ek het net bygevoeg die regte, maar as ons was om te kyk na die regte voordat ons sou gesien het wat eintlik hand dot HTML nie gelees het regte en daarom kon ons nie lewer nie. Maar nou, as ons dit doen, sien ons ons bietjie hello world reg daar. 

TOMAS Reimers: So laat eintlik, as hy skryf, hello wêreld, Ek het gedink oor 'n manier ons dit kan verander. Kom ons maak dit sê hallo wêreld, en dan wanneer jy beweeg, dit sê totsiens. Reg? So hello, totsiens. 

ARMAGHAN BEHLUM: Natuurlik. 

TOMAS Reimers: Dit klink redelik goed. 

ARMAGHAN BEHLUM: Dit klink goed vir my ook. 

TOMAS Reimers: So as ons gaan om dit te doen laat ons net dink deur middel van die webblad 'n bietjie. Ons gaan 'n paar script nodig wat basies registreer dat jy beweeg en na 'n sprong, 'n golf en 'n slag, dieselfde ding. So ons gaan 'n script nodig dat basies registreer vir daardie krap. En 'n ander ding wat ons is gaan nodig is ons gaan 'n paar nodig werklike inhoud te verander. 

So as jy onthou, jQuery kan jy die inhoud te verander. So een ding wat ons dalk wil in te sluit in hierdie is die jQuery biblioteek. En dan in staat wees om te kies wat ons is eintlik gaan om inhoud te verander, wat gaan 'n ID nodig of 'n klas, of iets wat ons kan gebruik om dit te kies. So ons sal net gee dit 'n vinnige ID van verandering teks. En dan wil jy jQuery te gryp? ARMAGHAN BEHLUM: So, wat is die eerste ding op ons lys te doen, dan nou? TOMAS Reimers: Kom ons gryp jQuery? ARMAGHAN BEHLUM: Kom ons gryp jQuery, OK, cool. In daardie geval, ek gaan te hê om te actually-- waar sou wees om die beste plek om dit te doen? 

TOMAS Reimers: jQuery, so as jy Google jQuery, getref jQuery, die eerste ARMAGHAN BEHLUM: Baie eerste een. TOMAS Reimers: Of aflaai. Dit is goed. Getref aflaai v1 en v2 aan die linkerkant. So ons beskryf jQuery uit aanlyn soos jy het waarskynlik gedoen. Scroll af. Up, up. 

ARMAGHAN BEHLUM: Ag, reg nou hier? TOMAS Reimers: Of dit. Yep. So jQuery het 'n gasheer weergawe wat beteken dat jy nie eintlik nodig het om dit af te laai, maar jy is meer as verwelkom dit af te laai en die gasheer dit self. ARMAGHAN BEHLUM: Cool. So nou het ons jQuery. Nou wat is die volgende op ons lys om te doen. TOMAS Reimers: Awesome. So volgende wat ons nodig het doen, is ons werklik nodig p hello world 'n ID te gee sodat ons dit kan verander, reg? So kom ons gee 'n idee van, Ek weet nie, verander die teks? ARMAGHAN BEHLUM: Laat ons net doen dit op hierdie manier, dink ek. TOMAS Reimers: changeText, cool. En nou, laat ons net die bladsy te verfris. Maak seker alles werk. So terug in die leser. Cool. Altyd 'n goeie herinnering dat wanneer jy 'n webwerf te bou, waarskynlik elke keer as jy verfris enige ietwat beduidende verandering net omdat jy soms per ongeluk laat val 'n tag, of jy per ongeluk iets verwyder, en dan moet jy iets klein breek, maar dan wanneer jy 'n groter verandering jy soos, hoekom het hierdie groot verandering skynbaar breek die onverwante ding. So dit is altyd goed om te sorteer van gaan en doen wat gesonde verstand tjeks. 

In elk geval so nou kom ons doen 'n laaste gesonde verstand tjek, wat laat ons probeer om te verander teks sonder Leap Motion, sonder om iets, net op die bladsy laai dit sal verander hallo wêreld totsiens met behulp van jQuery. So as jy onthou jQuery ontbloot hierdie dollar teken funksie, wat ons kan CSS selector slaag om, naamlik hashtag verandering teks, wat kies die element met 'n ID van verandering teks. En dan gaan ons die metode HTML te roep op die voorwerp dit terug met die argument van 'n string totsiens, wat sal die items verander HTML om totsiens te sê. Awesome. Dit lyk pretty cool. En nou wanneer ons verfris die bladsy gaan ons om te sien dit onmiddellik verander om totsiens, reg? Omdat dit nie wag vir iets. Soort van so gou as wat script loop dit verander dit om totsiens. Cool. 

So nou, laat ons draai wat in 'n funksie. Reg. So ons gaan om te wil 'n funksie te maak. Ons sal dit noem totsiens. So funksie totsiens is gaan nie argumente te neem en dit is nie regtig gaan niks om terug te keer. En dit is net gaan om te doen in JavaScript. Uitstekend. So ons funksie totsiens nou verander die teks om totsiens, reg? So dit gee ons 'n manier om basies verandering dat die teks om totsiens wanneer ons noem daardie funksie. Reg? So, dit is pretty cool. 

ARMAGHAN BEHLUM: Wel, ons kan ook net seker maak wat nou omdat ons nie die roeping van die funksie, as ons die bladsy te verfris, sien dit gaan nie die teks te verander. 

TOMAS Reimers: Uitstekende. So nou gaan ons begin te kry in daardie sprong dinge dat ons praat. So Armi, doen wat jy wil neem dit van hier of? 

ARMAGHAN BEHLUM: Ja. Seker nie. Ek is waarskynlik gaan nodig dubbel check dinge, maar byvoorbeeld onthou ons gesê ons wil om seker te maak in Options maak ons stel sodat gebare TOMAS Reimers: Goeie vangs. ARMAGHAN BEHLUM: om waar te wees. En dan is ons aanbeveling dat jy ouens wil hardloop sprong dot lus, wat soos ons vroeër gesê het, het twee opsies, 'n into voorwerp wat is die opsies vir hoe jy wil die sprong Motion te stel om werk, en dan 'n funksie wat gaan 'n raam te vang as 'n terugbel funksie soos Tomas gesê het. En dan wysig wat jy wil hê te doen met daardie funksie. 

So het ons slaag in die opsie en nou is ons definieer 'n funksie wat sal neem in 'n raam. En nou het ons te definieer wat daardie funksie nie. Dit is ook ter wille van die toekoms, doen dit om seker te maak. TOMAS Reimers: Uitstekende. So nou het ons hierdie sprong dot lus funksie noem wat basies sê kyk Leap met hierdie opsies en elke keer iets verander, noem dit funksie raam met al die data dat jy bewus is van in die raam. Klink redelik goed. So nou vinnig gesonde verstand tjek, wat ek altyd aanbeveel, is in die sin dat net sit konsole dot log raam. En dan in Chrome dit oop en kyk na jou console en speel rond met Leap die te sien rame word aangeteken, want dit sal kry jy 'n idee van wat data wat jy het toegang tot. En soos altyd as jy verward, kyk die API verwysing. En ons sal die skakel insluit vir dat aan die einde van hierdie. 

ARMAGHAN BEHLUM: So ons verfris die bladsy en dan ons gaan en maak die konsole weer. En nou is ons agterkom dat ons met rame geslaag in, hierdie klein voorwerpe wat ons vroeër gesien het. So ja. Dit is ons rame vertoon in die konsole. Cool. 

So nou dat ons gryp die rame, as jy dalk vroeër onthou uit die voorbeeld wat ons gehad het, as ons kyk raam dot gebare kry ons die lys van gebare wat die raam mees onlangs gevang. Ons kan die lengte van daardie verskeidenheid kyk om te sien of Leap gevang enige gebare. So as dit skikking is groter as nul dan is ons weet dat ons 'n paar dinge om te doen. 

So laat draai wat in 'n as voorwaarde en nou hier wat ons weet is dat ons het 'n gebaar gesien, laat ons optree. So nou dat ons hier ons 'n gebaar te sien. TOMAS Reimers: Wel, die eerste ding is dit is nie net een gebaar, dit kan wees as baie gebare. 

ARMAGHAN BEHLUM: Baie waar. TOMAS Reimers: So per klassieke C styl hier ons sal waarskynlik wil 'n te gebruik vir lus. ARMAGHAN BEHLUM: Hier is ons dan. Ons het besluit om Itereer deur die gebare. En laat ons sien. i plus, plus. En nou, as ons dalk gemaak net 'n var gebaar gelyk raam dot gebare bracket i, nou het ons gebaar self, wat is net een enkele geval van 'n gebaar voorwerp vir ons om te werk met binnekant van hierdie lus. Alle regte. TOMAS Reimers: Let's gesonde verstand kyk weer hier en net troos dot teken gebaar om te sien wat ons kry. 

ARMAGHAN BEHLUM: Console dot log gebaar. Okie Dokie. En verfris een keer. 

TOMAS Reimers: En laat probeer om 'n gebaar. Jy sal sien dat daar 'n klomp van toe hy dunbier, jy kry 'n klomp van die gebare in die konsole en as hy probeer om 'n sirkel te doen, dit is just-- 

ARMAGHAN BEHLUM: Sirkels is net baie mooi. 

TOMAS Reimers: Nou is daar 'n vreemde ding hier, wat hy doen een sirkel, maar dit is te meld 80 gebare, reg? Dit is 'n baie gebare. Dus is die eerste soort van ding te besef, en dit kan verwarrend wees, is dat 'n gebaar is nie net een keer aangeteken. 

Op elke raam, regs, so as ek doen 'n sirkel Sprong sal hierdie spoor is 'n verandering van hierdie is 'n verandering van hierdie is 'n verandering. En dit sal aanmeld elke een van daardie. Maar in elke een van daardie, dit gaan om te sê, o, daar is 'n gebaar tans aan die gang. So laat ek net sê, hey, daar is 'n gebaar en dit is tans aan die gang. So wat ons wil nie doen is sê, o, op elkeen van daardie gebare wat jy wil teks te verander. Wat ons wil doen, is wanneer daardie gebaar stop, en ons kan kyk vir wat, dan wil ons teks te verander. ARMAGHAN BEHLUM: Mhmm. Dus, net soos Tomas is verduidelik hierdie gebare mag voorkom deur middel van verskeie rame, maar byvoorbeeld, toe ons met daardie sirkel, kan ons sien dat die ID vir daardie een enkele sirkel wat ons dalk het probeer om te voltooi was dieselfde ID regdeur. En in die feit, kan jy ook check die status. opgedateer. 

En dan is dit waarskynlik die laaste sirkel wat, O, goed, OK. So soms toon dit dat jy 'n status van die stop 'n gebaar en dit wys dat jy ook 'n status van die begin van 'n nuwe gebaar wanneer dit erken vir seker dat jy begin 'n nuwe gebaar. Byvoorbeeld in hierdie geval. TOMAS Reimers: Cool. ARMAGHAN BEHLUM: So ja. En dan, laat ons sien. Jy kan ook sien al was ons maak 'n sirkel en gebare het 'n stuk grond genoem tipe wat ons vertel watter soort van gebare wat. Sodat bruikbare vir ons kan wees jy probeer en te doen wat ons doen. TOMAS Reimers: So oorgang terug na JS, die eerste ding wat kom by my ook, net lees deur middel van hierdie kode is daar 'n klein optimalisering, wat is ons eintlik moet nie hierdie as toestand, reg? Want as raam dot gebare dot lengte is nul, wat lus se nie in elk geval gaan hardloop. Sodat ons kan net so goed gaan voort en ontslae te raak van daardie. Weereens, terwyl jy kode skryf dit is belangrik om terug en sorteer gaan van refactor as jy besef dat jy kon iets gedoen het beter, of dat daar 'n ander manier om dit te doen nie. So nou het ons net gaan om dit te skoon te maak vinnig en ook skoon te maak jou kode. Dit is 'n groot deal. 

ARMAGHAN BEHLUM: Goeie styl word baie waardeer. 

TOMAS Reimers: Jy kan altyd sê wanneer iemand het kode waar daar gebruik 'n wees as toestand en dan moet hulle dit verwyder, maar hulle het nie Uncomment dit. Dit is baie duidelik en dit soort van lyk lelik. ARMAGHAN BEHLUM: So, wat is volgende op die lys om te doen? TOMAS Reimers: So nou as ons sê: Ek dink die eerste ding wat ons wil doen is seker te maak dat die gebaar se eintlik 'n slag, reg? 

ARMAGHAN BEHLUM: Ja. 

TOMAS Reimers: So as ons sê dat ons totsiens is soort van soos 'n krap, ons gaan met dit is 'n dwarsklap, die eerste ding wat ons nodig het om te sê, is, hey, is die gebaar tik 'n slag, reg? Nie 'n sirkel of 'n top, maar is dit 'n slag? So het die manier waarop ons dit kan doen is wat ons kan sê gebaar dot tipe gelyk gelyk krap as 'n string. 

ARMAGHAN BEHLUM: [onhoorbaar] gebaar dot tipe gelyk gelyk krap. Daar is ons. 

TOMAS Reimers: En dan is die laaste vraag ons wil sien is gebaar dot staat gelyke gelyk stop, reg? So dit is wanneer die gebaar is gestop. Ek dink eintlik vir swipe, ek weet dit uit die bokant van my kop, maar jy is welkom om kyk dit, wanneer jy krap elke keer as dit registreer dit totdat jy stop is 'n begin gebaar. En dan is die laaste een se net 'n stop gebaar. So sal daar net een stop wees gebaar, wat is 'n groot vir ons. So wat ons kan doen is om te sê as gebaar dot tik gelyk gelyk krap en gebare dot status gelyk gelyk stop, dan laat ons gesonde verstand kyk hier troos dot log gebaar. 

So ons sal terug te gaan hier. Ons sal die bladsy te verfris. En nou moet die enigste tyd om iets wees konsole dot aangemeld is wanneer ons krap. En ons probeer om te krap en ons sien niks nie. Reg? So dit is eintlik 'n groot probleem. Ons nie sien wat ons verwag het nie. En ontfouting kan 'n groot deel hiervan te wees. So die eerste ding wat ons gaan om te sê is, OK, laat ons troos dot teken dit as gebaar dot tik gelyk gelyk krap. ARMAGHAN BEHLUM: Ja, laat ons dit doen. TOMAS Reimers: So is ons gaan terug na hierdie gaan. Ons sal verfris. Ons sal krap. En ons gaan 'n klomp van hulle om te sien. OK. So duidelik die probleem was met ons gebare dot status. So as ons oop een van hierdie ons sal kyk in die voorwerpe en ons sal sien, Wel, dit is 'n stop, maar, o, dit genoem staat, nie status. So as ons kop terug na ons kode wat ons kan sê As gebaar dot tipe gelyk gelyk swipe en gebare dot staat gelyke gelyk stop, dan sal ons dot troos teken dit. En so verfris. Ons krap. En ons sal sien wat op elke slag, ons is net om een, wat is die einde, wat is 'n groot, reg? Dit is wat ons wil hê. 

ARMAGHAN BEHLUM: Yep. En ons kan ook sien dat die ID's vir elk van hierdie gebare is geskei. So as Tomas gesê het, want ons is vang hierdie een stop staat wat bestaan ​​aan die einde van 'n krap, is ons om individuele aparte gebare van Leap Motion. Groot. 

TOMAS Reimers: Kom ons gaan voort en net nie die finale ding, wat is, 

ARMAGHAN BEHLUM: Goodbye. 

TOMAS Reimers: Awesome. En nou, laat ons kyk na ons webwerf. Een 

ARMAGHAN BEHLUM: Tweede. Ons het nie, ja, ons het dit noem Goodbye. Groot. 

TOMAS Reimers: Nee, Goodbye is 'n ware funksie. 

ARMAGHAN BEHLUM: Ja. Kom ons doen dit. 

TOMAS Reimers: En wanneer ons waai totsiens, dit sê totsiens. 

ARMAGHAN BEHLUM: Ons het 'n oorwinning. 

TOMAS Reimers: So mooi opwindende dinge. Hopelik kan jy iets te bou anders, maar jy kry die idee van, reg? Jy kan opspoor gebare. Jy kan funksies noem. En van daardie wat werklik gee jy 'n paar baie fundamentele boustene om te sê, o, miskien wanneer hulle krap up, want jy kan ook dinge spoor soos rigting. Ek wil vir hulle iets om te doen. Of wanneer hulle krap reg, ek wil hê dat hulle om iets te doen. En ons kan begin om te kry kreatiewe met presies hoe ons gaan ons webwerf te verbeter die gebruik van hierdie krap gebare of sirkel gebare, of kraan gebare, óf sleutel krane of skerm krane. En dan anders as dat jy meer as welkom om te speel met die werklike data, maar as jy wil om te doen dat ons stel voor jy gaan na die dokumente want hulle is eintlik regtig 'n goeie. So op pad na die dokumente nou. Of wil jy om te praat oor wat? 

ARMAGHAN BEHLUM: Ja. Kom ons doen dit. Ook 'n ander versnapering van die raad, probeer en dink van hierdie in 3D. So eintlik laat trek dié gebare een keer konsole dot log gebaar en ons doen dit. Kom terug in en nou laat ons probeer om 'n paar van hierdie, n paar van daardie. 

As ons gaan in en check hierdie gebare sowel soos jy kan sien dat hulle is dimensionaliteit is in drie rigtings, eintlik. So nie net beperk nie om jouself te 'n 2D-skerm selfs al het jy dalk wees op 'n 2D webwerf. Jy kan probeer en dink hoe 'n gebruiker kan interaksie met die webwerf in 3D. TOMAS Reimers: In 'n 3D ruimte. ARMAGHAN BEHLUM: Presies. En ja. So jy kry aanwysings, snelhede, al hierdie koel stukkies inligting. 

TOMAS Reimers: En as jy nie vertroud is met dit, dit gaan x, y, en dan z is hierdie laaste dimensie. Net iets wat jy waarskynlik is vertroud is met as jy met 3D gehandel het koördineer vliegtuie voor. As jy nie het nie, dit is dieselfde as 'n 2D een behalwe daar is 'n derde dimensie. Ons noem dit z. En alles, soort van soos rigting, en dit is waar dit gaan, position-- Ek dink dit kan selfs versnelling blootstel, ek is nie seker nie. 

ARMAGHAN BEHLUM: Ja, ek glo nie. Dit het beslis spoed. Ek het eintlik nie 100% seker oor versnelling. 

TOMAS Reimers: Dit kan 'n opsie wees jy kan gee aan iets. So posisie en spoed blootgestel in hierdie soort van drie koördinate. So x, y, z of delta x, delta y, z delta. So nou op pad na die dokumentasie dit is developer.leapmotion.com en dan kan jy Dokumentasie klik. Weereens, Leap Motion het al hierdie wonderlike APIs, een vir JavaScript, een vir C Sharp en Unity, een vir C ++, een vir Java, een vir Python, en een vir doelstelling C. Ek persoonlik sou stoot jou na JavaScript of as jy wil 'n leer nuwe taal, probeer Python. Beide van die tale wat ek saam met hom gewerk voor en hulle is regtig maklik om te leer en jy het reeds JavaScript, weet watter maak dit 'n baie goeie aanspraakmaker. 

Een woord van waarskuwing wanneer jy in die dokumente. Maak seker dat jy op Docs v2.0. Want as jy op weergawe een, sal dit nie werk nie. Ook vir die voorbeeld gallery. Ons het 'n goeie 30 minute probeer om die debug ons Leap voordat ons besef dat V1 werk nie met V2. So maak seker dat jy op weergawe twee. En dan sal ek hom laat wys jou die dokumente. ARMAGHAN BEHLUM: Ja. So hier is die API oorsig en dan 'n paar stukkies en brokkies van die inligting wat ons reeds gesê het. Mooi klein swaai hande bo 'n sprong Motion. En 'n herinnering om te dink oor die ruimte in 3D. Een van die eerste voorwerpe te dink oor met Leap Motion is hande, natuurlik. Ons het daardie erken deur die Visualizer. En dan moet jy dalk ' gesien dat dit erken deel van die pols en die arm wat verband hou met dit. TOMAS Reimers: As jy wil hê te trek die Visualizer. ARMAGHAN BEHLUM: Ja, Kom ons doen dit weer. TOMAS Reimers: Jy kan sien, altyd net 'n goeie herinnering aan soort van sien nie, die Visualizer probeer om te wys al die data wat Leap sien. So jy sal sien dat ons hierdie soort van vier punte deur die pols en dan die werklike pols. En jy het ook hierdie bal by die palm. Al hierdie punte herken, erken deur die sprong. 

ARMAGHAN BEHLUM: Presies. En so met die hand voorwerp elke raam het 'n hand verskeidenheid sowel waar jy kan ook ' links en regs hande. Jy kan kry wat rigting die hande is die gesig staar met die normale rigting van die palm, of soos hulle dit noem die palm normaal. Wat anders het ons? Ons het ook, oops. Kom ons probeer en rol af op hierdie manier. Die arms, die vingers is verteenwoordig deur die vinger klas, wat is 'n pointable voorwerp. Dus, net soos ons sê, ons sien dat verskeidenheid van pointables vir elke hand. Dit is die klein vingers te dink oor. So, dit is 'n goeie oorsig te gaan deur te probeer verstaan. TOMAS Reimers: [onhoorbaar] hand anatomie daar. ARMAGHAN BEHLUM: Ja, presies. So ja. Daar is 'n baie van rou data dat die Sprong Motion neem in interpreteer goed vir jou, so dit is 'n groot idee om te gaan deur middel van hier en probeer uitvind hoe Leap het reeds uitgepluis dinge uit vir jou en so die inligting wat jy beskikbaar van daar af. En dan van daar het ek sou aanbeveel gaan in hierdie links artikel hier, wat gaan, goed eintlik nee, dit is eintlik net meer API dinge about-- 

TOMAS Reimers: Die API verwysing na die onderkant is gewoonlik 'n goeie plek om te gaan. Julle het waarskynlik gesien wanneer ons het die Google Maps PSET. Maar die verwysing regtig gaan net deur al van die funksies en parameters beskikbaar in die voorwerp aan jou. 

ARMAGHAN BEHLUM: Ja. Byvoorbeeld, dit is wat Ek was op soek na voor. Wanneer ons 'n hand wat ons kan gaan en uit te vind hoe Leap beveel aan ons 'n hand uit te vind. Soos ek vroeër gesê het, ons het 'n hande skikking. Vind uit as ons hande en dan probeer en gryp 'n enkele hand om met daardie manier. So dit is wat ons aanbeveel vir julle ouens. Die gebare en dinge so goed. Dit API dokumentasie gaan 'n fantastiese instrument vir julle ouens. U enige ander aanbevelings nie? 

TOMAS Reimers: Ek doen dit nie. Ek dink dit is goed vir nou. 

ARMAGHAN BEHLUM: Ja, Ek dink nie so nie so goed. Voel vry om ons te e-pos en kry in kontak oor Leap Motion as jy met miskien enige kwessies of nodig het om enige aanbevelings. En ons kan probeer en vind dinge met julle ouens as well. Dankie. 

TOMAS Reimers: Groot.