seite 1/2 jufotech - wko.at · 2018-05-08 · teilaufgabe 3 – erste schritte html ... diese web...

Datenblatt (dient als Titelblatt für die Projektarbeit)

Desiree Stofner und Marlene Hopfgartner | T 05 90 90 5 – DW 1231 und DW 1264 | M [email protected] u. [email protected]

Wir nehmen am Wettbewerb „Jugend forscht in der Technik – Auf den Spuren des kleinen Albert“ teil!

Titel der Projektarbeit:

Fachgebiet:

Projektbetreuer: Schulklasse:

Name: Schule:

Straße:

PLZ/Ort: Schulstufe:

E-Mail: PLZ/Ort:

Telefon:

Kleingruppe: Weitere Gruppenmitglieder:

Projektleiter (Vor-/Nachname) (Vor-/Nachname)

Straße (Vor-/Nachname)

PLZ/Ort (Vor-/Nachname)

E-Mail (Vor-/Nachname)

Telefon (Vor-/Nachname)

Schule, Schulstufe (Vor-/Nachname)

JUFOTech Jugend forscht in der Technik WKO.at/tirol/jufotech

DATENBLATT

Seite 1/2

Datenblatt (dient als Titelblatt für die Projektarbeit)

Desiree Stofner und Marlene Hopfgartner | T 05 90 90 5 – DW 1231 und DW 1264 | M [email protected] u. [email protected]

Kurzfassung unserer Arbeit:

WKO.at/tirol/jufotech

Eine Aktion der Kooperationspartner:Wirtschaftskammer Tirol, Förderverein Technik Tirol

Seite 2/2

PROJEKT FIRLEFRANZ VON JAN ANDRE & YANNIC TESCHKE SEITE 1

PROJEKT FIRLEFRANZ

INHALT

Vorstellung des Projektes – „Firlefranz“ ....................................................................................................................................... 1

Aller Anfang ist schwer. .................................................................................................................................................................. 2

Erste Schritte – LED ................................................................................................................................................................................ 2

Teilaufgabe 1 – Arduino und Programmiersprache C grundlegend kennenlernen ............................................. 2

Teilaufgabe 2 – LED über das Web steuern ........................................................................................................................... 4

Teilaufgabe 3 – Erste Schritte HTML ......................................................................................................................................... 6

Roboter bauen ........................................................................................................................................................................................... 6

Teilaufgabe 4 - Motorensteuern mit dem Arduino ............................................................................................................. 6

Teilaufgabe 5 – Chassis für Prototyp ......................................................................................................................................... 7

Teilaufgabe 6 – Web-Seite zur Steuerung des Roboters ................................................................................................... 8

Teilaufgabe 7 - Ultraschall Sensor zur Erkennung von Hindernissen ........................................................................ 8

Teilaufgabe 8 - Kamera vom Handy als Webcam .............................................................................................................. 10

Teilaufgabe 9 - Chassis verbessern .......................................................................................................................................... 10

Schlusswort .............................................................................................................................................................................................. 10

Anhang 1: C-Programm zur Steuerung der LED über Web ................................................................................................. 11

Anhang 2: Webseite LED .................................................................................................................................................................... 12

Anhang 3: C-Programm Firlefranz ................................................................................................................................................. 13

Anhang 4: Webseite Firlefranz ........................................................................................................................................................ 17

Anhang 6: Abbildungsverzeichnis .................................................................................................................................................. 19

VORSTELLUNG DES PROJEKTES – „FIRLEFRANZ“

Heute hört man ständig den Begriff „Internet

der Dinge“ oder „Internet of Things“ (IoT).

Dies bedeutet ein System von miteinander

verbundenen Geräten. Diese Geräte sind

mit der Fähigkeit ausgestattet Daten über

sich selbst und ihre Umwelt innerhalb eines

Netzwerks auszutauschen.

Da uns das Thema sehr interessiert und wir

wissen wollten wie das genau funktioniert

haben wir uns überlegt ein Roboter zu bauen

der sich über WiFi mit einer Webseite

steuern lässt. Darüber hinaus soll er in der

Lage sein Hindernis, die vor im Liegen, zu

erkennen. Damit das manuelle Steuern aus

der Entfernung möglich ist, soll er auch ein Kamerasystem besitzen das die Bilder von „Firlefranzs“

Umgebung liefert.

ABBILDUNG 1 FIRLEFRANZ


ALLER ANFANG IST SCHWER.

Wir nutzen zwar das Internet und Elektronik jeden Tag in unserem Leben dennoch betraten wir Neuland

den wir hatten keine Ahnung wie diese technischen Errungenschaften tatsächlich funktionieren. Also wie

Herangehen an unsere Aufgabe.

Als erstes galt es eine Plattform zu finden die es uns erlaubte kostengünstig, flexible und einfach zu

experimentieren. Unsere Wahl fiel auf die Arduino–Uno Platine als Basis für unseren Roboter. Arduino ist

eine aus Hard- und Software bestehende Mikrocontroller-Umgebung. Diese wurde zur Ausbildung von

Elektrotechnikern und Informatikern entwickelt.

ABBILDUNG 2 ARDUINO BOARD

