ChatBot

Um alle Funktionen nutzen zu k�nnen, aktivieren Sie bitte JavaScript in ihrem Browser!

Der Treffpunkt f�r Hilfe, Tricks & Tipps � XOBOR-Foren und Homepages � Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps � ChatBot

Themen-Einstellungen

Thema drucken

Bereich wechseln

Start Willkommen! Ank�ndigungen & Termine, wichtige News! Stellen Sie Ihr eigene Webseite vor! Betriebssystem MS Windows & andere Betriebssysteme Betriebssystem MS Windows 11, 10, 8 und 7 - Tricks & Tipps MS Windows 11, 10, 8 und 7 - Fragen & Antworten Linux, Ubuntu und andere Betriebssysteme �rger mit dem PC, Laptop oder Tablet? �rger mit dem PC, Laptop oder Tablet - Vorbeugung und Hilfe �rger mit dem PC, Laptop oder Tablet - Fragen & Antworten Fragen zu DSL, VDSL, LTE und anderen Netzempfangsarten XOBOR-Foren und Homepages Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Fragen & Antworten Das neue Template Xobor (v6) Energieerzeugung im neuen Zeitalter - Revolution�r! Videos und Webseiten zur Freien Energie Wasserstoff - Energietr�ger der Zukunft. Die besten Links Empfehlenswerte und interessante Links! Link - Suche Verschiedenes Faszinationen & Unglaubliches! Tricks & Tipps f�r Smartphones und iPhones Lob, Kritik & Verbesserungsvorschl�ge Spiel & Spa�, Witz & gute Laune! Spiritualit�t, Seele, New Age, Yoga, Gesundheit Alles, was noch so �brig bleibt Bannertausch Wie funktioniert der Bannertausch? Bannerrotation und Bannerwechsel

#1 | ChatBot datum

06.08.2022 17:53 (zuletzt bearbeitet: 02.02.2023 07:33)

Daishi

Informationen anzeigen

Beitr�ge:	387
Registriert seit:	08.01.2022

Homepage:	Nicht angegeben
Letzte Spende	Betrag 15 � Forum Spende
Sternzeichen	Steinbock
Likes	329

Hallöchen, ich habe mir mal ein Chatbot gebastelt, er ist schlicht und einfach, habe auch eine Schimpfwortliste eingebaut.

Im JavaScript habe ich wichtige Einträge beschrieben. Man kann auch die Texte ändern und verlängern. Man muss nur auf die Häckchen achten, am Anfang und am Schluss einer Antwort und das ihr innerhalb der Klammern bleibt. Jede neue Antwort wird durch ein Komma getrennt,
z.B. ( ["Wie findest du das Wetter?", "Kommst du oft hierher?", "Es ist so schön, mit dir zu reden.", "Weißt du was? Ich weiß nicht, ob ich an den Weihnachtsmann glaube."] ; )

Habe an dem Script sehr lange gehangen, man kann es im Xobor - Forum unter "Eigener Seiten" benutzen, auch daran habe ich lange gehangen bis ich es im Xobor - Forum zum Laufen bekommen habe.

Ich habe das Javascript schon in den HTML Code mit eingefügt, habe sie aber hier absichtlich eingefügt.

Hier der HTML Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
 
  <html>
<!-- Chat Bot -->    
    
 
    <head>
        <meta charset="UTF-8" />
        <link type="text/css" rel="stylesheet" href="css/styles.css">
 
        <title>Chat Bot</title>
            
    </head>
 
    <body>
        
        <div id="interface">
            <div id="chatBox">
                <div id="chatText">
                    
                </div>
                
            </div>
            <div id="activity">
              <div id="isTyping">ChatBot tippt...</div></div>
                        
            <input id="textField" type="text" autofocus="autofocus" onkeypress="return isEnter(event)" placeholder="Geben Sie hier Ihre Nachricht ein">
        </div>
        
        <script type="text/javascript" src="scripts/javascript.js"></script>
 
 
            
    
    </body>
 
</html>
 
<!-- Javascript -->   
 
 
<script type="text/javascript" src="scripts/javascript.js"></script>
 
 
<script src="https://cpwebassets.codepen.io/assets/common/stopExecutionOnTimeout-1b93190375e9ccc259df3a57c1abc0e64599724ae30d7ea4c6877eb615f89387.js"></script>
 
 
 
 
<script id="rendered-js">
function isEnter(event) {
  if (event.keyCode == 13) {
    sendMessage();
  }
}
 
