-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
40 lines (31 loc) · 823 Bytes
/
script.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
const fill = document.querySelector('.fill')
const empties = document.querySelectorAll('.empty')
fill.addEventListener('dragstart', dragStart)
fill.addEventListener('dragend', dragEnd)
for(const empty of empties) {
empty.addEventListener('dragover', dragOver)
empty.addEventListener('dragenter', dragEnter)
empty.addEventListener('dragleave', dragLeave)
empty.addEventListener('drop', dragDrop)
}
function dragStart() {
this.className += ' hold'
setTimeout(() => this.className = 'invisible', 0)
}
function dragEnd() {
this.className = 'fill'
}
function dragOver(e) {
e.preventDefault()
}
function dragEnter(e) {
e.preventDefault()
this.className += ' hovered'
}
function dragLeave() {
this.className = 'empty'
}
function dragDrop() {
this.className = 'empty'
this.append(fill)
}