Über die Pins des Boards (siehe Abbildung) können weitere Platinen und Sensoren angesteckt werden.

Programmiert wird der Arduino, um die Bauteile zu verbinden, in der Programmiersprache C. Eine

einfache Entwicklungsumgebung für den Arduino ist von der Arduino Homepage (

https://www.arduino.cc/en/main/software ) herunter zu laden.

Nach dem nun die Software installiert war mussten wir uns nun überlegen wie wir an die Sache

herangehen wollen. Uns erschien es am besten die Aufgabe in kleine Teile zu zerlegen so dass wir uns

Schritt für Schritt, Thema für Thema lernen konnten.

ERSTE SCHRITTE – LED

TEILAUFGABE 1 – ARDUINO UND PROGRAMMIERSPRACHE C GRUNDLEGEND

KENNENLERNEN

Um zu lernen wie die Entwicklungsumgebung funktioniert haben wir im Internet nach Lernvideos und

Anleitungen via YouTube gesucht. Hierbei haben wir gesehen wie wichtig Englisch ist da sehr viele

https://www.arduino.cc/en/main/software


Anleitungen in Englisch sind. Aber zum Glück haben wir zum Einstieg eine Anleitung für die ersten

Schritte in Deutsch gefunden1.

Wir haben also unsere erstes kleines kennenlernen Projekt begonnen eine LED ein und aus zu schalten

ABBILDUNG 3 ARDUINO MIT BREADBOARD UND ERSTE LED-SCHALTUNG HIER MIT 2 LEDS

Hierbei haben wir nicht nun gelernt wie man ein Breadboard zum Erstellen der Schaltungen verwendet

(siehe Abbildung oben), sondern auch die Programmstruktur des Arduinos mit void setup() { } und void

loop() { }

Die setup()-Methode wird nur beim Programmstart einmal ausgeführt hier deklariert man z.B. seine

Variablen, zu den wir gleich noch kommen. Die loop()-Methode wird endlos wiederholt. In dieser Methode

wird der Programmablauf geschrieben also was wann passieren soll.

Möchte man beim Programmieren Werte speichern geschieht das über sogenannte Variablen. Hierfür

muss vorher festegellegt werden ob diese z.B. einen Text als Wert, eine ganze Zahl oder eine Zahl mit

Nachkommastellen beinhalten soll. Man spricht hier vom Deklarieren der Variable.

Variablentyp

Bedeutung Beschreibung

int ganze Zahlen -32 768 bis 32 767

long ganze Zahlen -2 147 483 648 bis 2 147 483 647

float Fließkommazahl Zahl mit Nachkommastellen

char Character Alphanumerische Zeichen (Buchstaben, Zahlen,

Sonderzeichen)

ABBILDUNG 4 DIE WICHTIGSTEN VARIABLENTYPEN IN DER ÜBERSICHT

1 Quellen: http://starthardware.org/arduino-programmieren/

https://www.youtube.com/watch?v=oAsYwqZWsoY

https://www.youtube.com/watch?v=dnPPoetX0uw

http://starthardware.org/arduino-programmieren/

https://www.youtube.com/watch?v=oAsYwqZWsoY

https://www.youtube.com/watch?v=dnPPoetX0uw


Zum Beispiel wird mit „int ledPin=5;“ die Variable mit Namen ledPin als Ganzzahlige Variable im

Wertebereich von -32 768 bis 32 767 festgelegt und gleichzeitig der Wert 5 zugewiesen. Diese wäre auch

in zwei Schritten möglich mit „int ledPin;“ und als zweite Anweisung dann „ledPin=5;“.

Neben den Befehlen zur Steuerung der Pins am Arduino pinMode, digitalRead und DigitalWrite haben wir

die IF Abfrage zum steuern des Programmablaufs kennengelernt. Diese fragt immer eine Bedingung ab,

welche innerhalb der Rundenklammern formuliert wird. Ist diese Bedingung erfüllt wird der

Programmteil innerhalb der geschweiften Klammern, der unmittelbar im Anschluss der Bedingung steht,

ausgeführt. Desweitern ist es möglich über den Zusatz ELSE immer einen anderen Programmteil,

ebenfalls geschweiften Klammern, auszuführen wenn die Bedingung nicht erfüllt ist.

Zum Beispiel wird mit if (digitalRead(buttonPin)==HIGH) überprüft ob am „Einschaltknopf“ 5V+

anliegen also ob der Zustand des Tasters eingeschalten ist. Ist das der Fall und somit die Bedingung erfüllt

wird über den Befehl digitalWrite(ledPin, HIGH); die ledPIN auf 5V+ gesetzt und somit die LED

eingeschaltet.

Ist die Bedingung nicht erfüllt kommt die der Programmteil des Else-Zweigs zum Zug welcher mit der

Befehlszeile digitalWrite(ledPin, LOW); die LED ausschaltet.

ABBILDUNG 5 BEISPIEL PROGRAMM LED

TEILAUFGABE 2 – LED ÜBER DAS WEB STEUERN

Im nächsten Schritt wollen wir nun die LED nicht mehr über einen Taster, sondern über eine Web-Seite

steuern. Unser Roboter soll ja auch über das Web gesteuert werden. Hierzu müssen wir zunächst unser

Arduino Uno ermöglichen sich mit dem „Web“ zu verbinden. Hierzu ist die einfachste und günstigste

Lösung der ESP8266-01 ein WiFi-Modul das für weniger als 4 € erhältlich ist2.

2 Quelle: https://www.heise.de/developer/artikel/Arduino-goes-ESP8266-3240085.html

//Variablen deklarieren

int ledPin=5;

int buttonPin=8;

void setup() {

pinMode(buttonPin, INPUT);

pinMode(ledPin, OUTPUT);

}

void loop() {

if (digitalRead(buttonPin)==HIGH){

digitalWrite(ledPin, HIGH);

}

else {

digitalWrite(ledPin, LOW);

}

}


Die erste Hürde ist hierbei den ESP8266-01 mit dem Arduino zu verbinden den der ESP funktioniert mit

3.3V und der Arduino Uno mit 5V. Es gibt hier verschiedene Methoden um von 5V auf 3V zukommen z.B.

mit Wiederständen einen Spannungsteiler (Eng.: voltage devider) bauen. Wir haben uns für uns zunächst

für einen bidirektionalen sPegelwandler (Bidirectional Level Shifter) entschieden. Dieses Bauteil passt

sich nicht nur die Spannungsversorgung an, sondern auch die Signalpegel auf den Datenleitungen über

den die zwei Bauteile kommunizieren. Die unterschiedliche Spannung auf den Datenleitungen wird

übrigens auf vielen Webseiten über dieses Thema vernachlässigt.

Abbildung 6 Verbindung des Arduino zum ESP8266-013

Später haben wir einen Adapter zum Anschluss des ESP8266-01 verwendet. Diesen hatten wir zufällig bei

einem Händler in China gefunden bei den wir uns Reserve ESPs bestellen wollten. Dieser Adapter war

günstiger als die einzelnen Bauteile bei uns gar nicht zu sprechen von den ESP-Modulen.

Die beiden Module kommunizieren über die Serielle Schnittstelle die über den „RX“ (Empfänger) und den

„TX“ (Sender) Pins angesteuert wird. Über diese Schnittstelle werden dann die AT-Befehle geschickt die

dem ESP-8266 steuern.

Im Tutorial „ESP8266 Arduino LED Control“ auf der Seite http://allaboutee.com/2015/01/02/esp8266-

arduino-led-control-from-webpage/ haben wir gelernt wie man wie die Kommunikation zwischen den

3 Quelle: https://www.hackster.io/circuito-io-team/simple-arduino-uno-esp-8266-integration-dba10b

http://allaboutee.com/2015/01/02/esp8266-arduino-led-control-from-webpage/

http://allaboutee.com/2015/01/02/esp8266-arduino-led-control-from-webpage/


Modulen über die AT-Befehle via der Programmiersprache C funktioniert. Darüber hinaus haben wir

gelernt wie eine Funktion funktioniert und wie man eine Software Bibliothek einbindet.

Wir haben unser LED Programm um unsere Erkenntnisse aus dem Tutorial4 erweitert und so gestaltet das

es als Basis für die Steuerung unseres Roboters dienen kann. Deshalb haben wir die Parameter unserer

URL befehl=cmd_01 bzw. befehl=cmd_02 abstrakt gehalten. Cmd steht dabei für „command“. Des

Weiteren vereinfacht uns die immer gleiche Länge des Befehls von 6 Zeichen das Programmieren

gegenüber einem sprechender Befehl mit immer unterschiedlicher Länge.

Der Aufruf der URL http:// „IP-adresses unseres Arduinos“/?befehl=cmd_01 schaltet unsere LED ein und

http:// „IP-adresses unseres Arduinos“/?befehl=cmd_02 wieder aus.

Den vollständigen Code haben wir im Anhang „Programm zur Steuerung der LED über Web“

TEILAUFGABE 3 – ERSTE SCHRITTE HTML

Als erstes haben wir angesehen wie eine HTML Seite aufgebaut ist. Hier diente uns vor allem das Wiki von

selfhtml.org5. Wir haben gelernt das eine HTML-Seite aus sogenannten Tags besteht. Diese HTML Tags

stehen in spitzen Klammern <> und definieren die Struktur der Inhalte einer Webseite. Die Inhalte stehen

zwischen den Tags, ein Tag muss immer geschlossen werden. Das Schluss Tag beginnt mit einem

Schrägstrich. Hier ein Beispiel: <title>WEB LED</title>

Diese Tags können mit Attribute erweitert werden. Diese Attribute können das Aufsehen verändern oder

aber helfen um via der Programmiersprache Javascript auf die Inhalte zugreifen zu können. Aufgepasst

HTML ist keine Programmiersprache. Um Abläufe im HTML zu steuern kommen Script Sprachen zum

Einsatz.

Diese Web Seite6 weißt allerdings noch das Problem auf das jedes Mal die Webseite verlassen wird da

über das <href>-Tag eigentlich eine andere Webseite aufgerufen wird. Um diese Herausforderung

kümmern wir uns in der nächsten Version der Webseite. Jetzt geht’s zum Roboter.

ROBOTER BAUEN

TEILAUFGABE 4 - MOTORENSTEUERN MIT DEM

ARDUINO

Im nächsten Schritt müssen wir im Grunde die LED durch einen

Motor ersetzen und steuern. Dazu brauchen wir neben den Motoren

auch noch eine Motorsteuerung.

4 Weitere Quelle und Tutorial zum Thema: http://fkainka.de/wlan-modul-verbindung-aufbauen/ und

https://www.espressif.com/sites/default/files/documentation/4a-esp8266_at_instruction_set_en.pdf 5 Quelle: https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5-Grundgerüst 6 Siehe Anhang 2

http://fkainka.de/wlan-modul-verbindung-aufbauen/

https://www.espressif.com/sites/default/files/documentation/4a-esp8266_at_instruction_set_en.pdf

https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5-Grundgerüst


Wir haben uns für die Motorsteuerung von Adafruit in

der Version V1 entschieden da diese erheblich

günstiger ist als die Version V2 und einiges an

Flexibilität zur Steuerung von Servos und Motoren

bietet.

Das Adafruit Motorschield wird einfach auf den Arduino

uno aufgesteckt. An das Motorshield können dann

mehrere Motoren und Servos angeschlossen werden.

Ein Motor stand nicht zur Wahl da wir noch 5 Stück vom

„28BJY-48“, ein einfacher Stepper Motor, zu Hause

hatten.

Als erstes galt es nun das Motor Shield mit dem Arduino zu verbinden, was sich als sehr einfach

herausstellte da dieser einfach aufgesteckt wird. Etwas schwieriger war es herauszufinden wie man unser

Motormodell mit der Steuerplatine verbindet. Hier wurden wir auf instructables.com fündig7.

Im Anschluss galt es nun die Bibliothek für das Programmieren laut Anleitung zu installieren. Hier half die

Homepage des Herstellers8.

Danach mussten wir im Grunde nur das ein und ausschalten der LED durch Vorwärts und Rückwärts

ersetzen und um Links und Rechts erweitern. Für das C-Coding half uns wieder die Seite des Herstellers9.

TEILAUFGABE 5 – CHASSIS FÜR PROTOTYP

Für das erste Chassis des Prototyps half uns der Zufal l. Mein Vater

machte sich gerade ein Käsebrot da fiel uns die Verpackung auf, eine

Holzschachtel, die wie gemacht schien für unser Arduino-Board.

Räder die sich auf den Motor befestigen lassen waren schwierig zu

finden. Wir haben uns dann mit abgefahrenen Rädern von

Modellautos und einen Adapter für die Antriebsräder beholfen. Als

Vorderrad dient uns eine Lenkrolle für Möbel aus dem Baumarkt.

7 Quelle: http://www.instructables.com/id/28BYJ-48-Stepper-Motor-Arduino-L293D-Motor-Shield-/ 8 Quelle: https://learn.adafruit.com/adafruit-motor-shield/library-install 9 Quelle: https://learn.adafruit.com/adafruit-motor-shield/using-stepper-motors

ABBILDUNG 7 MOTO 28BJY-48 MIT ADAFRUIT L293D

MOTOR SHIELD VERBINDEN

ABBILDUNG 8 PROTOTYP CHASSIS

http://www.instructables.com/id/28BYJ-48-Stepper-Motor-Arduino-L293D-Motor-Shield-/

https://learn.adafruit.com/adafruit-motor-shield/library-install

https://learn.adafruit.com/adafruit-motor-shield/using-stepper-motors


TEILAUFGABE 6 – WEB-SEITE ZUR STEUERUNG DES ROBOTERS

Wir hätten eigentlich nur die bestehende Webseite für die LEDs

um die <href>-Links um Rechts, Links, Vor und zurück

erweitert müssen. Allerdings hatten wir dann immer noch das

bereits erwähnte Problem das <href> unsere Webseite zur

Steuerung verlassen würde.

Die einfachste Lösung erschien uns hier ein Javascript in unsere

Webseite einzubauen. Javascript ist eine Programmiersprache

für den Webbrowser. Um nicht alles Programmieren zu müssen

nutzen wir wieder eine Programmier-Bibliothek diesmal für

Javascript. Aus der J-Query Bibliothek benötigen wir im

Wesentlichen den Get request10.

Die Datenübertragung zwischen Browser und Server funktioniert folgendermaßen.

1. Daten werden vom Browser an einen Server geschickt.

2. Der Server, unser Arduino mit dem ESP8266 wertet die Daten aus.

3. Das Ergebnis wird vom Arduino an den Browser zurückgeschickt.

Mit dem J-Query Script werden die Daten sogar im Hintergrund geschickt und empfangen. Die

empfangenen Daten können dann in der Bestehenden Webseite angezeigt werden. Dieses Prinzip wird

AJAX11 genannt.

Wir haben bemerkt das wenn wir keine Antwort vom Arduino (Server) bekommen das sich unser Button

nur einmal anklicken lässt, da der Browser auf die Antwort vom Server wartet. Bei der Lösung, also wie

der Arduino die Antwort schickt müssen wir unserem Projektleiter für seine Hilfe Danken, da er uns

erklärt hat wie so eine Antwort funktioniert und aussieht. Wir schicken als Antwort welcher „Befehl“

verarbeitet wurde, also z.B. cmd_01

TEILAUFGABE 7 - ULTRASCHALL SENSOR ZUR ERKENNUNG VON HINDERNISSEN

Der Anschluss des Ultraschallsensors an den Arduino folgt im Grunde erfolgt im Grunde nach demselben

Prinzip wie unser erste LED-Schaltung zum einen die Stromversorgung und zum anderen einem Output-

und einem Intput-Pin.

10 Quelle: http://blog.simplease.at/2011/08/ajax-leicht-gemacht/ und

https://www.w3schools.com/jquery/ajax_get.asp

11 AJAX steht für Asynchronous JavaScript And XML

ABBILDUNG 9 WEBSEITE ZUR STEUERUNG

VON FIRLEFRANZ

http://blog.simplease.at/2011/08/ajax-leicht-gemacht/

https://www.w3schools.com/jquery/ajax_get.asp


ABBILDUNG 10 ANSCHLUSS DES ULTRASCHALL-SENSORS12

Wie funktioniert der Ultraschallsensor hier ein Beispiel. Wenn das Objekt beispielsweise 10 cm vom

Sensor entfernt ist und die Schallgeschwindigkeit 340 m / s beträgt, muss die Schallwelle etwa 294 μ

Sekunden zurücklegen. Aber das Ergebnis das man vom Echo-Pin bekommst, ist die doppelte Zeit, weil die

Schallwelle den doppelten Weg, hin und wieder zurück, reisen muss. Um also den Abstand in cm zu

erhalten, müssen wir den empfangenen Wegzeitwert vom Echo-Pin mit 0,034 multiplizieren und durch 2

teilen.

Dieses Beispiel haben wir in die Funktion „getDistance“ zur Berechnung der Distanz in unseren C-Code

gepackt13.

12 Quelle: https://howtomechatronics.com/tutorials/arduino/ultrasonic-sensor-hc-sr04/

13 Siehe Anhang C


TEILAUFGABE 8 - KAMERA VOM HANDY ALS WEBCAM

Diese Idee haben wir bei vergleichbaren

Projekten 14 gesehen. Diese Projekte hatten

zwar bei weitem nicht so funktionsumfang wie

unsere Roboter wie z.B. den Autopiloten oder

eine Antwort bei Kommunikation von Arduino

mit der Webseite.

Uns hat es aber sehr gut gefallen da es sehr

schön zeigt wie in einer Webseite unabhängige

Systeme eingebunden werden können.

Außerdem steigert es den Spaßfaktor an

unserem Projekt.

Wir mussten also nur ein altes Smartphone finden und eine App darauf installieren welche das Handy zu

einer Webcam umfunktionierte und unsere Webseite so anpassen das der vom Handy erzeugte

Videostream angezeigt wird. An unserem Arduino musste nicht angepasst werden da das Video

unabhängig funktioniert. Wir haben also somit 2 unabhängige Systeme auf unserer Webseite verbunden.

TEILAUFGABE 9 - CHASSIS VERBESSERN

Da wir die Kamera nicht mehr auf unserer „Käseschachtel

unterbrachten“ mussten wir ein neueres auch cooleres Chassis für

unseren Roboter bauen. Welches Material sollten wir nehmen, Holz

wäre leicht zu bearbeiten, aber irgendwie zu klobig. Daher entschieden

wir uns für ein dünnes Blech das man leicht schneiden und biegen

konnte. Die ersten Entwürfe hatten wir auf Karton gezeichnet und

gefaltet um zu sehen ob unsere Ideen funktionieren. Danach ging es

dann ans Blech das wir mit einer Blechschere und Feile bearbeiteten

haben und im Anschluss in Form gebogen.

SCHLUSSWORT Wir hoffen Ihnen gefällt unser kleiner Robotor. Uns hat dieses Projekt auf jeden Fall viel Spaß gemacht.

Am meisten hat uns jedes Mal gefallen, nach der Bastel und Knobelei an einer Teilaufgabe, zu sehen das es

funktioniert.

14 Quelle: https://create.arduino.cc/projecthub/igorF2/widc-wi-fi-controlled-fpv-robot-

8f1e09?ref=tag&ref_id=robot&offset=14

ABBILDUNG 11 WEBSEITE ZUR STEUERUNG VON FIRLEFRANZ

MIT VIDEO

ABBILDUNG 12 FIRLEFRANZ CHASIS

https://create.arduino.cc/projecthub/igorF2/widc-wi-fi-controlled-fpv-robot-8f1e09?ref=tag&ref_id=robot&offset=14

https://create.arduino.cc/projecthub/igorF2/widc-wi-fi-controlled-fpv-robot-8f1e09?ref=tag&ref_id=robot&offset=14


ANHANG 1: C-PROGRAMM ZUR STEUERUNG DER LED ÜBER WEB #include <SoftwareSerial.h>


int ledPin=5;

String var_befehl;

#define DEBUG true

SoftwareSerial esp8266(2,3); // make RX pin 2, TX pin 3.

void setup()

{

Serial.begin(9600);

esp8266.begin(9600);

pinMode(ledPin, OUTPUT);;

digitalWrite(ledPin,LOW);

// WiFi Verbindung

sendData("AT+RST\r\n", 2000, DEBUG);

sendData("AT+CWMODE=1\r\n", 1000, DEBUG);

sendData("AT+CWJAP=\"FIRLEFRANZ-NET\",\"firlefranz\"\r\n", 6000, DEBUG);

sendData("AT+CIFSR\r\n", 1000, true);

sendData("AT+CIPMUX=1\r\n", 2000, DEBUG);

sendData("AT+CIPSERVER=1,80\r\n", 1000, DEBUG);

}

void loop() {

if(esp8266.available()) {

if(esp8266.find("+IPD,")) {

delay(1000);

int connectionId = esp8266.read()-48;

//ausschneiden des empfangenen Befehls

esp8266.find ("?");

String request_parameter = esp8266.readStringUntil(' ');

var_befehl = request_parameter.substring (

request_parameter.indexOf("befehl=") + 7,

request_parameter.indexOf("befehl=") + 13

);

Serial.println (var_befehl);

// Verbindung schließen

String closeCommand = "AT+CIPCLOSE=";

closeCommand+=connectionId; // append connection id

closeCommand+="\r\n";

sendData(closeCommand,1000,DEBUG); // close connection

// Befehl auswerten

if (var_befehl == "cmd_01") {

digitalWrite(ledPin, HIGH);

}

else {

digitalWrite(ledPin, LOW);

}

}

}


}

//*****************************************************************************

// Funktion sendData: Befehl an ESP8266 (Wifi Modul) senden und Antwort lesen

//*****************************************************************************

String sendData(String command, const int timeout, boolean debug){

//Variable

String antwortESP8266 = "";

//Befehl an das ESP8266 schicken

esp8266.print(command);

// Zeit in Millisekunden die das Programm auf den Arduino läuft

long int time = millis();

// Zeitbegrenzung (timeout) für das lesen der Antwort des ESP8266

while ( (time + timeout) > millis()) {

// lesen der Antwort des ESP8266

while (esp8266.available()) {

char c = esp8266.read();

antwortESP8266 = antwortESP8266 +c;

}

}

// false Debug-Modus aktiviert (debug = true) Antwort ausgeben

if (debug) {

Serial.print(antwortESP8266);

}

//Rückgabe Wert der Funktion

return antwortESP8266;

}

ANHANG 2: WEBSEITE LED

<!DOCTYPE html>

<html lang="de">

<head>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>WEB LED</title>

</head>

<body>

<h1>LED ein- und ausshalten</h1>

<a href="http://192.168.173.32/?befehl=cmd_01">LED EIN</a>

</br>

<a href="http://192.168.173.32/?befehl=cmd_02">LED AUS</a>

<body>

</html>


ANHANG 3: C-PROGRAMM FIRLEFRANZ //Version mit Ultraschallsensor

//Autopilot und LED

#include <SoftwareSerial.h>

#include <AFMotor.h>


String var_befehl;

int connectionId;

int distance;

char search_ipd[] = "+IPD,";

char search_qmark[] = "?";

char search_ok[] = "OK";

const int trigPin = A1;

const int echoPin = A0;

const int ledPin = A4;

AF_Stepper rechterStepperMotor(48, 1);

AF_Stepper linkerStepperMotor(48, 2);

SoftwareSerial esp8266(A2, A3); //RX-Pin, TX-Pin

#define DEBUG true //Anzeigen der Komunikation zwischen ESP8266 and Arduino am Serial Monitor

void setup() {

// LED

// pinMode(LED, OUTPUT); // Digital Pin A4 Output

//Ultraschallsensor

pinMode(trigPin, OUTPUT); // Set trigPin als Output

pinMode(echoPin, INPUT); // Set echoPin als Input

//Ultraschallsensor

pinMode(ledPin, OUTPUT); // Set ledPin als Output

//Motor

rechterStepperMotor.setSpeed(900); // Set motor 2 speed

linkerStepperMotor.setSpeed(900); // Set motor 2 speed

// Kommunikation

Serial.begin(9600); // set Arduino Serial auf 9600 bps

esp8266.begin(9600); // set ESP8266 Serial auf 9600 bps

// Wifi

sendData("AT+RST\r\n", 2000, DEBUG); //reset module

sendData("AT+CWMODE=1\r\n", 1000, DEBUG); //set station mode

sendData("AT+CWJAP=\"FIRLEFRANZ-NET\",\"firlefranz\"\r\n", 5000, DEBUG); //connect wi-fi network

// while(!esp8266.find(search_ok)) { //wait for connection

sendData("AT+CIFSR\r\n", 1000, true); //show IP address

sendData("AT+CIPMUX=1\r\n", 2000, DEBUG); //allow multiple connections

sendData("AT+CIPSERVER=1,80\r\n", 1000, DEBUG); //start web server on port 80

// }

digitalWrite(ledPin, HIGH); // LED ein wenn Wifi fertig

}

void loop() {

if (esp8266.available()) //verify incoming data

{


if (esp8266.find(search_ipd)) //if there is a request

{

//nr der verbindung auslesen zur Vereinfachung gehen wir nur von einer Verbindung aus

connectionId = 0;

//ausschneiden des empfangenen Befehls

esp8266.find (search_qmark);

String request_parameter = esp8266.readStringUntil(' ');

var_befehl = request_parameter.substring

(

request_parameter.indexOf("befehl=") + 7,

request_parameter.indexOf("befehl=") + 13

);

Serial.println (var_befehl);

sendHtmlResponse(" Befehl " + var_befehl + " empfangen.");

}

}

//Vorwärts

if (var_befehl == "cmd_01") {

linkerStepperMotor.step(1, BACKWARD, DOUBLE);

rechterStepperMotor.step(1, FORWARD, DOUBLE);

}

//Rückwärts

else if (var_befehl == "cmd_02") {

linkerStepperMotor.step(1, FORWARD, DOUBLE);

rechterStepperMotor.step(1, BACKWARD, DOUBLE);

}

//Stop


linkerStepperMotor.release();

rechterStepperMotor.release();

}

//Links




}

