TOMAS REIMERS: Kühl. So Hallo, alle zusammen. Mein Name ist Tomas. Ich bin ein TF und das ist Armaghan BEHLUM: Armi. Schön, Sie zu sehen, Jungs. TOMAS REIMERS: Kühl. So werden wir zu sprechen über Leap Motion heute. So Leap Motion ist ein wirklich cool Produkt, lässt Sie mit einem interagieren Computer in einer anderen Art und Weise. So ist die ganze Idee hinter Sprung Bewegung ist, dass man Ihre Hände zu benutzen Interaktion mit dem Computer. Also hier habe ich etwas aufzubauen. Ich werde es in ein wenig sprechen. Aber der Grundversion ist, können Sie sehen, dass ich vor habe meine Hände von meinem Computer, und als ich sie bewegen, Sie analog auf dem Computer erhalten und Sie können diese analysieren. Sie können Gesten machen. Sie können Ihre Hände zu benutzen Interaktion mit dem Computer in neue und interessante Art und Weise. 

Nun, habe ich eigentlich zuerst wollen Armi abgehen Ihnen zeigen, ein paar coole Demos von dem, was einige Leute haben damit fertig. Und dann werden wir darüber, wie zu sprechen Sie tatsächlich mit diesem Code. Armaghan BEHLUM: Ja. Hallo. So wie wir sahen, wenig Daten hier, aber mal sehen, was einige Leute haben damit fertig. Also lassen Sie mich öffnen gerade dieses Beispiel. Und dann, so zum Beispiel können Sie sehen, meine Hand analogen da, aber jetzt dieses Mal einige Menschen mit Unity haben beschlossen, ein wenig mehr Haut legen und so auf der Hand. So kann ich, lasst uns mit diesem zu gehen, sicher, haben meine Hände in Wechselwirkung. Und Sie können sich wahrscheinlich vorstellen ein paar andere coole nützliche Dinge dass Sie mit diesem zu tun. So ist dies zumindest ein Beispiel. Und dann lassen Sie uns aus dieser zu springen. 

Und dann noch ein kühles ist, lassen Sie uns mit diesem zu gehen. Plasmo Ball. Auch hier würden wir nicht unbedingt erwarten, dass diese Komplexität von einem Abschlussprojekt für CS50. Dies ist nur um Ihnen zu zeigen einige der, geben Sie Kerle ein wenig Inspiration für das, was euch mit Leap Motion machen können. So zum Beispiel, hier ist eine kühle Physik beispielsweise die dort gehen wir. Hat meine beiden Hände so können Sie jetzt haben diese kleinen Plasmaballs. Und der Ball an die Physik reagieren von mir bewegte meine Hand um den Ball. Nun, das ist alles, wenn auch mit Unity, Hilfe Art von Tools und Frameworks dass wir uns nicht gelehrt, euch in der Klasse, aber wie Sie ein paar ziemlich sehen kühlen Durchläufe mit dem. 

Aber eine Sache, die euch tun können Anfahren jetzt mit Leap Motion ist die Arbeit in JavaScript. Leap Motion hat eine JavaScript-API, Sie Kerle können und wir sehr, sehr empfehlen, dass Sie Jungs bauen Ihre Projekte mit, dass. Also mit diesem, lassen Sie mich geben sie wieder ab, um Tomas über Leap sprechen Motion und JavaScript. TOMAS REIMERS: Kühl. Oder wollen Sie anzeigen möchten ihnen die ersten Visualizer? 

Armaghan BEHLUM: Oh ja. Ja. Reden wir mehr über diese Visualizer. 

TOMAS REIMERS: Also auf einer grundlegenden Ebene, wenn Sie zuerst auf Leap Motion erhalten wirst du dieses Kästchen haben. Hier wollen, dass ich die Kontrolle übernehmen? 

Armaghan BEHLUM: Ja, gehen für sie. 

TOMAS REIMERS: Also wenn Sie Erste Leap Motion erhalten wirst du dieses Kästchen haben. Es eine Einrichtung aufweist, sieht ungefähr so ​​aus. Sie stecken Sie es in Ihrem Computer, Installieren Sie die notwendigen Treiber, und dann wird es im Grunde eingerichtet werden. So ist der einfachste Weg, um zu sortieren der Deal mit Leap Motion wird dieses Programm für die es installiert rief die Leap Motion Visualizer. Und der Visualizer ist buchstäblich was ich hier zeigen. Es ermöglicht Ihnen, die zu sehen Skelett Umriss der Hand. Und was die Leap Motion als sie zu interpretieren. So ist die Leap Motion verwendet die Kamera bis der Blick auf Ihre Hände sortieren und dann versucht es zu erraten, was die Grundskelett Zusammensetzung, die Sie siehe der Bildschirm ist. Und das ist, was es zeigt Ihnen. Armaghan BEHLUM: Jeder Einzel wenig Sinn, und, was Sie sehen, gibt es Daten, die verfügbar ist, um euch sowie zu bedienen. So können Sie sehen, dass es Erfassen, dass Tomas hat fünf Finger, die jeweils diese verschiedenen Fingern auch für Sie als Daten vorhanden Punkte in jeder Anwendung dass Sie vielleicht. Wenn Sie sehen wollen, wenn jemand macht einen Daumen nach oben Sie, wenn die Finger sehen gewellt und ob sie Daumen Finger zeigen nach oben, oder in denen Handgelenk oder der Handfläche ist und diese Art von Sachen. TOMAS REIMERS: Kühl. So können Sie ein paar Gesten sehen versteht besser als andere. Denken Sie daran, dass es auf der Suche Ihrer Hand von in einer Kamera von unten, so, wenn Sie Ihre Hände wie haben Dieses es sie verstehe voll und ganz, aber wenn man einmal zu versuchen und zu tun, ein Daumen nach oben, manchmal liest, manchmal kann es erraten, aber ehrlich Die Kamera kann einfach nicht sehen, die Daumen. So ist es nicht wirklich sicher, was passiert. Nur einige Einschränkungen zu beachten, wenn Sie entwickeln mit diesem. 

