on-codemerge
Version:
A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product
172 lines (171 loc) • 6.4 kB
JavaScript
/*! on-codemerge v1.3.1 @author Pavel Kuzmin @license MIT @homepage https://s00d.github.io/on-codemerge/ @repository git+https://github.com/s00d/on-codemerge.git Copyright (c) 2026 Pavel Kuzmin - Built on 2026-07-02T13:39:17.947Z */
class u {
/**
* Экспорт таблицы в CSV формат
*/
exportToCSV(l, n = { format: "csv" }) {
const t = Array.from(l.querySelectorAll(".table-header-row, .table-row")), r = n.delimiter || ",", o = n.includeHeaders !== !1, e = [];
return t.forEach((a, c) => {
if (!o && c === 0 && l.querySelector(".table-header-row"))
return;
const i = Array.from(a.querySelectorAll(".table-header-cell, .table-cell")).map((m) => {
let s = m.textContent || "";
return (s.includes(r) || s.includes('"') || s.includes(`
`)) && (s = s.replace(/"/g, '""'), s = `"${s}"`), s;
});
e.push(i.join(r));
}), e.join(`
`);
}
/**
* Экспорт таблицы в JSON формат
*/
exportToJSON(l, n = { format: "json" }) {
const t = n.includeHeaders !== !1, r = [], o = [];
if (t && l.querySelector(".table-header-row")) {
const a = l.querySelector(".table-header-row");
if (a) {
const c = a.querySelectorAll(".table-header-cell");
r.push(...Array.from(c).map((d) => d.textContent || ""));
}
}
return l.querySelectorAll(".table-row").forEach((a) => {
const c = Array.from(a.querySelectorAll(".table-cell")), d = {};
c.forEach((i, m) => {
const s = r[m] || `column_${m + 1}`;
d[s] = i.textContent || "";
}), o.push(d);
}), JSON.stringify(o, null, 2);
}
/**
* Экспорт таблицы в HTML формат
*/
exportToHTML(l, n = { format: "html" }) {
const t = l.cloneNode(!0);
return t.style.display = "table", t.style.borderCollapse = "collapse", t.style.width = "100%", t.style.border = "1px solid #ddd", t.querySelectorAll(".table-cell, .table-header-cell").forEach((e) => {
e instanceof HTMLElement && (e.style.display = "table-cell", e.style.border = "1px solid #ddd", e.style.padding = "8px", e.style.textAlign = "left");
}), t.querySelectorAll(".table-header-cell").forEach((e) => {
e instanceof HTMLElement && (e.style.backgroundColor = "#f2f2f2", e.style.fontWeight = "bold");
}), t.outerHTML;
}
/**
* Экспорт таблицы в Excel-совместимый формат (HTML с расширенными стилями)
*/
exportToExcel(l, n = { format: "excel" }) {
return `
<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta charset="UTF-8">
<style>
table { border-collapse: collapse; width: 100%; }
td, th { border: 1px solid #000; padding: 8px; text-align: left; }
th { background-color: #f2f2f2; font-weight: bold; }
.number { mso-number-format: "0.00"; }
.date { mso-number-format: "dd/mm/yyyy"; }
</style>
</head>
<body>
${l.cloneNode(!0).outerHTML}
</body>
</html>
`;
}
/**
* Импорт CSV в таблицу
*/
importFromCSV(l, n = { format: "csv" }) {
const t = document.createElement("div");
t.className = "html-editor-table table-modern";
const r = n.delimiter || ",", o = n.hasHeaders !== !1;
return l.trim().split(`
`).forEach((a, c) => {
const d = document.createElement("div");
d.className = c === 0 && o ? "table-header-row" : "table-row", this.parseCSVRow(a, r).forEach((m) => {
const s = document.createElement("div");
s.className = c === 0 && o ? "table-header-cell" : "table-cell", s.textContent = m, s.contentEditable = "true", d.appendChild(s);
}), t.appendChild(d);
}), t;
}
/**
* Импорт JSON в таблицу
*/
importFromJSON(l, n = { format: "json" }) {
const t = document.createElement("div");
t.className = "html-editor-table table-modern";
try {
const r = JSON.parse(l);
if (!Array.isArray(r) || r.length === 0)
throw new Error("Invalid JSON data format");
const o = Object.keys(r[0]), e = document.createElement("div");
e.className = "table-header-row", o.forEach((a) => {
const c = document.createElement("div");
c.className = "table-header-cell", c.textContent = a, e.appendChild(c);
}), t.appendChild(e), r.forEach((a) => {
const c = document.createElement("div");
c.className = "table-row", o.forEach((d) => {
const i = document.createElement("div");
i.className = "table-cell", i.textContent = a[d] || "", i.contentEditable = "true", c.appendChild(i);
}), t.appendChild(c);
});
} catch (r) {
throw console.error("Error parsing JSON:", r), new Error("Invalid JSON format");
}
return t;
}
/**
* Скачивание файла
*/
downloadFile(l, n, t) {
const r = new Blob([l], { type: t }), o = URL.createObjectURL(r), e = document.createElement("a");
e.href = o, e.download = n, document.body.appendChild(e), e.click(), document.body.removeChild(e), URL.revokeObjectURL(o);
}
/**
* Парсинг CSV строки с учетом кавычек
*/
parseCSVRow(l, n) {
const t = [];
let r = "", o = !1;
for (let e = 0; e < l.length; e++) {
const a = l[e];
a === '"' ? o && l[e + 1] === '"' ? (r += '"', e++) : o = !o : a === n && !o ? (t.push(r), r = "") : r += a;
}
return t.push(r), t;
}
/**
* Получение MIME типа для формата
*/
getMimeType(l) {
switch (l) {
case "csv":
return "text/csv";
case "json":
return "application/json";
case "html":
return "text/html";
case "excel":
return "application/vnd.ms-excel";
default:
return "text/plain";
}
}
/**
* Получение расширения файла для формата
*/
getFileExtension(l) {
switch (l) {
case "csv":
return ".csv";
case "json":
return ".json";
case "html":
return ".html";
case "excel":
return ".xls";
default:
return ".txt";
}
}
}
export {
u as TableExportService
};