yogsototh/easy-planner
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

working no save

Browse source
This commit is contained in:
Yann Esposito (Yogsototh) 2021-09-06 16:21:07 +02:00
parent 6ba5d6c233
commit 8a275cc968
Signed by untrusted user who does not match committer: yogsototh
GPG key ID: 7B19A4C650D59646
1 changed files with 181 additions and 136 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

71
index.html
View file

@ -1,6 +1,6 @@
<html>
<head>
<title>Drag and Drop</title>
<title>Plan</title>
<style>
body { font-family: monospace; }
table { border: solid;}
@ -25,15 +25,25 @@
margin: 2px;
display: inline-block;
}
#trash {
padding: 0.3em;
width: 50px;
border-radius: 3px;
margin: 1em;
font-size: 2em;
font-weight: bold;
}
.hl { background-color: red; color: white; }
</style>
</head>
<body>
<center>
<h1>Plan</h1>
<h3>people</h3>
<h3>Team</h3>
<div id="devs"></div>
<h3>work</h3>
<h3>releases</h3>
<div id="main"></div>
<div id="trash">&#x1f5d1;</div>
</body>
<script>
// (function () {
@ -46,9 +56,11 @@
"Rob",
"Wanderson",
];
var nbcolumns = 2;
var fts = [ "SX Session", "Bug Squashing", "Secure Client" ]
var fts = [ "SX Session",
"Bug Squashing",
"Secure Client" ];
function enabledrag(event) { event.preventDefault(); }
function init(){
var devcards=document.getElementById("devs");
people.forEach(function(p) {
@ -59,9 +71,14 @@
main.appendChild(genTable());
var cells = document.querySelectorAll("td");
cells.forEach(function(cell) {
cell.ondragover = function(event){ event.preventDefault(); };
cell.ondragover = enabledrag;
cell.ondrop = function(ev){drop(ev,this);};
});
var trashel = document.getElementById("trash");
trashel.ondragover = enabledrag;
trashel.ondrop = trash;
trashel.ondragenter = hltrash;
trashel.ondragleave = unhltrash;
var cards = document.querySelectorAll(".card");
cards.forEach(function(card){ card.draggable = true; card.ondragstart = drag; });
}
@ -112,7 +129,10 @@
devdiv.classList.add(devname);
devdiv.classList.add('card');
devdiv.textContent = devname;
devdiv.draggable = true;
devdiv.id = "inner-" + devname + Math.random().toString().substr(2, 8);
devdiv.style.backgroundColor = genColor(devname);
devdiv.ondragstart = drag;
return devdiv;
}
@ -136,11 +156,6 @@
return res;
};
function drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}
// release logic
function getWeekNumber(d) {
@ -181,10 +196,40 @@
}
// drag n drop
function drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}
function drop(ev,el) {
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
el.appendChild(document.getElementById(data));
var name = ev.dataTransfer.getData("text");
if ( name.startsWith("inner-") ) {
console.log("move: " + name);
el.appendChild(document.getElementById(name));
} else {
console.log("create: " + name);
el.appendChild(devcard(name));
}
}
function trash(ev) {
ev.preventDefault();
var name = ev.dataTransfer.getData("text");
if ( name.startsWith("inner-") ) {
console.log("TRASH: " + name);
unhltrash(null);
document.getElementById(name).remove();
}
}
function hltrash(ev) {
var trashel = document.getElementById('trash');
trashel.classList.add("hl");
}
function unhltrash(ev) {
var trashel = document.getElementById('trash');
trashel.classList.remove("hl");
}
window.addEventListener("load", init);
// })();