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
88 lines (81 loc) • 5.21 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 */
"use strict";var n=Object.defineProperty;var s=(r,e,t)=>e in r?n(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t;var i=(r,e,t)=>s(r,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../components/LazyTableModal.cjs");class c{constructor(e,t,a={}){i(this,"editor");i(this,"table");this.editor=e,this.table=t}execute(){const e={url:this.table.getAttribute("data-lazy-url")||"",format:this.table.getAttribute("data-lazy-format")||"json",hasHeaders:this.table.getAttribute("data-lazy-headers")!=="false",delimiter:this.table.getAttribute("data-lazy-delimiter")||",",tableId:this.table.id||"",isEdit:!0,onSave:a=>this.updateTable(a)};new o.LazyTableModal(this.editor,document.createRange(),e).show()}updateTable(e){var d;e.url&&this.table.setAttribute("data-lazy-url",e.url),e.format&&this.table.setAttribute("data-lazy-format",e.format),e.delimiter&&this.table.setAttribute("data-lazy-delimiter",e.delimiter),e.hasHeaders!==void 0&&this.table.setAttribute("data-lazy-headers",String(e.hasHeaders)),e.tableId&&(this.table.id=e.tableId);const t=this.table.nextElementSibling;t&&t.tagName==="SCRIPT"&&t.remove();const a=document.createElement("script");a.type="text/javascript",a.textContent=this.generateLazyScript(this.table.id,{url:this.table.getAttribute("data-lazy-url")||"",format:this.table.getAttribute("data-lazy-format")||"json",hasHeaders:this.table.getAttribute("data-lazy-headers")!=="false",delimiter:this.table.getAttribute("data-lazy-delimiter")||","}),(d=this.table.parentNode)==null||d.insertBefore(a,this.table.nextSibling),setTimeout(()=>{const l=document.createElement("script");l.textContent=a.textContent,document.head.appendChild(l),document.head.removeChild(l)},100)}generateLazyScript(e,t){return`
(function() {
var table = document.getElementById('${e}');
if (!table) return;
var url = table.getAttribute('data-lazy-url');
var format = table.getAttribute('data-lazy-format');
var delimiter = table.getAttribute('data-lazy-delimiter') || ',';
var hasHeaders = table.getAttribute('data-lazy-headers') !== 'false';
function showLoading() {
table.innerHTML = '<div class="table-row"><div class="table-cell" style="text-align:center;padding:20px;">Загрузка данных...</div></div>';
}
function showError(msg) {
table.innerHTML = '<div class="table-row"><div class="table-cell" style="text-align:center;padding:20px;color:#e74c3c;">Ошибка загрузки: ' + msg + '</div></div>';
}
function parseCSV(csv, delimiter) {
var rows = csv.trim().split('\\n');
return rows.map(function(row) {
var result = [], current = '', inQuotes = false;
for (var i = 0; i < row.length; i++) {
var char = row[i];
if (char === '"') inQuotes = !inQuotes;
else if (char === delimiter && !inQuotes) { result.push(current.trim()); current = ''; }
else current += char;
}
result.push(current.trim());
return result;
});
}
function renderCSV(data, hasHeaders) {
table.innerHTML = '';
data.forEach(function(row, rowIndex) {
var rowDiv = document.createElement('div');
rowDiv.className = rowIndex === 0 && hasHeaders ? 'table-header-row' : 'table-row';
row.forEach(function(cellData) {
var cell = document.createElement('div');
cell.className = rowIndex === 0 && hasHeaders ? 'table-header-cell' : 'table-cell';
cell.textContent = cellData;
rowDiv.appendChild(cell);
});
table.appendChild(rowDiv);
});
}
function renderJSON(data) {
table.innerHTML = '';
if (!Array.isArray(data) || !data.length) {
table.innerHTML = '<div class="table-row"><div class="table-cell">Нет данных</div></div>';
return;
}
var headers = Object.keys(data[0]);
var headerRow = document.createElement('div');
headerRow.className = 'table-header-row';
headers.forEach(function(header) {
var cell = document.createElement('div');
cell.className = 'table-header-cell';
cell.textContent = header;
headerRow.appendChild(cell);
});
table.appendChild(headerRow);
data.forEach(function(row) {
var rowDiv = document.createElement('div');
rowDiv.className = 'table-row';
headers.forEach(function(header) {
var cell = document.createElement('div');
cell.className = 'table-cell';
cell.textContent = row[header] || '';
rowDiv.appendChild(cell);
});
table.appendChild(rowDiv);
});
}
showLoading();
fetch(url).then(function(resp) {
if (!resp.ok) throw new Error('HTTP ' + resp.status);
return format === 'json' ? resp.json() : resp.text();
}).then(function(data) {
if (format === 'json') renderJSON(data);
else renderCSV(parseCSV(data, delimiter), hasHeaders);
}).catch(function(e) { showError(e.message); });
})();
`}}exports.EditLazyTableCommand=c;