Wie auch immer, so geht zurück auf diese. Der Visualizer tatsächlich hat eine Menge nützlicher Tools. So ist die Leap Motion ist derart programmiert dass sie nicht erwarten, dass Sie Interaktion mit der Bilddaten. Sie nicht wirklich erwarten, dass Sie verstehen, was hinter den Kulissen passiert. Was sie tun, ist ausgesetzt eine Reihe von APIs für Sie wie, dass man Interaktion mit diesem Daten direkt, ohne zu verstehen was los ist unter der Haube. 

Also, wenn wir getroffen H hier im Visualizer Sie werden eine Menge von Optionen zu sehen. Das wichtigste hier aber ist, wenn Sie traf O und dann drücken Sie H, Sie sehen, dass es werde können Sie Gesten zu ziehen. So eine Geste, sehen Sie, es zeichnet einen Pfeil über. Eine Geste ist einer der Wege, die Sprung Motion-Art können Sie an der Daten zu erhalten ohne es zu verarbeiten. Also anstatt mich zu müssen heraus aus, oh, die Hand bewegte, auch wenn ich Punkt Zugang, den API Art sagen Sie mir, hey, machten sie diese Geste. So können Sie grundlegende Pfeil Gesten machen. Sie können Kreis Gesten machen. Sie können tippen Gesten. Und Sie können Tastendruck Gesten machen. Ja. Und solche Sachen. So, jetzt haben wir eine Art haben zu sehen, was Leap Motion machen können, Sie sehen, es kann ein zu lesen ganze Reihe von Gesten. Ich glaube, ich bin zu gehen geben es zurück zu Armi und er wird über das zu sprechen Sie erhalten auf diese mit JavaScript Wie Sie beginnen sogar ein Projekt mit diesem. Und dann werden wir über einige sprechen coole Orte, die Sie mit, dass zu gehen. Armaghan BEHLUM: Ja. Klingt gut. Also ja, das erste, was wir wollen Sie natürlich auch tun, ist, nachdem Sie die Leap Motion ist es, gehen Sie zu leapmotion.com, Aufstellung, Montage die Fahrer und Material. Nachdem ich, dass Sie gehen können, um sicherzustellen, dass er angeschlossen ist. Wenn Sie in Ihrem kleinen Fach finden Sie in der Leap Motion-Symbol und es ist grün, dann wissen Sie, du bist fertig. Und selbstverständlich prüfen, was genau Tomas zeigten Sie gerade mit den Gesten und tun die Berührung des Bildschirms, und Schlüssel Hähne, und diese Art von Sachen. 

Nach, dass, obwohl wir, einmal mehr, wie ich schon sagte, Wir haben Zugriff auf alle diese Dinge in JavaScript als auch. Die ideale up, dass setzen wir würden Sie empfehlen Jungs ist in Ihrem gehen vhost Verzeichnis lokalen Host, Öffentlichkeit im CS50-Appliance. Und wenn Sie dort hin gehen, was Sie sehen, ist ein Indexpunkt HTML-Datei. Nun, da Indexpunkt HTML-Datei oder Indexpunkt PHP-Datei, es gilt der gut, was Sie dann tun können ist gehen Sie zu Ihrem Haupt-Betriebssystem. Und wenn Sie die IP-Adresse gehen das ist in der rechten unteren Ecke aufgeführt Ecke des Gerätes genau hier, wie Sie sehen können, was passiert dann wird Sie zu der Seite, ist zu gehen von diesem Indexpunkt HTML-Datei verwiesen. Also alles, was Sie den Code, die Sie setzen in es wird gesendet und wieder verwendbar ist hier. 

TOMAS REIMERS: So ist es auch wichtig gerade als Referenz dass, wenn Sie Jungs wirklich wissen, wie man einen Server einrichten Sie sich, oder Sie dies auf der weltweit setzen wollen Bahn, sind Sie herzlich eingeladen, was auch immer zu tun. Denken Sie daran, dass es sich um nur JavaScript-Dateien und der ganze Sprung Verarbeitung ist auf dem Client. So ist es nicht wirklich wichtig, wo Ihr Server Leben so lange, wie der Computer Du betrachtest die Website an hat Leap Motion installiert. Armaghan BEHLUM: Auf jeden Fall. Wie Tomas sagte, ja, Was auch immer für euch. Dies ist nur eine unserer Empfehlungen. Jetzt starten mit Leap Bewegung, was Sie tun würden, wird Sie importieren die JavaScript-Datei von Leap Motion. Und dann von dort, was Sie tun können, ist, gerade jetzt Ich habe nur dieses Absatzes Tag mit der ID Text gesetzt. Dinge, die wir empfehlen werden Controller-Optionen einstellen für Leap Motion mit der ermöglichen Gesten wahr zu sein. So standardmäßig die Gesten, die wir Ihnen gezeigt, Jungs, der Kreis, und die Schlüsselhahn, und die Schläge, diese werden nicht gezeigt euch standardmäßig. Aber wir empfehlen, mit denen so dass Sie nicht das Rad neu erfinden. Aktivieren Sie die zu wahren, vorbei an denen Controller-Optionen zu Punkt Schleife springen und Sie sind einstellen, um zu gehen. Denn dann müssen Sie nur noch definiert eine anonyme Funktion das wird in eine Aufnahme Rahmen aus Leap Motion und dass der Rahmen hat alle Informationen, die Sie gehen zu müssen, sind. 

TOMAS REIMERS: Also, nur um rekapitulieren, müssen Sie ein Objekt. Sie müssen diese Funktion genannt Sprung Punkt Schleife. Und Sie nennen es mit zwei Argumenten. Sie nennen es mit einem, die Controller-Optionen. Und es gibt eine Menge von Optionen, die Sie dort setzen in. Der, den wir gerade zu gehen betonen ist Gesten zu ermöglichen. Und wenn Sie es gleich wahr ist, dann setzen Sie Zugriff auf diese Gesten zu bekommen dass wir Ihnen gezeigt, in der Visualizer. 

