From 0c45adc72d0f5c276509f2a6c5971be5dc7679aa Mon Sep 17 00:00:00 2001 From: LarsVomMars Date: Wed, 27 Jan 2021 22:16:22 +0100 Subject: Hm --- profile/public/script.js | 32 +++++++++++++++++++++++++++++++- 1 file changed, 31 insertions(+), 1 deletion(-) (limited to 'profile/public/script.js') diff --git a/profile/public/script.js b/profile/public/script.js index b927f9f..ba2284b 100644 --- a/profile/public/script.js +++ b/profile/public/script.js @@ -2,6 +2,21 @@ const fs = document.querySelector("fieldset"); const form = document.querySelector("form"); let init = true; +const popup = document.querySelector(".popup"); +const popupImage = document.querySelector("#popup-img"); +const cropper = new Cropper(popupImage, { // ration 2/3 + dragMode: 'move', + aspectRatio: 2 / 3, + autoCropArea: 0.65, + restore: false, + guides: false, + center: false, + highlight: false, + cropBoxMovable: false, + cropBoxResizable: false, + toggleDragModeOnDblclick: false, +}); + function updateHeading(user) { document.getElementById("username").textContent = `Steckbrief: ${user.name} ${user.middlename || ""} ${user.surname}`; } @@ -28,7 +43,22 @@ function appendQuestions(question) { field.value = question.answer || ""; field.placeholder = question.question; field.type = question.type; - if (question.type === "file") field.accept = "image/*"; + if (question.type === "file") { + field.accept = "image/*"; + field.addEventListener("input", e => { + const file = e.target.files[0]; + popupImage.file = file; + const reader = new FileReader(); + reader.onload = (function (aImg) { + return function (e) { + aImg.src = e.target.result; + }; + })(popupImage); + reader.readAsDataURL(file); + popupImage.style.display = "block !important"; + console.log(cropper); + }); + } div.appendChild(field); fs.insertBefore(div, fs.querySelector("button")); -- cgit v1.2.3