document.getElementById("send").onclick = function () {
  sendMessage();
};
 
function sendMessage() {
  var msg = document.getElementById("textField").value;
  if (msg == "") {return;};
 
  printMessage(msg, "user");
  clearInputField();
  showIsTyping();
  setTimeout(function () {chatBotAnswer(msg);}, 1500);
}
 
 
function printMessage(msg, user) {
  var newMsg = document.createElement('DIV');
 
  if (user == "user") {
    newMsg.className = 'userMessage';
 
  } else {
    newMsg.className = 'chatBotMessage';
  }
 
  newMsg.appendChild(document.createTextNode(msg));
 
  document.getElementById("chatText").appendChild(newMsg);
}
 
function clearInputField() {
  document.getElementById("textField").value = "";document.getElementById("textField").focus();
  gotoBottom();
}
 
function gotoBottom() {
 
  var scrollThisMuch = -(document.getElementById("chatBox").clientHeight - document.getElementById("chatText").scrollHeight);
 
  document.getElementById("chatBox").scrollTop = scrollThisMuch;
}
 
function showIsTyping() {
  document.getElementById("isTyping").style.visibility = "visible";
}
 
function chatBotAnswer(msg) {
  document.getElementById("isTyping").style.visibility = "hidden";
  var chatBotAnswer = getRandomMessage(msg);
  printMessage(chatBotAnswer);
  gotoBottom();
}
 
// Hier kann man die  Zufallsnachricht verändern  und  noch Texte hinzufügen
 
function getRandomMessage(msg) {
  var greetings = ["Wie geht es dir?", "Es ist schön, mit dir zu reden.", "Hallo!", "Hi!"];
  
// Hier kann man für die  Fragen noch Texte hinzufügen 
  var ifQuestion = ["Das ist eine interessante Frage.  Warum willst du das wissen?", "Das frage ich mich auch hin und wieder.", "Ich weiß nicht.", "Weißt du, was du fragst?", "Würde ich sagen ... Warte ab.  Nein, ich weiß es nicht."];
// Hier kann man für die Schimpfwörterliste noch Texte hinzufügen 
  var ifSwear = ["Du verwendest solch ein Schimpfwort?", "Ist das nett gesagt?", "Ich denke, du solltest dir ansehen, was du geschrieben hast."];
// Hier kann man für die normalen Wörter noch Texte hinzufügen
  var general = ["Wie findest du das Wetter?", "Kommst du oft hierher?", "Es ist so schön, mit dir zu reden.", "Weißt du was?  Ich weiß nicht, ob ich an den Weihnachtsmann glaube."];
  var answerTypes = [general, greetings, ifQuestion, ifSwear];
 
  var selectedAnswerType = answerTypes[0];
  isQuestion(msg);
 
  if (isQuestion(msg)) {
    selectedAnswerType = answerTypes[2]; // Wählt den Antworttyp �ifFrage';
  };
 
  if (isSwear(msg)) {
    selectedAnswerType = ifSwear;
  }
 
  if (msg.includes("hallo")) {};
 
 
  var selectedPhrase = selectedAnswerType[Math.floor(Math.random() * selectedAnswerType.length)];
  return selectedPhrase;
}
// Hier kann man die  Schimpwörter für die Schimpfwortliste angeben 
function isSwear(msg) {
  var list = ["fuck", "shit", "hitto", "perkele", "fucking"];
  return containsAnyOnList(msg, list);
}
// Hier kann man noch Fragewörter einfügen
function isQuestion(msg) {
  var list = ["?", "was", "Wenn"];
  return containsAnyOnList(msg, list);
}
 
function containsAnyOnList(msg, listToBeComparedTo) {
  var contains = false;
  for (i = 0; i < listToBeComparedTo.length; i++) {if (window.CP.shouldStopExecution(0)) break;
    if (msg.includes(listToBeComparedTo[i])) {
      contains = true;
    };
  }window.CP.exitedLoop(0);;
  return contains;
}
//# sourceURL=pen.js
    </script>  
  
 

Schlie�en

HTML - Code Zeile: 116
Aktualisiert 07.08.2022

Hier der CSS Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
 
/* chatbot Anfang */
/* chatbot Anfang */
 
body {
    background-color: #444;
    color: white;
    padding: 1em;
    font-family:  'Rockwell', 'Georgia',  sans-serif;
}
 
#interface {
    width: 400px;
    background-color: #3e3e3e;
    margin: 0 auto;
    border: solid #333 6px;
    box-shadow: 0 2px 10px #000;
}
 