Und dann das zweite Argument ist ein Funktion, es ist ein bisschen wie ein Rückruf das wird jeder aufgerufen werden Zeit jeden Frame Sprung, Also jedes Mal, Sprung Register, Ihre Hand bewegen, hat es einen neuen Rahmen. Und diese Funktion mit einer ruft Argument, das der Rahmen-Objekt ist. Und das Frame-Objekt beschreibt der Rahmen, wie Leap sieht. Armaghan BEHLUM: Genau. So enthält diese alle nützlichen Stücke von Informationen dass wir vorhin gesprochen. Überprüfen Rahmen dot Gesten ist eine Reihe von Gesten dass der Sprung Bewegung gefangen Ihre Hände zu tun im letzten Frame. So zum Beispiel, was wir denn hier ist wir überprüfen, hey, Leap, in diesem letzten Bild habe Sie Gesten, die ich tat, fangen? Und wenn ja, was wir beschließen, zu tun wird durch diese Gesten laufen und versuchen, einige nützliche Informationen von ihnen. Jede Geste hat eine einzigartige ID zugeordnet. Sie haben Typen. Sie können an welchen Finger schauen wurden in den Gesten beteiligten indem Sie aus diesen anzielbaren Zeug. Also, wenn, wenn Sie durch die gehen Leap Motion JavaScript API Zeug, wenn sie erwähnen pointables, sie sind über diese Finger sprechen. Und dann die Hände sind natürlich die gesamte Hand-Objekt. 

Was sonst? Sie können überprüfen, wie lange die Bewegung fort für und, ja, all die nützlichen Sachen. Also, was ich jetzt tun Hier ist I angemeldet Sie den Rahmen, und dann habe ich mein HTML aktualisieren, um anzuzeigen alle diese Bits von Informationen von dem Rahmen. Also lassen Sie uns prüfen, ob aus. 

Also hier ist es. Hier ist der Index Punkt HTML-Datei. Und wie Sie gerade gesehen, als ich gerade umgezogen meine Hand Leap fing einen Kreisbewegung. So können Sie sehen mich dabei ein Kreis über hier, aktualisiert mit Kreis Informationen. Doing Hiebe, fängt Schläge. Versuchen wir eine Bildschirm Registerkarte. Dort gehen wir. Bildschirm tippen und ein Schlüsselhahn. So Schlüssel Hähne auch durch die So sind, wenn Sie sich treffen. So können Sie sich vorstellen vielleicht ein Klavier spielt. 

Und dann Bildschirmberührungen sind wenn Sie traf den Bildschirm. So können Sie vielleicht sogar vorstellen, können Sie über einen Touchscreen vor Ihnen und Sie schlagen die Touch sind Bildschirm vor Ihnen. Und dann können wir ein zu packen dieser Objekte in hier. So erinnere ich mich, dass ich Passieren der Rahmen in der Konsole ist. Und so können wir einen Blick auf die gesamte Stücke von Informationen die verfügbar sind in daß der Rahmen sowie zu bedienen. 

Wie ich bereits sagte, pointables die Finger. Zu diesem Zeitpunkt hatten wir nicht unsere Hände vor dem Leap Motion so registriert Null, aber das ist, wie Sie beginnen würde vielleicht herausfinden, wie viele Finger auf dem Bildschirm. Und diese Art von Informationen. TOMAS REIMERS: Und das Erinnern dies ist nur ein Objekt. Also alles zugegriffen werden kann wie eine Art Struktur in C. Sie haben die Aufgabe, nennen Punkt dem Namen der Eigenschaft. Und dann in, dass Sie Arrays und andere Objekte haben, aber denken Sie daran, es ist nur ein Objekt. Es gibt nichts besonderes weil wir mit Sprung. Armaghan BEHLUM: Ja. Kühle. Sollten wir prüfen, ein paar JavaScript-Beispiele? 

TOMAS REIMERS: So schnell vergessen, dass wir sagte, dass Leap kann tatsächlich laufen auf jeder Website. LeapJS wird nur an einen Kunden serviert. Und so zusammen, wie der Kunde Leap Motion angebracht wird es funktionieren. So Leap Motion hat ein Website, wo Menschen ihre Beispiele teilen Dinge, die sie gemacht habe. Also sind wir gerade dabei, zu gehen durch ein paar von ihnen um zu sehen, was möglich ist, bevor Tauchen in mehr Einzelheiten darüber, wie es ist möglich. So Armaghan BEHLUM: Mal sehen. TOMAS REIMERS: Jetzt sollte es funktionieren. Armaghan BEHLUM: So, jetzt bevor wir ein Beispiel gesehen mit Unity, die unsere Hände gemacht mit ziemlich beeindruckende Grafik-Skins, aber jetzt können Sie sehen, können Sie das tun, dasselbe in einem Web-Browser. Das ist alles im Inneren Chrome nur mit Hilfe von JavaScript. Und dann die andere nette Sache ist, wenn Sie wollen zu wissen, wie sie dies taten, Beispiele für JavaScript auch Code Optionen Sie können überprüfen, und dann sehen, wie diese Person wurde Grabbing Hände und Codes und so. 

Also das ist alles, was Sie finden können bei developer.leapmotion.com. Sie können gehen und überprüfen Sie JavaScript Beispiele, die sie dort haben. Also ja. Hier sind sie, oops sorry. Lassen Sie uns versuchen, dass wieder. Oh. Ich habe zwei rechten Händen. Also ja. 

TOMAS REIMERS: Also wieder, erinnern manchmal Leap vermasselt. Probieren Sie es ein zweites. Es ist nicht perfekt, aber es ist ziemlich gut. Armaghan BEHLUM: One andere Empfehlung auch ist es nicht in direkter Sonneneinstrahlung. So übrigens Leap Motion Werke ist, tatsächlich wenn ich die Kamera diese zeigen als auch Infrarotlicht. So sendet er diejenigen aus und dann liest sie, wenn sie zurückkommen. Also, wenn Sie versuchen, tun sie direkter Sonneneinstrahlung, zum Beispiel, ist es wahrscheinlich nicht zur Arbeit gehen, oder es wird erforderlich einige Kalibrierung zu tun. 

Auch eine andere Empfehlung ist, klar den Raum hinter dem Sprung und vor Leap. Betrachten Sie es als Arbeits innerhalb einer Kuppel, die ist rund um dieses Leap Motion-Objekt. Wenn es Sachen Recht dahinter aber auch, das ist auch werde stören mit, wie die Leap Motion versuchen Ihre Hand erkennen und diese Art von Sachen. 

