>> TOMAS REIMERS: cool.
Tak ahoj, všetci.
Volám sa Tomas.
Som TF a to je
ARMAGHAN BEHLUM: Armi.
Som rád, že vás vidím ľudí.
TOMAS REIMERS: cool.
Takže budeme hovoriť o Leap Motion dnes.
Takže Leap Motion je naozaj super výrobok, ktorý
vám umožní komunikovať s počítač iným spôsobom.
Takže celá myšlienka skok pohyb je, že vás
použiť svoje ruky komunikovať s počítačom.
Tak tu mám niečo nastaviť.
Porozprávam sa o tom trochu.
Ale základnej verzii je môžete vidieť, že mám ruky pred
z môjho počítača, a keď som ich presunúť, dostanete analógového na počítači
a môžete analyzovať to.
Môžete vytvoriť gestá.
Môžete použiť svoje ruky komunikovať s počítačom
V novom a zaujímavým spôsobom.
>> No, vlastne som sa prvýkrát chcú vydávať na Armi
vám ukázať nejaké zaujímavé ukážky toho, čo niektorí ľudia robili s tým.
A potom sa budeme baviť o tom, ako ste vlastne kód s tým.
ARMAGHAN BEHLUM: Jo.
Dobrý deň.
Tak, ako sme videli, málo Údaje tu, ale poďme sa pozrieť
to, čo niektorí ľudia robili s tým.
Takže mi dovoľte otvoriť tento príklad.
A potom, takže napríklad môžete vidieť moja ruka tam analóg, ale teraz tentoraz
niektorí ľudia používajú Unity majú rozhodol sa dať trochu viac kože
a tak okolo ruky.
Tak som si, poďme s tymto, Iste, majú ruky interakciu.
A vy si asi predstaviť, pár ďalších skvelých užitočných vecí
že si môžete robiť s tým.
Takže to je aspoň jeden príklad.
A potom sa poďme skočiť z toho.
>> A potom ďalší kľuďas je, poďme s týmto.
PLASMA guľou.
Opäť platí, že by sme nemali byť nutne očakávať, že túto úroveň zložitosti
z konečného projektu pre CS50.
To je len ukázať niektoré, vám chlapci
trochu inšpirácie pre to, čo vy môžete robiť s Leap Motion.
Tak napríklad tu v pohode napríklad fyzika, ktorý tam ideme.
Má obe moje ruky, takže teraz si majú tento malý plazma gule.
A loptu reaguje na fyzike ma pohybujúce sa ma za ruku okolo gule.
Teraz je to všetko však používa Unity, za použitia druhu nástrojov a rámcov
že sme sa učili chalani v triede,
ale ako môžete vidieť niektoré docela pohode beh priechodky s tým.
>> Ale jedna vec, ktorá vy môžete robiť rozjazde teraz s Leap Motion
je práca v jazyku JavaScript.
Leap Motion má API JavaScript, ktorý vy môžete používať a dôrazne, vysoko
Odporúčame, aby chlapci vybudovať Vaše projekty využívajúce že.
Takže s tým, dovoľte mi, aby som odovzdať ho späť off Tomášovi
hovoriť o Leap Motion a JavaScript.
TOMAS REIMERS: cool.
Alebo chcete zobraziť je Visualizer prvý?
>> ARMAGHAN BEHLUM: Oh áno.
Áno.
Poďme hovoriť viac o tom Visualizer.
>> TOMAS REIMERS: Takže na najzákladnejšie level, keď prídete do Leap Motion
budete mať toto políčko.
Tu, chcú, aby som prevziať kontrolu?
>> ARMAGHAN BEHLUM: Jo, ísť na to.
>> TOMAS REIMERS: Takže keď sa Najskôr sa na Leap Motion
budete mať toto políčko.
To má zariadenie, ktoré vyzerá nejako takto.
Môžete ho zapojte do vášho počítača, nainštalovať potrebné ovládače,
a potom sa v podstate byť nastavená.
Takže najjednoduchší spôsob, ako triediť z obchodu s Leap Motion
je otvoriť tento program sa nainštaluje volal Leap Motion Visualizer.
A Visualizer je doslova to, čo som tu ukazovať.
To vám umožní vidieť kostrové prehľad o vašich rúk.
A čo Leap Motion interpretuje ich ako.
Takže Leap Motion využíva kamery triediť z pohľadu na svoje ruky
a potom sa snažia odhadnúť, čo základné kostrové zloženie, ktoré vás
vidieť na obrazovke je.
A to je to, čo vám ukáže.
ARMAGHAN BEHLUM: Každý jediný zmysel
a to, že ste vidieť, že je Údaje, ktoré je k dispozícii na vami
tiež použiť.
Takže vidíte, že je to zachytenie, že Tomas
má päť prstov, každý z tieto jednotlivé prsty
sú k dispozícii aj pre vás údaje body pre použitie v akejkoľvek aplikácii
že budete chcieť.
Ak chcete zistiť, či niekto robí palce hore
vidíte, či prsty sú skrútené a či sú
palec prst smeruje smerom nahor, alebo ak
ich zápästia alebo dlaň je a tento druh vecí.
TOMAS REIMERS: cool.
Takže môžete vidieť niektoré gestá to chápe lepšie ako ostatní.
Pamätajte si, že sa pozerá na vaše ručne z kamery na od dna,
takže keď máte ruky ako to, že je plne chápe,
ale akonáhle začnete, aby sa pokúsila urobiť palec hore, niekedy to číta,
Niekedy to môže hádať, ale úprimne fotoaparát jednoducho nemôže vidieť palec.
Takže to nie je naozaj istí, že to, čo sa deje.
Len niektoré obmedzenia mať na pamäti, keď ste vývoji s tým.
>> Každopádne, takže sa vracia do toho.
Visualizer vlastne má veľa užitočných nástrojov.
Takže Leap Motion je naprogramovaný takým spôsobom,
že neočakávajú, aby ste komunikovať s tým, že obrazovými dátami.
Nemajú vlastne Očakávam, že pochopiť
čo sa deje v zákulisí.
To, čo robia, je vystaviť banda API pre vás
taká, že môžete komunikovať s týmito dátami
priamo bez pochopenia čo sa deje pod kapotou.
>> Takže ak sme narazili H tu v Visualizer uvidíte veľa možností.
Dôležitý tu však je, ak trafíte O a stlačiť H,
uvidíte, že to umožňuje kresliť gestá.
Takže gesto, uvidíte čerpá šípku naprieč.
Gesto je jedným zo spôsobov, ktoré Leap Motion druh vám umožní dostať sa na údaje
aby bolo nutné ich spracovávať.
Takže skôr než ma museli prísť out, oh, ruka bola v pohybe,
aj keď mám prístupový bod k API bude nejako mi to povedať,
hej, oni robili toto gesto.
Takže si môžete urobiť základné šípkami gestá.
Môžete vytvoriť kruh gestá.
Môžete vytvoriť kliknutím na gestá.
A vy môžete urobiť kľúčové tlačové gestá.
Jo.
A také veci.
Takže teraz, že máme trochu videl, čo Leap Motion sa dá robiť,
môžete vidieť, že vie čítať celá partia gest.
Myslím si, že budem odovzdať ho späť na Armi
a on sa bude hovoriť o tom, ako vám na nich s JavaScript,
ako ste dokonca začať projekt s tým.
A potom budeme hovoriť o niektorých pohode miest, kam môžete ísť s tým.
ARMAGHAN BEHLUM: Jo.
Znie to dobre.
Tak jo, prvá vec, ktorú by sme bude chcieť, aby si samozrejme,
je potom, čo sa dostanete Leap Motion je na prejsť na leapmotion.com, nastaviť, nainštalovať
vodiči a tak.
Potom, čo robí, že môžete ísť uistite sa, že je pripojený.
Vidíte-li v malom zásobníku Leap Motion ikona a je to zelené,
potom viete, že to je všetko.
A samozrejme, pozrite sa, čo presne Tomas len ukázal tie gestá
a robí na obrazovke kohútiky, a kľúčové kohútiky, a tento druh vecí.
>> Potom však my, ešte raz, ako som povedal,
máme prístup ku všetkým z nich veci v JavaScripte rovnako.
Ideálne nastavenie, ktoré by sme vám odporúčame
chlapi, je ísť do vhost adresár, miestne hostiteľ,
verejnosť v CS50 spotrebiča.
A keď sa tam to, čo budete vidieť, je index bodka súbor HTML.
Teraz, keď index dot HTML súbor alebo index dot
PHP súbor, podľa toho, čo je v poriadku, čo sa potom môžete robiť
je ísť do hlavného operačného systému.
A keď idete na IP adresy ktorá je uvedená v pravom dolnom rohu
rohu vášho prístroja priamo tu, ako môžete vidieť, potom to, čo sa deje
sa môžete prejsť na stránku, ktorá je odkazuje, že index bodka HTML súboru.
Takže všetok kód, ktorý môžete umiestniť do tam dostane poslal a je použiteľný tu.
>> TOMAS REIMERS: Tak to je taky dôležité len orientačné
že ak vy vlastne viete, Ako nastaviť server sám,
alebo ak chcete dať na celom svete tento web, ste vítaní robiť čokoľvek.
Pamätajte si, že sa jedná o len súbory JavaScript
a všetky spracovanie Leap sa vykonáva na strane klienta.
Takže to naozaj nezáleží kde sa váš server životy
tak dlho, kým počítač si prezeráte webové stránky na
nainštaloval Leap Motion.
ARMAGHAN BEHLUM: Presne tak.
Rovnako ako Tomáš povedal, jo, čo pracuje pre vás.
To je len jeden z našich odporúčaní.
Teraz začať používať skok Motion, čo by ste urobili
sa chcete importovať JavaScript súbor z Leap Motion.
A potom sa tam to, čo môžete urobiť, je práve teraz
Mám len tento odsek štítok nastaviť s ID textu.
Veci, ktoré by sme Odporúčame sú možnosti nastavenia regulátora
pre Leap Motion s umožňujú gestá aby to bola pravda.
Takže v predvolenom nastavení tými gestá, ktorá vám ukázali
chalani, kruh, a kľúč kohútik, a oháňa,
tie, ktoré nie sú zobrazené na chlapci v predvolenom nastavení.
Ale odporúčame používať tie takže nie ste objavovanie Ameriky.
Povolenie pre tých, pravda, okolo tých Možnosti radiče skočiť dot slučky
a to je všetko, aby mohli vyraziť.
Vzhľadom k tomu, potom stačí len definovali anonymné funkcie
, Ktorý bude mať v rám z Leap Motion
a že rám má všetky Informácie, ktoré budete potrebovať.
>> TOMAS REIMERS: Takže len preto, aby rekapitulácia, budete mať jeden objekt.
Máte túto funkciu volal skok dot slučka.
A vy to nazývate s dvomi argumentmi.
Zavoláte to s jedným, možnosti regulátor.
A existuje veľa Voľby, ktoré môžete umiestniť tam.
Ten budeme Dôraz je umožniť gestá.
A ak si nastavíte ju na hodnotu pravda, potom môžete získať prístup na tohle gest
že vám ukázal v Visualizer.
>> A potom druhý argument je funkcie, je to niečo ako spätné volanie
ktorá sa bude volať každý čas každú rámec Leap
Takže zakaždým, keď prestupné registre, ktoré vaša ruka ťah, to má nový rám.
A to volanie tejto funkcie s jedným argument, ktorý je predmetom rámik.
A že rám objekt opisuje rám ako skok to vidia.
ARMAGHAN BEHLUM: Presne tak.
Takže tento obsahuje všetky užitočné kúsky informácií
že sme hovorili o tom skôr.
Kontrola snímok dot gestá je pole gest
že skok pohyb chytil svoj ruky robia v poslednom framu.
Tak napríklad, to, čo sme tu sa budeme kontrolovať,
hej, Leap, v tom poslednom snímke urobil chytiť všetky gestá, ktoré som urobil?
A ak áno, čo sme sa rozhodli urobiť Je iterovat týchto gest
a pokúsiť sa získať nejaké užitočné informácie z nich.
Každé gesto má jedinečný ID s ním spojené.
Majú typy.
Môžete sa pozrieť na ktoré prsty boli zapojení do gestá
kontrolou túto smerovateľná veci.
Takže ak, keď idete cez Leap Motion JavaScript API veci,
keď sa zmieniť pointables, oni hovoria o týchto prstov.
A potom ruky sú, samozrejme, celý ruka objekt.
>> Čo ešte?
Môžete skontrolovať, ako dlho pohyb pokračoval
pre a, áno, všetky tie užitočné veci.
Takže to, čo robím práve teraz Tu je, že som prihlásený rám,
a potom som aktualizovať HTML na zobrazenie všetky tieto bity informácií
z rámu.
Takže poďme skontrolovať, že von.
>> Tak tu to je.
Tu je súbor HTML index bodka.
A ako ste práve videli, keď som sa práve presťahoval moja ruka Leap chytil kruhu pohyb.
Takže vidíte, ma robí kruh cez tu, aktualizuje informácie kruhu.
Robiť oháňa, chytá oháňa.
Skúsme kartu obrazovky.
Tam sme ísť.
Kliknite na obrazovke a kliknite na kľúč.
Takže kľúčové kohúty Tiež tým, že spôsobom, sú, keď narazí dole.
Takže si viete predstaviť Možno, že hrá na klavír.
>> A potom sa na obrazovke kohútiky keď narazí na obrazovku.
Takže si dokážete predstaviť, možno si skutočne majú dotykovú obrazovku pred sebou
a vy ste biť na dotyk obrazovky pred vami.
A potom sa môžeme chytiť jeden z týchto objektov v sem.
Takže pamätajte Povedal som, že som bol absolvovanie rám do logu konzoly.
A tak sa môžeme pozrieť na všetky kúsky informácií
ktoré sú k dispozícii v že rám tiež použiť.
>> Rovnako ako som povedal predtým, pointables sú prsty.
V tej chvíli sme nemali naše ruky pred Leap Motion
tak to zapísaná nula, ale to je to, ako vás
začne zistiť možná Koľko prstov je obrazovka.
A tento typ informácií.
TOMAS REIMERS: a spomínanie je to len objekt.
Takže všetko, čo sa dá pristupovať niečo ako struct
v C. Tie majú za cieľ meno bodka názov vlastnosti.
A potom v rámci ktorej máte polia a máte ďalšie objekty,
ale pamätajte, že je to len objekt.
Na tom nie je nič zvláštne preto, že sme pomocou skok.
ARMAGHAN BEHLUM: Jo.
Super.
Mali by sme vyskúšať pár príkladov JavaScript?
>> TOMAS REIMERS: Tak Rýchlo si uvedomiť, že my
povedal, že Leap môže v skutočnosti spustiť na všetkých stránkach.
LeapJS práve podáva klientovi.
A tak spolu ako klient Leap Motion pripojený že to bude fungovať.
Takže Leap Motion má webové stránky, kde sa ľudia
môžu zdieľať svoje príklady z vecí, ktoré urobili.
Takže sme jednoducho ísť prostredníctvom niekoľkých z nich
aby zistili, čo je možné pred potápanie do viac špecifiká o tom, ako
je to možné.
Tak
ARMAGHAN BEHLUM: Uvidíme.
TOMAS REIMERS: Teraz je potrebné pracovať.
ARMAGHAN BEHLUM: Tak teraz predtým, než sme videli príklad
pomocou jednoty, ktorá vykreslený naše ruky s celkom pôsobivé grafické kožou,
ale teraz môžete vidieť, čo môžete urobiť to isté vnútri webovom prehliadači.
To všetko je v Chrome len pomocou JavaScript.
A potom ďalšie pekné vec je, ak chcete
vedieť, ako to urobili, príklady na JavaScripte
tiež obsahovať kódu, ktoré si môžete vyskúšať a potom uvidíte
ako sa táto osoba bola schmatol ruky a kódy a tak.
>> Tak to je všetko, čo môžete nájsť na developer.leapmotion.com.
Môžete ísť a check-out JavaScript príklady, ktoré tam majú.
Tak jo.
Tu sú tie, oops ľúto.
Skúsme to znova.
Oh.
Mám dve pravej ruke.
Tak jo.
>> TOMAS REIMERS: Tak a ešte raz, pamätať niekedy Leap skazí.
Len to chvíľu.
Nie je to dokonalé, ale je to celkom dobré.
ARMAGHAN BEHLUM: One ďalšie odporúčania tiež
je to robiť na priamom slnečnom svetle.
Spôsob, akým Leap Motion Práca je, v skutočnosti
ak ukážem kameru tento tiež, infračervené svetlo.
Tak to posiela tie, a potom sa číta je, keď sa vráti.
Takže ak sa snažíte to urobiť priamemu slnečnému žiareniu,
Napríklad, je to asi nebude fungovať,
alebo, že to bude vyžadovať niektorí kalibrácia, aby tak urobili.
>> Aj ďalšie odporúčanie je vyčistiť priestor za skok
a pred Leap.
Ber to ako práca vnútri kupoly, ktorá je
obklopujúce tento objekt Leap Motion.
V prípade, že je vec správna za to, ako dobre,
že to tiež bude zasahovať s tým, ako Leap Motion sa snaží
rozpoznať ruku a tento druh vecí.
>> Tak napríklad, myslím, že v tomto prípad, že je to môj notebook vlastne
to je niečo robiť Leap Motion.
Jo, ideme na to.
Takže keď som sa vypratať svoj laptop od Za ním ruka objaví celkom dobre.
Tak jo.
Tam je to.
Takže to, čo ešte sme sa im ukázať.
TOMAS REIMERS: Myslím si, že Teraz bude čas
triediť ponoru do a Povedzme vytvoriť demo úplne od nuly.
Bude to naozaj jednoduché.
V podstate to, čo budeme pokúsiť sa urobiť, je, aby to
tak, že keď prejdete rukou, na pozadie sa začnú tak, ako červené,
a keď prejdete rukou, pozadie sa bude zelenať.
OK?
Naozaj jednoduché.
A to je v podstate len ísť cez mnoho
z koncepcií, Leap takže môžeme
dostať sa do tejto ideológie ako Leap funguje a ako môžeme stavať veci s tým.
A potom sa tam stretneme Pravdepodobne len ukázať vám
Docs API a kde na vás môžete prečítať viac o tom.
A potom budeme hovoriť deň.
Takže chceš kód alebo chceš, aby som kódu?
ARMAGHAN BEHLUM: Jo.
No, myslím, že môžeme pracovať spoločne na to a skúste
>> TOMAS REIMERS: takže budeme urobiť nejaké pár kódovanie.
ARMAGHAN BEHLUM: sme tam ísť.
To je presne to, čo som sa chcel vyskúšať.
Super.
Tak napríklad v tú, poďme sa pozrieť.
Aj keď sme sa iterácie prostredníctvom gest už,
TOMAS REIMERS: Chcete, aby sa Len celkom nový súbor?
ARMAGHAN BEHLUM: Úplne nový súbor?
Jo, určite.
>> TOMAS REIMERS: Jo.
>> ARMAGHAN BEHLUM: Tak poďme to urobiť.
>> TOMAS REIMERS: Takže ideme aby sa úplne súboru.
Budeme hovoriť, že ruky dot HTML.
To je v pohode so mnou.
Takže pamätajte urobíte značku HTML, potom v rámci ktorej budete mať hlavu.
Táto hlava má titul v ňom.
Takže karta iná cesta.
Tu to je.
Titul, budeme hovoriť Leap príklad.
Jo.
>> ARMAGHAN BEHLUM: Oops.
Názov.
>> TOMAS REIMERS: Jo.
>> ARMAGHAN BEHLUM: Tu to máme.
>> TOMAS REIMERS: A potom poďme urobiť telo.
>> ARMAGHAN BEHLUM: Počkajte, poďme Tiež skontrolujte, či chcete importovať.
TOMAS REIMERS: Oh, samozrejme.
Má zlé.
Takže vždy uistite, že máte Leap skript, tak to je scenár vám dané
od Leap Motion, ktorá v podstate umožňuje webový prehliadač pre pripojenie
do zariadenia na počítači užívateľa.
A potom sa v tomto tiež potrebujú telo a povedzme,
aby sa telo pozdraviť tak že môžeme ukázať študentom
ako sa pripojiť k tejto novej webové stránky, ktoré robil.
ARMAGHAN BEHLUM: Iste.
Tak nech to len dať another--
>> TOMAS REIMERS: Ahoj, ahoj svet.
Takže veľmi jednoduchý príklad.
Naozaj len demo.
>> ARMAGHAN BEHLUM: A potom tu máme môže ísť, sa nazýva sme to ruka dot HTML,
že jo?
A oh!
Tak by ma zaujímalo, čo je zle s týmto práve teraz.
Poďme pridať povolenie na čítanie do ruky dot HTML.
TOMAS REIMERS: Chcete na to vo veľkom termináli
takže môžeme len ukázať, že na the--
>> ARMAGHAN BEHLUM: Jo, to dáva zmysel.
Dobrá.
Tak som pridal oprávnenia, ale ak
boli sa pozrieť oprávnenia než sme
by vidieť, že vlastne za ruku dot HTML nemal povolenie na čítanie
a preto sme nemohli urobiť to.
Ale teraz keď to urobíme tak, vidíme svoju malý hello world práve tam.
>> TOMAS REIMERS: Takže je vlastne, ako písal, Hello World,
Myslel som, že o spôsobe môžeme zmeniť.
Urobme to hovoriť Hello World, a potom, keď vlna, hovorí zbohom.
Je to tak?
Tak ahoj, dovidenia.
>> ARMAGHAN BEHLUM: Iste.
>> TOMAS REIMERS: To znie celkom dobre.
>> ARMAGHAN BEHLUM: To znie dobre, taky.
>> TOMAS REIMERS: Takže ak sme robiť, že povedzme,
premyslieť webové stránky trochu.
Budeme potrebovať nejaký skript ktorý v podstate registruje
že ste zamával, a skok, vlna a švihnúť, to isté.
Takže budeme potrebovať skript, ktorý v podstate registruje pre tento výpad.
A ďalšia vec, že ​​sme bude potrebovať, je, že sme
bude potrebovať nejaké skutočný obsah zmeniť.
>> Tak, ako si spomeniete, jQuery umožňuje meniť obsah.
Takže jedna vec, ktorú by sme mohli chcieť zahrnúť v je knižnica jQuery.
A potom, aby bolo možné zvoliť, čo sme vlastne bude meniť obsah,
že to bude potrebovať ID alebo triedy, alebo niečo
že môžeme použiť, vyberte ho.
Tak sme si len dať si rýchla ID zmeny textu.
A potom ho chcete chytiť jQuery?
ARMAGHAN BEHLUM: Takže to, čo je prvý vec na náš zoznam úloh potom teraz?
TOMAS REIMERS: Poďme chytiť jQuery?
ARMAGHAN BEHLUM: Poďme chytiť jQuery, OK, v pohode.
V tom prípade idem musieť actually--
ak by bol Najlepšie miesto na to, že?
>> TOMAS REIMERS: jQuery, takže ak ste Google jQuery, jQuery hit, prvý
ARMAGHAN BEHLUM: Veľmi prvý.
TOMAS REIMERS: Or download.
To je v poriadku.
Hit sťahovanie V1 a V2, na ľavej strane.
Takže sme popísať jQuery od on-line, ako vy ste asi urobil.
Posunúť nadol.
Hore, hore.
>> ARMAGHAN BEHLUM: Oh, tu teraz?
TOMAS REIMERS: Alebo že.
Jo.
Takže jQuery má hostované verzie čo znamená, že nie v skutočnosti
je potrebné ho stiahnuť, ale ty si viac než
vitajte na stiahnuť a hosť sami.
ARMAGHAN BEHLUM: cool.
Takže teraz máme jQuery.
Teraz, čo je ďalší na našej urobiť zoznam.
TOMAS REIMERS: Úžasné.
Takže nabudúce, čo potrebujeme urobiť, je, že sme skutočne potrebujú
dať p hello world ID tak sme to môže zmeniť, nie?
Takže poďme dať predstavu, Ja neviem, zmeniť text?
ARMAGHAN BEHLUM: Povedzme to urobiť takto, myslím.
TOMAS REIMERS: changeText, v pohode.
A teraz poďme stačí aktualizovať stránku.
Uistite sa, že všetko funguje.
Takže späť v prehliadači.
Super.
Vždy dobre pripomienkou toho, že keď ste budovanie internetovej stránky,
pravdepodobne aktualizovať zakaždým, keď vykonáte akákoľvek trochu významná zmena len
preto, že niekedy sa náhodne pokles značku,
alebo ste omylom zmazať niečo, a potom rozbiť niečo malé,
ale potom, keď urobíte väčšiu zmenu ste ako, prečo to veľká zmena
zdanlivo rozbiť nesúvisiace veci.
Takže je to vždy dobré akési ísť a robiť tie kontroly zdravý rozum.
>> Každopádne tak teraz poďme robiť Posledná kontrola rozumu,
ktorý sa poďme pokúsiť zmeniť Text bez Leap Motion,
bez ničoho, len na zaťaženie stránke to bude
zmeniť Hello World na zbohom pomocou jQuery.
Takže ak si spomeniete jQuery vystavuje tento znak dolára funkcie,
ktoré môžeme prejsť voliča CSS, a to hashtag zmena text, ktorý
vyberie prvok s ID zmeny textu.
A potom pôjdeme volanie metódy HTML
na objekte sa vracia s Argument reťazca zbohom, ktorý
zmení položky HTML rozlúčiť.
Desivý.
To sa zdá celkom v pohode.
A teraz, keď sme sa občerstviť stránky budeme vidieť
sa okamžite zmení na rozlúčku, nie?
Vzhľadom k tomu, že nebude čakať na nič.
Druh akonáhle tomuto scriptu spustí sa zmení to zbohom.
Super.
>> Takže teraz poďme zabaliť, že vo funkcii.
Správne.
Takže budeme chcieť aby sa funkcie.
Budeme hovoriť zbohom.
Takže zbohom funkcia je bude trvať žiadne argumenty
a to nie je naozaj chystá k návratu nič.
A je to len bude tomu, že v JavaScripte.
Výborne.
Takže naša funkcia zbohom teraz zmení text rozlúčka, nie?
Tak to nám dáva cestu sa v podstate zmenou
že text goodbye kedykoľvek je to sme zavolali túto funkciu.
Je to tak?
Tak to je celkom v pohode.
>> ARMAGHAN BEHLUM: No, my sme Môžete tiež len sa uistite,
že teraz, pretože nie sme volania funkcie, ak budeme aktualizovať stránku,
Všimnite si, že to nebude zmeniť text.
>> TOMAS REIMERS: Výborný.
Takže teraz ideme na začiatok sa dostať do tej Leap veci
že sme hovorili o.
Takže Armi, chceš vezmite si ju odtiaľto, alebo?
>> ARMAGHAN BEHLUM: Jo.
Iste.
Ja som asi bude potrebovať prekontrolovať veci,
ale napríklad pamätať povedali sme chceli
aby sa ubezpečil, v okne Možnosti sme si stanovili umožniť gestá
TOMAS REIMERS: Dobrý úlovok.
ARMAGHAN BEHLUM: je to pravda.
A potom sme boli odporúčací že chlapci by
beh skok dot slučka, ktorá ako už sme povedali,
má dve možnosti, objekt JSON, ktorý sa o možnosti, ako chcete
nakonfigurovať Leap Motion práce, a potom sa funkcie, ktorá je
nechytí rámu ako spätné volanie Funkcie ako Tomáš hovoril.
A potom upraviť, čo chcete čo do činenia s týmto funkciou.
>> Tak sme sa prejsť v možnosť a teraz definujeme
funkcia, ktorá bude mať v rámčeku.
A teraz musíme definovať to, čo táto funkcia robí.
Je to tiež kvôli budúcnosť, to urobiť, aby sa ubezpečil.
TOMAS REIMERS: Výborný.
Takže teraz máme to skok funkcie dot loop
volania, ktorá v podstate hovorí, že pozerať sa na skok s týmito možnosťami a zakaždým
sa niečo zmení, nazývať Funkcie rám so všetkými údajmi
že ste si vedomí v ráme.
Znie to celkom dobre.
Takže teraz rýchlu kontrolu rozumu, ktorý vždy odporúčam,
je v tom, že len dať konzola dot log frame.
A potom sa v prehliadači Chrome ho otvoríte hore a pozrieť sa na konzole
a pohrajte sa s Leap vidieť rámy boli zaznamenané, pretože tejto vôle
vám predstavu o tom, čo údaje, ktoré máte prístup.
A ako vždy, keď sa zmiasť, vyhľadať referencie API.
A budeme zahŕňať odkaz pre, že na konci tohto.
>> ARMAGHAN BEHLUM: Tak sme aktualizujte stránku a potom
ideme a otvoriť znova konzolu.
A teraz sme si všimli, že sme s rámami prešiel v,
tieto malé objekty sme videli predtým.
Tak jo.
To sú naše rámy objavovať v konzole.
Super.
>> Takže teraz, že sme schmatol rámy, ako ste si možno spomenú skôr
z príkladu, ktorý sme mali, ak budeme kontrolovať rám dot gestá
dostaneme zoznam gest rám naposledy chytil.
Môžeme zistiť dĺžku tohto poľa aby zistil, či Leap chytil nejaké gestá.
Takže ak, že pole je väčší ako nula potom
vieme, že máme nejaké veci na práci.
>> Takže poďme zabaliť, že až v ak stave a teraz tu, čo vieme je, že sme
Videl gesto, poďme rokovať.
Takže teraz, že sme tu my majú gesto vyskúšať.
TOMAS REIMERS: No, prvý vec je, že to nie je len jeden gesto,
to môže byť toľko gestá.
>> ARMAGHAN BEHLUM: To je pravda.
TOMAS REIMERS: Tak za klasický C štýl tu
pravdepodobne budeme chcieť použiť pre sláčiky.
ARMAGHAN BEHLUM: Tu sme sa potom.
Rozhodli sme sa opakovať prostredníctvom gest.
A pozrime sa.
aj plus, plus.
A teraz keď sme snáď z len var gesto rovná
rám dot gestá držiak i, teraz máme
gesto samotnej, čo je len jeden single inštancia gesto objektu
pre nás pracovať Vnútri to pre slučky.
Dobrá.
TOMAS REIMERS: Poďme zdravý rozum skontrolujte znova tu a práve konzoly
dot prihláste gesto, aby videli, čo dostaneme.
>> ARMAGHAN BEHLUM: Console dot log gesto.
Okie Doki.
A obnoviť ešte raz.
>> TOMAS REIMERS: A poďme skúste robiť gesto.
Uvidíte, že partia o, keď sa oháňa,
dostanete veľa gest v konzoly a keď sa snažia urobiť kruh,
je to jen--
>> ARMAGHAN BEHLUM: Kruhy sú len naozaj pekné.
>> TOMAS REIMERS: Teraz je divná vec tu, čo je robí jeden krúžok,
ale toto je prihlásenie 80 gestá, že jo?
To je veľa gest.
Takže prvá druh vec realizovať, a to môže byť mätúce,
je to gesto nie je len raz prihlásený.
>> Na každom snímku, vpravo, takže keď robím kruh
Leap to zistí je zmena, z toho
je zmena, z toho je zmena.
A to sa prihlási každý jeden z nich.
Ale v každom z tých, to bude hovoriť, oh,
tam je gesto v súčasnej dobe prebieha.
Takže mi dovoľte povedať, hele, je tu gesto a to je v súčasnej dobe prebieha.
Takže to, čo nechceme, aby urobiť, je povedať, oh, na jedného každého
z týchto gest vám Ak chcete zmeniť text.
To, čo chceme urobiť, je, keď to gesto sa zastaví, a môžeme skontrolovať, že
potom chceme zmeniť text.
ARMAGHAN BEHLUM: mhmm.
Tak ako je Tomáš je vysvetlenie týchto gest
sa môžu objaviť až násobok rámy, ale napríklad,
Keď sme boli s že kruh, môžeme vidieť
že ID, že jeden jeden kruh, ktorý sme
možno sa snaží dokončiť bol po celý čas rovnaký ID.
A v skutočnosti, môžete tiež pozrite sa na stav.
aktualizované.
>> A potom je to pravdepodobne posledný kruh, ktorý, oh, no, OK.
Takže niekedy to ukazuje, stav zastavenia gesto
a to vám tiež ukazuje stav o spustenie novej gesto keď
uznáva, pre istotu, že ste začali nový gesto.
Napríklad v tomto prípade.
TOMAS REIMERS: cool.
ARMAGHAN BEHLUM: Tak jo.
A potom, pozrime sa.
Môžete si tiež všimnúť, keď sme robili
kruh a gesto má pole s názvom typ
že nám hovorí, aký druh gesto, že je.
Tak, že by mohli byť užitočné pre nás si vyskúšať a robiť to, čo robíme.
TOMAS REIMERS: Tak prechodu späť do JS,
Prvá vec, ktorá ma napadá, tiež, len prečítaní tohto kódu
Je tam malý optimalizácia, čo je vlastne
Nemusíte, ak podmienkou, že jo?
Vzhľadom k tomu, ak rám dot gestá dot dĺžka je nulová, že slučka je
nebudú prebiehať tak ako tak.
Tak sme sa môže rovnako dobre ísť vpred a zbaviť sa toho.
Opäť platí, že keď ste písať kód je dôležité vrátiť sa a triediť
z refaktorovat si uvedomíte, že vás mohol urobiť niečo lepšie,
alebo že existuje iný spôsob, ako to urobiť.
Takže teraz už len tak čistiť to rýchlo a tiež vyčistiť váš kód.
To je veľký problém.
>> ARMAGHAN BEHLUM: Dobrý štýl je veľmi cenený.
>> TOMAS REIMERS: Môžete vždycky, keď niekto
má kód, tam, kde býval, ak stav a potom odstránili,
ale nemali vložte ju.
Je to veľmi jasné a to trochu vyzerá škaredo.
ARMAGHAN BEHLUM: Takže to, čo je vedľa na našej zoznam úloh?
TOMAS REIMERS: Takže teraz, keď sme hovorili, Myslím, že prvá vec, ktorú chceme urobiť
sa uistite sa, že to gesto je vlastne švihnúť, že jo?
>> ARMAGHAN BEHLUM: Jo.
>> TOMAS REIMERS: Takže keď hovoríte, že naše zbohom je niečo ako výpad,
pôjdeme s jeho výpad, Prvá vec, ktorú musíme povedať, je, hej,
je gesto zadajte výpad, že jo?
Nie kruh alebo top, ale je to výpad?
Tak, ako to môžeme urobiť sa môžeme povedať gesto
Typ dot rovná rovná výpad ako reťazec.
>> ARMAGHAN BEHLUM: [nepočuteľné] gesto Typ dot rovná rovná vysetrovania.
Tam sme.
>> TOMAS REIMERS: A potom posledná otázka
Ak chceme vidieť je gesto dot Stať sa rovná rovná zastávka, že jo?
Tak to je, keď gesto to bola zastavená.
Vlastne som si, že na výpad, I viem to z vrcholu mojej hlavy,
ale ste vítaní, aby to nájsť, keď sa
prejdite zakaždým, keď zaregistruje kým ho nezastavíte, je začiatok gesto.
A potom posledný let len zastavenie gesto.
Takže tam bude len jednu zastávku gesto, čo je pre nás skvelé.
Takže to, čo môžeme urobiť, je, keď gesto dot hovoria typ rovné rovné výpad a gesto bodku
Stav rovná sa rovná zastaviť, potom nech je zdravý rozum
pozrite sa sem konzoly dot protokolu gesto.
>> Takže pôjdeme tu späť.
Budeme aktualizovať stránku.
A teraz jediný prípad, kedy by sa niečo byť konzola bodka prihlásený je, keď sme sa švihnúť.
A snažíme sa prejdite a vidíme nič.
Je to tak?
Takže je to vlastne veľký problém.
Nie sme vidia to, čo sme očakávali.
A ladenie môže byť veľká časť toho.
Takže prvá vec, ideme povedať je, OK, poďme konzoly dot
log, ak gesto dot typ rovný rovného vysetrovania.
ARMAGHAN BEHLUM: Jo, poďme to urobiť.
TOMAS REIMERS: Takže sme chystá sa vrátiť k tomu.
Budeme aktualizovať.
Budeme švihnúť.
A budeme vidieť veľa z nich.
OK.
Takže zrejme bol problém s naším postavením gesto bodov.
Takže ak sme sa otvoriť jednu z nich stretneme Pozrite sa do objektov a uvidíme,
no, to je zastaviť, ale, ach, je to len stav, nie stav.
Takže ak sa vydáme späť do náš kód môžeme povedať,
ak typ gesto dot rovnať rovnať potiahnite prstom a gesto dot štát rovná rovná zastavenie,
potom budeme utešovať dot načítavať.
A tak obnoviť.
My švihnúť.
A uvidíme, že na každý prst, my sme len
ako sa jeden, ktorý je koniec, čo je skvelé, nie?
To je to, čo chceme.
>> ARMAGHAN BEHLUM: Jo.
A tiež môžeme všimnúť, že ID pre každý z týchto gest sú oddelené.
Tak ako Tomas hovorí preto, že sme chytanie tento jeden stop stav, ktorý
existuje na konci výpad, sme ako sa jednotlivé samostatné gestá
od Leap Motion.
Skvelé.
>> TOMAS REIMERS: Poďme ďalej a urobiť len posledná vec, ktorá je,
>> ARMAGHAN BEHLUM: Goodbye.
>> TOMAS REIMERS: Úžasné.
A teraz poďme pozrieť na naše webové stránky.
Jeden
>> ARMAGHAN BEHLUM: Second.
My sme, jo, my to hovoríme Goodbye.
Skvelé.
>> TOMAS REIMERS: Nie, Goodbye je reálna funkcia.
>> ARMAGHAN BEHLUM: Jo.
Poďme to urobiť.
>> TOMAS REIMERS: A keď sme sa zbohom, hovorí zbohom.
>> ARMAGHAN BEHLUM: Máme víťazstvo.
>> TOMAS REIMERS: Tak docela vzrušujúce veci.
Dúfajme, že si môžete vytvoriť niečo iného, ​​ale máte predstavu o, nie?
Môžete zistiť gestá.
Môžete volať funkcie.
A z toho, že vás naozaj dáva niektoré veľmi základné stavebné bloky
povedať, oh, možno keď sa prejdite prstom hore, pretože môžete tiež zistiť, čo
ako smer.
Chcem, aby niečo urobiť.
Alebo keď sa prejdite prstom doprava, I chcete, aby niečo urobiť.
A môžeme začať, aby si kreatívny s tým, ako presne
budeme zlepšovať naše webové stránky použitie týchto Swipe gestá alebo kruh
gestá, alebo kliknite na gestá, buď kľúč kohútiky alebo obrazovky kohútiky.
A potom iný, než že ste viac než vítaní hrať
sa skutočnými údajmi, ale ak chcete robiť
že by sme odporúčam vám ísť na dokumenty preto, že sú naozaj veľmi dobré.
Tak šiel do docs teraz.
Alebo chcete, aby o tom hovoriť?
>> ARMAGHAN BEHLUM: Jo.
Poďme to urobiť.
Tiež jeden ďalší lahôdka rád, si vyskúšať a myslieť na to, v 3D.
Takže vlastne poďme vytiahnuť tie gestá ešte raz konzoly dot log gesto
a robíme to.
Príďte a teraz poďme skúsiť pár z nich, niekoľko z nich.
>> Ak pôjdeme in a check-out Tieto gestá i
ako môžete vidieť, že sú rozmerov
je v troch smeroch, v skutočnosti.
Takže to nie je len obmedzovať sami 2D obrazovku
aj keď by mohla byť na 2D internetových stránkach.
Môžete skúsiť a premýšľať, ako užívateľ môže komunikovať s webovej stránky v 3D.
TOMAS REIMERS: V 3D priestore.
ARMAGHAN BEHLUM: Presne tak.
A jo.
Takže ste si nasmerovanie, rýchlosti, všetky tieto skvelé kúsky informácií.
>> TOMAS REIMERS: A ak si nie ste oboznámení s tým, že ide x, y,
a potom z je to posledná rozmer.
Proste niečo, čo pravdepodobne ste oboznámení s, ak som sa zaoberal 3D
Pred súradníc lietadla.
Ak nie, je to rovnaké, ako 2D jeden až tú tretí rozmer.
Hovoríme to z.
A všetko, niečo ako smer, čo je miesto, kde to ide,
Position-- Myslím si, že by to mohlo aj vystaviť zrýchlenie, nie som si istý.
>> ARMAGHAN BEHLUM: Áno, verím.
To rozhodne má rýchlosť.
Ja som vlastne nie je 100% istí zrýchlenie.
>> TOMAS REIMERS: Môže to byť voľba sa môžete preniesť na niečo.
Tak polohu a rýchlosť sú vystavené v týchto druhu troch súradníc.
Tak x, y, z, alebo delta x, y delta, delta z.
Takže teraz išiel do dokumentácie to je developer.leapmotion.com
a potom môžete kliknutím na tlačidlo dokumentácie.
Opäť platí, že Leap Motion má všetky tieto nádherné API, jeden pre JavaScript,
jeden pre C Sharp a jednoty, jeden pre C ++, jeden pre Javu, jeden pre Python,
a jeden pre Cieľ C. Osobne by ťa tlačiť smerom k JavaScriptu
alebo ak sa chcete dozvedieť Nový jazyk, skúste Python.
Oba z týchto jazykov som pracoval s skôr a sú naozaj ľahko sa učí
a vy už viete, JavaScript, ktorý je to naozaj dobrý kandidátom.
>> Jedným slovom opatrne keď zadáte dokumenty.
Uistite sa, že ste na Docs v2.0.
Pretože ak ste na verzia jedna, nebude to fungovať.
Tiež pre príkladu galériu.
Strávili sme dobrých 30 minút snaží sa ladiť naše Leap
predtým, než sme si uvedomili, že V1 nepracuje s V2.
Tak len sa uistite, že ste na verziu dve.
A potom budem ho nechal ukázať svoje docs.
ARMAGHAN BEHLUM: Jo.
Tak tu je prehľad API a potom Niektoré kúsky z informácií
že sme už ti to povedal.
Pekná malá floating ruky nad skok pohybu.
A pripomenutie myslieť o priestor v 3D.
Jeden z prvých objektov, premýšľať o tom, s Leap Motion sú ruky, samozrejme.
Sme videli, ktoré boli uznané u Visualizer.
A potom by ste mali mať Videl, že to uznal
časť zápästia a rameno s ním spojené.
TOMAS REIMERS: Ak chcete, vytiahnuť Visualizer.
ARMAGHAN BEHLUM: Jo, poďme to urobiť znova.
TOMAS REIMERS: Môžete vidieť, a to vždy len dobrá pripomienka, aby trochu vidieť,
Visualizer snaží ukázať všetky údaje, ktoré Leap vidia.
Takže budete vidieť, že máme Tieto druh štyroch bodov
za zápästie a potom skutočným zápästia.
A máte tento loptu na dlani.
Všetky z nich sú body uznať uznané skok.
>> ARMAGHAN BEHLUM: Presne tak.
A tak sa tu ruku objektom každý rámec má ručné poľa
ako aj, kde môžete tiež získať ľavá a pravá ruky.
Môžete získať, ktoré smer ruky sú
čelia s normálnou smer dlane,
alebo ako sa tomu hovorí dlaň normálne.
Čo ešte máme?
My tiež, oops.
Skúsme a prejdite nadol týmto spôsobom.
Ramená, prsty sú zastúpené prstom
trieda, čo je smerovateľná objekt.
A tak, ako by sme hovorili, sme videli, že Pole pointables pre každú ruku.
Tí, ktorí sú málo prsty myslieť.
Tak to je dobrý prehľad ísť až vyskúšať a pochopiť.
TOMAS REIMERS: [nepočuteľné] ruka anatómie tam hore.
ARMAGHAN BEHLUM: Jo, presne tak.
Tak jo.
Je tu veľa surových dát, ktorá Leap Motion sa v interpretov dobre
pre vás, takže je to skvelý nápad ísť tadiaľto
a pokúsiť sa prísť na to, ako má Leap už prišiel, čo pre vás
a tak, aké informácie majú k dispozícii od tam.
A potom sa tam by som odporučil ísť do tejto ľavej časti sem,
ktorý ide, no vlastne nie, to sú vlastne len ďalší API veci about--
>> TOMAS REIMERS: Odkaz na API dno je zvyčajne dobré miesto, kam ísť.
Vy ste asi, keď videl, sme robili Google Maps pset.
Ale odkaz skutočne práve prechádza všetky
funkcií a parametrov k dispozícii v objekte na vás.
>> ARMAGHAN BEHLUM: Jo.
Napríklad, to je to, čo Hľadal som predtým.
Keď máme stranu sme môže ísť a zistiť,
Ako Leap odporúča sa nám nájsť ruku.
Rovnako ako som povedal predtým, máme ruky poľa.
Zistite si, či máme ruky a skúste a urvat jednu ruku
pre interakciu s týmto spôsobom.
Tak to je to, čo sme Odporúčame pre vás.
Gestá a veci rovnako.
Táto dokumentácia API bude je fantastický nástroj pre vás.
Máte nejaké iné odporúčanie?
>> TOMAS REIMERS: Ja nie.
Myslím si, že je to dobré pre túto chvíľu.
>> ARMAGHAN BEHLUM: Jo, Myslím si, že to rovnako.
Neváhajte a napíšte nám a získajte v kontakte asi Leap Motion
ak máte možno nejaké problémy alebo potrebovať žiadne odporúčanie.
A môžeme skúsiť a zistiť veci sa s vami tiež.
Děkuju.
>> TOMAS REIMERS: Skvelé.