//Rechts




}

//Autopilot

else if (var_befehl == "cmd_06"){

setAutopilot(); // ruft die Funktion Autopilot auf

}


digitalWrite(ledPin, HIGH); // LED an

}


digitalWrite(ledPin, LOW); // LED aus

}

else

{

//Stop



}

}


//*********************************************************

// Funktion sendHtmlResponse: sendet HTML Antwort (Response)

// für den Get-Request der unseren Befehl im Parameter mit gibt

//*********************************************************

void sendHtmlResponse(String antwortText){

// Response auf Web-Request

String html_content;

html_content = "<b>" + antwortText + "</b>";

String httpHeader;

httpHeader = "HTTP/1.1 200 OK\r\n";

httpHeader += "Content-Type: text/html; charset=UTF-8\r\n";

httpHeader += "Content-Length: ";

httpHeader += html_content.length();

httpHeader += "\r\n";

httpHeader += "Access-Control-Allow-Origin: *";

httpHeader += "\r\n";

httpHeader +="Connection: close\r\n\r\n";

String httpResponse;

httpResponse = httpHeader + html_content;

String cipStart = "AT+CIPSTART=";

cipStart += connectionId;

cipStart += ",\"TCP\"\r\n";

String cipSend = "AT+CIPSEND=";

cipSend += connectionId;

cipSend += ",";

cipSend += httpResponse.length();

cipSend +="\r\n";

String cipClose = "AT+CIPCLOSE=";

cipClose += connectionId;

cipClose += "\r\n";

// Response Daten senden

sendData(cipStart,100,DEBUG); //Verbindung öffnen

sendData(cipSend,100,DEBUG);

sendData(httpResponse,100,DEBUG);

sendData(cipClose,100,DEBUG); //Verbindung schließen

}