So, zum Beispiel, ich glaube, in diesem Fall ist es mein Laptop tatsächlich das ist eine Art, den Sprung Motion. Ja, da wir gehen. Also, wenn ich klar aus meinem Laptop aus dahinter die Hand zeigen sich ziemlich gut. Also ja. Es ist das. Also, was sonst getan zeigen wir ihnen. TOMAS REIMERS: Ich denke, Jetzt wäre die Zeit bis der Sprung ins sortieren und lassen Sie uns einfach machen eine Demo ganz von vorne an. Es wird wirklich einfach. Im Grunde, was wir um zu versuchen zu tun, ist es so dass, wenn Sie Ihre Hand, die wischen Hintergrund geht um so rot beginnen, und wenn Sie Ihre Hand streichen, die Hintergrund geht auf grün. OK? Wirklich einfach. Und es ist im Grunde nur gehen durch eine Menge gehen der Konzepte Leap damit wir bekommen in dieser Ideologie, wie Leap funktioniert und wie wir Sachen mit, dass zu bauen. Und dann von dort wir werden wahrscheinlich nur zeigen, die API-Dokumentation und wo Sie Mehr zu diesem Thema lesen. Und dann werden wir es heute nennen. So wollen Sie codieren möchten oder willst du mich zum Code? Armaghan BEHLUM: Ja. Nun, ich denke wir arbeiten zusammen auf diese und versuchen 

TOMAS REIMERS: Also wir werden tun einige Paar Codierung. Armaghan BEHLUM: Dort gehen wir. Das ist genau das, was ich wollte heraus zu überprüfen. Kühle. So zum Beispiel in hier, mal sehen. Während wir Iteration durch die Gesten schon, TOMAS REIMERS: Willst du machen nur eine völlig neue Datei? Armaghan BEHLUM: Völlig neue Datei? Ja, sicher. 

TOMAS REIMERS: Ja. 

Armaghan BEHLUM: Also lassen Sie uns tun. 

TOMAS REIMERS: Also werden wir um ein komplett einreichen. Wir nennen es die Hand dot HTML. Das ist cool mit mir. So erinnern Sie sich ein HTML-Tag zu tun, dann innerhalb, dass Sie einen Kopf. Das Kopf hat einen Titel in ihr. So Registerkarte umge. Dort gehen Sie. Titel, werden wir es nennen Leap Beispiel. Yep. 

Armaghan BEHLUM: Hoppla. Titel. 

TOMAS REIMERS: Yep. 

Armaghan BEHLUM: Da sind wir. 

TOMAS REIMERS: Und dann lassen Sie uns einen Körper. 

Armaghan BEHLUM: Warten Sie, lassen Sie uns Auch stellen Sie sicher, zu importieren. TOMAS REIMERS: Oh, natürlich. Mein schlechtes. Also immer sicherstellen, dass Sie die Leap haben Skript, so dass ein Skript ein, die Sie von Leap Motion, die im Grunde ermöglicht es dem Web-Browser eine Verbindung zur Einrichtung auf dem Computer des Benutzers. Und dann in diesen wir brauchen einen Körper und lassen Sie uns einfach machen den Körper sagen hallo so dass wir Studenten zeigen wie man auf diese neue Verbindung Web-Seite, die sie gemacht. Armaghan BEHLUM: Sicher. Also lasst uns einfach another-- setzen 

TOMAS REIMERS: Hallo, Hallo Welt. Also ein sehr einfaches Beispiel. Wirklich nur eine Demo. 

Armaghan BEHLUM: Und dann wir hier kann, nannten wir Hand dot HTML zu gehen, oder? Und oh! Ich frage mich, was los ist mit diesem Augenblick. Lassen Sie Leseberechtigungen hinzufügen zu Punkt HTML übergeben. TOMAS REIMERS: Möchten Sie um es in der großen Terminal tun so dass wir nur zeigen sie auf the-- 

Armaghan BEHLUM: Ja, das macht Sinn. In Ordnung. Also habe ich nur noch die Berechtigungen, aber wenn wir waren Sie bitte zuerst die Berechtigungen, bevor wir würde, dass tatsächlich die Hand gesehen haben dot HTML nicht über Leseberechtigungen und daher konnten wir nicht machen es. Aber jetzt, wenn wir das tun, sehen wir unsere wenig Hallo Welt recht. 

TOMAS REIMERS: Lassen Sie uns also tatsächlich, als er schrieb, Hallo Welt, Ich über eine Idee wir könnten das ändern. Machen wir es sagen, hallo Welt, dann, wenn Sie winken, heißt es Abschied nehmen. Richtig? So hallo, auf Wiedersehen. 

Armaghan BEHLUM: Sicher. 

TOMAS REIMERS: Das klingt ziemlich gut. 

Armaghan BEHLUM: Das klingt gut für mich. 

TOMAS REIMERS: Also, wenn wir tun, dass wir einfach denken über die Web-Seite ein wenig. Wir werden ein Skript benötigen was im Grunde registriert Sie winkte und auf einen Sprung, eine Welle und ein Schlag, dasselbe. So werden wir ein Skript benötigen, dass grundsätzlich Register für diesen Schlag. Und noch etwas, wir sind gehen zu müssen, ist, wir sind werde einige brauchen eigentlichen Inhalt zu ändern. 

So wie Sie sich erinnern, jQuery ermöglicht es Ihnen, Inhalte zu ändern. So eine Sache wir vielleicht schließen dabei ist die jQuery-Bibliothek. Und dann in der Lage sein, was auszuwählen wir eigentlich los, um Inhalte zu ändern, das wird eine ID benötigen oder eine Klasse oder etwas, dass wir verwenden können, um es auszuwählen. So dass wir nur geben ihm eine schnelle Identifikation von Text ändern. Und dann wollen Sie jQuery zu greifen? Armaghan BEHLUM: Also, was ist das erste was auf unserer Liste, um dann jetzt tun? TOMAS REIMERS: Lassen Sie greifen jQuery? Armaghan BEHLUM: Lassen Sie uns greifen jQuery, OK, cool. In diesem Fall werde ich um actually-- zu haben wo wäre die beste Ort, um das zu tun? 

