openvk/Web/static/js/al_photos.js
lalka2016 dd37321d42 aj
2023-09-09 22:48:01 +03:00

120 lines
4.2 KiB
JavaScript

$(document).on("change", "#uploadButton", (e) => {
let iterator = 0
if(e.currentTarget.files.length > 10) {
MessageBox(tr("error"), tr("too_many_pictures"), [tr("ok")], [() => {Function.noop}])
return;
}
let photos = new FormData()
for(file of e.currentTarget.files) {
photos.append("photo_"+iterator, file)
iterator += 1
}
photos.append("count", e.currentTarget.files.length)
photos.append("hash", u("meta[name=csrf]").attr("value"))
let xhr = new XMLHttpRequest()
xhr.open("POST", "/photos/upload?album="+document.getElementById("album").value)
xhr.onloadstart = () => {
document.getElementById("photos").insertAdjacentHTML("beforeend", `<img id="loader" src="/assets/packages/static/openvk/img/loading_mini.gif">`)
}
xhr.onload = () => {
let result = JSON.parse(xhr.responseText)
if(result.success) {
u("#loader").remove()
let photosArr = result.photos
for(photo of photosArr) {
let table = document.querySelector("#photos")
table.insertAdjacentHTML("beforeend", `
<tr id="photo" data-id="${photo.id}">
<td width="120" valign="top">
<div class="uploadedImage">
<a href="${photo.link}" target="_blank"><img width="125" src="${photo.url}"></a>
</div>
<a style="float:right" id="deletePhoto" data-id="${photo.vid}" data-owner="${photo.owner}">${tr("delete")}</a>
</td>
<td>
<textarea style="margin: 0px; height: 50px; width: 259px; resize: none;" maxlength="255"></textarea>
</td>
</tr>
`)
}
document.getElementById("endUploading").style.display = "block"
} else {
u("#loader").remove()
MessageBox(tr("error"), result.flash.message ?? tr("error_uploading_photo"), [tr("ok")], [() => {Function.noop}])
}
}
xhr.send(photos)
})
$(document).on("click", "#endUploading", (e) => {
let table = document.querySelector("#photos")
let data = new FormData()
let arr = new Map();
for(el of table.querySelectorAll("tr#photo")) {
arr.set(el.dataset.id, el.querySelector("textarea").value)
}
data.append("photos", JSON.stringify(Object.fromEntries(arr)))
data.append("hash", u("meta[name=csrf]").attr("value"))
let xhr = new XMLHttpRequest()
// в самом вк на каждое изменение описания отправляется свой запрос, но тут мы экономим запросы
xhr.open("POST", "/photos/upload?act=finish&album="+document.getElementById("album").value)
xhr.onloadstart = () => {
e.currentTarget.setAttribute("disabled", "disabled")
}
xhr.onerror = () => {
MessageBox(tr("error"), tr("error_uploading_photo"), [tr("ok")], [() => {Function.noop}])
}
xhr.onload = () => {
let result = JSON.parse(xhr.responseText)
e.currentTarget.removeAttribute("disabled")
document.querySelector(".page_content tbody").innerHTML = ""
document.getElementById("endUploading").style.display = "none"
NewNotification(tr("photos_successfully_uploaded"), tr("click_to_go_to_album"), null, () => {window.location.assign(`/album${result.owner}_${result.album}`)})
}
xhr.send(data)
})
$(document).on("click", "#deletePhoto", (e) => {
let data = new FormData()
data.append("hash", u("meta[name=csrf]").attr("value"))
let xhr = new XMLHttpRequest()
xhr.open("POST", `/photo${e.currentTarget.dataset.owner}_${e.currentTarget.dataset.id}/delete`)
xhr.onloadstart = () => {
e.currentTarget.closest("tr#photo").classList.add("lagged")
}
xhr.onerror = () => {
MessageBox(tr("error"), tr("unknown_error"), [tr("ok")], [() => {Function.noop}])
}
xhr.onload = () => {
u(e.currentTarget.closest("tr#photo")).remove()
if(document.querySelectorAll("tr#photo").length < 1) {
document.getElementById("endUploading").style.display = "none"
}
}
xhr.send(data)
})