{"id":247,"date":"2017-06-07T15:01:09","date_gmt":"2017-06-07T13:01:09","guid":{"rendered":"https:\/\/www.pingu-mobil.de\/iot\/?p=247"},"modified":"2021-05-14T10:07:52","modified_gmt":"2021-05-14T08:07:52","slug":"4-blockeintrag-magic-mirror","status":"publish","type":"post","link":"http:\/\/www.iot-embedded.de\/iot-2017\/smart-mirror\/4-blockeintrag-magic-mirror\/","title":{"rendered":"4. Blockeintrag Magic Mirror"},"content":{"rendered":"<p><span style=\"color: #000000;font-family: Calibri\">Nachdem unser Team die Oberfl\u00e4che des Smart-Mirrors erstellt hat, haben wir uns diese Woche damit befasst, wie wir dem Anwender die M\u00f6glichkeit geben, seine pers\u00f6nlichen Daten (Name, Heimatadresse, Arbeitsadresse,\u2026) einzugeben. Schnell fand sich die L\u00f6sung in einer HTML-Weboberfl\u00e4che. <\/span><\/p>\n<p><a href=\"http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Eingabemaske.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-248 size-large\" src=\"https:\/\/www.pingu-mobil.de\/iot\/wp-content\/uploads\/2017\/06\/Eingabemaske-1024x528.jpg\" alt=\"\" width=\"750\" height=\"387\" srcset=\"http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Eingabemaske-1024x528.jpg 1024w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Eingabemaske-300x155.jpg 300w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Eingabemaske-768x396.jpg 768w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Eingabemaske-1536x792.jpg 1536w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Eingabemaske-1568x809.jpg 1568w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Eingabemaske.jpg 1920w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/a><\/p>\n<p><span style=\"color: #000000;font-family: Calibri\">Schnell programmiert ging es im n\u00e4chsten Schritt darum, die Daten aus der Eingabe-Weboberfl\u00e4che f\u00fcr den Smart Mirror nutzbar zu machen. Da uns\u00a0 JS leider keine M\u00f6glichkeit zur Verf\u00fcgung stellt eine Datei zu beschreiben, nutzen wir PHP, um die eingegebenen Daten in einer .txt-Datei zu speichern. Dabei wird direkt in der Eingabe gepr\u00fcft, ob alle Felder ausgef\u00fcllt sind. Fehlen Daten, wird der Anwender freundlich auf diesen Fauxpas hingewiesen.<\/span><\/p>\n<p><span style=\"color: #000000;font-family: Calibri\"><a href=\"http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Einlesen.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-249 size-large\" src=\"https:\/\/www.pingu-mobil.de\/iot\/wp-content\/uploads\/2017\/06\/Einlesen-1024x551.jpg\" alt=\"\" width=\"750\" height=\"404\" srcset=\"http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Einlesen-1024x551.jpg 1024w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Einlesen-300x161.jpg 300w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Einlesen-768x413.jpg 768w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Einlesen-1536x826.jpg 1536w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Einlesen-1568x844.jpg 1568w, http:\/\/www.iot-embedded.de\/iot-2017\/wp-content\/uploads\/sites\/2\/2017\/06\/Einlesen.jpg 1920w\" sizes=\"(max-width: 750px) 100vw, 750px\" \/><\/a><\/span><\/p>\n<p><span style=\"color: #000000;font-family: Calibri\">Beim Starten der Smart-Mirror-Oberfl\u00e4che werden wiederum mit Hilfe von PHP die gespeicherten Daten ausgelesen. Die ausgelesenen Daten dienen als Parameter f\u00fcr Javascript, um so den Inhalt f\u00fcr den Smart Mirror dynamisch darstellen zu k\u00f6nnen.<\/span><\/p>\n<p><span style=\"color: #000000;font-family: Calibri\">Um diese Funktionsweise zu erm\u00f6glichen ben\u00f6tigen wir einen Webserver der unsere Dateien dem Raspberry Pi und dem Nutzer zur Verf\u00fcgung stellt. In einem ersten Versuch mit XAMPP funktionierte alles reibungslos. <\/span><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nachdem unser Team die Oberfl\u00e4che des Smart-Mirrors erstellt hat, haben wir uns diese Woche damit befasst, wie wir dem Anwender die M\u00f6glichkeit geben, seine pers\u00f6nlichen Daten (Name, Heimatadresse, Arbeitsadresse,\u2026) einzugeben. Schnell fand sich die L\u00f6sung in einer HTML-Weboberfl\u00e4che. Schnell programmiert<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[4],"tags":[],"_links":{"self":[{"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/posts\/247"}],"collection":[{"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/comments?post=247"}],"version-history":[{"count":1,"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/posts\/247\/revisions"}],"predecessor-version":[{"id":581,"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/posts\/247\/revisions\/581"}],"wp:attachment":[{"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/media?parent=247"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/categories?post=247"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.iot-embedded.de\/iot-2017\/wp-json\/wp\/v2\/tags?post=247"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}