delete drag and drop functions

This commit is contained in:
ReznoRMichael 2021-07-14 23:11:05 +02:00
parent 2f1bf9fe18
commit b713ebde98
8 changed files with 38 additions and 105 deletions

View file

@ -6083,54 +6083,10 @@ document.getElementById("save-location-input").addEventListener("mouseout", func
document.getElementById("checkbox-hints").addEventListener("click", CheckboxHintsToggle, false); document.getElementById("checkbox-hints").addEventListener("click", CheckboxHintsToggle, false);
document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxSpoilersToggle, false); document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxSpoilersToggle, false);
/* Drag and drop functions */
var dropArea = document.getElementById("drop-area");
/* Prevent default browser functions from firing */
["dragenter", "dragover", "dragleave", "drop"].forEach(function (eventName) {
dropArea.addEventListener(eventName, preventDefaults, false);
});
function preventDefaults(e) {
e.preventDefault();
e.stopPropagation();
}
/* Make the user know that they hover over the right drag and drop area */
["dragenter", "dragover"].forEach(function (eventName) {
dropArea.addEventListener(eventName, highlight, false);
});
["dragleave", "drop"].forEach(function (eventName) {
dropArea.addEventListener(eventName, unhighlight, false);
});
function highlight(e) {
dropArea.classList.add("highlight");
}
function unhighlight(e) {
dropArea.classList.remove("highlight");
}
/* What to do with the file(s) */
dropArea.addEventListener("drop", handleDrop, false);
function handleDrop(e) {
var dt = e.dataTransfer;
var files = dt.files;
console.log(e);
console.log(dt);
console.log(files);
(0,_LoadSaveFile_js__WEBPACK_IMPORTED_MODULE_1__.LoadSaveFile)(dt, new Date());
}
/* ------------------------- Exports ------------------------------- */ /* ------------------------- Exports ------------------------------- */
/***/ }), /***/ }),
/***/ "./node_modules/core-js/internals/a-function.js": /***/ "./node_modules/core-js/internals/a-function.js":

File diff suppressed because one or more lines are too long

View file

@ -264,7 +264,9 @@
</div> <!-- end content --> </div> <!-- end content -->
<div id="drop-area"></div> <div id="drop-area">
<div id="drop-area-inside" class="hidden"></div>
</div>
<script src="app.js"></script></body> <script src="app.js"></script></body>
</html> </html>

View file

@ -345,17 +345,26 @@ input[type="file"] {
#drop-area { #drop-area {
position: fixed; position: fixed;
width: 90%; width: 100%;
height: 90%; height: 100%;
left: 5%; left: 0;
top: 5%; top: 0;
z-index: 9999;
visibility: hidden;
}
#drop-area-inside {
background-color: rgba(38, 189, 38, 0.5); background-color: rgba(38, 189, 38, 0.5);
border: 0.3rem dashed rgba(38, 189, 38, 0.85); border: 0.3rem dashed rgba(38, 189, 38, 0.85);
border-radius: 1rem; border-radius: 1rem;
z-index: 9999; width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 9000;
} }
#drop-area.highlight { #drop-area #drop-area-inside.highlight {
border-color: rgb(61, 228, 61); border-color: rgb(61, 228, 61);
} }

File diff suppressed because one or more lines are too long

View file

@ -238,17 +238,26 @@ input[type="file"] {
#drop-area { #drop-area {
position: fixed; position: fixed;
width: 90%; width: 100%;
height: 90%; height: 100%;
left: 5%; left: 0;
top: 5%; top: 0;
z-index: 9999;
visibility: hidden;
}
#drop-area-inside {
background-color: rgba(38, 189, 38, 0.5); background-color: rgba(38, 189, 38, 0.5);
border: 0.3rem dashed rgba(38, 189, 38, 0.85); border: 0.3rem dashed rgba(38, 189, 38, 0.85);
border-radius: 1rem; border-radius: 1rem;
z-index: 9999; width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 9000;
} }
#drop-area.highlight { #drop-area #drop-area-inside.highlight {
border-color: rgb(61, 228, 61); border-color: rgb(61, 228, 61);
} }

View file

@ -149,7 +149,9 @@
</div> <!-- end content --> </div> <!-- end content -->
<div id="drop-area"></div> <div id="drop-area">
<div id="drop-area-inside" class="hidden"></div>
</div>
</body> </body>
</html> </html>

View file

@ -1082,51 +1082,6 @@ document.getElementById("save-location-input").addEventListener("mouseout", () =
document.getElementById("checkbox-hints").addEventListener("click", CheckboxHintsToggle, false); document.getElementById("checkbox-hints").addEventListener("click", CheckboxHintsToggle, false);
document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxSpoilersToggle, false); document.getElementById("checkbox-spoilers").addEventListener("click", CheckboxSpoilersToggle, false);
/* Drag and drop functions */
let dropArea = document.getElementById("drop-area");
/* Prevent default browser functions from firing */
["dragenter", "dragover", "dragleave", "drop"].forEach(eventName => {
dropArea.addEventListener(eventName, preventDefaults, false);
});
function preventDefaults(e) {
e.preventDefault();
e.stopPropagation();
}
/* Make the user know that they hover over the right drag and drop area */
["dragenter", "dragover"].forEach(eventName => {
dropArea.addEventListener(eventName, highlight, false);
});
["dragleave", "drop"].forEach(eventName => {
dropArea.addEventListener(eventName, unhighlight, false);
});
function highlight(e) {
dropArea.classList.add("highlight");
}
function unhighlight(e) {
dropArea.classList.remove("highlight");
}
/* What to do with the file(s) */
dropArea.addEventListener("drop", handleDrop, false);
function handleDrop(e) {
let dt = e.dataTransfer;
let files = dt.files;
console.log(e);
console.log(dt);
console.log(files);
LoadSaveFile(dt, new Date());
}
/* ------------------------- Exports ------------------------------- */ /* ------------------------- Exports ------------------------------- */
export { export {