let MaterialEditor = (function () {
let module = {};
let __CreateNewsButton = document.querySelector("#CreateNewsButton");
if (__CreateNewsButton) {
__CreateNewsButton.onclick = openModal;
}
let __CreateNoticeButton = document.querySelector("#CreateNoticeButton");
if (__CreateNoticeButton) {
__CreateNoticeButton.onclick = openModal;
}
let __CreateMaterialButton = document.querySelector("#CreateMaterialButton");
if (__CreateMaterialButton) {
__CreateMaterialButton.onclick = openModal;
}
let __CurrentCategory = undefined;
function dataURIToBlob(dataURI) {
const splitDataURI = dataURI.split(",");
const byteString = splitDataURI[0].indexOf("base64") >= 0 ? atob(splitDataURI[1]) : decodeURI(splitDataURI[1]);
const mimeString = splitDataURI[0].split(":")[1].split(";")[0];
const ia = new Uint8Array(byteString.length);
for (let i = 0; i < byteString.length; i++) ia[i] = byteString.charCodeAt(i);
return new Blob([ia], { type: mimeString });
}
/**
* Собрать все данные и отправить на БД
*
* @param {HTMLInputElement} caption
* @param {HTMLInputElement} link
* @param {HTMLDivElement} content
* @param {HTMLDivElement} images
* @param {HTMLInputElement} file
*/
function create(caption, link, content, images, file) {
if (!caption || !link || !content || !images) {
Messenger.Show("Некоторые элементы не были найдены, невозможно создать новость!");
return;
}
if (caption.value.length == 0) {
Messenger.Show("Необходимо заполнить заголовок!");
return;
}
if (link.value.length == 0) {
link.value = Main.GenerateHash256();
}
let preview = {
Valid: true,
String: "",
};
var date = new Date();
let m = ("00" + (date.getMonth() + 1)).slice(-2);
let d = ("00" + date.getDate()).slice(-2);
var imageFullpath = "image/" + __CurrentCategory + "/" + date.getUTCFullYear().toString() + "-" + m + "-" + d + "/";
var thumbFullpath = "thumb/" + __CurrentCategory + "/" + date.getUTCFullYear().toString() + "-" + m + "-" + m + "/";
let data = new FormData();
let contentHtml = "";
for (const c of content.blocks) {
switch (c.type) {
case "paragraph":
contentHtml += "
" + c.data.text + "
";
preview.String += c.data.text;
break;
case "header":
contentHtml += "" + c.data.text + "/h" + c.data.level + ">";
preview.String += c.data.text;
break;
case "list":
if (c.data.style === "ordered") {
contentHtml += "";
for (const li of c.data.items) {
contentHtml += "- " + li + "
";
preview.String += li;
}
contentHtml += "
";
} else {
contentHtml += "";
for (const li of c.data.items) {
contentHtml += "- " + li + "
";
preview.String += li;
}
contentHtml += "
";
}
break;
case "delimiter":
contentHtml += "
";
break;
case "table":
contentHtml += "";
for (const row of c.data.content) {
contentHtml += "";
for (const col of row) {
contentHtml += "" + col + " | ";
preview.String += col;
}
contentHtml += "
";
}
contentHtml += "
";
break;
case "image":
let filename = Main.GenerateHashDashed(2) + "." + c.data.url.slice(11, c.data.url.indexOf(";"));
contentHtml +=
'';
let div = document.createElement("div");
div.innerHTML = c.data.caption;
if (div.textContent.length > 0) {
contentHtml += '' + c.data.caption + "
";
}
data.append("Files", dataURIToBlob(c.data.url), filename);
break;
}
}
let clearTags = document.createElement("div");
clearTags.innerHTML = preview.String;
preview.String = clearTags.textContent;
if (preview.String.length > 260) {
preview.String = preview.String.slice(0, 260);
}
let selectedImage = {
Valid: false,
String: "",
};
if (__CurrentCategory != MATERIAL_CATEGORY.MATERIAL) {
let selectedImageName = ";";
let selectedInput = images.querySelector("input:checked");
if (selectedInput) {
let img = selectedInput.closest(".image").querySelector("img");
if (img) {
selectedImageName = img.alt;
selectedImage.String = thumbFullpath + selectedImageName.toLowerCase();
selectedImage.Valid = true;
}
}
if (file.files.length > 0) {
if (__CurrentCategory != MATERIAL_CATEGORY.NOTICE) {
contentHtml += '';
}
for (const f of file.files) {
let filename = f.name.toLowerCase();
filename = Main.GenerateHashDashed(2) + filename.slice(filename.lastIndexOf("."));
if (selectedImageName === f.name) {
selectedImage.String = thumbFullpath + filename;
}
if (__CurrentCategory != MATERIAL_CATEGORY.NOTICE) {
contentHtml +=
'
';
}
data.append("Files", f, filename);
}
if (__CurrentCategory != MATERIAL_CATEGORY.NOTICE) {
contentHtml += "
";
}
}
}
data.set("Caption", caption.value);
data.set("Link", link.value);
data.set("Content", contentHtml);
data.set("Source", JSON.stringify(content));
data.set("PreviewValid", preview.Valid);
data.set("PreviewString", preview.String);
data.set("ImageValid", selectedImage.Valid);
data.set("ImageString", selectedImage.String);
data.set("ImagePath", imageFullpath);
data.set("ThumbPath", thumbFullpath);
let closeModal = this.closest(".modal").querySelector(".close");
XHR.POST(
function (result) {
if (result && "Error" in result) {
if (result.Error === null) {
Messenger.Show(__CurrentCategory + " успешно добавлена");
closeModal.click();
} else {
Messenger.Show("Возникла ошибка добавления новости." + result.Error);
}
}
},
"/material-insert/" + __CurrentCategory,
data,
null,
true,
true
);
}
/**
* Создать модальное окно для добавления новости
*/
function openModal() {
switch (this.dataset.category) {
case MATERIAL_CATEGORY.MATERIAL:
__CurrentCategory = MATERIAL_CATEGORY.MATERIAL;
break;
case MATERIAL_CATEGORY.NEWS:
__CurrentCategory = MATERIAL_CATEGORY.NEWS;
break;
case MATERIAL_CATEGORY.NOTICE:
__CurrentCategory = MATERIAL_CATEGORY.NOTICE;
break;
default:
return;
}
let body = document.createElement("div"),
inputCaption = document.createElement("input"),
inputLink = document.createElement("input"),
contentBlock = document.createElement("div"),
previewBlock = document.createElement("div"),
preview = document.createElement("div"),
label = document.createElement("label"),
file = document.createElement("input"),
fileButton = document.createElement("div"),
buttonSend = document.createElement("button");
label.append(file, fileButton);
label.className = "select-file";
fileButton.className = "button";
fileButton.textContent = "Выбрать изображениия";
file.type = "file";
if (__CurrentCategory === MATERIAL_CATEGORY.NOTICE) {
file.multiple = false;
} else {
file.multiple = true;
}
file.accept = "image/*";
file.onchange = changeImages;
inputCaption.type = "text";
inputCaption.placeholder = "Заголовок/название (обязательно)";
inputLink.type = "text";
inputLink.placeholder = "Ссылка на " + __CurrentCategory + " (не обязательно)";
buttonSend.textContent = "Создать";
// buttonSend.onclick = create.bind(buttonSend, inputCaption, inputLink, contentBlock, preview, file);
preview.className = "preview-images";
contentBlock.id = "editorjs";
contentBlock.className = "content-editor";
// contentBlock.append(createManipulator());
if (__CurrentCategory !== MATERIAL_CATEGORY.MATERIAL) {
body.append(inputCaption, inputLink, contentBlock, previewBlock, label, preview, buttonSend);
} else {
body.append(inputCaption, inputLink, contentBlock, previewBlock, buttonSend);
}
let tools = {
header: {
class: Header,
inlineToolbar: true,
config: {
placeholder: "Заголовок",
},
shortcut: "CMD+SHIFT+H",
},
list: {
class: List,
inlineToolbar: true,
shortcut: "CMD+SHIFT+L",
},
// quote: {
// class: Quote,
// inlineToolbar: true,
// config: {
// quotePlaceholder: "Введите цитату",
// captionPlaceholder: "Автор цитаты",
// },
// shortcut: "CMD+SHIFT+O",
// },
marker: {
class: Marker,
shortcut: "CMD+SHIFT+M",
},
delimiter: Delimiter,
inlineCode: {
class: InlineCode,
shortcut: "CMD+SHIFT+C",
},
linkTool: LinkTool,
table: {
class: Table,
inlineToolbar: true,
shortcut: "CMD+ALT+T",
},
onReady: function () {
console.log("ready");
},
onChange: function () {
console.log("changed");
},
};
if (__CurrentCategory === MATERIAL_CATEGORY.MATERIAL) {
tools.image = {
class: SimpleImage,
inlineCode: true,
};
tools.embed = {
class: Embed,
inlineToolbar: false,
config: {
services: {
youtube: true,
},
},
};
}
const editor = new EditorJS({
holderOd: "editorjs",
tools: tools,
data: null,
});
buttonSend.addEventListener("click", function () {
editor.save().then((savedData) => {
create.call(buttonSend, inputCaption, inputLink, savedData, preview, file);
});
});
Modal.Create("Создать " + __CurrentCategory, body);
}
/**
* Функция выбора файлов изображения для новости
*/
function changeImages() {
let preview = document.querySelector(".preview-images");
if (!preview) {
console.warn("Элемент [.preview-images] не найжен");
return;
}
for (const file of this.files) {
/**
* 1. Контейнер под изображение
*/
let div = document.createElement("div");
div.className = "image";
/**
* 2. Создать элемент для изображения
*/
let img = document.createElement("img");
img.src = window.URL.createObjectURL(file);
img.alt = file.name;
img.height = 100;
/**
* 3. Создать label
*/
let label = document.createElement("label");
/**
* 4. Создать input + span
*/
let input = document.createElement("input");
input.type = "radio";
input.dataset.image = file.name;
input.name = "preview-images";
let span = document.createElement("span");
div.append(img, label);
label.append(input, span);
preview.append(div);
}
let firstImage = preview.querySelector("input");
firstImage.click();
}
return module;
})();