-
Notifications
You must be signed in to change notification settings - Fork 1
/
new-task.js
56 lines (50 loc) · 1.96 KB
/
new-task.js
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
import dataKeeper from './data-keeper.js'
class NewTask {
constructor() {
window.closeModal = this.closeModal
window.addTask = this.addTask.bind(this)
window.newTaskHandler = this.newTaskHandler.bind(this)
}
openModal() {
const modalRoot = document.getElementById('modal-root')
if(modalRoot) {
const modalHTML = `
<section class="modal">
<div class="modal__overlay" onclick="closeModal()"></div>
<article class="modal__body">
<header>
<h3 class="modal__body_header">Add Task</h3>
</header>
<form class="form" id="js-add-task">
<input class="form__input-text" id="js-title"type="text" placeholder="Add Title" />
<input class="form__input-text" id="js-desc" type="text" placeholder="Add Description" />
<footer class="modal__body_footer">
<button class="btn" type="button" onclick="addTask(event)">Add</button>
</footer>
</form>
</article>
</section>
`
modalRoot.insertAdjacentHTML('beforeend', modalHTML)
}
}
closeModal() {
const modalRoot = document.getElementById('modal-root')
while(modalRoot.firstChild) {
modalRoot.removeChild(modalRoot.firstChild)
}
}
addTask(event) {
event.preventDefault()
const title = document.getElementById('js-title').value
const description = document.getElementById('js-desc').value
if(title.length > 0 || description.length > 0) {
dataKeeper.addTask({task: {title, description}})
this.closeModal()
}
}
newTaskHandler(event) {
this.openModal()
}
}
export default NewTask