diff --git a/background.jpg b/background.jpg
new file mode 100644
index 0000000..4f33928
Binary files /dev/null and b/background.jpg differ
diff --git a/favicon.ico b/favicon.ico
new file mode 100644
index 0000000..dd4bb03
Binary files /dev/null and b/favicon.ico differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..6d6858f
--- /dev/null
+++ b/index.html
@@ -0,0 +1,36 @@
+
+
+
+
+
+
+
+
+ Troia Text Adventure | CdV22
+
+
+
+
+
+ Troia Text Adventure
+
+
+
+
+
+
+
+
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..fc5ebad
--- /dev/null
+++ b/index.js
@@ -0,0 +1,249 @@
+/*
+ HTML ELEMENTE
+*/
+const inputForm = document.querySelector('#inputform') // form element
+const textInput = document.querySelector('#textinput') // text input
+const textContainer = document.querySelector('#messagecontainer') // text container
+
+/*
+ TEXTE / GAMEPLAY DATEN
+*/
+
+const INTRO_TEXT =
+ 'Sie wollen Troia erleben? Hier können Sie sich den Fakten stellen!'
+const WINNING_TEXT =
+ 'Herzlichen Glückwunsch, Sie haben das Troia Text Adventure erfolgreich gemeistert und sind ein wahrer Troia Experte! Als Nächstes wartet unser 3D- Spiel „Troia erleben“ auf Sie! Auf geht’s ins nächste Troianische Abenteuer!'
+const LOOSING_TEXT = 'Das ist leider nicht richtig. Sie verlieren.'
+const QUESTIONS = [
+ {
+ question: 'Haben Sie Lust?',
+ options: ['ja', 'nein'],
+ answer: 'ja',
+ positive: 'Perfekt. Los gehts!',
+ negative: 'Schade, bis zum nächsten Mal.',
+ },
+ {
+ question:
+ 'Troia war eine altertümliche Stadt in der Landschaft Troas gelegen, was heute dem Nordwesten der Türkei entspricht. Aus welcher Sprache stammt der Begriff „Troia“?',
+ options: ['Türkisch', 'Latein'],
+ answer: 'latein',
+ positive:
+ 'Richtig! Der Begriff stammt von der lateinischen Schreibweise „Troia“, welche wiederum der altgriechischen Schreibweise entspricht.',
+ },
+ {
+ question:
+ 'Im 19. Jahrhundert wurden in Troia viele Ausgrabungen gemacht von einem bekannten deutschen Archäologen. Wissen Sie, wie er heißt?',
+ options: ['Heinrich Schliemann', 'Paul Kretschmer'],
+ answer: 'heinrich schliemann',
+ positive:
+ 'Richtig! Johann Ludwig Heinrich Julius Schliemann war Kaufmann, Archäologe sowie Pionier der Feldarchäologie, als er die in Vergessenheit geratene Stadt Troia wiedergefunden hat.',
+ },
+ {
+ question:
+ 'Es steht außer Frage, dass Schliemann eine Quelle für sein Vorhaben und Fund haben musste. In der Antike gab es einige Schriftsteller und Dichter, die sich mit der Troianische Sage beschäftigten. So gab es auch eine Art „Urvater“ der Legende des Troianischen Kriegs. Wie war sein Name?',
+ options: ['Homer', 'Sophokles'],
+ answer: 'homer',
+ positive:
+ 'Richtig! Der griechische Dichter Homer schrieb die Werke „Ilias“ und „Odyssee“, die heute in Griechenland als Nationaldichtungen gefeiert werden. In „Ilias“ steht die antike Geschichte des Troianischen Kriegs niedergeschrieben.',
+ },
+ {
+ question:
+ 'In welchem Jahr, denken Sie, fanden die ersten Ausgrabungen statt?',
+ options: ['1750', '1871'],
+ answer: '1871',
+ positive:
+ 'Richtig! 1871 erhielt Schliemann seine Ausgrabungslizenz und begann zu graben.',
+ },
+ {
+ question: 'Halbzeit! Weiter gehts: Wann hat Schliemann Troia entdeckt?',
+ options: ['1875', '1873'],
+ answer: '1873',
+ positive:
+ 'Richtig! Im Jahre 1873 gab Schliemann bekannt, Troia in Hisarlık gefunden zu haben.',
+ },
+ {
+ question:
+ 'Was war sein spektakulärster Fund, der ihm den Durchbruch zum Ruhm als Wissenschaftler und Archäologen ermöglichte?',
+ options: ['Schatz des Priamos', 'Goldmaske des Agamemnon'],
+ answer: 'schatz des priamos',
+ positive:
+ 'Richtig! Seinen, zu Ehren des Troianischen Königs Priamos, selbsternannten „Schatz des Priamos“ hat Schliemann 1873 ausgegraben.',
+ },
+ {
+ question:
+ 'Troia war vielen Katastrophen ausgesetzt, was schließlich der Grund für die verschiedenen Phasen der Stadt war, an welchen die Zerstörung und der Wiederaufbau Troias zu erkennen ist. Welche Art von Katastrophen waren hauptsächlich dafür verantwortlich?',
+ options: ['Überschwemmung', 'Brände'],
+ answer: 'brände',
+ positive:
+ 'Richtig! Neben folgenschweren Eroberungen litt Troia unter Naturkatastrophen wie Erdbeben und Bränden, die die Stadt großflächig zerstörten. Ingesamt wurden die Mauern und Ruinen 46 Mal wieder aufgebaut.',
+ },
+ {
+ question: 'Wann fand der Troianische Krieg vermutlich statt?',
+ options: ['1200 v. Chr.', '500 v. Chr.'],
+ answer: '1200 v. Chr.',
+ positive:
+ 'Richtig! Angeblich geschah der entscheidende Angriff, in dem Troia schließlich unterging, in der Nacht des siebten Vollmonds. Dieser war am 13. Juli 1182 v. Chr. Sollte diese Angabe stimmen, dann dauerte der Troianische Krieg etwa 10 Jahre und 6 Monate.',
+ },
+ {
+ question:
+ 'Fast geschafft! Welche Funktion hatte das Troianische Pferd im Troianischen Krieg in der griechischen Mythologie?',
+ options: ['Geschenk', 'Versteck'],
+ answer: 'versteck',
+ positive:
+ 'Richtig! Das Troianische Pferd war ein hölzernes Pferd, in dessen Bauch sich die griechischen Soldaten vor den Toren Troias versteckten, um sich Zugang zur Festung zu verschaffen.',
+ },
+ {
+ question:
+ 'Letzte Frage: Wie lautet der Name des Troianers, der die Zerstörung Troias überlebte und zum Stammvater der Römer werden sollte?',
+ options: ['Aeneas', 'Odysseus'],
+ answer: 'aeneas',
+ positive: 'Richtig! Sein Name war Aeneas.',
+ },
+]
+
+/*
+ GAMEPLAY VARIABLEN
+*/
+
+let isGameOver = false
+let currentQuestionIndex = 0
+
+/*
+ START DES PROGRAMMS
+*/
+
+// zuerst den intro text und die erste frage printen
+printIntro()
+printQuestion()
+
+// "Enter"-Taste listener
+inputForm.addEventListener('submit', onInputSubmit)
+
+/**
+ * Wird aufgerufen, wenn im Inputfeld "Enter" gedrückt wird.
+ * Hier wird der Input gelesen, mit der erwarteteten Antwort verglichen,
+ * und entsprechend die nächste Frage gestellt oder gameOver() aufgerufen.
+ *
+ * @param event Form Submit Event
+ */
+function onInputSubmit(event) {
+ event.preventDefault()
+ // wird aufgerufen, wenn im text input enter gedrückt wird
+ const input = readInput()
+ const currentQuestion = QUESTIONS[currentQuestionIndex]
+
+ if (isGameOver) {
+ return
+ }
+
+ print(input, true)
+
+ if (
+ currentQuestion.options
+ .map((s) => s.toLowerCase())
+ .includes(input.toLowerCase())
+ ) {
+ if (currentQuestion.answer.toLowerCase() === input.toLowerCase()) {
+ print(currentQuestion.positive)
+ currentQuestionIndex++
+ if (currentQuestionIndex >= QUESTIONS.length) {
+ // alle fragen durch, gewonnen
+ print(WINNING_TEXT)
+ gameOver()
+ } else {
+ printQuestion()
+ }
+ } else {
+ print(currentQuestion.negative || LOOSING_TEXT)
+ gameOver()
+ }
+ } else {
+ print('Versuchen Sie es noch einmal.')
+ printQuestion()
+ }
+
+ textInput.value = '' // leert das input feld
+}
+
+/**
+ * Setzt das Spiel in den "Game Over" Zustand.
+ * Es wird kein weiterer Input angenommen, und statt dem
+ * Eingabefeld erscheint ein "Erneut Spielen"-Button
+ */
+function gameOver() {
+ isGameOver = true
+ inputForm.disabled = true
+ const button = createReplayButton()
+ textContainer.appendChild(button)
+ button.scrollIntoView()
+}
+
+function createReplayButton() {
+ const div = document.createElement('div')
+ div.classList.add('replaycontainer')
+ const button = document.createElement('button')
+ button.id = 'replay'
+ button.textContent = 'Erneut Spielen'
+ button.addEventListener('click', replay)
+ div.appendChild(button)
+ return div
+}
+
+/**
+ * Gibt den Text der aktuellen Frage aus.
+ */
+function printQuestion() {
+ const options = QUESTIONS[currentQuestionIndex].options.join('/')
+ print(QUESTIONS[currentQuestionIndex].question + ` (${options})`)
+}
+
+/**
+ * Gibt den Intro Text aus.
+ */
+function printIntro() {
+ print(INTRO_TEXT)
+}
+
+/**
+ * Liest den aktuellen Input im Eingabefeld und gibt ihn zurück.
+ * @returns Der Userinput
+ */
+function readInput() {
+ return textInput.value // text der vom user eingegeben wurde
+}
+
+/**
+ * Fügt dem textContainer einen neuen Paragraphen (
-Tag) mit dem
+ * gewünschen Text hinzu.
+ *
+ * @param text Text der ausgegeben werden soll
+ * @param userInput True, wenn der Input des Users wieder ausgegeben wird.
+ */
+function print(text, userInput = false) {
+ const div = document.createElement('div')
+ div.classList.add('bubble')
+ if (userInput) {
+ // falls der user input zurück gegeben wird, eine spezielle klasse hinzufügen
+ div.classList.add('right')
+ }
+ const p = document.createElement('p') // erstellt einen
tag
+ const textNode = document.createTextNode(text) // erstellt den text als html text
+ p.appendChild(textNode) // schreibt den text in den
tag
+ div.appendChild(p) // fügt den
tag in den
tag ein
+ textContainer // container für consolen text
+ .appendChild(div) // fügt den neuen
+ Troia Text Adventure
+