TOMAS REIMERS: jQuery, wenn Sie also Google jQuery, jQuery getroffen, die erste Armaghan BEHLUM: Sehr erste. TOMAS REIMERS: Or herunterladen. Es ist in Ordnung. Hit Download v1 und v2 links. So dass wir die Beschreibung von jQuery Online wie haben Sie wahrscheinlich getan. Blättern Sie nach unten. Up, up. 

Armaghan BEHLUM: Oh, hier gerade? TOMAS REIMERS: Oder dass. Yep. So jQuery hat eine gehostete Version was bedeutet, dass Sie nicht wirklich tun, müssen Sie es herunterladen, aber Sie sind mehr als willkommen, um es herunterzuladen und hosten Sie es selber. Armaghan BEHLUM: Kühl. So, jetzt haben wir jQuery. Nun, was als nächstes auf unserer Liste zu tun. TOMAS REIMERS: Awesome. Also das nächste, was wir brauchen zu tun ist, die wir wirklich brauchen p Hallo Welt eine ID geben so können wir es ändern, oder? Lassen Sie uns so eine Vorstellung davon, Ich weiß nicht, ändern Sie Text? Armaghan BEHLUM: Sagen wir einfach machen es so, denke ich. TOMAS REIMERS: changeText, cool. Und nun die Seite zu aktualisieren gerade. Stellen Sie sicher, dass alles funktioniert. Also zurück in den Browser. Kühle. Immer eine gute Erinnerung daran, dass wenn Sie den Aufbau einer Website, jedes Mal wenn Sie machen wahrscheinlich aktualisieren jeder etwas wesentliche Änderung nur weil man manchmal versehentlich fallen ein Tag, oder Sie versehentlich etwas zu löschen, und dann können Sie etwas Kleines zu brechen, aber dann, wenn Sie eine größere Änderung vornehmen du, warum hat diese große Veränderung sind scheinbar brechen die nicht verwandten Sache. So ist es immer gut, um von zu sortieren gehen und tun, Plausibilitätsprüfungen. 

Wie dem auch sei, so jetzt tun können eine letzte Plausibilitätsprüfung, das ist wollen wir versuchen, zu ändern Text ohne Leap Motion, ohne irgendetwas, nur auf der Seite zu laden, es wird ändern Hallo Welt zu Wiedersehen mit jQuery. Also, wenn Sie daran denken, jQuery entlarvt Diese Dollarzeichen-Funktion, die wir CSS-Selektor zu passieren, nämlich hashtag Änderungstext hinzu, die wählt das Element mit eine ID-Änderungstext. Und dann werden wir um die Methode HTML nennen auf das Objekt mit der zurück Argument eines Strings auf Wiedersehen, die die Einzelteile ändern HTML zu verabschieden. Ehrfürchtig. Das scheint ziemlich cool. Und jetzt, wenn wir aktualisieren die Seite, wir werden sehen, es sofort ändert sich zu verabschieden, nicht wahr? Weil sie nicht warten, für alles. Art, sobald das Skript läuft es Abschied nehmen ändert es. Kühle. 

So, jetzt wollen wir wickeln, daß in einer Funktion. Richtig. Also wir werden wollen um eine Funktion zu machen. Wir werden es auf Wiedersehen nennen. So Funktion Abschied ist werde keine Argumente haben und es ist nicht wirklich werde nichts zurück. Und es ist gerade dabei, tun, dass in JavaScript. Ausgezeichnet. So, jetzt unsere Funktion auf Wiedersehen ändert sich der Text zu verabschieden, nicht wahr? So gibt uns einen Weg im Grunde Wechsel dass der Text zu verabschieden, wenn wir nannten diese Funktion. Richtig? Also das ist ziemlich cool. 

Armaghan BEHLUM: Nun, wir kann auch nur sicherstellen, dass dass jetzt, da wir nicht den Aufruf der Funktion, wenn wir die Seite zu aktualisieren, bemerken es nicht geht um den Text zu ändern. 

TOMAS REIMERS: Ausgezeichnet. So, jetzt werden wir beginnen in diese Leap Zeug dass wir redeten. So Armi, wollen Sie möchten nehmen Sie es von hier aus oder? 

Armaghan BEHLUM: Ja. Sicher. Ich bin wahrscheinlich zu benötigen zu überprüfen Sie die Dinge, aber zum Beispiel daran erinnern, wir sagten, wir wollten , um in den Optionen sicher setzen wir ermöglichen Gesten TOMAS REIMERS: Guter Fang. Armaghan BEHLUM: wahr zu sein. Und dann wurden wir empfehlen dass euch würde laufen Sprung Punkt Schleife, die wie bereits erwähnt, hat zwei Möglichkeiten, ein JSON-Objekt, sind die Möglichkeiten, wie Sie wollen um die Leap Motion konfigurieren Arbeit, und dann eine Funktion, die es gehen, um einen Rahmen als Callback zu fangen Funktion wie Tomas sagte. Und bearbeiten Sie, was Sie wollen mit dieser Funktion zu tun. 

So in die passieren wir Option und jetzt definieren wir eine Funktion, die in einem Rahmen stattfinden wird. Und jetzt haben wir zu definieren was die Funktion tut. Es ist auch im Interesse der Zukunft tun, um sicherzustellen, dass. TOMAS REIMERS: Ausgezeichnet. So, jetzt müssen wir diese Sprung Punkt Loop-Funktion nennen, die im Grunde sagt beobachten Leap mit diesen Optionen und jedes Mal, etwas ändert, rufen Sie diese Funktionsrahmen mit allen Daten Sie sind sich der im Rahmen. Klingt ziemlich gut. So, jetzt schnelle Plausibilitätsprüfung, die ich immer empfehlen, ist in dieser hat gerade Konsole Punkt Protokollrahmen. Und dann in Chrome öffnen und schauen Sie sich Ihre Konsole und spielen, um mit Sprung auf die zu sehen Frames werden, denn das wird protokolliert erhalten Sie eine Vorstellung davon, was Daten, die Sie Zugriff haben. Und wie immer, wenn Sie verwirrt, Nachschlagen der API-Referenz. Und wir erledigen den Link angeben für die am Ende von diesem. 

