Irvold ChatBot’en
body { font-family: 'Open Sans', sans-serif; background-color: #f3f3f3; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; } #chatbox { width: 100%; max-width: 90%; background-color: white; border-radius: 10px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); padding: 20px; position: relative; } #messages { height: 300px; overflow-y: auto; border: 1px solid #ddd; padding: 10px; border-radius: 5px; margin-bottom: 15px; background-color: #fafafa; } .message { margin: 5px 0; } .user { font-weight: bold; } .bot { display: flex; align-items: flex-start; margin-top: 10px; } .bot img { width: 75px; height: 75px; border-radius: 50%; margin-right: 15px; } #user-input { width: calc(100% - 100px); padding: 10px; margin-right: 10px; border: 1px solid #ddd; border-radius: 5px; } #send-button { padding: 10px 20px; border: none; background-color: #007bff; color: white; border-radius: 5px; cursor: pointer; } #send-button:hover { background-color: #0056b3; }
Velkommen til Irvold ChatBot! Stil endelig dit spørgsmål.
const updateNameButton = document.getElementById('update-name-button');
const usernameInput = document.getElementById('username');
const sendButton = document.getElementById('send-button');
const userInputElement = document.getElementById('user-input');
const messagesElement = document.getElementById('messages');
updateNameButton.addEventListener('click', () => {
if (usernameInput.value.trim()) {
usernameInput.disabled = true;
updateNameButton.style.display = 'none';
appendMessage('bot', `Hej ${usernameInput.value.trim()}`);
} else {
alert('Indtast venligst dit navn.');
}
});
sendButton.addEventListener('click', sendMessage);
userInputElement.addEventListener('keypress', function(event) {
if (event.key === 'Enter') {
sendMessage();
}
});
function sendMessage() {
const userInput = getUserInput();
if (!userInput) return;
appendMessage('user', userInput);
handleResponse(userInput);
}
function getUserInput() {
const userInput = userInputElement.value.trim();
userInputElement.value = '';
return userInput;
}
function appendMessage(sender, text) {
const messageElement = document.createElement('div');
messageElement.className = 'message';
if (sender === 'user') {
messageElement.innerHTML = `${usernameInput.value.trim() || 'Bruger'}: ${text}`;
} else {
messageElement.className += ' bot';
messageElement.innerHTML = ` ${text}`;
}
messagesElement.appendChild(messageElement);
messagesElement.scrollTop = messagesElement.scrollHeight;
}
function handleResponse(input) {
const response = getResponse(input.toLowerCase());
setTimeout(() => appendMessage('bot', response), 500);
}
function getResponse(input) {
const responses = {
'??': 'Tilgængelige kommandoer: **clr (ryd chatten), **mailto (send chat som e-mail), facebook (link til Facebook), **col (skift tekstfarve), **exit (genstart chatten). Men ellers kan du spørge om alt omkring kommunalvalget i Vordingborg Kommune, så svarer jeg så godt jeg kan.',
'facebook': 'Du kan følge mig på Facebook her: 
Facebook',
'hej': `Hej! ${usernameInput.value.trim() || 'der'}. Velkommen til Irvold ChatBot, hvad kan jeg hjælpe dig med?`,
'hello': 'Hyggeligt at se dig her. Hvad vil du gerne vide?',
'idiot': 'Lad os holde en god tone - jeg er her for at hjælpe, ikke for at skændes.',
'fjols': 'Det lyder som om, vi måske kunne bruge en frisk start. Lad os prøve igen.',
'moderaterne': 'Jeg forstår, at du overvejer forskellige muligheder. Jeg arbejder for samarbejde over midten med fokus på grøn omstilling og lokal vækst.',
'politik moderaterne': 'Jeg mener, at det er vigtigt at have en klar vision for vores kommune og arbejde for samarbejde over midten, med fokus på bæredygtighed, social ansvarlighed og stærke fællesskaber.',
"skat": "Jeg ønsker en retfærdig skattepolitik, hvor skattepengene bruges til gavn for fællesskabet og sikrer en velfungerende kommune.",
"skatter": "Skatter skal være rimelige og sikre, at vi har råd til vigtige offentlige tjenester som skoler, sundhed og infrastruktur.",
"klima": "Klimaet er en topprioritet. Jeg arbejder for grøn omstilling og bæredygtige løsninger.",
"familier": "Familier er kernen i vores kommune. Jeg vil sikre trygge rammer for børn og forældre.",
"erhverv": "Jeg vil støtte erhvervslivet med grøn vækst og bedre rammevilkår for lokale virksomheder.",
"uddannelse": "Jeg kæmper for stærkere uddannelsestilbud og bedre muligheder for livslang læring.",
"cykler": "Flere cykelstier gør det lettere og sikrere at komme rundt i vores kommune.",
"unge": "Unge skal have bedre muligheder for fritid, uddannelse og job i Vordingborg.",
"ældre": "Jeg arbejder for værdighed og kvalitet i ældreplejen, så alle kan få en tryg alderdom.",
"natur": "Vi skal bevare vores grønne områder og sikre en rig biodiversitet for fremtiden.",
"økonomi": "Økonomisk ansvarlighed betyder, at vi bruger pengene der, hvor de gør mest gavn.",
"fritid": "Gode fritidstilbud styrker fællesskaber og skaber bedre vilkår for børn og unge.",
"integration": "Jeg støtter en inkluderende kommune, hvor alle har mulighed for at bidrage.",
"kultur": "Kultur skaber fællesskab. Jeg vil styrke vores lokale kulturtilbud og arrangementer.",
"transport": "Offentlig transport skal være tilgængelig, klimavenlig og brugervenlig for alle.",
"tryghed": "Tryghed i hverdagen er vigtigt. Jeg vil sikre sikre byrum og mere nærhedspoliti.",
"energi": "Vedvarende energi er fremtiden. Jeg arbejder for flere grønne energiprojekter.",
"børn": "Alle børn fortjener en god start i livet med kvalitet i daginstitutioner og skoler.",
"digitalisering": "Jeg vil arbejde for smartere løsninger, der gør kommunen mere effektiv og tilgængelig.",
"arbejde": "Jeg støtter skabelsen af nye arbejdspladser gennem grøn vækst og innovation.",
"broer": "Som radikal politiker bygger jeg bro mellem borgere og partier for fælles løsninger.",
"trafik": "Jeg arbejder for grønne transportløsninger og bedre infrastruktur i Vordingborg.",
"boliger": "Flere bæredygtige boliger vil gøre kommunen mere attraktiv for både unge og familier.",
"miljø": "Vi skal beskytte miljøet og skabe grønne initiativer, der gavner både klima og borgere.",
"iværksættere": "Jeg støtter iværksættere med bedre vilkår og adgang til hjælp og netværk.",
"valg": "Din stemme gør en forskel. Lad os sammen forme fremtiden for Vordingborg.",
"hvornår": "Kommunalvalget er den 18. november. Du kan finde mig på liste B.",
"parti": "Jeg stiller op for Radikale Venstre.",
"radikale venstre": "Det er det parti jeg stiller op for.",
"sundhed": "Jeg arbejder for bedre sundhedstilbud og mere fokus på forebyggelse.",
"atomkraft": "Atomkraft giver store risici og er ikke løsningen. Vi bør fokusere på grønne alternativer.",
"strøm": "Vedvarende energikilder som vind og sol er sikrere og billigere end atomkraft.",
'**clr': 'COMMAND_CLEAR_CHAT',
'**mailto': 'COMMAND_SEND_EMAIL',
'**col': 'COMMAND_TOGGLE_COLOR',
'**exit': 'COMMAND_RESTART_CHAT'
};
for (const key in responses) {
if (input.includes(key)) {
if (responses[key] === 'COMMAND_CLEAR_CHAT') {
clearChat();
return 'Chatten er blevet ryddet.';
}
if (responses[key] === 'COMMAND_SEND_EMAIL') {
requestEmail();
return 'Indtast venligst din e-mailadresse for at modtage chatindholdet.';
}
if (responses[key] === 'COMMAND_TOGGLE_COLOR') {
const newColor = toggleTextColor();
return `Tekstfarven er blevet ændret til ${newColor}.`;
}
if (responses[key] === 'COMMAND_RESTART_CHAT') {
restartChat();
return 'Chatten er blevet genstartet.';
}
return responses[key];
}
}
return 'Jeg er kun en Bot og kender ikke alle svarene. Tjek daniel.irvold.dk eller skriv en mail til daniel@irvold.dk, hvis du ikke finder svar her.';
}
function clearChat() {
messagesElement.innerHTML = '';
}
function requestEmail() {
const email = prompt('Indtast din e-mailadresse:');
if (email) {
sendEmail(email);
}
}
function sendEmail(email) {
const subject = 'Chat Transcript from Irvold ChatBot';
const body = getChatContent();
const mailtoLink = `mailto:${email}?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`;
window.location.href = mailtoLink;
}
function getChatContent() {
let chatContent = '';
messagesElement.querySelectorAll('.message').forEach(message => {
let textContent = message.textContent.trim();
const linkElements = message.querySelectorAll('a');
linkElements.forEach(link => {
textContent = textContent.replace(link.textContent, link.href);
});
chatContent += textContent + '\n';
});
return chatContent.trim();
}
function toggleTextColor() {
const currentColor = messagesElement.style.color;
let newColor = '';
if (currentColor === 'rgb(236, 0, 140)') {
newColor = '#003974';
messagesElement.style.color = newColor;
} else if (currentColor === 'rgb(0, 57, 116)') {
newColor = '';
messagesElement.style.color = newColor;
} else {
newColor = '#ec008c';
messagesElement.style.color = newColor;
}
return newColor;
}
function restartChat() {
messagesElement.innerHTML = '';
usernameInput.disabled = false;
usernameInput.value = '';
updateNameButton.style.display = 'block';
appendMessage('bot', 'Velkommen til Irvold ChatBot! Stil endelig dit spørgsmål.');
}