Professur E-Learning und Neue Medien Institut für Medienforschung Philosophische Fakultät Scripting für Kommunikationswissenschaftler Gruppe C https://s-media-cache-ak0.pinimg.com/736x/9e/46/b5/9e46b5c98ae65d0880f37a30989781bb.jpg Steve Nebel M.A.
Scripting für Kommunikationswissenschaftler Telefon: +49 371 / 531 33917 Fax: +49 371 / 531 833917 Sitz: Rawema-Gebäude, Straße der Nationen 12, Raum 246 E-Mail: steve.nebel@phil.tuchemnitz.de Sprechzeiten: nach Vereinbarung 2
Scripting für Kommunikationswissenschaftler Inhalt des Seminars ist das Thema Scripting https://s3.amazonaws.com/kinlane-productions/apievangelist/scripting-platforms.jpg 3
Scripting für Kommunikationswissenschaftler Schreiben Sie sich (wenn noch nicht bereits getan) in die OE ein, darüber erhalten Sie auch alle relevanten Veranstaltungsmails! Grundlegender Ablauf: Einführungsveranstaltung Online-Videokurse Hausaufgaben Klausur 4
Scripting für Kommunikationswissenschaftler Prüfungsvorleistung (PVL): Gibt es nicht aber, Klausurinhalte beziehen sich in etwa zu 50% auf die Hausaufgaben. Es ist also in Ihrem Interesse, die Aufgaben zu erledigen. Prüfungsleistung (PL): 60-minütige Klausur zur Vorlesung Scripting für Kommunikationswissenschaftler Übung ist Ersatz für die Vorlesung, daher gibt es die gleiche PL. MELDEN SIE SICH DAHER GANZ NORMAL FÜR DIE PRÜFUNG AN! 5
Zeitplanung Termin Thema 06. 04 entfällt 13. 04 Einführung JAVA SCRIPT 20. 04 entfällt 27. 04 Freischaltung Tutorials SosciSurvey 04. 05 entfällt 11. 05 Freischaltung Tutorials SPSS 18. 05 entfällt 25. 05 Freischaltung Tutorials R 01. 06 entfällt 08. 06 Pfingsten 15. 06 Freischaltung Tutorials OpenSesame 22. 06 entfällt 29. 06 entfällt 04. 07 entfällt 6
JAVA SCRIPT CPU CPU INTERPRETER JAVA SCRIPT ist nicht JAVA COMPILER CODE CODE 7
HTML Öffnen Sie Spiegel.de mit Mozilla Drücken Sie Strg + U HTML - Hypertext Markup Language Auszeichnungssprache, Markierung durch Tags Unterteilung in head und body Der Head beinhaltet Meta-Informationen (z. B. Name der Website, Kontaktdaten, Informationen für Suchmaschinen) sowie Verweise auf zugehörige externe Komponenten wie CSS oder JavaScripts. Der Body beinhaltet das, was dem Nutzer auf der Seite angezeigt wird. 8
HTML <p> Absatz</p> <div> Abschnitt </div> <br> bzw. <br /> Umbruch <a href="http://www.spiegel.de"> Spiegel</a> <img src="https://www.tuchemnitz.de/phil/imf/elearning/files/elearning.png"> font style buttons Hilfe z.b bei: Teil der Hausaufgabe http://lifeyourway.net/printables/blogging-html-cheat-sheet.pdf (Wichtig: em, strong, img, a href, p, br, font size, font color, table) 9
CSS Cascading Style Sheets Stylesheet Sprache bestimmt die Darstellung Formatierung mit HTML (z.b. via font) gilt als überholt Was ist Kaskadierung? - Eigenschaften werden an untergeordnete Elemente vererbt, es sei denn sie werden explizit überschrieben entweder direkt im Head der HTML-Seite mit <style> </style> oder als zusätzliche.css-datei, im Head aufgerufen mit <link rel="stylesheet" href= beispielname.css">" <p class="testklasse">test</p> p.testklasse{background-color: #f89; border: 1px solid black} 10
CSS CSS macht effiziente Änderungen möglich, da diese automatisch für alle zugeordneten Elemente gelten Body - Blau Body - Blau Absätze - Rot Body Blau Absätze - Rot Class Sonne - Gelb 11
JAVA SCRIPT Typischerweise um Interaktion zu steuern klassische Objektorientiere Programmiersprache Einbinden via <script> oder Verweis im head <script src="pfad.js"> https://www.w3schools.com/js/default.asp https://wiki.selfhtml.org/wiki/schnell-index/javascript 12
JAVA SCRIPT Funktionen: HTML <button onclick = "TEST()">DRÜCK MICH</button> JAVA SCRIPT function TEST() { window.alert("test") } 13
JAVA SCRIPT Zugriff auf HTML: HTML <p id="ausgabe">das steht hier</p> <button onclick = "TEST()">DRÜCK MICH</button> JAVA SCRIPT function TEST() { document.getelementbyid("ausgabe"). innerhtml = "nicht mehr"; } 14
JAVA SCRIPT Variablen: HTML <p id="ausgabe"></p> <p id="ausgabe2"></p> <button onclick = "TEST()">DRÜCK MICH</button> JAVA SCRIPT function TEST() { var Nummer = 5 + 5 var Buchstabe = "K" document.getelementbyid("ausgabe"). innerhtml =Nummer; document.getelementbyid("ausgabe2"). innerhtml =Buchstabe; } 15
JAVA SCRIPT Bedingungen (Conditional Statements): HTML <p id="ausgabe"></p> <button onclick = "TEST()">DRÜCK MICH</button> JAVA SCRIPT function TEST() { var Datum = new Date() var Sekunden = Datum.getSeconds(); var Statement; if (Sekunden < 30) {Statement= "kleiner";} else {Statement = "groesser";} document.getelementbyid("ausgabe"). innerhtml =Statement; } 16
HAUSAUFGABE I Ihre Hausaufgabe: Programmieren Sie ein Beispiel auf JSBin, bei dem zu Beginn ein roter (!) Instruktionstext wie oben steht Gefolgt von einem Button, der eine JS-Funktion aufruft welche eine Zufallszahl (von 0 bis 1) erzeugt und dann per if-/else anzeigt, ob die Zahl größer oder kleiner als 0,5 ist Wichtiges Objekt: MATH 17