Armaghan BEHLUM: Also wir aktualisieren Sie die Seite, und dann wir gehen und öffnen Sie die Konsole wieder ein. Und jetzt stellen wir fest, dass wir mit Rahmen in übergeben, diese kleinen Objekte sahen wir früher. Also ja. Dies sind unsere Rahmen zeigt sich in der Konsole. Kühle. 

So, jetzt, da wir das packte Rahmen, wie Sie sich erinnern kann früher aus dem Beispiel, dass wir, wenn wir überprüfen Rahmen dot Gesten wir die Liste von Gesten zu bekommen, dass der Rahmen zuletzt gefangen. Wir können die Länge des Arrays überprüfen zu sehen, ob Leap gefangen keine Gesten. Also, wenn das Array größer als Null ist, dann haben wir wissen, dass wir ein paar Sachen zu tun. 

Lassen Sie uns also zu wickeln, dass in einem Zustand, wenn und jetzt hier, was wir wissen ist, dass wir haben eine Geste zu sehen, lassen Sie uns auf diese zu reagieren. So, jetzt, dass wir hier sind wir eine Geste heraus zu überprüfen. TOMAS REIMERS: Nun, die erste Sache ist, es ist nicht nur eine Geste, es könnte so viele Gesten. 

Armaghan BEHLUM: Sehr wahr. TOMAS REIMERS: Also pro klassische C-Stil hier Wir werden wahrscheinlich wollen eine for-Schleife verwenden. Armaghan BEHLUM: Hier sind wir dann. Wir entschieden uns, laufen durch die Gesten. Und lassen Sie uns sehen. i und, und. Und jetzt, wenn wir vielleicht gemacht nur var Geste entspricht Rahmen dot Gesten Halterung i, wir haben jetzt Geste selbst, die nur gehört einzelne Instanz einer Geste Objekt für uns zu arbeiten Innere dieser for-Schleife. In Ordnung. TOMAS REIMERS: Lassen Sie uns geistige Gesundheit Überprüfen hier immer nur trösten dot loggen Geste, um zu sehen, was wir bekommen. 

Armaghan BEHLUM: Console Punkt log Geste. Okie dokie. Und aktualisieren Sie noch einmal. 

TOMAS REIMERS: Und lassen Sie uns versuchen, eine Geste. Sie werden, dass ein Haufen sehen der, als er klaut, Sie eine Reihe von Gesten in das bekommen Konsole und wenn er versucht, einen Kreis zu tun, es ist just-- 

Armaghan BEHLUM: Kreise sind einfach richtig nett. 

TOMAS REIMERS: Jetzt gibt es eine seltsame Sache, Hier, das wird er macht einen Kreis, aber dies ist die Anmeldung 80 Gesten, nicht wahr? Das ist eine Menge von Gesten. Also die erste Art der Sache zu zu realisieren, und dies kann verwirrend sein, ist, dass eine Geste wird nicht nur einmal protokolliert. 

Auf jedem Bild, rechts, so dass, wenn ich tue, einen Kreis Leap dies erkennen ist eine Änderung, davon ist eine Änderung, davon ist eine Änderung. Und es wird jeden von denen einloggen. Aber in jedem Fall haben, es geht zu sagen, oh, gibt es eine Geste in Arbeit. Also lassen Sie mich nur sagen, hey, es gibt eine Geste und es ist derzeit in Arbeit. Also, was wir nicht wollen, zu tun ist, zu sagen, oh, auf jeden jener Gesten Sie Text ändern möchten. Was wir wollen, ist, wenn diese Geste Haltestellen, und können wir für die Überprüfung dann in Text ändern möchten wir. Armaghan BEHLUM: Mhmm. So wie Tomas ist erklären diese Gesten könnte durch mehrere erscheinen Frames, zB als wir mit dass Kreis, können wir sehen, dass die ID für diesen einen Einzelkreis, dass wir vielleicht wurden versucht, abzuschließen war die gleiche ID überall. Und in der Tat, können Sie auch Besuche die Status. aktualisiert. 

Und dann ist wahrscheinlich die diese letzten Kreis, die, oh, na ja, OK. Also manchmal zeigt es Ihnen eine Status Stoppen einer Geste und es zeigt Ihnen auch eine Status der Start einer neuen Geste, wenn sie erkennt genau, dass Sie eine neue Geste begonnen haben. Zum Beispiel in diesem Fall. TOMAS REIMERS: Kühl. Armaghan BEHLUM: Also ja. Und dann wollen wir mal sehen. Sie können auch feststellen, aber wir machten ein Kreis und Gestik ist ein Feld namens Typ dass uns sagt, welche Art der Geste ist. So dass möglicherweise nützlich für uns sein Sie versuchen und tun, was wir tun. TOMAS REIMERS: So Übergang zurück zu JS, das erste, was mir einfällt, auch, nur das Lesen durch diesen Code ist es eine kleine Optimierung, was wir eigentlich brauchen das nicht, wenn die Bedingung, nicht wahr? Denn wenn Rahmen dot Gesten dot Länge Null ist, das für Schleife nicht dabei, dennoch laufen lassen möchten. So können wir auch einfach gehen voraus und davon zu befreien. Auch, während Sie Code es ist wichtig, sich zurück und Art gehen von Refactoring, wie Sie erkennen, dass Sie könnte etwas besser sein können, oder dass es einen anderen Weg, um das zu tun. So, jetzt sind wir gerade dabei, diese zu reinigen schnell und säubern Sie Ihren Code. Das ist eine große Sache. 

Armaghan BEHLUM: Gut Stil wird sehr geschätzt. 

TOMAS REIMERS: Sie können immer sagen, wenn jemand hat Code, wo es früher ein, wenn Zustand und sie entfernt sich, aber sie haben nicht kommentieren Sie es. Es ist sehr offensichtlich, und es sieht hässlich. Armaghan BEHLUM: Also, was ist nächstes auf unserer Liste zu tun? TOMAS REIMERS: So, jetzt, wie wir sagten, Ich denke, das erste, was wir tun wollen wird dafür sorgen, dass diese Geste eigentlich ein Schlag, nicht wahr? 