//*********************************************************

// Funktion getDistance: berechnet die Entfernung zum

// nächsten Objekt über den Ultraschallsensor

//*********************************************************

int calcDistanceUltrasonicSensor(){

long duration;

int calcDistance;

// Wert des trigPin löschen, bzw. ausschalten

digitalWrite(trigPin, LOW);

delayMicroseconds(2);

// einschalten des trigPin für 10 Mikrosekunden

digitalWrite(trigPin, HIGH);

delayMicroseconds(10);

digitalWrite(trigPin, LOW);

//lesen des echoPin, gibt die Reisezeit der Schallwelle in Mikrosekunden zurück


duration = pulseIn(echoPin, HIGH);

// Berechnen der Distanz

calcDistance= duration*0.034/2;

// Rückgabewert der Funktion ist die berechnete Distanz

return calcDistance;

}

//*****************************************************************************

// Funktion sendData: Befehl an ESP8266 (Wifi Modul) senden und Antwort lesen

//*****************************************************************************

String sendData(String command, const int timeout, boolean debug){

//Variable

String antwortESP8266 = "";

//Befehl an das ESP8266 schicken

esp8266.print(command);

// Zeit in Millisekunden die das Programm auf den Arduino läuft

long int time = millis();

// Zeitbegrenzung (timeout) für das lesen der Antwort des ESP8266

while ( (time + timeout) > millis())

{

// lesen der Antwort des ESP8266

while (esp8266.available())

{

char c = esp8266.read();

antwortESP8266 = antwortESP8266 +c;

}

}

// false Debug-Modus aktiviert (debug = true) Antwort ausgeben

if (debug)

{

Serial.print(antwortESP8266);

}

//Rückgabe Wert der Funktion

return antwortESP8266;

}