#chatBox {
    width: 100%;
    height: 500px;
    background-color: #222;
    position: relative;
    overflow-y: scroll;
    padding: 0;
}
 
#chatText {
    /*position: relative;*/
    bottom: 0;
    left: 0;
    margin: 0;
}
 
#textField {
    border: solid #444 1px;
    font-family: 'Rockwell', 'Georgia',  sans-serif;
    width: 99%;
    font-size: 1em;
    line-height: 1.5em;
  
}
 
#send {
    display: none;
    font-weight: bold;
    text-transform: uppercase;
    color: white;
    background-color: dodgerblue;
    margin: 0;
    width: 100%;
    line-height: 1.5em;
}
 
#activity {
      display: block;
    background-color: #222;
    color: #f4f4f4;
    padding: 0.3em;
    height: 1em;
    text-align: center;
}
#isTyping {
    visibility: hidden;
}
 
.userMessage {
  
  text-align:left;
    padding: 0.5em;
}
 
.chatBotMessage {
  color: #ccc;
    text-align: right;
    padding: 0.5em;
}
 
::-webkit-scrollbar {
  width: 0;
}
/* chatbot Ende */
/* chatbot Ende */   
 

Schlie�en

Hier der Javascript Code allein:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
 
<!-- Javascript -->   
 
 
<script type="text/javascript" src="scripts/javascript.js"></script>
 
 
<script src="https://cpwebassets.codepen.io/assets/common/stopExecutionOnTimeout-1b93190375e9ccc259df3a57c1abc0e64599724ae30d7ea4c6877eb615f89387.js"></script>
 
 
 
 
<script id="rendered-js">
function isEnter(event) {
  if (event.keyCode == 13) {
    sendMessage();
  }
}
 
document.getElementById("send").onclick = function () {
  sendMessage();
};
 
function sendMessage() {
  var msg = document.getElementById("textField").value;
  if (msg == "") {return;};
 
  printMessage(msg, "user");
  clearInputField();
  showIsTyping();
  setTimeout(function () {chatBotAnswer(msg);}, 1500);
}
 
 
function printMessage(msg, user) {
  var newMsg = document.createElement('DIV');
 
  if (user == "user") {
    newMsg.className = 'userMessage';
 
  } else {
    newMsg.className = 'chatBotMessage';
  }
 
  newMsg.appendChild(document.createTextNode(msg));
 
  document.getElementById("chatText").appendChild(newMsg);
}
 
function clearInputField() {
  document.getElementById("textField").value = "";document.getElementById("textField").focus();
  gotoBottom();
}
 
function gotoBottom() {
 
  var scrollThisMuch = -(document.getElementById("chatBox").clientHeight - document.getElementById("chatText").scrollHeight);
 
  document.getElementById("chatBox").scrollTop = scrollThisMuch;
}
 
function showIsTyping() {
  document.getElementById("isTyping").style.visibility = "visible";
}
 
function chatBotAnswer(msg) {
  document.getElementById("isTyping").style.visibility = "hidden";
  var chatBotAnswer = getRandomMessage(msg);
  printMessage(chatBotAnswer);
  gotoBottom();
}
 
// Hier kann man die  Zufallsnachricht verändern  und  noch Texte hinzufügen
 
function getRandomMessage(msg) {
  var greetings = ["Wie geht es dir?", "Es ist schön, mit dir zu reden.", "Hallo!", "Hi!"];
  
// Hier kann man für die  Fragen noch Texte hinzufügen 
  var ifQuestion = ["Das ist eine interessante Frage.  Warum willst du das wissen?", "Das frage ich mich auch hin und wieder.", "Ich weiß nicht.", "Weißt du, was du fragst?", "Würde ich sagen ... Warte ab.  Nein, ich weiß es nicht."];
// Hier kann man für die Schimpfwörterliste noch Texte hinzufügen 
  var ifSwear = ["Du verwendest solch ein Schimpfwort?", "Ist das nett gesagt?", "Ich denke, du solltest dir ansehen, was du geschrieben hast."];
// Hier kann man für die normalen Wörter noch Texte hinzufügen
  var general = ["Wie findest du das Wetter?", "Kommst du oft hierher?", "Es ist so schön, mit dir zu reden.", "Weißt du was?  Ich weiß nicht, ob ich an den Weihnachtsmann glaube."];
  var answerTypes = [general, greetings, ifQuestion, ifSwear];
 
  var selectedAnswerType = answerTypes[0];
  isQuestion(msg);
 
  if (isQuestion(msg)) {
    selectedAnswerType = answerTypes[2]; // Wählt den Antworttyp �ifFrage';
  };
 
  if (isSwear(msg)) {
    selectedAnswerType = ifSwear;
  }
 
  if (msg.includes("hallo")) {};
 
 
  var selectedPhrase = selectedAnswerType[Math.floor(Math.random() * selectedAnswerType.length)];
  return selectedPhrase;
}
// Hier kann man die  Schimpwörter für die Schimpfwortliste angeben 
function isSwear(msg) {
  var list = ["fuck", "shit", "hitto", "perkele", "fucking"];
  return containsAnyOnList(msg, list);
}
// Hier kann man noch Fragewörter einfügen
function isQuestion(msg) {
  var list = ["?", "was", "Wenn"];
  return containsAnyOnList(msg, list);
}
 