Armaghan BEHLUM: Ja. 

TOMAS REIMERS: Also, wenn wir sagen, dass unser Abschied ist ein bisschen wie ein Schlag, wir gehen mit, es ist ein Schlag, der erste, was wir zu sagen, hey benötigen, wird die Geste geben Sie einen Seitenhieb, oder? Nicht ein Kreis oder eine Spitze, aber es ist ein Schlag? So, wie wir das tun können ist, können wir sagen, Geste Punkt-Typ gleich gleich Swipe als String zurück. 

Armaghan BEHLUM: [unverständlich] Geste Punkt-Typ entspricht entspricht Schlag. Da sind wir. 

TOMAS REIMERS: Und dann ist die letzte Frage Wir wollen sehen, ist Geste dot Zustand gleich gleich Stop, oder? Also das ist, wenn die Geste ist gestoppt. Ich eigentlich für Swipe denke, ich weiß, das aus der Spitze von meinem Kopf, aber Sie sind herzlich eingeladen, schauen Sie, wenn Sie Swipe jedes Mal registriert er bis Sie zu stoppen ist ein Anfang Geste. Und dann der letzte, der nur ein Stop Geste. Es wird also nur eine Station sein, Geste, die für uns ist groß. Also, was wir tun können, ist zu sagen, wenn Geste dot Typ gleich gleich Swipe und Gestik dot Status gleich gleich stoppen, dann lassen Sie uns geistige Gesundheit Überprüfen Sie hier, trösten Punkt log Geste. 

So werden wir wieder hier. Wir werden die Seite zu aktualisieren. Und jetzt das einzige Mal etwas sollte sein Konsole dot angemeldet ist, wenn wir streichen. Und wir versuchen, Streichen und wir sehen nichts. Richtig? Also das ist wirklich ein großes Problem. Wir sind nicht zu sehen, was wir zu erwarten. Und Debugging kann ein großer Teil davon zu sein. Das erste, was wir gehen zu sagen ist, OK, lass uns zu trösten dot melden Sie sich, wenn Geste dot Typ gleich gleich swipe. Armaghan BEHLUM: Ja, lasst uns das tun. TOMAS REIMERS: So sind wir werde darauf zurückgehen. Wir aktualisieren. Wir streichen. Und wir werden ein paar von ihnen zu sehen. OK. So klar das Problem war, Mit unseren Geste dot Status. Wenn wir eröffnen eine davon wir werden Blick in den Objekten und wir werden sehen, gut, es ist ein Anschlag, aber, oh, es heißt Staat, nicht den Status. Also, wenn wir wieder in den Kopf unseren Code können wir sagen, wenn Geste Punkt-Typ gleich gleich Swipe und Gestik dot Zustand gleich gleich Altestelle, dann werden wir Punkt trösten protokollieren. Und so zu aktualisieren. Wir streichen. Und wir, denn bei jeder Schlag, wir sind nur immer eine, die das ist Ende, das ist toll, nicht wahr? Das ist, was wir wollen. 

Armaghan BEHLUM: Yep. Und wir können auch feststellen, dass die IDs für jede dieser Gesten sind getrennt. So wie Tomas sagte, weil wir Fang dieser One-Stop-Zustand, dass besteht am Ende eines Swipe, wir sind immer einzelne separate Gesten von Leap Motion. Großartig. 

TOMAS REIMERS: Lassen Sie uns weitermachen und einfach nicht die letzte Sache, die ist, 

Armaghan BEHLUM: Auf Wiedersehen. 

TOMAS REIMERS: Awesome. Und nun besuchen Sie unsere Website lassen. Einer 

Armaghan BEHLUM: Zweite. Wir wussten ja, wir haben es nennen Wiedersehen. Großartig. 

TOMAS REIMERS: Nein, Auf Wiedersehen ist eine echte Funktion. 

Armaghan BEHLUM: Ja. Lassen Sie uns das tun. 

TOMAS REIMERS: Und wenn wir winken, heißt es Abschied nehmen. 

Armaghan BEHLUM: Wir haben den Sieg. 

TOMAS REIMERS: So ziemlich aufregend Zeug. Hoffentlich können Sie etwas zu bauen sonst, aber Sie bekommen die Idee, nicht wahr? Sie können Gesten erkennen. Sie können Funktionen aufrufen. Und davon, dass wirklich gibt Ihnen einige sehr grundlegende Bausteine zu sagen, oh, vielleicht, wenn sie swipe up, da kann man auch Dinge erkennen wie Richtung. Ich will, dass sie etwas tun. Oder, wenn sie rechts streichen, I wollen, dass sie etwas tun. Und wir beginnen können, um zu kreativ mit, wie genau werden wir zur Verbesserung unserer Website Mit diesen Swipe-Gesten oder Kreis Gesten, oder tippen Sie auf Gesten, entweder Schlüsselhähne oder Berührung des Bildschirms. Und dann außer, dass Sie mehr als willkommen, um zu spielen mit den tatsächlichen Daten, aber wenn Sie wollen, dass wir empfehlen Ihnen, die Dokumentation zu gehen weil sie eigentlich wirklich gut. Also, um die Dokumentation jetzt geleitet. Oder wollen Sie darüber sprechen? 

Armaghan BEHLUM: Ja. Lassen Sie uns das tun. Auch eine andere Leckerbissen der Beratung, versuchen und denken Sie an diese in 3D. Also eigentlich ist nach oben ziehen, diese Gesten lassen ein weiteres Mal Konsole Punkt log Geste und wir das tun. Kommen Sie zurück in und nun wollen wir versuchen ein paar von ihnen, einige von denen. 

Wenn wir in gehen und Check-Out diese Gesten sowie Sie können sehen, dass sie sind Dimensionalität ist in drei Richtungen, eigentlich. Also nicht nur einschränken Sie sich ein 2D-Bildschirm Auch wenn Sie vielleicht werden auf einer 2D-Website. Sie können versuchen, und denken, wie ein Benutzer könnte mit der Website in 3D zu interagieren. TOMAS REIMERS: In einem 3D-Raum. Armaghan BEHLUM: Genau. Und ja. So erhalten Sie Richtungen, Geschwindigkeiten, alle diese kühlen Bits an Informationen. 