//*********************************************************

// Funktion setAutopilot()

// Roboter fährt allein und erkennt Hindernisse

//*********************************************************

void setAutopilot(){

//Distanz messen über Funktion

distance = calcDistanceUltrasonicSensor();

if (distance < 6) {

Serial.println ("Links prüfen");

Serial.println (distance);

//stop



delay(200);

//links 1/4 Drehung

for (int i=0; i <= 900; i++){




}

//Prüfen ob Links OK


if (distance < 10) {

Serial.println ("Rechts prüfen");

//rechts 1/2 Drehung

for (int i=0; i <= 1800; i++){



}

//Prüfen ob Rechts OK


if (distance < 20) {

Serial.println ("Zurück den Weg gekommen");

//weitere 1/4 Drehung rechts (Weg zurück gekommen)

for (int i=0; i <= 890; i++){



}

}

}

}

// Vorwärts

Serial.println ("Vorwärts");

for (int i=0; i <= 50; i++){



}

}

ANHANG 4: WEBSEITE FIRLEFRANZ

<!DOCTYPE html>

<html>

<head>

<script src="jquery-3.2.1.js"></script>

</head>

<body>

<div id="main">

<div class="header" style="clear:both; width:1020px;">

<h1>Firlefranz Control</h1>

</div>

<div class="control" style="float:right; top:50px; width:375px; height:360px">

