Tools & Methods in DH

Aufgabe 1 Laden Sie bitte die JavaScript-Bibliothek Modernizr von der Seite http://modernizr.com herunter und legen Sie die Datei in dem Ordner js ab. Verwenden Sie die Produktivversion (Production) mit allen Unterelementen von CSS3, HTML5 und Misc. Aufgabe 2 Erstellen Sie ein neues HTML5-Dokument und binden Sie Modernizr im Kopfbereich Ihres HTML-Dokumentes ein. Fügen Sie anschließend…

Read More Sitzungsaufgaben I – Feature Detection mit Modernizr und Zeichnen mit canvas

Aufgabe 1 Erstellen Sie ein neues HTML-Dokument, das mit Modernizr und jQuery verknüpft ist. Ergänzen Sie den Inhaltsbereich Ihres neu erstellten Dokumentes um einen Div-Container mit der ID „ausgabe“. Aufgabe 2 Binden Sie die folgenden JavaScript-Anweisungen in den Inhaltsbereich Ihres HTML-Dokumentes ein: var startTime = Date.now(), startRange = 0, endRange = 999999999; for (var i…

Read More Sitzungsaufgaben II – High Performance JavaScript: Web Worker

index.html <!DOCTYPE html> <html ng-app=“bandapp“> <head> <title>Künstlerinnen- und Künstlerseite</title> <meta charset=“utf-8″> <link rel=“stylesheet“ href=“css/style.css“> </head> <body> <div ng-controller=“helloCtrl“ id=“hello“> <!– Hier arbeitet unser Controller –> {{ message }} <br><br> <input type=“text“ name=“nachricht“ ng-model=“message“ /> <br><br> <button ng-click=“wetteraendern()“>Schönwetterknopf</button> </div> <div ng-controller=“artistCtrl“> <h1>{{ artistName }}</h1> <a href=“{{ discogsPage }}“>{{ discogsPage }}</a> <br> <p> {{ description }} </p>…

Read More Beispiellösung zu AngularJS, JSON und Helene Fischer

<!DOCTYPE html> <html> <head> <meta charset=“utf-8″> <meta name=“author“ content=“Jan G. Wieners“> <title>(Text)Annotation mit Annotator.js – Lyrics</title> <link rel=“stylesheet“ href=“https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css“ integrity=“sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7″ crossorigin=“anonymous“> <link rel=“stylesheet“ href=“http://assets.annotateit.org/annotator/v1.2.10/annotator.min.css“> <style> @import url(https://fonts.googleapis.com/css?family=Roboto); body { /* Permalink – use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dbdbdb+0,adadad+100 */ background: rgb(219,219,219); /* Old browsers */ background: -moz-linear-gradient(top, rgba(219,219,219,1) 0%, rgba(173,173,173,1) 100%); /* FF3.6-15…

Read More Beispiellösung zur Textannotation mit Annotator.js

Wird eine mit jQuery Mobile erstellte Webanwendung in Chrome geöffnet, verbietet Chrome mitunter die Ausführung wichtiger JavaScript-Anweisungen und bricht die Verarbeitung mit folgender Fehlermeldung ab: Uncaught SecurityError: Failed to execute ‚replaceState‘ on ‚History‘: A history state object with URL ‚[…]‘ cannot be created in a document with origin ’null‘ and URL ‚[…]‘. Um Chrome –…

Read More jQuery Mobile: Sicherheitsprobleme in Chrome & Co. umgehen

Tools zur heutigen Sitzung: Annotator.js (http://annotatorjs.org/) + Plugins (http://annotatorjs.org/plugins/, Offline-Plugin: https://github.com/aron/annotator.offline.js, Download: https://github.com/aron/annotator.offline.js/downloads) Bootstrap (http://getbootstrap.com/) oder Skeleton (http://getskeleton.com/) Aufgabe 1 Die JavaScript-Bibliothek Annotator.js (http://annotatorjs.org/) macht’s mit wenigen Anweisungen möglich, auf einer Website textuelle Information zu annotieren. Laden Sie sich die Bibliothek Annotator.js von der Projekthomepage http://annotatorjs.org/ herunter. Erstellen Sie unter Verwendung von Bootstrap oder Sekelton…

Read More Sitzungsaufgaben zu Annotator.js

Aufgabe 1 Laden Sie bitte das heutige Startpaket herunter und extrahieren Sie das Zip-Archiv in Ihren Arbeitsordner. Aufgabe 2 Ergänzen Sie die HTML-Datei 01_jqmobilefirststeps.htm um folgende Angaben: Ergänzen Sie die Autorangabe um Ihren Namen. Verknüpfen Sie Ihr HTML-Dokument mit dem jQuery Mobile Stylesheet, das sich im Ordner css befindet. Binden Sie die beiden JavaScript-Dateien jquery.min.js und…

Read More Sitzungsaufgaben zu jQuery Mobile

Neben unterschiedlich hohen Auflösungen der Digitalisate stellt das CEEC-Projekt auf seinen Detailseiten weiterführende Informationen zu den Codices bereit: Aufgabe Erstellen Sie eine Detailseite, die über eine Handschrift Ihrer Wahl informiert. Binden Sie die weiterführenden Informationen des Langkatalogisates – möglichst benutzerfreundlich – auf Ihrer Detailseite ein.

Read More Erweiterung des CEEC-Redesigns um eine Detailseite