TOMAS REIMERS: Und wenn Sie nicht das kennen, es geht x, y, und z ist diese letzte Dimension. Nur etwas, das Sie wahrscheinlich mit, wenn Sie mit 3D beschäftigt haben vertraut Koordinatenebenen vor. Wenn Sie nicht haben, ist es das gleiche wie ein 2D- eine Ausnahme gibt es eine dritte Dimension. Wir nennen es z. Und alles, irgendwie mag Richtung, die ist, wohin es geht, Position-- Ich denke, es könnte sogar aussetzen Beschleunigung, ich bin nicht sicher. 

Armaghan BEHLUM: Ja, das glaube ich. Es hat definitiv Geschwindigkeit. Eigentlich bin ich nicht 100% sicher Beschleunigung. 

TOMAS REIMERS: Es kann eine Option sein Sie können auf etwas passieren. So Position und Geschwindigkeit ausgesetzt sind in dieser Art von drei Koordinaten. So x, y, z bzw. x delta, delta y, delta z. So, jetzt in der Dokumentation angeführt es ist developer.leapmotion.com und dann können Sie auf Dokumentation. Auch hier hat Leap Motion alles wunderbare APIs, eine für JavaScript eine für C Sharp und Einheit, eine für C ++, eine für Java, eine für Python, und eine für Objective C Ich persönlich würden Sie in Richtung JavaScript schieben oder wenn Du lernen wollen neue Sprache, versuchen Python. Diese beiden Sprachen, die ich gearbeitet habe vor und sie sind wirklich einfach zu erlernen und Sie wissen bereits, unter anderem Java macht es zu einem wirklich guten Anwärter. 

Ein Wort der Vorsicht wenn Sie die Dokumentation geben. Achten Sie darauf, auf Docs v2.0 sind. Denn wenn Sie an Version ein, wird es nicht funktionieren. Auch für die Beispiel-Galerie. Wir haben eine gute 30 Minuten versuchen die Debug unsere Leap bevor wir merkten, dass V1 nicht mit V2 arbeiten. Also nur sicherstellen, dass Sie nach Ausführung zwei sind. Und dann werde ich ihn lassen zeigen Sie Ihre die Dokumentation. Armaghan BEHLUM: Ja. Also hier ist die API-Übersicht und dann Einige Stücke der Information dass wir schon gesagt. Nice little floating Hände über einem Leap Motion. Und eine Erinnerung daran zu denken, über den Weltraum in 3D. Einer der ersten Gegenstände zu denken mit Leap Motion sind Hände, natürlich. Wir sahen die erkannt vom Visualizer. Und dann haben Sie vielleicht gesehen, dass es anerkannt Teil des Handgelenks und der Arm zugeordnet. TOMAS REIMERS: Wenn Sie möchten zu ziehen Sie den Visualizer. Armaghan BEHLUM: Ja, machen wir das noch mal. TOMAS REIMERS: Sie können sehen, immer nur eine gute Erinnerung an Art zu sehen, der Visualizer versucht zu zeigen, alle Daten, die Leap sieht. So werden Sie sehen, dass wir Diese Art von vier Punkten am Handgelenk und dann dem tatsächlichen Handgelenk. Und Sie haben auch diesen Ball auf der Handfläche. Alle diese Punkte sind erkennen durch den Sprung angesetzt. 

Armaghan BEHLUM: Genau. Und so mit dieser Hand Objekt jeder Rahmen eine Hand Array wie auch, wo Sie auch die linke und die rechte Hand. Sie können sich die Richtung die Zeiger mit Blick auf die normale Richtung der Handfläche, oder wie sie es nennen die Palme normal. Was haben wir? Wir auch, oops. Lassen Sie uns versuchen und scrollen Sie auf diese Weise. Die Arme sind die Finger durch den Finger dargestellt Klasse, die ein anzielbaren Objekt. So wie wir sagten, sahen wir, dass Reihe von pointables für jede Hand. Das sind die kleinen Finger zu denken. Das ist also eine gute Übersicht zu gehen durch, um zu versuchen und zu verstehen. TOMAS REIMERS: [unverständlich] Hand Anatomie oben. Armaghan BEHLUM: Ja, genau. Also ja. Es gibt eine Menge von Rohdaten, die das Leap Motion nimmt in interpretiert gut für Sie, so dass es ein großartiger Idee, hier durch zu gehen und versuchen, herauszufinden, wie Leap hat schon dachte, die Dinge, die für Sie und so weiter, welche Informationen Sie haben von dort. Und dann von dort würde ich empfehlen, gehen in diesem linken Bereich hier, die geht, auch wirklich nicht, das sind eigentlich nur mehr API Zeug about-- 

TOMAS REIMERS: Die API-Referenz bei der Boden ist in der Regel ein guter Ort, um zu gehen. Ihr habt wahrscheinlich sah dies als wir haben die Google Maps PSET. Aber der Hinweis wirklich nur geht durch alle der Funktionen und Parameter Im Objekt für Sie. 

Armaghan BEHLUM: Ja. Beispielsweise ist das, was Ich war auf der Suche vor. Wenn wir einen Hand wir kann gehen und herausfinden, wie Leap empfiehlt mit uns, um eine Hand zu finden. Wie ich bereits sagte, wir haben ein Hände-Array. Finden Sie heraus, wenn wir die Hände und dann versuchen Sie und sichern Sie sich eine einzige Hand mit auf diese Weise zu interagieren. Also das ist, was wir empfehlen für euch. Die Gesten und Dinge als gut. Diese API-Dokumentation zu gehen ist ein fantastisches Werkzeug für euch. Haben Sie andere Empfehlungen? 

TOMAS REIMERS: Ich weiß nicht. Ich denke, das ist gut für den Moment. 

Armaghan BEHLUM: Ja, Ich glaube, so gut. Fühlen Sie sich frei, uns zu mailen und zu erhalten in Kontakt zu Leap Motion wenn Sie mit vielleicht irgendwelche Probleme sind oder müssen alle Empfehlungen. Und wir können versuchen und Dinge mit euch auch. Danke. 

TOMAS REIMERS: Great.