{"size": 1563, "ext": "js", "max_stars_repo_path": "app.js", "max_stars_repo_name": "NazarProton/DRAG-DROP", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "app.js", "max_issues_repo_name": "NazarProton/DRAG-DROP", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "app.js", "max_forks_repo_name": "NazarProton/DRAG-DROP", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 30.0576923077, "max_line_length": 69, "alphanum_fraction": 0.6621880998}
const item = document.querySelector('.item')
const placeholders = document.querySelectorAll('.placeholder')

item.addEventListener('dragstart' , dragstart)
item.addEventListener('dragend' , dragend)

for (const placeholder of placeholders) {
    // console.log(placeholder);
    placeholder.addEventListener('dragover' , dragover)
    placeholder.addEventListener('dragenter' , dragenter)
    placeholder.addEventListener('dragleave' , dragleave)
    placeholder.addEventListener('drop' , dragdrop)
}

function dragstart (event) {
    document.querySelector('.item').innerHTML = 'Хочу новое место!' 
    // console.log('drag start' , event.target);
    // console.log('drag start' , this);
    event.target.classList.add('hold')
    setTimeout(() => event.target.classList.add
    ('hide'), 0)
}

function dragend (event) {
    document.querySelector('.item').innerHTML = 'Перетащи меня!'
    // console.log('drag end');
    // event.target.classList.remove('hold', 'hide')
    event.target.className = 'item'
    // event.target.classList.remove('hide')
    
}

function dragover(event) {
    event.preventDefault()
    // console.log('drag over');
    
}
function dragenter (event) {
    // console.log('drag enter');
    event.target.classList.add('hovered')
    
}
function dragleave (event) {
    // console.log('drag leave');
    event.target.classList.remove('hovered')

}
function dragdrop (event) {
    event.target.append(item)
    // console.log('drop');
    event.target.classList.remove('hovered')
}