5 changed files with 161 additions and 61 deletions
@ -0,0 +1,69 @@
@@ -0,0 +1,69 @@
|
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<title> |
||||
Kara - Add reponses |
||||
</title> |
||||
<meta charset="utf8"> |
||||
<link rel="icon" href="/favicon.ico"> |
||||
<link rel="manifest" href="manifest/kara.json"> |
||||
<link href="https://bootswatch.com/4/slate/bootstrap.min.css" rel="stylesheet" type="text/css"/> |
||||
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no" |
||||
name="viewport"> |
||||
</head> |
||||
<body> |
||||
<div class="container-fluid" id="kara"> |
||||
<div id="kara-banner" class="bg-dark text-light"> |
||||
<img src="/img/logo/luna/icon.ico" class="header-logo" alt="logo-header"/> |
||||
{{ this.name }} |
||||
</div> |
||||
|
||||
<div class="row" id="addForm"> |
||||
<div class="col"> |
||||
<h5>Add Reaction</h5> |
||||
<div class="form-group"> |
||||
<label for="includeAll">Message must include all search-terms</label> |
||||
<input type="checkbox" id="includeALl" v-model="addModal.includeAll"> |
||||
</div> |
||||
<div class="form-group"> |
||||
<label for="keywords">Keywords (separated with comma)</label> |
||||
<input type="text" id="keywords" v-model="addModal.keywords" class="form-control"> |
||||
</div> |
||||
<div class="form-group"> |
||||
<label>Responses</label> |
||||
<small>(Wildcards: $username$, $botname$)</small> |
||||
<template v-for="(key, responseOption) in addModal.responses"> |
||||
<input type="text" v-model="addModal.responses[responseOption]" class="form-control response-input"> |
||||
</template> |
||||
<div class="float-right"> |
||||
<button class="btn-sm btn-success" @click="addResponseToInput">+</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="row"> |
||||
<div class="col"> |
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button> |
||||
<button type="button" class="btn btn-primary" data-dismiss="modal" @click="addNewResponseContainer">Add |
||||
</button> |
||||
</div> |
||||
</div> |
||||
|
||||
<link rel="stylesheet" |
||||
:href="'https://maxcdn.bootstrapcdn.com/bootswatch/4.3.1/' + activeTheme + '/bootstrap.min.css'"> |
||||
<link href="app.css" rel="stylesheet" type="text/css"/> |
||||
</div> |
||||
|
||||
|
||||
<script src="https://kit.fontawesome.com/b54a4cceff.js" crossorigin="anonymous"></script> |
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment.min.js" crossorigin="anonymous"></script> |
||||
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" crossorigin="anonymous"></script> |
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" |
||||
crossorigin="anonymous"></script> |
||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" crossorigin="anonymous"></script> |
||||
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> |
||||
<script src="https://code.jquery.com/jquery-3.5.1.js"></script> |
||||
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> |
||||
<script src="addReponse.js"></script> |
||||
</body> |
||||
</html> |
||||
@ -0,0 +1,77 @@
@@ -0,0 +1,77 @@
|
||||
let responses = new Vue({ |
||||
el: '#kara', |
||||
data: { |
||||
name: 'Kara', |
||||
activeTheme: 'slate', |
||||
addModal: { |
||||
includeAll: false, |
||||
keywords: '', |
||||
responses: [ |
||||
'Answer #1' |
||||
] |
||||
} |
||||
}, |
||||
methods: { |
||||
addMessage(body, bot, me = false) { |
||||
this.messages.push({ |
||||
body: body, |
||||
bot: bot, |
||||
command: body.search('/') === 0, |
||||
me: me, |
||||
time: Date.now() |
||||
}) |
||||
}, |
||||
addResponseToInput() { |
||||
this.addModal.responses.push(''); |
||||
}, |
||||
addNewResponseContainer() { |
||||
let includeAll = this.addModal.includeAll; |
||||
let keywords = this.cleanupMessage(this.addModal.keywords).split(','); |
||||
let responses = this.addModal.responses; |
||||
|
||||
let newResponse = { |
||||
includeAll: includeAll, |
||||
keywords: keywords, |
||||
responses: responses |
||||
}; |
||||
|
||||
axios.post('/responses/create', newResponse) |
||||
.then((response) => { |
||||
console.log(response); |
||||
}) |
||||
.catch((error) => { |
||||
console.log(error); |
||||
}) |
||||
|
||||
// this.addModal.includeAll = false;
|
||||
// this.addModal.keywords = '';
|
||||
// this.addModal.responses = [''];
|
||||
}, |
||||
cleanupMessage(message) { |
||||
message = message.toLowerCase(); |
||||
return message.replace('?', '') |
||||
.replace('!', '') |
||||
.replace('.', '') |
||||
.replace(',', '') |
||||
.replace('-', '') |
||||
.replace('_', '') |
||||
.replace('#', '') |
||||
.replace('\'', '') |
||||
.replace('"', '') |
||||
.replace('+', '') |
||||
.replace('*', '') |
||||
.replace('§', '') |
||||
.replace('$', '') |
||||
.replace('%', '') |
||||
.replace('&', '') |
||||
.replace('/', '') |
||||
.replace('(', '') |
||||
.replace(')', '') |
||||
.replace('=', '') |
||||
.replace('\\', '') |
||||
.replace('@', '') |
||||
.replace('~', '') |
||||
.replace('…', ''); |
||||
} |
||||
} |
||||
}); |
||||
Loading…
Reference in new issue