function containsAnyOnList(msg, listToBeComparedTo) {
  var contains = false;
  for (i = 0; i < listToBeComparedTo.length; i++) {if (window.CP.shouldStopExecution(0)) break;
    if (msg.includes(listToBeComparedTo[i])) {
      contains = true;
    };
  }window.CP.exitedLoop(0);;
  return contains;
}
//# sourceURL=pen.js
    </script>  
   
 

Schlie�en

Javascript Zeile: 80
Aktualisiert 07.08.2022

Ich hoffe das meine Erklärungen im Script in Ordnung sind.

Ich hoffe, dass meine Inspiration gut ankommt.

Mit freundlichen Grüßen

Daishi

Daishi

Antworten

#2 | RE: ChatBot - Automatisch antworten! datum

07.08.2022 09:44

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3420
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Skorpion
Likes	1301

ChatBot - Automatisch antworten!

Hallo Daishi,
wieder eine tolle, inspirierende, aber doch spezielle Idee!

Für große Foren mit formellen Themen eine große Hilfe!
Oft werden die gleichen Fragen gestellt und wenn es hierzu auch die gleichen Antworten gibt, ist bei einer Flut von Anfragen so ein ChatBot super hilfreich!
Gut bestückt mit überlegten und passenden Antworten eine ideale Unterstützung
Aber ein persönlichen Chat mit echten Antworten kann durch ein ChatBot, sei er noch so gut, nicht ersetzt werden!
Wenn man entdeckt, das man mit einer Maschine redet, war's das ....

Zu Deinem Skript:

Es hat auf Anhieb funktioniert!
Hier finde ich es auch passend das Skript auf "Eigene Seiten" unterzubringen!
Deine Erklärungen sind gut und hilfreich!
Es ist schon interessant, dass das Skript auf Fragen, Aussagen, Schimpfwörter, auch auf Wiederholungen reagieren kann!

Fehler im Skript, die der Browser ingnoriert oder korregiert:

Das Javascript im Spoiler "HTML" ist außerhalb der HTML-Struktur eingetragen!
Einige JavaScript-Eintragungen benötigt nur "Codepen" und können wegfallen!
Unter "HTML": Zeile 28+40
Der CSS-Link in Zeile 7 führt ins Leere, kann aber angepasst werden, wenn er gebraucht wird!

Nachteil:

In Zeile 43 unter "HTML" befindet sich von "Codepen" ein generiertes Skript, dass wohl mit der Anmeldung zu tun hat!
Ich denke, wenn Du Deinen Accont aufgibts, funktioniert das Skript in anderen Foren auch nicht mehr....

1
 
<script src="https://cpwebassets.codepen.io/assets/common/stopExecutionOnTimeout...."></script>

Bis dann und besten Dank für Deine Arbeit und Dein Tun
Wolfgang

Antworten

#3 | RE: ChatBot - Automatisch antworten! datum

07.08.2022 15:49

Zitat von Wolfgang im Beitrag #2
Nachteil: In Zeile 43 unter "HTML" befindet sich von "Codepen" ein generiertes Skript, dass wohl mit der Anmeldung zu tun hat! Ich denke, wenn Du Deinen Accont aufgibts, funktioniert das Skript in anderen Foren auch nicht mehr....1 <script src="https://cpwebassets.codepen.io/assets/common/stopExecutionOnTimeout...."></script>n 

Das ist ein Timing des Endlosschleifenschutzes für CodePen ja und leider, wenn man den entfernt geht das Script leider nicht.

