You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
542 lines
16 KiB
542 lines
16 KiB
3 years ago
|
{% load static %}
|
||
|
|
<!DOCTYPE html>
|
||
|
|
<html lang="de">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
|
||
|
|
<title>VoiceBot-Prototyp</title>
|
||
|
|
|
||
|
|
<link rel="stylesheet" href="{% static "css/bootstrap.min.css" %}">
|
||
|
|
<link rel="stylesheet" href="{% static "css/css/common-page.css" %}">
|
||
|
|
<link rel="stylesheet" href="{% static "css/font-awesome-4.7.0/css/font-awesome.min.css" %}">
|
||
|
|
|
||
|
|
<!--für den chatbot-->
|
||
|
|
<link rel="stylesheet" href="{% static "css/toastr.css" %}">
|
||
|
|
<link rel="stylesheet" href="{% static "css/css/chat.css" %}">
|
||
|
|
<link rel="stylesheet" href="{% static "css/css/home.css" %}">
|
||
|
|
|
||
|
|
<link href="https://fonts.googleapis.com/css2?family=Montserrat&family=Source+Sans+Pro:wght@600&display=swap">
|
||
|
|
<!-- ======= Icon Chat =======-->
|
||
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||
|
|
|
||
|
|
<link rel="stylesheet" href="{% static "css/custom.css" %}">
|
||
|
|
<script src="{% static "script/jquery-1.10.2.js" %}"></script>
|
||
|
|
<script src="{% static "script/bootstrap.min.js" %}"></script>
|
||
|
|
<script src="{% static "script/toastr.js" %}"></script>
|
||
|
|
|
||
|
|
|
||
|
|
<!-- Fonts menu nav-->
|
||
|
|
<script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
|
||
|
|
|
||
|
|
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<header>
|
||
|
|
<nav>
|
||
|
|
<!--======= Responsive Menu Nav ======-->
|
||
|
|
<input type="checkbox" id="check">
|
||
|
|
<label for="check" class="checkbtn">
|
||
|
|
<i class="fa fa-bars"></i>
|
||
|
|
</label>
|
||
|
|
<ul>
|
||
|
|
<li><a href="{% url 'index' %}">Home</a></li>
|
||
|
|
<li><a href="{% url 'barrierefrei' %}" target="_blank">Barrierefrei</a></li>
|
||
|
|
<li><a href="mailto:KommHUB@komm.one">Kontakt</a></li>
|
||
|
|
<li><a href="https://www.digitalakademie-bw.de/" target="_blank">DA@bw</a></li>
|
||
|
|
</ul>
|
||
|
|
</nav>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<!-- ====== Logo DA ====== -->
|
||
|
|
<div class="logohome">
|
||
|
|
<label class="logo"><a href="https://www.digitalakademie-bw.de"><img
|
||
|
|
src="https://www.digitalakademie-bw.de/wp-content/uploads/2018/04/digitalakademie_logo-1.png"
|
||
|
|
alt="Digitalakademie@bw"></a>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
<!--======= End Responsive Menu Nav ======-->
|
||
|
|
|
||
|
|
<!-- ======= Logo Kommi =======-->
|
||
|
|
<img class="kommi" src="{% static "img/Voicebot_mitHintergrund.png" %}" width="500" height="400">
|
||
|
|
|
||
|
|
<!-- ====== CHAT BAR BLOCK ====== -->
|
||
|
|
<div class="chat-bar-collapsible">
|
||
|
|
<button id="chat-button" type="button" class="collapsible">Starten Sie KOMMI!
|
||
|
|
<i id="chat-icon" style="color: #fff;" class="fa fa-fw fa-comments-o"></i>
|
||
|
|
</button>
|
||
|
|
|
||
|
|
<div class="content">
|
||
|
|
<div class="full-chat-block">
|
||
|
|
<!-- Message Container -->
|
||
|
|
<div class="outer-container">
|
||
|
|
<div class="chat-container">
|
||
|
|
<input type="hidden" id="userId">
|
||
|
|
<!-- Messages -->
|
||
|
|
<div class="col-md-12">
|
||
|
|
<div class="row" id="MessageContent">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- User input box -->
|
||
|
|
<div class="chat-bar-input-block">
|
||
|
|
<div id="userInput">
|
||
|
|
<input id="Message" class="input-box" type="text" name="msg"
|
||
|
|
placeholder="Geben Sie hier Ihre Frage ein oder nutzen Sie die Sprachfunktion">
|
||
|
|
<p></p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="chat-bar-icons">
|
||
|
|
<i id="chat-icon" style="color: #333;" class="fa fa-fw fa-send"
|
||
|
|
onclick="Reply()"></i>
|
||
|
|
<i id="chat-icon" style="color: crimson;" class="fa fa-microphone"
|
||
|
|
onclick="myFunction2()"></i>
|
||
|
|
<i id="play" style="color: #333;" class="fa fa-play"
|
||
|
|
onclick="play()"></i>
|
||
|
|
|
||
|
|
<i id="stop" style="color: #333;" class="fa fa-stop"
|
||
|
|
onclick="stop()"></i>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="chat-bar-bottom">
|
||
|
|
<p></p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<!-- ====== end Chat Bar Block ====== -->
|
||
|
|
|
||
|
|
|
||
|
|
<script>
|
||
|
|
toastr.options.positionClass = 'toast-bottom-left';
|
||
|
|
var pref='{{request.path}}';
|
||
|
|
pref =pref.replace("chatbot/", "benae_")+'#';
|
||
|
|
var sesid = pref+ Math.random().toString(36).substr(2, 9) + Math.random().toString(36).substr(2, 9);
|
||
|
|
sesid =sesid.substr(1)
|
||
|
|
console.log(sesid)
|
||
|
|
$("#userId").val(sesid);
|
||
|
|
sessionStorage.setItem("chatbot.sessionid", sesid);
|
||
|
|
|
||
|
|
var msgText = $('#Message');
|
||
|
|
$("#Message").keypress(function (e) {
|
||
|
|
if (e.which == 13) {
|
||
|
|
Reply();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
var idaktuell ;
|
||
|
|
var frageaktuell ;
|
||
|
|
function set_id(x){
|
||
|
|
idaktuell = x;
|
||
|
|
}
|
||
|
|
|
||
|
|
function set_frage(x){
|
||
|
|
frageaktuell = x;
|
||
|
|
}
|
||
|
|
function Reply() {
|
||
|
|
var msg = msgText.val()
|
||
|
|
if (msg == '') {
|
||
|
|
toastr.error("Message can not be empty")
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
var data = {
|
||
|
|
"msg": msg, "userId":$("#userId").val(), "startcontext": ""
|
||
|
|
}
|
||
|
|
var id= $("#userId").val()
|
||
|
|
set_id(id)
|
||
|
|
set_frage(msg)
|
||
|
|
|
||
|
|
$.ajax({
|
||
|
|
url: '/kommi/barrierefrei',
|
||
|
|
data: JSON.stringify(data),
|
||
|
|
method: 'POST',
|
||
|
|
success: function (res) {
|
||
|
|
drawMessage(res)
|
||
|
|
|
||
|
|
},
|
||
|
|
error: function (err) {
|
||
|
|
if (err.desc == null)
|
||
|
|
err.desc = "Something went wrong"
|
||
|
|
toastr.error(err.desc)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
function isObject(obj) {
|
||
|
|
return (typeof obj === "object" && obj !== null) || typeof obj === "function";
|
||
|
|
}
|
||
|
|
var intentbutton = document.getElementsByClassName('btn-ortena');
|
||
|
|
|
||
|
|
function toCorona(){
|
||
|
|
var cdata = document.getElementById("chatbot-button").dataset;
|
||
|
|
var sessionId = sessionStorage.getItem("ortena.sessionid");
|
||
|
|
user = "corona_" + cdata.chat + "#" + sessionId;
|
||
|
|
|
||
|
|
}
|
||
|
|
function toOrtena(){
|
||
|
|
var cdata = document.getElementById("chatbot-button").dataset;
|
||
|
|
var sessionId = sessionStorage.getItem("ortena.sessionid");
|
||
|
|
user = cdata.system + "_" + cdata.chat + "#" + sessionId;
|
||
|
|
}
|
||
|
|
|
||
|
|
function positiv() {
|
||
|
|
|
||
|
|
var q= jQuery("<div></div>")
|
||
|
|
q.addClass("col-md-6").addClass("guest-message")
|
||
|
|
q.append("<p>Vielen Dank für Ihre Rückmeldung!</p>")
|
||
|
|
q.appendTo(msgContent)
|
||
|
|
scrollDown();
|
||
|
|
|
||
|
|
console.log('id dfvkdj', idaktuell)
|
||
|
|
console.log('frage dfvkdj', frageaktuell)
|
||
|
|
|
||
|
|
var data = {
|
||
|
|
"msg": frageaktuell, "userId":idaktuell, "startcontext": ""
|
||
|
|
}
|
||
|
|
$.ajax({
|
||
|
|
url: '/kommi/positiv',
|
||
|
|
data: JSON.stringify(data),
|
||
|
|
method: 'POST',
|
||
|
|
success: function (res) {
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
error: function (err) {
|
||
|
|
if (err.desc == null)
|
||
|
|
err.desc = "Something went wrong"
|
||
|
|
toastr.error(err.desc)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function negativ() {
|
||
|
|
|
||
|
|
var q= jQuery("<div></div>")
|
||
|
|
q.addClass("col-md-6").addClass("guest-message")
|
||
|
|
q.append("<p>Vielen Dank für Ihre Rückmeldung.</p><p>Es tut uns leid, dass Ihnen diese Antwort nicht weitergeholfen hat. Wir arbeiten kontinuierlich daran, Kommi zu verbessern.</p>")
|
||
|
|
q.appendTo(msgContent)
|
||
|
|
scrollDown();
|
||
|
|
|
||
|
|
console.log('id dfvkdj', idaktuell)
|
||
|
|
console.log('frage dfvkdj', frageaktuell)
|
||
|
|
|
||
|
|
var data = {
|
||
|
|
"msg": frageaktuell, "userId":idaktuell, "startcontext": ""
|
||
|
|
}
|
||
|
|
$.ajax({
|
||
|
|
url: '/kommi/negativ',
|
||
|
|
data: JSON.stringify(data),
|
||
|
|
method: 'POST',
|
||
|
|
success: function (res) {
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
error: function (err) {
|
||
|
|
if (err.desc == null)
|
||
|
|
err.desc = "Something went wrong"
|
||
|
|
toastr.error(err.desc)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function myFunction(intent_message) {
|
||
|
|
|
||
|
|
console.log(intent_message)
|
||
|
|
"$('.btn-ortena').data('intent');"
|
||
|
|
var msg = intent_message;
|
||
|
|
|
||
|
|
if (msg == '') {
|
||
|
|
toastr.error("Message can not be empty")
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
var data = {
|
||
|
|
"msg": msg, "userId":$("#userId").val()
|
||
|
|
}
|
||
|
|
$.ajax({
|
||
|
|
url: '/kommi/barrierefrei',
|
||
|
|
data: JSON.stringify(data),
|
||
|
|
method: 'POST',
|
||
|
|
success: function (res) {
|
||
|
|
drawAnswer(res)
|
||
|
|
},
|
||
|
|
error: function (err) {
|
||
|
|
if (err.desc == null)
|
||
|
|
err.desc = "Something went wrong"
|
||
|
|
toastr.error(err.desc)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
}
|
||
|
|
for (var i = 0; i < intentbutton.length; i++) {
|
||
|
|
intentbutton[i].addEventListener('click', myFunction);
|
||
|
|
}
|
||
|
|
|
||
|
|
var msgContent = $('#MessageContent');
|
||
|
|
|
||
|
|
function drawMessage(res) {
|
||
|
|
msgContent.append("<div class='col-md-6 owner-message'><p>"+res.ques+"</p></div>");
|
||
|
|
|
||
|
|
scrollDown();
|
||
|
|
drawAnswer(res)
|
||
|
|
}
|
||
|
|
function drawAnswer(res) {
|
||
|
|
|
||
|
|
var q= jQuery("<div></div>")
|
||
|
|
q.addClass("col-md-6").addClass("guest-message")
|
||
|
|
|
||
|
|
if (Array.isArray(res.res)) {
|
||
|
|
q.append("<p>"+paint(res.res[0])+"</p>")
|
||
|
|
} else q.append("<p>"+paint(res.res)+"</p>");
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
msgText.val('')
|
||
|
|
|
||
|
|
q.append('<div class="feedback"><ul class="feedback__buttons"><li><button class="feedback__button feedback__button--positive gut" aria-label="Positives Feedback für die Antwort abgeben" onclick="positiv()"><i class="fa fa-thumbs-up"></i></button></li><li><button class="feedback__button feedback__button--negative schlecht" aria-label="Negatives Feedback für die Antwort abgeben" onclick="negativ()"><i class="fa fa-thumbs-down"></i></button></li></ul></div>\n')
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
q.appendTo(msgContent)
|
||
|
|
scrollDown();
|
||
|
|
console.log('res.res[0]', res.res[1])
|
||
|
|
if (Array.isArray(res.res)) {
|
||
|
|
botVoice(res.res[1])
|
||
|
|
} else botVoice(res.res);
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function scrollDown() {
|
||
|
|
$chatbotMessageWindow = document.querySelector(".full-chat-block");
|
||
|
|
$chatbotMessages = document.querySelector("#MessageContent");
|
||
|
|
var distanceToScroll = $chatbotMessageWindow.scrollHeight - ($chatbotMessages.lastChild.offsetHeight + 60);
|
||
|
|
//jQuery("#MessageContent").animate({scrollTop: distanceToScroll}, 500);
|
||
|
|
$chatbotMessageWindow.scrollTop = distanceToScroll;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
jQuery(document.body).on('click', '.btn-abfallja', function (e) {
|
||
|
|
var el= jQuery(this).parent().parent().parent().parent();
|
||
|
|
jQuery(el).find(".abfallja").show()
|
||
|
|
jQuery(el).find(".abfallnein").hide()
|
||
|
|
});
|
||
|
|
jQuery(document.body).on('click', '.btn-abfallnein', function (e) {
|
||
|
|
var el= jQuery(this).parent().parent().parent().parent();
|
||
|
|
jQuery(el).find(".abfallnein").show()
|
||
|
|
jQuery(el).find(".abfallja").hide()
|
||
|
|
});
|
||
|
|
function paintStrukturierteAntwort(obj) {
|
||
|
|
|
||
|
|
let xstr="";
|
||
|
|
var items = obj["atwst"];
|
||
|
|
|
||
|
|
items.sort(function (a, b) {
|
||
|
|
return a.pgx - b.pgx;
|
||
|
|
});
|
||
|
|
if (items.length > 0) {
|
||
|
|
|
||
|
|
xstr += "<div class=\"chatbot-card chatbot-card--antwst\">";
|
||
|
|
|
||
|
|
items.forEach(function (item) {
|
||
|
|
let typ = item.typ;
|
||
|
|
if (!typ) typ = "atwst"
|
||
|
|
xstr += paintItem(item, typ)
|
||
|
|
|
||
|
|
})
|
||
|
|
xstr+="</div>";
|
||
|
|
}
|
||
|
|
|
||
|
|
return xstr;
|
||
|
|
}
|
||
|
|
function paintItem(item, typ) {
|
||
|
|
let xstr = "<div class=\"chatbot-card--" + typ + "\">";
|
||
|
|
let xcls = "accordion"
|
||
|
|
if (Number(item.pgx) < 1)
|
||
|
|
xcls = "selection"
|
||
|
|
|
||
|
|
if (item.titel)
|
||
|
|
xstr+="<div class=\"chatbot-card__header\"><div class=\"chatbot-card__title\">" + item.titel + "</div></div>"
|
||
|
|
xstr+="<div class=\"chatbot-card__body\">"
|
||
|
|
if (item.intro)
|
||
|
|
xstr+="<div class=\"chatbot-intro\">" + item.intro + "</div>"
|
||
|
|
if (item.btn && item.btn.length > 0) {
|
||
|
|
|
||
|
|
xstr+="<div class=\"chatbot-card__" + xcls + "\"><nav><ul class=\"" + xcls + "__items\">"
|
||
|
|
let btn = item.btn;
|
||
|
|
btn.sort(function (a, b) {
|
||
|
|
return Number(a.lfnr) - Number(b.lfnr);
|
||
|
|
});
|
||
|
|
btn.forEach(function (element) {
|
||
|
|
xstr+="<li class=\"" + xcls + "__item\"><button class=\"btn-ortena\" data-intent=\"" + element.bint + "\""
|
||
|
|
xstr+=" onclick=\"myFunction('" + element.bint + "')\">" + element.bzn + "</button></li>"
|
||
|
|
|
||
|
|
});
|
||
|
|
xstr+="</ul></nav></div>";
|
||
|
|
}
|
||
|
|
xstr+="</div>";
|
||
|
|
xstr+="</div>";
|
||
|
|
|
||
|
|
return xstr;
|
||
|
|
}
|
||
|
|
function paint (val) {
|
||
|
|
let str = "";
|
||
|
|
if (val) {
|
||
|
|
if (Array.isArray(val)) {
|
||
|
|
if (val.length) {
|
||
|
|
|
||
|
|
val.forEach(function (t) {
|
||
|
|
str = str + paint(t);
|
||
|
|
});
|
||
|
|
|
||
|
|
}
|
||
|
|
} else if (isObject(val)) {
|
||
|
|
if(val["atwst"])
|
||
|
|
{
|
||
|
|
|
||
|
|
return paintStrukturierteAntwort(val);}
|
||
|
|
|
||
|
|
else
|
||
|
|
return val;
|
||
|
|
} else
|
||
|
|
return val;
|
||
|
|
}
|
||
|
|
|
||
|
|
return str;
|
||
|
|
}
|
||
|
|
|
||
|
|
function paintItemBtn(item, typ) {
|
||
|
|
let xstr = "<div class=\"chatbot-card--" + typ + "\">";
|
||
|
|
let xcls = typ
|
||
|
|
let intro =jQuery(item).data(typ)
|
||
|
|
let titel=jQuery(item).text()
|
||
|
|
if (titel)
|
||
|
|
xstr+="<div class=\"chatbot-card__header\"><div class=\"chatbot-card__title\">" + titel + "</div></div>"
|
||
|
|
xstr+="<div class=\"chatbot-card__body\">"
|
||
|
|
if (intro)
|
||
|
|
xstr+="<div class=\"chatbot-intro\">" + intro + "</div>"
|
||
|
|
xstr+="</div>";
|
||
|
|
xstr+="</div>";
|
||
|
|
|
||
|
|
return xstr;
|
||
|
|
}
|
||
|
|
const voice = document.querySelector(".voice");
|
||
|
|
const voice2text = document.querySelector(".voice2text");
|
||
|
|
|
||
|
|
const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
|
||
|
|
const recorder = new SpeechRecognition();
|
||
|
|
recorder.lang = 'de-DE';
|
||
|
|
|
||
|
|
function addHumanText(text) {
|
||
|
|
text= 'Du: ' + text
|
||
|
|
const chatContainer = document.createElement("div");
|
||
|
|
chatContainer.classList.add("chat-container");
|
||
|
|
const chatBox = document.createElement("p");
|
||
|
|
chatBox.classList.add("voice2text");
|
||
|
|
const chatText = document.createTextNode(text);
|
||
|
|
chatBox.appendChild(chatText);
|
||
|
|
chatContainer.appendChild(chatBox);
|
||
|
|
return chatContainer;
|
||
|
|
}
|
||
|
|
|
||
|
|
function addBotText(text) {
|
||
|
|
text = 'Elisa: ' + text
|
||
|
|
const chatContainer1 = document.createElement("div");
|
||
|
|
chatContainer1.classList.add("chat-container");
|
||
|
|
chatContainer1.classList.add("darker");
|
||
|
|
const chatBox1 = document.createElement("p");
|
||
|
|
chatBox1.classList.add("voice2text");
|
||
|
|
const chatText1 = document.createTextNode(text);
|
||
|
|
chatBox1.appendChild(chatText1);
|
||
|
|
chatContainer1.appendChild(chatBox1);
|
||
|
|
return chatContainer1;
|
||
|
|
}
|
||
|
|
var voiceaktuell;
|
||
|
|
|
||
|
|
//function to call inside ajax callback
|
||
|
|
function set_voiceaktuell(x){
|
||
|
|
voiceaktuell = x;
|
||
|
|
}
|
||
|
|
function botVoice(message) {
|
||
|
|
const speech = new SpeechSynthesisUtterance();
|
||
|
|
console.log(message)
|
||
|
|
speech.text = message
|
||
|
|
set_voiceaktuell(message)
|
||
|
|
speech.volume = 1;
|
||
|
|
speech.rate = 1;
|
||
|
|
speech.pitch = 1;
|
||
|
|
window.speechSynthesis.speak(speech);
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
var playEle = document.querySelector('#play');
|
||
|
|
var pauseEle = document.querySelector('#pause');
|
||
|
|
var stopEle = document.querySelector('#stop');
|
||
|
|
var flag = false;
|
||
|
|
|
||
|
|
function play(){
|
||
|
|
|
||
|
|
console.log('sdkfcsdfvkdj', voiceaktuell)
|
||
|
|
const speech = new SpeechSynthesisUtterance();
|
||
|
|
|
||
|
|
speech.text = voiceaktuell
|
||
|
|
|
||
|
|
speech.volume = 1;
|
||
|
|
speech.rate = 1;
|
||
|
|
speech.pitch = 1;
|
||
|
|
window.speechSynthesis.speak(speech);
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
function stop(){
|
||
|
|
|
||
|
|
speechSynthesis.cancel();
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
/* Button start*/
|
||
|
|
function myFunction2 (){
|
||
|
|
recorder.start();
|
||
|
|
console.log('Ready to receive the voice.');
|
||
|
|
}
|
||
|
|
|
||
|
|
recorder.onresult = function (event) {
|
||
|
|
for (var i = event.resultIndex; i < event.results.length; ++i) {
|
||
|
|
if (event.results[i].isFinal) {
|
||
|
|
var str = event.results[i][0].transcript;
|
||
|
|
var newstr = str.replace(/Conny/i, "Kommi");
|
||
|
|
Message.value += newstr;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||
|
|
<script src="{% static "script/responses.js" %}"></script>
|
||
|
|
<script src="{% static "script/chat.js" %}"></script>
|
||
|
|
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|