BA-Chatbot/backend/templates/config1.html

345 lines
12 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters!

This file contains invisible Unicode characters that may be processed differently from what appears below. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to reveal hidden characters.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Chatbot HSMA</title>
<style>
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
}
.main-container {
display: flex;
width: 100%;
padding: 20px;
}
.sample-questions {
padding: 20px;
border-radius: 8px;
background-color: #e6f2ff; /* Hintergrundfarbe */
height: 30%;
}
.aufgabenstellung {
padding: 20px;
border-radius: 8px;
background-color: #e6f2ff; /* Hintergrundfarbe */
}
.sample-questions h3,
.sample-questions h4 {
font-weight: bold;
margin-top: 15px;
color: #2c3e50; /* Dunkles Blau für Überschriften */
}
.aufgabe-title {
font-weight: bold;
margin-top: 15px;
font-size: 20px;
color: #2c3e50; /* Dunkles Blau für Überschriften */
}
.sample-questions ul,
.aufgabenstellung ul {
list-style-type: none;
padding-left: 0;
}
.sample-questions li,
.aufgabenstellung li {
margin-bottom: 10px;
}
.container {
display: flex;
align-items: flex-start;
width: 100%;
max-width: 100%;
}
iframe {
position: relative;
left: -20px;
margin-right: -100px;
}
.aufgabenstellung {
flex: 1;
margin-right: 20px;
}
#resetChat {
display: inline-block;
padding: 10px 15px 10px;
margin: 10px 0;
background-color: #007bff;
color: white;
border: none;
cursor: pointer;
border-radius: 4px;
}
.content {
width: 100%;
flex: 1;
margin-right: 20px;
}
</style>
</head>
<body>
<div class="main-container">
<div class="container">
<!-- Content-Bereich -->
<div class="content">
<div class="aufgabenstellung">
<h2>Aufgabenstellung</h2>
<p>
Du hast die Gelegenheit, mit einem spezialisierten Chatbot zu
interagieren, der entwickelt wurde, um Informationen und
Empfehlungen bezogen auf Ihre Hochschule zu liefern. Der Chatbot
verfügt über eine Vielzahl von Daten und kann bei vielen
verschiedenen Anfragen assistieren. Im Folgenden findest du eine
Liste von Aufgaben, die dem Chatbot gestellt werden können , um
seine Fähigkeiten zu evaluieren. Bitte beachte die vorgegebenen
Formulierungen und Szenarien, um einheitliche Ergebnisse zu
gewährleisten.
</p>
<p>
Wenn du bei der Durchführung der Aufgaben auf Probleme stoßt, etwa
wenn der Chatbot nicht reagiert, dann kannst du die Konversation
mit dem folgenden Button neu starten. Beachten jedoch, dass der
Chatbot bei intensiven KI-Suchen für Empfehlungen und Ähnliches
bis zu 30 Sekunden benötigen kann, um passende Ergebnisse zu
liefern.
</p>
<button id="resetChat">
Neustarten (Chat-Session zurücksetzen)
</button>
<br />
<br />
<div class="aufgabe-title">
Aufgabe 1: Empfehlungen Wahlpflichtmodule
</div>
<p>
Der Chatbot kann Wahlpflichtmodule aus dem Informatik Bachelor
Studiengang Empfehlen.
</p>
<p><b>Aufgabe 1.1</b></p>
<p>
Schreibe dem Chatbot die Nachricht:
<i>"Empfehlungen für Wahlpflichtmodule"</i> oder klicke auf den
Button.
</p>
<p>
Antworte auf die Frage
<i>"Welche Themen interessieren dich besonders?"</i> <br />
mit: <br />
<i
>"Ich habe Interesse an Natural Language Processing und
Künstliche Intelligenz im Medizinischen Bereich."</i
>
</p>
<p>
Antworte auf die Frage
<i>"Welche Kurse hast du in der Vergangenheit belegt?"</i>
<br />mit:<br />
<i
>"Ich habe bereits die Kurse Grundlagen der Neuronalen Netze
(GNN) und Machine Learning belegt"</i
>"
</p>
<p>
Anworte auf die Frage <br />
<i
>"Welche Art von Karriere möchtest du nach dem Studium
anstreben?"</i
>
<br />mit:<br />
<i
>"Ich möchte als Softwareentwickler arbeiten. Dabei möchte ich
insbesondere AI Systeme entwickeln."</i
>
</p>
Nun solltest du nach kurzer Zeit (ca. 30 Sekunden) eine Liste an
Modulen erhalten.
<br />
<br />
<p><b>Aufgabe 1.2</b></p>
Wiederhole den Prozess. Dabei kannst du nun frei Wählen, nach
welchen Modulen du suchen möchtest.
<br />
<br />
<div class="aufgabe-title">Aufgabe 2: Studienprüfungsordnung</div>
<p><b> Aufgabe 2.1</b></p>
<p>
Frage den Chatbot: <i>"Wie kann man Elternzeit beantragen?"</i>
</p>
<p><b> Aufgabe 2.2 </b></p>
<p>
Wiederhole den Prozess. Dabei kannst du die Frage über inhaltliche
Themen in der Studienprüfungsordnung frei Formulieren.
</p>
<br />
<div class="aufgabe-title">
Aufgabe 3: Experten für ein Fachgebiet finden
</div>
<p><b> Aufgabe 3.1 </b></p>
<p>
Der Chatbot kann Experten aus der Faktuktät für Informatik für
eine gegebene Fachrichtung identifizieren und vorschlagen.
</p>
<p>
Schreibe dem Chatbot die Nachricht "Expertensuche durchführen"
oder klicke auf den Button.
</p>
<p>
Antworte auf die Frage <br />
<br />
<i>"In welchem Bereich suchst du einen Experten?"</i> <br />
<br />
mit:
</p>
<p>
"<i
>Ich suche jemanden der sich im Bereich Natural Language
Processing auskennt und Machine Learning. Insbesondere für den
Fachbereich Medizin."</i
>
</p>
<p>
Der Chatbot sucht nun mittels KI Techniken nach passenden
Expertern. Dieser Prozess kann bis zu 30 Sekunden dauern
</p>
<p><b> Aufgabe 3.2 </b></p>
<p>
Wiederhole den Prozess. Dabei kannst du nun frei Wählen, in
welchem Fachbereich du Experten suchen möchtest.
</p>
<br />
<br />
<div class="aufgabe-title">
Aufgabe 4: Allgemeine Hochschulfragen
</div>
<p><b>Aufgabe 4.1</b></p>
<p>
Bitte den Chatbot die etwas über Mars oder Inno.space zu erzählen:
<i>"Erzähle mir etwas über Mars"</i> <br />
<i>"Wo finde ich den Mars-Raum?"</i>
<br />
Frage anschließend nach, wo du einen 3D Drucker findest.
</p>
<p><b>Aufgabe 4.2</b></p>
Wiederhole den Prozess. Dabei kannst du nun frei Wählen wonach du
Fragen möchtest
<br />
<br />
<div class="aufgabe-title">
Vielen Dank für die Teilnahme! <br />
Bitte fülle nun die folgende Umfrage aus:
</div>
</div>
</div>
</div>
<div class="sample-questions">
<h3>Beispielfragen:</h3>
<h4>Allgemeine Fragen über die Hochschule:</h4>
<ul>
<li>Erzähle mir etwas über Mars</li>
<li>Erzähle mir etwas über Inno Space</li>
<li>Wo befindet sich der Mars-Raum?</li>
<li>Wo finde ich einen 3D-Drucker?</li>
<li>Wo finde ich den Lehrveranstaltungsplan?</li>
<li>Welche Studienangebote hat die Hochschule?</li>
<li>Wie setze ich mein Passwort für das Hochschulportal zurück?</li>
<li>
An wen kann ich mich wenden, wenn ich mein Passwort und meine
zentrale Kennung vergessen habe?
</li>
<li>
An wen kann ich mich wenden, wenn ich die Matrikelnummer vergessen
habe?
</li>
<li>Erzähle mir etwas über Mars</li>
<li>Wie beantrage ich Elterngeld?</li>
<li>Wo befindet sich der Lasercutter?</li>
</ul>
<h4>Studienprüfungsordnung Fragen:</h4>
<ul>
<li>Darf ich die Frist der Bachelorthesis verlängern?</li>
<li>Wieviele Präsenztage muss ich im Pflichtpraktikum ableisten?</li>
<li>
Was sind die Voraussetzungen für das Praktische Studiensemester?
</li>
<li>Welche Vorteile haben Studierende mit Kindern?</li>
<li>Wie kann man Elternzeit beantragen?</li>
<li>Muss ich bei einer Online Prüfung meine Identität nachweisen?</li>
<li>
In welchem Absatz finde ich Informationen zu "Muss ich bei einer
Online Prüfung meine Identität nachweisen?"
</li>
<li>Wie oft darf ich eine Prüfung wiederholen?</li>
<li>
Wann wird mein Zeugnis, nach bestehen der Bachelorarbeit,
ausgestellt?
</li>
<li>Wie lange dauert die Ausstellung meines Zeugnisses?</li>
<li>Was weißt du über Mutterschutz im Studium?</li>
<li>
Wie lange werden meine Daten und Prüfungsleistungen von der
Hochschule gepeichert?
</li>
<li>Welche Zuständigkeiten hat der Prüfungsausschuss?</li>
</ul>
</div>
</div>
<script>
document.addEventListener("DOMContentLoaded", function () {
localStorage.removeItem("chat_session");
});
document
.getElementById("resetChat")
.addEventListener("click", function () {
window.location.reload();
});
!(function () {
let e = document.createElement("script"),
t = document.head || document.getElementsByTagName("head")[0];
(e.src =
"https://cdn.jsdelivr.net/npm/rasa-webchat@1.x.x/lib/index.js"),
// Replace 1.x.x with the version that you want
(e.async = !0),
(e.onload = () => {
window.WebChat.default(
{
customData: { language: "en" },
hideWhenNotConnected: false,
initPayload:
'/get_started{"reader_model":"GPT","retrieval_method_or_model":"distilbert", "rerank":false}',
title: "Chatbot HSMA",
socketUrl: "http://localhost:5005",
},
null
);
setTimeout(() => {
const launcher = document.querySelector(".rw-launcher");
const localStorageChatSession =
localStorage.getItem("chat_session");
const data = JSON.parse(localStorageChatSession);
if (launcher && !data?.params?.isChatOpen) {
launcher.click();
}
}, 4000);
}),
t.insertBefore(e, t.firstChild);
})();
</script>
</body>
</html>