Существует
@@ -1992,21 +1996,30 @@ const EXISTS_ITEMS = [
{expr:'√0.49', val:'yes'}, {expr:'√(-100)', val:'no'}, {expr:'√(-0.1)', val:'no'},
{expr:'√169', val:'yes'}, {expr:'√(-9)', val:'no'},
];
+let _existsSelected = null;
function initExists(){
const pool = document.getElementById('exists-pool');
if(!pool) return;
existsReset();
- // setup dz drop handlers
+ // HTML5 drag-and-drop
['exists-yes','exists-no','exists-pool'].forEach(id=>{
const dz = document.getElementById(id);
dz.addEventListener('dragover', e=>{ e.preventDefault(); dz.classList.add('over'); });
dz.addEventListener('dragleave', ()=>dz.classList.remove('over'));
dz.addEventListener('drop', e=>{
e.preventDefault(); dz.classList.remove('over');
- const id = e.dataTransfer.getData('text/plain');
- const item = document.getElementById(id);
+ const itemId = e.dataTransfer.getData('text/plain');
+ const item = document.getElementById(itemId);
if(item) dz.appendChild(item);
});
+ // Click-режим: если выбран элемент — клик по зоне переносит его
+ dz.addEventListener('click', e=>{
+ if(!_existsSelected) return;
+ if(e.target.closest('.drag-item') && e.target.closest('.drag-item') !== _existsSelected) return;
+ dz.appendChild(_existsSelected);
+ _existsSelected.classList.remove('selected');
+ _existsSelected = null;
+ });
});
}
function existsReset(){
@@ -2014,6 +2027,7 @@ function existsReset(){
pool.innerHTML = '';
document.getElementById('exists-yes').innerHTML='';
document.getElementById('exists-no').innerHTML='';
+ _existsSelected = null;
EXISTS_ITEMS.forEach((it,i)=>{
const d = el('div', {class:'drag-item', id:'exi-'+i, draggable:'true'}, it.expr);
d.dataset.val = it.val;
@@ -2022,6 +2036,18 @@ function existsReset(){
d.classList.add('dragging');
});
d.addEventListener('dragend', ()=>d.classList.remove('dragging'));
+ // Click — выбор / снятие выбора
+ d.addEventListener('click', ev=>{
+ ev.stopPropagation();
+ if(_existsSelected === d){
+ d.classList.remove('selected');
+ _existsSelected = null;
+ return;
+ }
+ document.querySelectorAll('.drag-item.selected').forEach(x=>x.classList.remove('selected'));
+ d.classList.add('selected');
+ _existsSelected = d;
+ });
pool.appendChild(d);
});
document.getElementById('exists-fb').className='feedback';