<p>Arduino IP: >

<input type="text" id="arduino_ip" value="192.168.173.26">

<button class="showUrl" >Show URL</button>

</p>

<p>

Antwort:><span id="antwort"></span>

</p>


<table style="width:220px">

<tr>

<td></td>

<td><button class="cmd" id="cmd_01" style="height: 50px; width: 70px">Vor</button></td>

<td></td>

</tr>

<tr>

<td><button class="cmd" id="cmd_04" style="height: 50px; width: 70px">Links</button></td>

<td><button class="cmd" id="cmd_03" style="height: 50px; width: 70px">Stop</button></td>

<td><button class="cmd" id="cmd_05" style="height: 50px; width: 70px">Rechts</button></td>

</tr>

<td></td>

<td><button class="cmd" id="cmd_02" style="height: 50px; width: 70px">Zurück</button></td>

<td></td>

<tr>

</tr>

<td></td>

<td><button class="cmd" id="cmd_06" style="height: 25px; width: 70px">Autopilot</button></td>

<td></td>

<tr>

<td><button class="cmd" id="cmd_07" style="height: 25px; width: 70px">LED-An</button></td>

<td></td>

<td><button class="cmd" id="cmd_08" style="height: 25px; width: 70px">LED-Aus</button></td>

</tr>