Wir machen hier bei CodePen ziemlich ausgefallene Tänze, um zu verhindern, dass Endlosschleifen in JavaScript den Browser blockieren. Ja, so intelligent Browser auch sind, sie können immer noch eine Endlosschleife schreiben und den Browser vollständig sperren, bis er absolut eingefroren ist und überhaupt nicht mehr reagiert. Wir wollen nicht, dass das im CodePen-Editor passiert, da es sogar zu Arbeitsverlusten führen kann (keuch!).
von Chris Coyier

Hier eine genauere Erklärung in Englisch:

Sie können das Timing des Endlosschleifenschutzes anpassen!

Keine Angst, werde den Account nicht löschen, mir macht da die Arbeit richtig Spaß.

Mit freundlichen Grüßen

Daishi

Daishi

Wolfgang findet das Top!

Antworten

#4 | ChatBot - Automatisch antworten - Endlosschleifenschutz aufheben! datum

07.08.2022 18:45

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3420
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Skorpion
Likes	1301

ChatBot - Automatisch antworten - Endlosschleifenschutz aufheben!

Hallo Daishi,
besten Dank für den Hinweis!
Wenn der "Endlosschleifenschutz" nur für den CodePen-Editor gedacht ist (da ist er auch sinnvoll), hat er bei einem funktionierenden Skript keine Aufgabe und könnte somit entfernt werden!
Löscht man allerdings das dazu gehörige JavaScript, funktionieren Teile vom Skript nicht mehr!

Lösung:

Der Schleifenschutz ist in "CodePen" nicht geheimnisvoll versteckt, sondern gut aufzufinden!
Eine Teil-Bezeichnung des JavaScript-Namen findet man im eigentlichen Skript wieder (stopExecution)!

Mit einer umschließenden if-Funktion wird eine mögliche Endlosschleife verhindert!
Löscht man die if-Funktion heraus (durch 2 Doppelstriche), läuft das Skript ohne die zusätzliche JavaScript-Datei!
Die if-Funktion ist immer gleich, auch in anderen Skripten, hier Rot markiert!

Das CodePen-Editor-Script für den "Endlosschleifenschutz":

1
 
<script src="https://cpwebassets.codepen.io/assets/common/stopExecutionOnTimeout...."></script>

if-Funktion wird auskommentiert:

  for (i = 0; i < listToBeComparedTo.length; i++)  //  {if (window.CP.shouldStopExecution(0)) break;

  ............................

  // }window.CP.exitedLoop(0);

Bis dann und nochmal besten Dank für das Skript

Wolfgang

Antworten

#5 | RE: ChatBot datum

07.08.2022 19:34

Ich habe noch einen kleinen Fehler gefunden, habe ich korrigiert, anstatt Gänsefüßchen oben ( " ) hatte ich Gänsefüßchen unten ( � ) .

Diese habe ich in HTML - Code geändert und im Javascript.

HTML - Code Zeile: 116

vorher ( var ifSwear = ["Du verwendest solch eine Schimpfworte!�, �Ist das nett gesagt?�, �Ich denke, du solltest dir ansehen, was du sagst."]; )

Aktualisiert : ( var ifSwear = ["Du verwendest solch ein Schimpfwort?", "Ist das nett gesagt?", "Ich denke, du solltest dir ansehen, was du geschrieben hast."]; )

Javascript Zeile: 80

vorher ( var ifSwear = ["Du verwendest solch eine Schimpfworte!�, �Ist das nett gesagt?�, �Ich denke, du solltest dir ansehen, was du sagst."]; )

Aktualisiert : ( var ifSwear = ["Du verwendest solch ein Schimpfwort?", "Ist das nett gesagt?", "Ich denke, du solltest dir ansehen, was du geschrieben hast."]; )

Mit freundlichen Grüßen

Daishi

Daishi

Wolfgang findet das Top!

Antworten

V6 User Hintergrundbild � � Sprechblasen fürs Forum - Teil 1+2

Foren Spende

Hallo !

Wir hoffen, dass Dir unser Forum gef�llt und Du Dich hier genauso wohlf�hlst wie wir.

Um Dir und den anderen Mitgliedern das Bestm�gliche bieten zu k�nnen, w�rden wir das Forum gern werbefrei gestalten, mit tollen neuen Extras erg�nzen.

Wenn Du uns dabei unterst�tzen m�chtest, kannst Du mit Hilfe einer kleinen Spende dazu beitragen.

Deine Spende hilft!

Spendenziel: 45 €

17%