DAVID J. Malan: Tak jo, tak toto je Myo rameno kapela, pár, ktorý sme mať pre CS50 záverečných prác. A to bola demonštrácia sme vo fronte si s predstihom kde v podstate to celkom tesné ramenom sem počúva vaše svalové pohyby ktoré sú potom mapované v softvéri na Colton je notebooku cez tú, ktorá mal iTunes a song už vo fronte. Skôr než ja demoing to, Colton to už v laboratóriu jasne celý týždeň dostať demonštrácie pripravený pre jedného odvážneho dobrovoľníka. Ak by niekto chcel, aby sa na up-- videl svoju ruku ako prvý. Poď hore. [00:01:09] Dobrá. A aké je vaše meno? [00:01:13] Publikum: Uh, Maria. [00:01:14] DAVID J. Malan: Maria, rád vás vidím. Poď sem. Dovoľte mi, aby som vám predstavil Colton. Colton, to je Maria. [00:01:21] COLTON: Ahoj, rád vás spoznávam. [00:01:23] DAVID J. Malan: All Dobre, tak prvý krok, že sme bude musieť umiestniť to na predlaktie tak, že je to celkom priliehať u vášho lakťa. A medzitým, poďme sa kladený na našej Google Glass a budeme miešať technológie dnes. [00:01:33] COLTON: Najprv budeme musieť háčik to do vecí. [00:01:36] DAVID J. Malan: OK. V skutočnosti, poďme dať ruku as v blízkosti tohto kábla, ako je to možné takže môžeme najprv synchronizovať ho. [00:01:41] COLTON: Ideme na to. [00:01:42] DAVID J. Malan: A medzitým, tak že každý môže získať bližší pohľad, budeme prehadzovať Ondreja fotoaparát na obrazovke tam. Takže máme USB kábel, ktorý je je zapojený do Máriinho pásku. A dovoľte mi hodí obrazovku Colton sa hore na projektore ďalšie. [00:02:00] Takže Colton je registrácia zariadenia teraz ako Myo pripojený k tomuto káblu. A teraz to, čo Mária je robiť chvíľu je vlastne prejsť kalibračných krokov a učiť softvér ako sa jej svaly reagovať keď sa uistil, vopred definované gestá, ktorá softvér chápe. Ak by ste chceli ísť Predná časť obrazovky. OK, ďalej snažiť. [00:02:30] COLTON: Choďte takhle. A rovnako ako to. A úplne na pravej strane. Vráťte sa späť. [00:02:35] DAVID J. Malan: OK. Iný pohľad. Je to nie. Je to na nás. [00:02:40] MARIA: OK. DAVID J. Malan: Nie Poďme to posunúť vyššie, takže je to bližšie k lakťu, a ešte pevnejšie. Dobrá. [00:02:52] Ideme na to. To by bol dobrý čas na CS52X. Tak ideme. [00:02:57] Veľmi pekné. OK. Palec na malíček. [00:03:02] Veľmi pekné. Roztiahnite prsty. Dobre. Wave pravdu. Je to napodiv ukazuje ste s ľavým hand-- [00:03:17] COLTON: Jo, to je divný. DAVID J. Malan: Wave na vpravo a vpred. Rýchly posun vpred preskočiť alebo vedľa. To je v poriadku Wave pravdu. [00:03:25] MARIA: Ja ne-- čakať. [00:03:26] DAVID J. Malan: Potrebujete pomoc? [00:03:28] COLTON: Takže ideš takto. MARIA: Je to otáčanie Ďalšia vec, keď. COLTON: Je to tak. DAVID J. Malan: Jo, ja neviem, prečo sa to ukáže vám leftie. COLTON: Prečo si try-- Len sa snažím ísť takto. [00:03:38] DAVID J. Malan: Nie? Možno dosiahnuť ruku sa trochu narovnal a robiť to oveľa skôr, ako je tento. Jo, OK, no tak. [00:03:48] MARIA: Je mi to ľúto. DAVID J. Malan: Nie je to tvoja vina. COLTON: To je v poriadku. DAVID J. Malan: All Right. Well-- [00:03:56] MARIA: Mali by sme preskočiť, a potom? DAVID J. Malan: Áno, poďme Nechajte si vyvesený. Takže ak by niekto chcel robiť záverečný projekt pomocou tohto ostrie hardware, uvedomiť, že jediné čo trvať trochu zvykať. A tohle-- realita je to Je to vlastne veľmi drsne. [00:04:10] To je to, čo sa nazýva developer kit, ktorý má byť v podstate vopred uvoľnenie takže ľudia môžu robiť presne to, tohle-- bojovať s ním, postava ako telá ľudí pracovať s technológiou. Takže ak chcete potom, po prednáške, môžeme vám prísť a vziať ďalšiu stab na to. Ale inak, potlesk, ak je Mohli by sme Maria prišla na up. [00:04:26] MARIA: Ďakujem. [00:04:28] DAVID J. Malan: Ďakujem. Budeme visieť na to, ale budeme dávať you-- ako o strese loptu tu? Oh, a- if-- jo, vďaka. Dobrá. Takže zvedavý, ak ste boli oboznámení s rozumnú voľbu že tam z skôr, úžasný TV ukazujú, že by ste mali absolútne byť nárazovo sledovanie na Netflix je to jeden tu. [00:04:51] SPEAKER 1: Dámy a páni, kúzelník s názvom Josh. [00:05:04] DAVID J. Malan: A zdá sa, že je to vec mi texte počas prednášky teraz. Mi bolo povedané, že Mária mal včera narodeniny. Tak všetko najlepšie k narodeninám od CS50 Márii rovnako. [00:05:18] Takže ste možno čítali v posledný mesiac že to páni tu, Steve Ballmer, ktorý bol v skutočnosti trieda z roku 1977 na vysokej škole, Nedávno odišiel pre Microsoft. Bol študent tu, potom pár rokov neskôr sa ocitol v Stanford Business School keď dostal telefón volanie z jeho priateľ kto žil chodbou od neho tu na Harvarde. Mená priateľa bol Bill Gates, a v tej dobe, sa snažil naverbovať Steva byť prvý obchodný osoba, naozaj, na malé firmy názov Microsoft. [00:05:45] Dlhý príbeh krátky, Steve bol nakoniec získal, pripojil Microsoft, keď sa mal len 30 zamestnancov. A v čase, keď odišiel celkom nedávno, mala spoločnosť 100.000 zamestnancov v posledných niekoľkých rokoch. A tak web známy ako The Verge pripravila tento hold na videu že sme si mysleli, že zdieľané, ktoré vám dáva pocit, ako moc energie Steve prináša všetky prezentácie dáva. [VIDEO PREHRÁVANIE] -Microsoft To ako štvrté dieťa. Deti robiť opustiť dom. V tomto prípade, myslím, že Odchádzam z domu. Hej Bill, whazzap? [00:06:23] -Wazzap? [00:06:24] Hej, wazzap? Sme dostali obrovská príležitosť. A Bill nám dal túto príležitosť. Chcel by som poďakovať Billa za to. Chcem, aby si taky. Tempo inovácií sa nebude spomaľovať. [00:06:42] Je to dostane rýchlejšie a rýchlejšie. Tam by mohlo byť niekoľko konkurentov ktoré sú bohužiaľ odstránené! [00:06:54] Milujem túto spoločnosť. Áno! Som PC, a mám rád túto spoločnosť! [00:07:08] Vývojári, vývojári, vývojári, vývojári, vývojári, vývojári, vývojári, vývojári. Áno! Weboví vývojári! [00:07:19] Weboví vývojári! Weboví vývojári! Vypočujte si, čo ešte dostať bez príplatku! [00:07:28] MS-DOS výkonných, vymenovanie kalendár, karta hromada, poznámkový blok, hodiny, ovládací panel. A môžete veriť? Reversie! [00:07:35] Napáliť na CD! Po nich na MSN! Môžete nám ich zašlite priateľom! [00:07:40] Všetko s jedným kliknutím! Jeden Microsoft, jedna stratégia, jeden team-- sústredený, disciplinovaný, profesijné, a odborník na všetko, čo robíme. Dovoľte mi, aby som linku zo starého filmu. [00:07:52] Vzťahy sú ako žraloky. Oni sa pohybujú vpred alebo zomrú. Vlastne si myslím, tech spoločnosti sú rovnaké. [00:08:01] [END Videoprehrávanie] DAVID J. Malan: Tak my sme tak radi, že oznamujeme, že Steve bude nám pripojí tu CS50 budúcu stredu na zvyčajné miesto a čas tu. Priestor bude pravdepodobne obmedzený. A tak sa k nám pripojili osobne, prosím hlava dnes alebo krátko potom na cs50.harvard.edu/register. [00:08:22] A budeme sledovať od Utorok potvrdenie škvrny. Môžete sa tešiť na to ďalší Streda pri prednáške v CS50. Teraz, v iných správach, som sa náhodou naraziť na toto v Crimson len druhý deň. [00:08:34] Ukazuje sa, že jeden z pracovníkov CS50 je a aspoň jeden z jeho žiakov CS50 je v súčasnosti beží na UC prezident a viceprezident, ktorý ma priviedol späť na mojich dní späť keď som prehral voľby UC nešťastne. Ale útechou v tom, že je vždy povedať, príbeh je to, že jeden zo som si istý, mnoho dôvodov, prečo som stratil voľby bol úplný nedostatok o talente pre rozprávanie na verejnosti. A tak celkom úprimne to, išiel mi, že skúsenosti Myslím, že môj mladší rok, skutočne podpísať up pre Harvard Computer Society, ktorá je skupina na akademickej pôde, ktoré usporadúva rôzne technické rokovania a ďalšie veci. A ja som prevzal svoju výučbu semináre, a preto mal príležitosť, skvelá príležitosť, začať pracovať na práve toto. Ale tiež som mal možnosť Počas tejto skúsenosti učiť sám o to viac HTML. A tak som odkladal včera večer hľadá prostredníctvom internetových stránok HTML na báze Urobil som dovnútra ako 1997 '98 pre môj kampaň, ktorá vyzerá ako toto. Ja viem. [00:09:29] Protože-- a samozrejme, oznámenia tento úžasný návrh rozhodnutia v roku 1998 alebo ktovie čo ešte. Prvá vec, ktorú chcete, aby používatelia urobiť pri návšteve svojich webových stránok ich musieť kliknite na ďalší odkaz len zadajte svoje stránky s mníchom za ako zahalené oponou, kde zrejme moja kampaň platforma bola. A to je všetko, čo dostanete dnes je len screenshot. Ale ja som čítal, ako, Moja kampaň plagáty posledná noc a môj platformu. [00:09:50] A ja som bol tak naštvaný, v tej dobe. Môj platforma was-- to bolo zaujímavé. Tak som sa upokojil od tej doby. Ale raz, budem znova spustiť a snáď lepšie túto dobu. [00:10:03] Tak HTML, ktorý jazyk, v ktorom som že in-- budete čoskoro robiť oveľa more-- je niečo, čo sme boli hovorí o neskoré a do značnej miery brania za samozrejmosť teraz že sme sa presunuli do iných jazykov. Ale poďme pozastaviť na chvíľu a dať niektoré z týchto vecí v súvislostiach. Takže vo vete, čo je HTML? [00:10:18] Alebo, čo sa používa? Každý, kto? Áno. [00:10:20] Divákov: Markup pre webové stránky. DAVID J. Malan: Markup pre webové stránky. Takže je to značkovací jazyk, ktorý umožňuje štruktúrovať webovú stránku. Header ide sem, titul ide tu, telo sa dostane tu. To tučný, to je italics-- tento druh detailu. [00:10:33] OK, dobre. Takže CSS umožňuje you-- a ja sa niektoré slobody tu s tučným-obklad a kurzívou nasledujúcich dôvodov To už je lepšie realizovať s tým. CSS je-- čo? Povedzme, že vo vete. Každý, kto vôbec. Jo. [00:10:46] Divákov: zdobenie a veci, ako ako to navrhnúť. DAVID J. Malan: OK, dobre. Zdobenie, ktoré vám umožňujú navrhnúť, alebo štylizovať ju s vecami, ako je tučné písmo a kurzíva a farby, a tiež jemnejšia jemnozrnný umiestnenie prvkov. Tak nejako vám umožní vziať veci do Poslednej míle tak, aby v prípade, napríklad, v Pset7, možno ste si všimli, na vašom portfólio strana, ak ste na tomto mieste už, že východiskové tabuľku, ktorá vám aby ukázať držanie zásob užívateľa a cash asi vyzerá celkom odporná V predvolenom nastavení sa žiadne biele miesto. Všetko je trochu preplnené spoločne v riadkoch a stĺpcoch. [00:11:18] No, s trochou CSS, ako ste si možno uvedomíte, môžete skutočne vyladiť to a robiť to niečo oveľa známejší a oveľa krajšie na pohľad. Takže CSS je o štylizácia webových stránok. Ale potom sme ešte ďalšie predstavený jazyk, PHP, ktorý nám umožňuje robiť čo? [00:11:36] Poďme len to, čo? Ktokoľvek. Musím Zájsť Prvých pár riadkov. Jo. [00:11:40] Divákov: Generovať dynamický obsah. DAVID J. Malan: Perfect. Generovať dynamický obsah. A môžete to urobiť v ľubovoľný počet jazykov. Náhodou používať PHP, pretože je to v časti, takže podobne ako syntax C. [00:11:50] Ale PHP robí presne to. To vám umožní dynamicky generovať výstup. A niektoré z týchto výstupov môže byť HTML, ako sme bežne robili. A je to aj preto, že je programovací jazyk, je mechanizmus, prostredníctvom ktorého môžeme hovoriť s databázou. [00:12:03] A môžeme otázky na ostatné servery ako Yahoos a programovo robiť čokoľvek Naozaj, ktoré by ste inak chcete prinútiť počítač robiť. PHP tak nám umožňuje začať dynamicky výstup obsahu. Takže tejto logiky, som nemal dynamický web v roku 1998. [00:12:16] Bol to len statické webové stránky. Môj obsah musel byť zmenený ručne gedit alebo nejaký ekvivalent. Ale PHP je to, čo sme použili, alebo mohli použiť skôr niečo ako Webové stránky frosh IM, ktorý mal vziať registrácie a spravovať zoznam users-- vecí, ktoré sú skutočne prepnutie čas, aj keď sa stalo, používať Perl, iný jazyk v tej dobe. [00:12:35] A potom konečne, sme zaviedli SQL-- Structured Query Language. Napriek tomu tak iný jazyk ktorá je použitá pre čo? Používa sa pre čo? Môžeme pustiť slight-- OK, nebudeme dostať oveľa ďalej než orchestra tu. Divákov: Je to protokol použije pre komunikáciu s databázou. DAVID J. Malan: protokol použije pre komunikáciu s databázou. Dovoľte mi, aby som vyladiť. Je to prirodzený jazyk použitý hovoriť databases-- vyberie a vložky a odstráni a aktualizácie a v skutočnosti dokonca aj viac funkcií, ktoré Ešte sme ani potápal do, ale budete chcieť mať explore-- preskúmať, povedzme, záverečný projekt. Takže tam sú tieto rôzne kúsky. [00:13:09] A dúfajme, že Pset7, aj keď jeho špecifikácia je pomerne dlhá, je to zámerne dlho, aby vás vďaka, ako sa tieto veci môžu všetci byť zadané spoločne. Teraz v pondelok sme predstavil svoju poslednú jazyk že budeme formálne zaviesť do course-- to je, JavaScript. To, rovnako ako PHP, je interpretovaný jazyk. [00:13:25] Ale kľúčový rozdiel Navrhol som v pondelok je to, že zatiaľ čo PHP je vykonávanie alebo vykladá na serveri, ktorý v tomto prípade je CS50 spotrebiče, alebo by mohol byť nejaký komerčný web servera na internete, JavaScript všeobecne je jazyk, ktorý beží na strane klienta nie servera side-- tak v prehliadači. Čo znamená, že rovnako ako keď som otvoril up Facebooku zdrojového kódu a zistil všetko týchto JS súborov, vyplývalo, že pri návšteve Facebook alebo najviac webové stránky v týchto dňoch, získate nielen HTML, CSS nielen, ale celá partia JavaScriptu Kód často vo forme JS súborov. A potom je to browser-- vlastné Mac alebo PC--, ktorý vykonáva tento kód. [00:14:03] Váš prehliadač spustí ho. Môžete si myslieť v akejsi karantény. Tak, že kód JavaScript by nemala byť môcť odstrániť súbory na vašom počítači. Nemalo by byť schopní posielať e-maily vaším menom. Váš prehliadač druh obmedzuje Čo môžete robiť s ním. [00:14:17] Takže v tomto zmysle, je to trochu menej silný, možno, ako C. Ale JavaScript môže, as stranou, používať na serveri, keď budeme nemajú tendenciu hovoriť o to v tomto kontexte. Takže teraz poďme zviazať tieto spolu. Týždeň navyše dávno, sme predstavili niektoré HTML na left-- Super nudné webové stránky. [00:14:34] Len hovorí, hello world. A potom som navrhol na právo môžeme trochu kradnúť nápady z našej diskusie dátové štruktúry v C a premýšľať o tom, ako tento hierarchický značkovací jazyk na ľavej strane by mohli byť spracované, alebo realizované v pamäti ako skutočné stromovej štruktúry s uzlami a ukazovatele a tie druhy detailov. Na pravej strane, hovoríme že sa DOM-- dokumente Objekt Model-- čo je len ozdobný spôsob, ako hovoriť strom. [00:14:56] Teraz, prečo je to užitočné myslieť na to týmto spôsobom? Pretože teraz sa JavaScript, pretože máme kód, ktorý sa dostane do hry v tomto prostredia, aktuálny HTML, ktorý je bola odoslaná do prehliadača a už má už bol načítaný do pamäte prehliadač do stromu vo vašom počítači RAM takto, môžeme použiť JavaScript skutočne prejsť alebo ísť pešo alebo hľadanie alebo zmeniť DOM strom však chceme. Takže v skutočnosti, ak si myslíte, o facebook.com, Ak použijete funkciu chatu, ak máte Použitie Gmail a funkcie gchat, niečo, kde máte správy znova a znova prichádza a znova, tieto správy sú pravdepodobne, ako, LI tag, List Item tagy, možno. [00:15:35] Alebo možno, že to len divs, ktoré udržujú objavovať zakaždým, keď sa dostanete rýchlu správu. A tak to len znamená, že to, čo Facebook alebo Google robí sa kedykoľvek dostanete správy zo servera, sú pravdepodobne používate JavaScript len pridať ďalší uzol to tree-- ďalší uzol na to strom, ktorý vizuálne len vyzerá ako nový riadok textu na obrazovke. Ale oni vloženie do tejto dátovej štruktúry. [00:15:57] Takže v triedach, ako CS124 a ďalšie, budete vlastne napísať viac kóde proti dátové štruktúry ako je tento. Ale teraz v JavaScripte, budeme len predpokladať, dostaneme všetky tieto funkcie zadarmo z jazyka samotného. Takže poďme sa pozrieť na príklad. [00:16:09] Dovoľte mi, aby som otvoriť súbor s názvom form.html. Je to super jednoduché. Proste to vyzerá takto. [00:16:15] Nie CSS, žiadna myšlienka na estetiku. Je to čisto funkčné a zrejme som žiada o e-mail, heslo, znova heslo a potom kontrola súhlasiť s niektorými podmienkami. Čo zdrojový kód pre tento vyzerá to je asi niečo asi tušíte s trochu premýšľania teraz. Mám tag formulára tu. [00:16:32] Akcia sa zrejme chystá prejsť do súboru s názvom register.php. Metóda budem používať, je dostať. A potom som dostal text pole, ktorého meno je e-mail. [00:16:40] Mám pole hesla ktorého meno je heslo. Mám ďalšie Heslo pole, ktorého meno je trochu ľubovoľne potvrdenie. Je to len ďalší parameter HTTP. [00:16:49] A potom sme sme nepoužívajú tieto, s výnimkou pretože frosh IM demo v class-- zaškrtávacie políčko, ktoré je len typ rovná kontrolu. A ja zavolám túto dohodu. Takže som trochu ľubovoľne, ale vhodne pomenovaný týchto polí. Tak, že teraz, keď táto forma dostane predložené, pozrime sa, čo sa stane. Ak mám malan@harvard.edu, Urobím heslo karmínovej. Urobím heslo nič. Poďme nespolupracuje. [00:17:10] A nebudem zaškrtnite políčko. Dovoľte mi, aby som na tlačidlo Registrovať. A hovorí, hm, ste zaregistrovaný. Nie tak celkom. [00:17:16] Ale URL zmenilo. Takže táto forma bola jasne povolený predložiť register.php. Ale pravdepodobne by som mal byť zachytenie niektoré z týchto chýb. Teraz, v Pset7 a niektoré z našich príkladov prednášky, by sme všeobecne vytlačiť veľké červené chybové hlásenie tu hovorí, chýba meno, alebo chýbajúce heslo. Urobili sme, že pred a máme done detekcie chýb na strane servera. [00:17:37] Ale veľa webových stránok, v týchto dňoch robiť detekciu chýb na strane klienta kde URL nemení. Celá stránka neobnoví. Získate okamžitú spätnú väzbu z prehliadača. Možno, že sa niečo na červeno. [00:17:48] Možno dostanete pop-up. Ale nemusíte strácať čas odosielania dátový server, ktorý je neúplný. Takže poďme sa pozrieť, ako by sme mohli dosiahnuť túto funkciu rovnako. [00:17:56] Nechaj ma ísť do form1.html, ktorá vyzerá rovnako. Ale keď tentoraz som robiť malan@harvard.edu a píšem crimson a nemám ďalej spolupracovať ale kliknite na tlačidlo Registrovať, všimnete hneď. Nie je to sexi riešenie. Ja som aspoň zachytil túto chybu. A ja som použil záznam Funkcie v JavaScript-- ktoré sme použili iba v triede. Všeobecne platí, že by ste nemali používať tento pretože to môže veľmi rýchlo dostať von kontroly. Ale heslá sa nezhodujú, je chyba. [00:18:19] Nechaj ma ísť napred a kliknite na tlačidlo OK. Ale to, čo kľúč stánok s jedlom tu je, že adresa URL nezmenila. Takže som sa neobťažoval plytvanie čas servera a opýtal sa ho otázka, ktorú by som mohol mať prišiel na to odpoveď pre seba. [00:18:30] A užívateľ, aj keď Hovoril o tom dlhší ako užívateľa bude premýšľať o tom, bude mať okamžitú spätnú väzbu. Nie je latencia sa pripojenie k sieti. Takže poďme sa pozrieť na tohto zdrojového kódu. [00:18:40] Form1.html vzhľad štrukturálne podobné tu. Forma je v podstate rovnaký. Ale poďme sa pozrieť, čo som urobil tu. A je tu rôzne spôsoby, ako to dosiahnuť. A ja som urobil najviac rovno nasledovník, ale najelegantnejší spôsob, ako ešte. Mám tag script. Potom som volať document.getElementById ("registrácia"). A ja uložiť túto hodnotu vo forme, premenná. [00:19:04] Takže to, čo som to urobil? Môžete si myslieť document.getElementById ako špeciálne funkcie, ktorá JavaScript vám dáva ktoré doslova podá vám Ukazovateľ na jednom z uzlov alebo obdĺžniky v tejto vetve. Takže teraz, že je to, čo naša forma premenná v JavaScripte je v skutočnosti ukazuje na. [00:19:21] Takže teraz syntax je odlišná od C. Ale robíme pár vecí tu. Jeden z nich, toto je trochu divné hľadáte, určite proti C. Ale pozrite sa na riadku 35. Tak na ľavom form.onsubmit. Pripomeňme si, že je onSubmit ako pole v struct. Ak si myslíte, že premenné formuláre je zrovna C struct, to by mohlo mať nejaké pole. [00:19:42] Späť v deň, sme mali študenti mená, ID, domy, tyhle polí. Len pomyslite na onSubmit ako ďalšie pole. Ale je to zvláštne, pretože pole prehliadač je vopred naprogramovaný očakávať .onsubmit nebyť hodnotu ako číslo alebo reťazec, ale v skutočnosti je funkcia alebo adresa funkcie v pamäti počítača. [00:20:02] A vskutku, to je to, čo toto kľúčové slovo tu robí. To hovorí, dajte mi novú funkciu. Ale to, čo je jeho meno bude zrejme? [00:20:09] Spomínal na pondelok. Aký je názov tohto na základe tejto syntaxe funkcie? Nie, myslím, že to jasne no name associated-- iste nie v tom, čo som tu zvýraznené. [00:20:21] Ale to je vlastne v poriadku. To je anonymné funkcie, alebo funkcia lambda ako by si niektorí mohli nazvať. A to práve znamená, je to stále funkčné. Je to len, nemôžete hovoriť menom. Ale to je v poriadku. Vzhľadom k tomu, opäť, prehliadač je predprogramovaná spoločnosťami ako Google alebo Microsoft alebo Mozilla alebo tretej osoby ku len viem, že ak .onsubmit pole vnútri formulárový prvok má hodnota, zaobchádzať s ňou ako s function-- ukazovateľ na funkciu, ak chcete. A volať, keď je formulár. [00:20:46] Takže to, čo kód by mal byť vykonaný ak je formulár zaslaný? Zdá sa, že všetko, čo vnútri zložená zátvorka. A to je len štylistické. [00:20:53] Dalo by sa to páči máme tendenciu robiť v CS50. Ale v JavaScripte, väčšina ľudí majú tendenciu, aby ju udržali na rovnakom riadku len preto, že jasnejšie je spojené s touto funkciou kľúčových slov. Takže čo teraz robím? [00:21:03] Ak form.email.value rovná rovná prázdny reťazec, alebo nič, tu je upozornenie, kde som chcel povedať, je nutné zadať e-mailovú adresu, a potom sa vrátiť false. A to, že return false že zabraňuje formulár z ich predloženie. Medzitým, v prípade, že hodnota je heslo prázdny, budem kričať na užívateľa a hovoria, musíte zadať heslo. [00:21:21] Medzitým, čo sú stále trochu milovník tu. Pokiaľ nie je form.password.value rovná form.confirmation.value, iné pole, kričať na Užívateľ, ktorý heslá nezodpovedajú ako oni nie pred chvíľou. A potom toto je trochu viac sexi, pretože som viem, že som vedel, že koncepčne kontrolovať je názov zaškrtávacie políčko je. [00:21:40] Tak som sa použiť len výkrik bod povedať, či kontrola nie je checked-- je to Boolean hodnota true alebo false-- Budem kričať na užívateľa z tohto dôvodu. V opačnom prípade, ak sa dostaneme cez všetky tieto podmienky, povedzme, vráti hodnotu true. Nechajte forma byť predložené. A to sa potom stane. [00:21:56] Poďme zadajte rude. Nechajte zaškrtnite políčko, kliknite na Registrovať. A teraz som sa prejsť na miesto určenia. Teraz tam nie je žiadna databáza. Tu nič zaujímavého v register.php. Len som potreboval niečo skutočne hovoriť. Takže mi dovoľte pozastaviť, tu. Akékoľvek otázky týkajúce sa toho, čo sme práve urobili alebo to, čo niektorí z tejto novej syntaxe je? OK, jo? [00:22:17] Divákov: Akékoľvek políčko je automaticky Boolean. Nemusíte deklarovať to takto. [00:22:21] DAVID J. Malan: Správne. Každý checkbox, ktorý je poslaný, aby vás od HTML forma kódu JavaScriptu bude zaobchádzať, áno, as Boolean value-- true alebo false. To je dobrá otázka. Vzhľadom k tomu, iné hodnoty, o Samozrejme, že boli text, AKA reťazca. [00:22:36] Dobre, tak nech mi pretočiť kúsok ďalej. Aký bol celý zmysel tohto? Len aby bolo jasno. Rovnako ako už vieme, a to aj od Pset7 a dokonca aj minulý týždeň prednášky Príklady, ktoré možno samozrejme skontrolovať $ _GET $ _POST, Či používateľ dá nám prázdna hodnota. Spomeňte si na prázdnu funkciu v PHP. [00:22:54] Takže len aby bolo jasné, čo je jeden dôvod, prečo by tiež chcú robiť túto kontrolu chýb vnútri prehliadača? Čo je to motivácia tu? Jo. [00:23:06] Publikum: Rýchlejšie a vy nie Poslať zbytočné dáta na server. DAVID J. Malan: Dobrý. Je to rýchlejšie. Nemusíte posielať k ničomu dát na server. [00:23:12] Tak sa dostanete späť viac okamžitá odozva. A celkovo užívateľ skúsenosť je lepšia. Premýšľajte o alternatívu. [00:23:17] Ak je pre Gmail-- a bol prípad pred mnohými rokmi. Predpokladajme, že máte nový e-mail Gmail účtu, ale jediný spôsob, ako prostredníctvom vidieť, že je, rovnako ako, znovu načítať celú stránku. Alebo Predpokladám, že kliknete na odkaz prečítať e-mail. [00:23:29] Všetko musí znovu tak ktoré môžete vidieť na e-mail. Alebo Facebook-- dostanete správu chatu. Nevidíte ho, kým znova stránky alebo kliknite na nejaký odkaz. [00:23:36] Ako by to bolo strašne nepríjemné užívateľské skúsenosti. A to je to, čo to bolo, jasne, keď som sa uchádzal o UC a web bol oveľa menej dynamický a JavaScript nebola tak propagovaný ako to je teraz. A veci sú stále veľa dynamickejšie a oveľa viac na strane klienta v tomto zmysle. [00:23:49] Ale je tu jeden háčik tu, a To je druh nepríjemný Gotcha. Len preto, že ste pridať na strane klienta Detekcie ako to neznamená, môžete alebo mal opustiť detekcia na strane servera. Ste v podstate chce, aby vaše Kontrola chýb na oboch miestach. Vzhľadom k tomu, čo bolo raz o poučenie z článku som čítal niektoré výňatky z tejto hlúpe CMS system-- Content Management System--, ktorá bola vykonávanie svojej autentizačný systém, jeho prihlásenie cez aký mechanizmus? JavaScript. [00:24:20] Divákov: JavaScript. DAVID J. Malan: JavaScript, presne, je to tak? To bolo pomocou JavaScriptu. A doslova, vy máte hral trochu pravdepodobne s Chrome Inspector. A keď ju nájdete, skontrolujte, či prvok. [00:24:30] Nechaj ma ísť nad to urobiť všetko o možnostiach Chrome. A to je to, ako ľahké je vypnúť JavaScript v prehliadači. Pozrite sa, nič viac JavaScript. [00:24:38] Takže spravodlivosť, veľa pásu v týchto dňoch sa práve chystá zlomiť, pretože Gmail a ďalšie sites-- Facebook-- predpokladať, že JavaScript je povolené. Ale ak robíte niečo hlúpeho ako iba overovanie používateľov vstup a kontrola je pre Chyby na strane klienta, protivník môže ľahko urobiť. A potom ešte múdrejší protivník, ako že vy Teraz by sa použiť Telnet alebo zvlnenie alebo príkazy iba z príkazového riadku a skutočne posielať správy na server že podobne nie sú Chyba kontrolované. [00:25:05] Tak to je viac Rozhodnutie užívateľské rozhranie než je skutočný technický improvement-- vykonávanie na strane klienta niečo také. Takže teraz rýchly pohľad, ale potom Budem odložiť na on-line prechádzku až na tento jeden. V podobe dvoch, sme vlastne prešli a vyčistiť kód trochu. Ale dovoľte mi, aby som odložiť do jedného videí my budeme pravdepodobne vložiť do Pset8, že práve vám ukáže, podobné syntaxe pomocou knižnice s názvom jQuery, čo je super, super populárne knižnica v jazyku JavaScript že úprimne povedané väčšina ľudí stačí použiť v týchto dňoch a dokonca zmiasť ako bytosť JavaScript sám. [00:25:37] A má tendenciu sa zapojiť Niektoré dolára a kľúčové slová ako dokumente tu v zátvorkách. Ale opäť, dovoľte mi, aby som odložiť na niektoré pomalší cvičenia on-line skôr než dostať zviazaný len v syntaxi. Poďme sa presunúť na niečo málo chladnejšie z hľadiska aplikácií to. [00:25:50] Tak predovšetkým, nechaj ma ísť dopredu a otvoriť toto. Poďte ďalej. Tak ideme. [00:25:59] Dovoľte mi, aby som otvoriť tento obrázok tu. Zbytočne komplikovaný hľadať, ale opisuje techniku ​​zvanú AJAX-- Asynchrónny JavaScript a XML, kde X XML je v skutočnosti už skutočne používa. To inklinuje používať niečo čo nazývame JSON. [00:26:13] Ale tu je to, ako niečo ako Google Maps alebo Google Earth funguje. Skúsme to za behu, v skutočnosti. Nechaj ma ísť napred a otvoriť up Chrome na mojom prehliadači. [00:26:21] A nechaj ma ísť do, hovoria, maps.google.com. A skutočne, ak ste starý Stačí si pamätať, čo, ako, MapQuest bol ako späť v deň, a možno, že aj naďalej pracovať takhle. Ak sa používa na hľadanie something-- 33 Oxford Street, Cambridge, Mass, poďme robiť tohle-- vás by v skutočnosti, ak máte chcel posúvať nahor a dole, doľava a doprava, by ste vyzerať veľká šípka na vrchole, a to by vám iný ukázať rám mapy sa tu. Alebo by ste kliknite na ľavej strane a by ísť sem, alebo ďalším kliknutím a vy by ste ísť sem. Ale namiesto toho tieto dni, sme samozrejme len brať za samozrejmosť, že môžeme ísť okolo Cambridge celkom rýchlo jednoduchým kliknutím a ťahaním myšou. Povšimnime si ale, že je to nejaké závady. [00:26:59] Keby som to robiť dosť rýchlo, čo sa zdá byť pravda ako som pretiahnuť príliš rýchlo na počítači držať krok? Čo vidíte? Jo. [00:27:07] Divákov: Pixely sa neobnovujú. DAVID J. Malan: body sa neobnovujú. Je tu actually-- a vás mohol vidieť, v skutočnosti, ak sledujete on-line a pauza tento alebo dokonca spomaľuje veci nadol pre once-- uvidíte, že tam sú dlaždice, štvorce, obdĺžniky, alebo že chýba z mapy do zlomok sekundy neskôr, ďalšie dáta, viac obrázkov v skutočnosti sa objaví na obrazovke. A v skutočnosti, keď sme to tým, že hľadá up Chrome's-- povedzme, Chrome-- poďme sa pozrieť. Nemôžeme to urobiť. [00:27:31] Oh, pokriky. Poďme otvoriť maps.google.com. Dovoľte mi, aby som sa okno väčšie znova. [00:27:36] Vráťte sa do 33 Oxford Street. Čo bolo na internetových stránkach som bol na v poslednej dobe? Mal som, ako, súkromný chvastať sa som, že by som potom rýchle správy Každý priateľ, ktorý bol on-line kto chcel počuť. Je tu nejaká stránka. Myslím, že je to tak Comcast-- veľmi veľký americký ISP. Môžete pri registrácii nové vedenie servisné modem alebo káblová televízia služby, majú tvar veľmi rozumné kde sa vás spýta na Vašu adresu. A má to úžasné rys volal auto kompletné, ako je Google, ktorý začína vyplniť v odpovedi na vašu otázku. [00:28:04] Problém je, že oni robia auto kompletné na prvých vecí, ktoré zadáte. Takže ak začnete písať v 33, vám ukáže, doslova každý dom v Amerike, ktorá začína s číslom 33 pred pokračovaním očakávajú, že budete písať viac. Takže ak zadáte 33 Oxford, potom ti to ukazuje všetky ulice v Amerike, ktorý má 33 Oxford v jeho meno, a to bez ohľadu na mesto že ste v. [00:28:25] A potom budete pokračovať v písaní. A konečne, že si uvedomuje, že to tak nie je ponuka služieb do svojho domova v Cambridge alebo niečo také. Ale ide o to, to je najviac hlúpy implementácia auto dokončiť vôbec. [00:28:34] A ja som jednoducho ísť preč Na tejto točne znova. Ale tam sú dobré spôsoby, ako používať JavaScript a zlé spôsoby. A to nemusí byť nutne najlepší. [00:28:40] Ale ide tu, ako to predvádzaniami bolo otvorenie nástroja sem a otvoriť vývojové nástroje, ako sme povzbudzovaní skôr, a sledovať sieť Karta, keď som kliknite na tlačidlo naozaj rýchlo. A všimnite si veľa z GET stalo. To všetko sa stalo, pretože som ťahal. [00:28:57] A s najväčšou pravdepodobnosťou skutočne Mnoho z týchto radov Teraz je obraz lomka JPEG MIME typ alebo typy obsahu. To preto, že to, čo robí chróm zakaždým, keď som kliknite na tlačidlo a ťahajte, kliknite na tlačidlo a ťahať, je to uvedomil, oh, som treba ísť požiadať Google o dlaždice na mapu, ktorá je tu, Rýchlo si ho stiahnuť cez HTTP, a potom ho pridajte do tzv DOM na webových prehliadačov v pamäti stromu zastúpenia tak, aby užívateľ, ma, vidí, že aktualizovaný dlaždice. A je to preto, technika volala AJAX. Späť v deň, je to naozaj tomu bolo v prípade, že ak chcel zmeniť to, čo je na obrazovke, budete musieť kliknite na tlačidlo hore, dole, vľavo, pravdu. A potom sa nová stránka sa otvorí. Ale v týchto dňoch, všetko je dynamickejší. Stáva sa to v tom, ako my ľudia by dúfam, že to v skutočnosti by interaktívne. A dosahuje tým, že spôsob technikou zvanou AJAX, čo je možno najlepšie vysvetlený na príklade. Najprv mi dovoľte, aby som do toho a otvoriť súbor volal quote.php v Súčasná distribučná kód. [00:29:53] A potom ma nechaj robiť symbol-- Och. Nechaj ma to urobiť symbol = GOOG len pre určité populácie. Alebo vlastne, poďme robiť jeden z pset ZADARMO. Enter. [00:30:05] A teraz si všimnúť, čo sa vrátim. Tak toto je naozaj krátky PHP súbor, ktorý som napísal, že jednoducho požičiava kód z funkcie vyhľadávania Pset7 sa a vypľuje pomocou tohto zloženou zátvorkou a citácie a hrubého čreva firmy, zdá sa, aktuálna fotografia je cena za spoločnosť, ktorá vám odovzdať pomocou GET. Tak toto je niečo iné od najviac z toho, čo máme vykonáva v tomto oznámení Som doslova vypľul čo vyzerá ako kód JavaScriptu. [00:30:27] V skutočnosti sa jedná o objekt JavaScript. V skutočnosti, len aby bolo jasnejšie, JavaScript Object Notation-- JSON-- je len ozdobný spôsob, ako hovoriť, že vás môžu predstavovať dáta v JavaScripte moc rovnako ako je to možné v PHP s využitím kľúčových párov hodnôt. Takže ak by som chcel vyhlásiť, premenné v JavaScripte sa predstavuje Zamyla, pre instance-- struct pre Zamyla-- a budeme nazývať študent, táto premenná. Jej číslo je jeden, dom je Winthrop, a meno je Zamyla. [00:30:53] Ale môžem mať aj rad objektov. Takže keď som vlastne chcel mať polia v JavaScripte obsahujúce viac takých objektov, táto Doba zastupujúcimi zamestnancov, Mohol by som mať tieto tri kusy kódu späť sa chrbtom k sebe pre tieto Traja bývalí zamestnanci. Takže syntax, pekný podobné both-- PHP. Ale to je obzvlášť JavaScript. Je to objekt notácie. Takže to, čo je to dobré? [00:31:17] Ak mám napísať kód, ktorý vypľuje JSON-- JavaScript Object Notation-- veci, ktoré vyzerá to, alebo veci, ktoré vyzerá štruktúra Zamyla je, Ja si skutočne použiť v programoch píšem. Nechaj ma ísť do ajax0.html. A to too-- moc myslel, že vzhľadom k estetike. Ale pozor, čo sa stane. [00:31:34] Nechaj ma ísť napred a zadajte zadarmo tu. Kliknite na položku Získať cenovú ponuku. A všimnite si URL sa nemení. Ale ja som si pop-up sa zrejme dnešná penny cena akcií vo výške $ 0,15. Takže nie je všetko tak zlé. Ale rozdiel je, že nejako tieto údaje sa vrátil ku mne priamo. Ale poďme krok smerom k niečo známejší. Vo verzii jedného z tohto, dovoľte mi, aby som zadajte opäť voľný, kliknite na tlačidlo Načítať cenovú ponuku, a now-- oh, to bolo v skutočnosti verzie jQuery. Tak nech me-- ja nie rýchlo vpred dosť ďaleko. Nechaj ma ísť na verziu dva, čo je miesto, kde som chcel. Všimnite si, čo som tu urobil. Mám web page-- super jednoduchá verzia ľubovoľnej webovej stránky si dnes môže používať s textovým poľom zadarmo tu a potom zrejme len textu. [00:32:14] To nie je forma tu, zrejme. Ale keď som kliknite na tlačidlo Načítať citácie, všimnite si moje webové stránky sa čoskoro zmení, ako by som práve dostal novú správu chatu alebo ako by som sa presťahoval mapa a potreboval sa dostať viac dát pridané dynamicky na webovú stránku bez URL striedanie a užívateľom skúsenosti ako sa prerušil. Naozaj, som stále na samý place-- ajax2.html. [00:32:35] Takže poďme sa pozrieť len na tento príklad a uvidíte, ako sa to deje. Nechaj ma ísť do ajax2.html. A všimnite si najprv formulár. [00:32:44] Tu dole, ja som otočil off auto kompletné. Niekedy dostane nepríjemné v prípade, že prehliadač sa snaží ukázať Celá vaša história. Takže si môžete urobiť v HTML pomocou len hovorím, že auto dokončiť off. [00:32:53] Dal som tento text poli symbol-- skôr ID symbolu. A teraz je to zaujímavé funkcie. Nehovorili sme o rozsahu, ale môžete premýšľať o tom ako odseky značku alebo tag div. Je to, čo sa nazýva In-line prvkom, ktorý znamená, že nebudete mať odsek zlomiť nad a pod ním. Je to len tak zostať in-line, bez biť ekvivalent vstúpiť. Tak som dal tento kus HTML treba určiť jedinečný identifikátor že som svojvoľne volal cenu. A ja mám tlačidlo Odoslať. [00:33:21] Pretože teraz sa here--, a to je v skutočnosti výborný úžasné, ako málo kód môžete písať urobiť relatívne čistý things-- Všimnite si, čo som urobil tu, keby som prejdite až k hlave tejto stránky. Uviedol som prvý moja hlava tag script že v skutočnosti odkazuje JavaScript súbor inde. To je z organizácie že píše jQuery, a to sa len tak vám najnovšie verzia ich knižnice jQuery. [00:33:42] Takže to je niečo ako ostré sú v C alebo vyžadujú v PHP. Môžete použiť tag script s atribútom zdroja. Ale teraz môj vlastný kód bude priamo tu. [00:33:52] Všimnite si, mám funkciu nazvanú Quotes. A to vyzerá trochu mystický na prvý pohľad. Ale poďme dráždiť to od seba. Daj mi premennú s názvom URL. Priradiť doslova tento reťazec. Takže, apostrofy, úvodzovky v JavaScript mi ​​dáva len reťazec. Čo je a robiť? Zreťazenie. [00:34:08] Tak toto už je syntaxe jQuery ktorý trvá trochu zvykať. Ale to len znamená, choď mi DOM uzol, ktorého jedinečný identifikátor je symbol. Hashtag tu znamená jedinečný identifikátor symbol. [00:34:21] Znak dolára na Zátvorky len povedať, že zabaliť v jQuery druh tajný recept, aby získate ďalšie funkcie. A potom .val je zrejme funkcie, alebo ako sa hovorí dnes, Spôsob vnútri tohto uzla že práve vám dáva hodnotu. Takže v skratke, škaredý a mätúce ako to vyzerá na prvý pohľad, to znamená len dostať s užívateľom zadaný v, dať na konci reťazca zřetězením to. To je všetko. [00:34:43] Takže teraz, posledné tri riadky. Môžete si vymačkať veľa Funkčnosť z troch riadkov. Tento znak dolára, as stranou, je len prezývka pre špeciálne globálne premenné volal doslova jQuery. [00:34:55] Znak dolára len vyzerá v pohode. Takže jQuery komunita len tak použitých ako ich špeciálny symbol. To neznamená, že to, čo to znamená v PHP. V JavaScriptu, znak dolára je rovnako ako písmeno abecedy alebo číslo pre premenné. [00:35:07] Stačí si len mať to ako názov. Len vyzerá v pohode. Tak komunity prijal to ako prezývka pre ich vlastné knižnice s názvom jQuery. [00:35:13] A je super populárny. Tak sa JSON je presne to. Je to funkcia, ktorá Ľudia z jQuery napísal že dostane JSON z server-- JavaScript Object Notation. Z toho, čo URL sa to deje získať tieto informácie? Zrejme z tohto URL tu. [00:35:27] A čo by mal robiť, čo prehliadač akonáhle sa vráti túto odpoveď? A to je kúzlo AJAX, tak speak-- Asynchronous JavaScript v XML. Je ťažké vidieť, s takým Jednoduchý príklad, ako sme tu mali. [00:35:41] Ale to bolo v asynchrónny pocit, že môj kód, ak vykonaný poslal správu server choď mi nejaký JSON. A stalo sa to veľmi rýchle že som dostal odpoveď. Ale čo je zaujímavé, je, že táto riadok kódu ani visieť môj počítač. [00:35:55] Nevidel som ikonu odstreďovania. Nestratil som schopnosť pohnúť myšou. Môj prehliadač bol vlastne úplne v poriadku. [00:36:01] Vzhľadom k tomu, ako JavaScript spracováva odpoveď zo servera je nasledujúci. Môžete registrovať, čo by ste nazvali funkcia spätného volania, ktoré jednoducho znamená, hej, JavaScript. Akonáhle server reaguje s JSON, volajte tento anonymný funkcie. [00:36:18] A prosím, prešiel do tejto funkcie bez ohľadu na reťazec server vypľuť ako argument, nazvaný dáta. Takže inými slovami, v prípade Som montáž dynamicky URL quote.php absolvovaní v tomto symbol ako free alebo GOOG alebo ktovie čo ešte, Ja potom hovorím JavaScript choď túto adresu URL. Nezabudnite, že prehliadače sa chystá vrátiť niečo že vyzerá ako sme videli earlier-- to. [00:36:42] A čo druhý argument Tu sa dostať JSON hovorí je volanie tejto funkcie keď server vráti či už je to 10 milisekúnd od teraz, alebo 10 sekúnd od teraz. A akonáhle to urobíte, pridať cenu na stránku. Táto syntax tu len znamená choď na uzol zo stromu, ktorého jedinečný identifikátor je price-- tomto úseku sme videli predtým. [00:37:01] Táto metóda nazýva HTML Len hovorí, ísť nahradiť HTML to tam s data.price. Čo je data.price? No, prehliadač, spomínam, ukázal mi to vracia. Tak toto je dát. [00:37:14] A tak je to trochu záhadný vidieť čiarky tu. Ale v skutočnosti, dovoľte mi to. Dovoľte mi vložiť naozaj rýchlo do gedit a ukázať to, ako sme ukázali, Štruktúra Zamyla je skôr. [00:37:27] Čo je server posiela späť je malý objekt, ktorý vyzerá takto. A tak data.price je len mi dáva 0,1515. Takže veľa pohybujúcich diely tu naraz. [00:37:39] Ale kľúčové takeaways je že majú túto schopnosť aby ďalšie HTTP žiadosti pomocou JavaScript aby bolo nutné znovu načítate stránku. A potom môžeme skutočne zmeniť webové stránky v reálnom čase. A ukázalo sa, že JavaScript a iné jazyky možno použiť teraz nielen mutovať webových stránok, ale vlastne písať softvér v skutočnom počítači, neobmedzuje len na Chrome alebo podobne. [00:38:00] V skutočnosti, if-- Colton by ťa sa k nám pripojiť späť sem s laboratórne kód a Chang rovnako? Poďme ďalej, keď hovoril o anonymné funkcie a volania a naozaj pokúšať osud tu so živou ukážku s krvácaním hrana technológie, jeden z tieto zariadenia Elite pohybu. Teraz toto zariadenie, odvolanie, je malý USB zariadenie rovnako that-- to beautiful-- ktorý sa zapája do USB portov. [00:38:25] A potom poskytuje vstupné vo forme ľudských gest detekciou pomocou infračervených lúčov, v podstate, pohyby z vášho ramena. Takže vzhľadom k tomu, čo Maria snažil skôr, než bol svalnatý, skutočne pocit, čo sa mení vaša ruka, to je infračervené báze. Tak vyzerá to pri prepravách v rámci druh sfére nohy alebo tak samotného zariadenia. [00:38:46] Tak prečo som si stab na to prvé? A poďme do toho a hodiť ste sa na réžii tu. Takže poďme dať notebook Colton je tu. Máme Andrewa na televízore. A čo by si chcel, aby som urobil ako prvé? [00:39:00] COLTON: Choďte do toho a len dajte ruky nad tým chlapom a uvidíte nejaké báječný lesk. [00:39:04] DAVID J. Malan: Veľmi pekný. To všetko sa deje v reálnom čase. OK. Tak jo, a jo. Tak pekné. Tak jo, čo iného môžeme robiť? [00:39:15] COLTON: Prejsť na ďalšie obrazovke a uvidíte. [00:39:17] DAVID J. Malan: Dobre. [00:39:19] COLTON: zábavná hra kde máte robiť roboty. [00:39:21] DAVID J. Malan: Dobre, takže to je falošné ruky ukazujúce mi, čo mám robiť. COLTON: Áno Takže choďte do toho a chytiť jedného z blokov a dal ju na telo, ktoré robotu. DAVID J. Malan: Oh, to je moja ruka. Oh. OK, rozkošný. Počkaj chvíľku, OK. Tak ideme. [00:39:41] COLTON: Urobil som jeden na nehody. [00:39:43] DAVID J. Malan: OK, tak som si toho chlapa. Sakra! Keď sme cvičili to posledné noc, viete, čo to prešiel do? [00:39:51] Takhle. OK. Ďalší z nich? [00:39:55] COLTON: Iste. [00:39:56] DAVID J. Malan: Tak jo, a je tu tretia. Dobrá. COLTON: A v tomto jednom, dostanete to-- DAVID J. Malan: Oh, táto je krásna. COLTON: --yeah, vybrať od seba túto kvetinu. DAVID J. Malan: OK. Nie? Minul. [00:40:14] COLTON: Oh, tam idete. [00:40:15] DAVID J. Malan: Ah, pozri sa na to. Veľmi pekné. No, prečo dont 'berieme z jedného dobrovoľníka tu ktorí by chceli ísť hore. Ako o tu v zeleni, je to? [00:40:27] V poriadku, a poďme have-- namiesto toho robil to, že niektorí z vás možno viete túto hru here-- znížiť lano, snáď? Poďme sa pozrieť. Máme okuliare tu? [00:40:37] OK. Děkuju. Ako sa voláte? [00:40:39] Divákov: Laura. [00:40:40] DAVID J. Malan: Laura? Pekné vidieť. Ak vám nevadí, že uvedenie Google Glass cez vaše okuliare. To je Colton. [00:40:46] COLTON: Ahoj. Teší ma. [00:40:48] DAVID J. Malan: OK, no tak okolo. Dobre, takže to, čo budete robiť tu, mať hral predtým, je dať si ruku na Leap Motion tu. A teraz vaše šípka by sa mal pohybovať. Oh, ani náhodou. [00:40:57] Divákov: Nie [00:40:58] DAVID J. Malan: My nechcem ešte odísť. OK, počkajte. Tu. Takže si všimnúť, ako držíte prst nad niečím, myš začína ísť zelená, čo je, ako sa na tlačidlo. [00:41:06] Takže vznášať sa nad Play. A len jeden prst je v poriadku. A teraz kliknite na malý zelený chlap na ľavej strane. A teraz sa podržte, kým sa zaplní zelene. Dobre. Teraz, ako, jeden stupeň nahor hore. [00:41:16] Publikum: Áno, chceme o jeden stupeň, tu. [00:41:20] DAVID J. Malan: Dobrý. OK, takže všetko, čo musíte urobiť, je znížiť lano. Kurzor je biely tam dole. [00:41:28] Veľmi pekné. V poriadku, je to asi ťažšie. Takže držte prst cez budúci teraz. Dobre. Tohle je ťažké. [00:41:39] Divákov: Oh crap. OK. Chce ísť tadiaľ. Oh crap, that-- [00:41:44] DAVID J. Malan: Jo. Sekundárnym cieľom je dostať všetky hviezdy. Dobre, nabudúce. [00:41:53] Uvidíme, či môžete získať tento tretí. Dobre. OK, tam ísť. [00:42:06] Iste. Oh, veľmi pekné. Dobrá. [00:42:11] Tak prečo nie my odložiť tu dnes? Nech niekto ísť hore, kto si chce hrať. Vďaka moc Laure náš dobrovoľník. A my vás uvidí v pondelok. [00:42:18] Divákov: Pravdepodobne budete chcieť tieto staré. [00:42:21] SPEAKER 2: Na ďalší CS50--