</table>

</div>

<div class="video" style="float:left; top:50px; width:640px; height:360px;">

<p>Webcam IP:

<input type="text" id="webcam_ip" value="192.168.173.28">

<button class="loadVideo">Video laden</button>

</p>

<object id="video" type="text/html" data="" style="width:640px; height:360px;"></object>

</div>

<div class="bottom" style="clear:both; width:1020px;">

Jan & Yannic

</div>

</div>

<script type="text/javascript">

$(document).ready(function(){

$(".cmd")

.click(function(){

var var_arduino_url = "http://" + $("#arduino_ip").val() + ":80";

var var_comand = $(this).attr('id'); // get id value (i.e. pin13, pin12, or pin11)

// send HTTP GET request to the IP address with the parameter "pin" and value "p", then execute the function

$.get(var_arduino_url, {befehl:var_comand})

.done(function( data ) {

$( "#antwort" ).html( data );

//alert(data);

});

});

$(".showUrl")

.click(function(){

var var_arduino_url = "http://" + $("#arduino_ip").val() + ":80";

var webcam_url = "http://" + $("#webcam_ip").val() + ":80";

alert("Arduino: " + var_arduino_url + "\n\n" + "Webcam: " + webcam_url );

});


$(".loadVideo")

.click(function(){

var webcam_url = "http://" + $("#webcam_ip").val() + ":80";

document.getElementById("video").setAttribute('data', webcam_url);

// document.getElementById("audio").setAttribute('data', webcam_url);

});

});

</script>

</body>

</html>

ANHANG 6: ABBILDUNGSVERZEICHNIS

Abbildung 1 Firlefranz ........................................................................................................................................................................... 1

Abbildung 2 Arduino Board ................................................................................................................................................................ 2

Abbildung 3 Arduino mit Breadboard und erste LED-Schaltung hier mit 2 LEDs ...................................................... 3

Abbildung 4 Die wichtigsten Variablentypen in der Übersicht .............................................................................................. 3

Abbildung 5 Beispiel Programm LED ............................................................................................................................................. 4

Abbildung 6 Verbindung des Arduino zum ESP8266-01 ....................................................................................................... 5

Abbildung 7 Moto 28BJY-48 mit Adafruit L293d Motor Shield verbinden .................................................................... 7

Abbildung 8 Prototyp Chassis ............................................................................................................................................................ 7

Abbildung 9 Webseite zur Steuerung von Firlefranz ............................................................................................................... 8

Abbildung 10 Anschluss des Ultraschall-Sensors ..................................................................................................................... 9

Abbildung 11 Webseite zur Steuerung von Firlefranz mit Video ..................................................................................... 10

Abbildung 12 Firlefranz Chasis ....................................................................................................................................................... 10

https://d.docs.live.net/6f98a6f1ef071bc9/Documents/Projekt%20Firlefranz/Project%20Kleine%20Alberts%20Dokumentation.docx#_Toc510074336




