mirror of
https://git.imnavajas.es/jjimenez/safekat.git
synced 2025-07-25 22:52:08 +00:00
editorjs
This commit is contained in:
amazuecos
65
httpdocs/assets/js/safekat/pages/wiki/demo.js
Normal file
65
httpdocs/assets/js/safekat/pages/wiki/demo.js
Normal file
@ -0,0 +1,65 @@
|
||||
export const dataExample = {
|
||||
"time": 1739862579806,
|
||||
"blocks": [
|
||||
{
|
||||
"id": "uynEMELQjD",
|
||||
"type": "header",
|
||||
"data": {
|
||||
"text": "Presupuesto",
|
||||
"level": 1
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "5lBp4qELvp",
|
||||
"type": "header",
|
||||
"data": {
|
||||
"text": "Introducción",
|
||||
"level": 4
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "cf8xhN8Zo_",
|
||||
"type": "paragraph",
|
||||
"data": {
|
||||
"text": "\nLorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam lacinia\n diam ut tincidunt ornare. Suspendisse bibendum, velit ut mollis \nplacerat, tellus ante iaculis mi, ut luctus erat ligula sed est. Integer\n aliquam mauris eu diam tristique viverra. Proin id sem nisi. Praesent \ngravida tortor ac aliquam faucibus. Curabitur faucibus, magna vel \nconsectetur luctus, arcu diam iaculis lectus, posuere vehicula nisl \nnulla eget nibh.<b> Praesent tincidunt</b> enim condimentum interdum sodales. \nCurabitur eu diam sed mauris dignissim vestibulum eu quis justo. Nam \nornare odio id tincidunt aliquam. Quisque quis elit quis sem blandit \nimperdiet euismod non quam. Mauris maximus elit eu elementum consequat. \nSed nec cursus nibh. Nullam accumsan enim in tortor semper, in dapibus \nquam sagittis. In volutpat nisl libero, et pharetra dui luctus vitae. \nProin sit amet ornare mi. Sed vulputate ligula at elit posuere, non \nultrices risus ornare.\n"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "2SnovwX73t",
|
||||
"type": "header",
|
||||
"data": {
|
||||
"text": "Configuracion",
|
||||
"level": 4
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "Sz_mcM8_BZ",
|
||||
"type": "paragraph",
|
||||
"data": {
|
||||
"text": "\nFusce varius, erat vitae egestas elementum, ante turpis tincidunt erat, \nsit amet scelerisque massa nisl vel mauris. Cras eu condimentum magna, \nac finibus orci. Donec convallis sapien nulla, ac porta massa elementum \nsed. Nulla elit urna, ornare id quam ac, luctus commodo sem. Nam a \nsemper lectus. Sed eget ex varius, pretium ante ac, ultricies est. Sed \nut est leo. In velit lorem, vestibulum id sodales eu, vulputate et \nlectus. Mauris elementum lectus consequat cursus sollicitudin. Proin in \nsagittis turpis. Pellentesque ut pulvinar mi. Nullam nec purus vel enim \nconvallis rutrum. Pellentesque sem elit, fringilla quis accumsan quis, \nconvallis eu est. Nam malesuada nulla volutpat dui lobortis, vitae \nauctor turpis faucibus.\n"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "Alu9XBLH6v",
|
||||
"type": "paragraph",
|
||||
"data": {
|
||||
"text": "\nMaecenas sit amet iaculis diam. Aliquam sed feugiat neque. Proin et \npellentesque mi, et elementum risus. Sed volutpat, nibh quis finibus \nvenenatis, augue magna mollis est, vel efficitur nulla ligula et urna. \nVestibulum dictum molestie orci, vel pretium sapien fringilla eget. \nPellentesque fringilla facilisis congue. Proin bibendum dui non nisl \nornare rhoncus. Nam sit amet eros est. Integer luctus molestie lacus. \nPraesent elementum condimentum bibendum. Donec lacus nibh, sagittis in \ntempor nec, lacinia lacinia erat. Mauris pulvinar erat non nulla \npharetra dignissim. Quisque commodo dolor a neque lacinia porttitor. \nCras rhoncus ligula nibh.\n"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "DLkw7hyvB1",
|
||||
"type": "paragraph",
|
||||
"data": {
|
||||
"text": "\nPellentesque condimentum ullamcorper faucibus. Quisque vel enim et urna \nvenenatis faucibus at suscipit ipsum. Suspendisse nec nisi sit amet \ntortor suscipit volutpat ac eget mauris. Curabitur arcu arcu, vehicula \nin malesuada vitae, dapibus sit amet massa. Vivamus nec ex porttitor, \nvehicula nunc et, euismod velit. Maecenas dolor tortor, cursus quis \npurus ut, vulputate malesuada nunc. Morbi hendrerit auctor nisi. In \nfaucibus nibh sed quam suscipit lacinia. Cras placerat ornare lorem \nhendrerit blandit. Lorem ipsum dolor sit amet, consectetur adipiscing \nelit. Aliquam porttitor nisl ut arcu pretium, a sodales est iaculis. \nCras commodo sit amet tortor a rutrum. Mauris tristique magna nibh, quis\n bibendum tortor feugiat eget.\n"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "3Ph1J1DR_5",
|
||||
"type": "paragraph",
|
||||
"data": {
|
||||
"text": "\nPraesent iaculis tellus in quam rutrum ultrices. Phasellus ultricies \nlacus in neque volutpat iaculis. Aliquam at egestas tellus, vitae \nsollicitudin sapien. Sed commodo tellus ut ligula elementum iaculis. \nCurabitur sodales consequat dui, et tincidunt nunc vehicula vitae. \nSuspendisse aliquam justo a ante pellentesque ultrices ut in turpis. \nClass aptent taciti sociosqu ad litora torquent per conubia nostra, per \ninceptos himenaeos. Mauris scelerisque mattis tortor, in molestie neque \nbibendum a. Curabitur ut tempor erat. Donec aliquam scelerisque ipsum, \nbibendum placerat ante efficitur at. Sed malesuada, eros ut posuere \nvenenatis, leo est sagittis mi, at pretium augue tortor id ligula. Ut \negestas eget sapien a rhoncus. Ut lectus arcu, consequat posuere ipsum \nin, mollis iaculis augue.\n"
|
||||
}
|
||||
}
|
||||
],
|
||||
"version": "2.31.0-rc.8"
|
||||
}
|
||||
76
httpdocs/assets/js/safekat/pages/wiki/home.js
Normal file
76
httpdocs/assets/js/safekat/pages/wiki/home.js
Normal file
@ -0,0 +1,76 @@
|
||||
import { es } from './lang/es.js';
|
||||
import '../../../../../themes/vuexy/js/editorjs/list.js';
|
||||
import '../../../../../themes/vuexy/js/editorjs/header.js';
|
||||
import EditorJS from '../../../../../themes/vuexy/js/editorjs.mjs';
|
||||
import '../../../../../themes/vuexy/js/editorjs/alert.js';
|
||||
import '../../../../../themes/vuexy/js/editorjs/drag-drop.js';
|
||||
import '../../../../../themes/vuexy/js/editorjs/image.js';
|
||||
import { dataExample } from './demo.js';
|
||||
|
||||
|
||||
const editor = new EditorJS({
|
||||
holder : 'editorjs',
|
||||
i18n : es,
|
||||
autofocus: true,
|
||||
placeholder : 'Empieza a diseñar aquí',
|
||||
readOnly : true,
|
||||
tools: {
|
||||
header: {
|
||||
class: Header,
|
||||
config: {
|
||||
placeholder: 'Introduce un encabezado ...',
|
||||
levels: [1,2, 3,4],
|
||||
defaultLevel: 3
|
||||
},
|
||||
},
|
||||
list: {
|
||||
class: EditorjsList,
|
||||
inlineToolbar: true,
|
||||
config: {
|
||||
defaultStyle: 'unordered'
|
||||
},
|
||||
},
|
||||
alert: {
|
||||
class: Alert ,
|
||||
inlineToolbar: true,
|
||||
shortcut: 'CMD+SHIFT+W',
|
||||
config: {
|
||||
alertTypes: ['primary', 'secondary', 'info', 'success', 'warning', 'danger', 'light', 'dark'],
|
||||
defaultType: 'primary',
|
||||
messagePlaceholder: 'Introduzca texto',
|
||||
},
|
||||
},
|
||||
image: {
|
||||
class: ImageTool,
|
||||
config: {
|
||||
endpoints: {
|
||||
byFile: 'http://localhost:8008/uploadFile', // Your backend file uploader endpoint
|
||||
byUrl: 'http://localhost:8008/fetchUrl', // Your endpoint that provides uploading by Url
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
})
|
||||
try {
|
||||
await editor.isReady;
|
||||
new DragDrop(editor);
|
||||
editor.render(dataExample)
|
||||
/** Do anything you need after editor initialization */
|
||||
$('#save-editor').on('click',() => {
|
||||
editor.save().then(outputData => {
|
||||
console.log("Data saved",outputData)
|
||||
})
|
||||
})
|
||||
$('#preview-editor').on('click',() => {
|
||||
editor.readOnly.toggle()
|
||||
$('#edit-editor').removeClass('d-none')
|
||||
$('#preview-editor').addClass('d-none')
|
||||
})
|
||||
$('#edit-editor').on('click',() => {
|
||||
$('#edit-editor').addClass('d-none')
|
||||
$('#preview-editor').removeClass('d-none')
|
||||
editor.readOnly.toggle()
|
||||
})
|
||||
} catch (reason) {
|
||||
console.log(`Editor.js initialization failed because of ${reason}`)
|
||||
}
|
||||
136
httpdocs/assets/js/safekat/pages/wiki/lang/es.js
Normal file
136
httpdocs/assets/js/safekat/pages/wiki/lang/es.js
Normal file
@ -0,0 +1,136 @@
|
||||
export const es = {
|
||||
|
||||
messages: {
|
||||
/**
|
||||
* Other below: translation of different UI components of the editor.js core
|
||||
*/
|
||||
ui: {
|
||||
"blockTunes": {
|
||||
"toggler": {
|
||||
"Click to tune": "Click para editar",
|
||||
"or drag to move": "o arrastra para editar",
|
||||
"Filter" : "Filtrar"
|
||||
},
|
||||
"filter" : {
|
||||
"Filter" : "Filtrar"
|
||||
}
|
||||
},
|
||||
"inlineToolbar": {
|
||||
"converter": {
|
||||
"Convert to": "Convertir a",
|
||||
"Filter" : "Filtrar"
|
||||
|
||||
},
|
||||
|
||||
},
|
||||
"toolbar": {
|
||||
"toolbox": {
|
||||
"Add": "Añadir",
|
||||
"Filter" : "Filtrar"
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Section for translation Tool Names: both block and inline tools
|
||||
*/
|
||||
toolNames: {
|
||||
"Text": "Texto",
|
||||
"Heading": "Encabezado",
|
||||
"List": "Lista",
|
||||
"Unordered List": "Lista",
|
||||
"Ordered List" : "Enumeración",
|
||||
"Warning": "Advertencia",
|
||||
"Checklist": "Checklist",
|
||||
"Quote": "Cita",
|
||||
"Code": "Codigo",
|
||||
"Delimiter": "Delimitador",
|
||||
"Raw HTML": "Raw HTML",
|
||||
"Table": "Tabla",
|
||||
"Link": "Enlace",
|
||||
"Marker": "Subrayar",
|
||||
"Bold": "Negrita",
|
||||
"Italic": "Cursiva",
|
||||
"InlineCode": "Código",
|
||||
"Image" : "Imagen",
|
||||
"Alert" : "Alerta",
|
||||
"Convert to" : "Convertir a"
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Section for passing translations to the external tools classes
|
||||
*/
|
||||
tools: {
|
||||
/**
|
||||
* Each subsection is the i18n dictionary that will be passed to the corresponded plugin
|
||||
* The name of a plugin should be equal the name you specify in the 'tool' section for that plugin
|
||||
*/
|
||||
"warning": { // <-- 'Warning' tool will accept this dictionary section
|
||||
"Title": "Titulo",
|
||||
"Message": "Mensaje",
|
||||
},
|
||||
"list" : {
|
||||
"Start with" : "Empezar con",
|
||||
"Unordered": "Sin orden",
|
||||
"Ordered" : "Ordenada",
|
||||
"Counter type" : "Contador",
|
||||
"Convert to" : "Convertir a"
|
||||
},
|
||||
/**
|
||||
* Link is the internal Inline Tool
|
||||
*/
|
||||
"link": {
|
||||
"Add a link": "Añadir un enlace"
|
||||
},
|
||||
/**
|
||||
* The "stub" is an internal block tool, used to fit blocks that does not have the corresponded plugin
|
||||
*/
|
||||
"stub": {
|
||||
'The block can not be displayed correctly.': 'El bloque no puede ser mostrado correctamente'
|
||||
},
|
||||
"alert" : {
|
||||
"Primary" : "Color primario",
|
||||
"Secondary" : "Color secundario",
|
||||
"Info" : "Info",
|
||||
"Success" : "Éxito",
|
||||
"Warning" : "Advertencia",
|
||||
"Danger" : "Peligro",
|
||||
"Light" : "Ligero",
|
||||
"Left" : "Izquierda",
|
||||
"Right" :"Derecha",
|
||||
"Dark" : "Oscuro",
|
||||
"Center" : "Centrar"
|
||||
},
|
||||
"image": {
|
||||
"With border" : "Con borde",
|
||||
"Stretch image" : "Estirar imagen",
|
||||
"With background" : "Añadir fondo",
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Section allows to translate Block Tunes
|
||||
*/
|
||||
blockTunes: {
|
||||
/**
|
||||
* Each subsection is the i18n dictionary that will be passed to the corresponded Block Tune plugin
|
||||
* The name of a plugin should be equal the name you specify in the 'tunes' section for that plugin
|
||||
*
|
||||
* Also, there are few internal block tunes: "delete", "moveUp" and "moveDown"
|
||||
*/
|
||||
|
||||
"delete": {
|
||||
"Delete": "Eliminar",
|
||||
"Click to delete" : "Click para eliminar"
|
||||
},
|
||||
"moveUp": {
|
||||
"Move up": "Mover hacia arriba"
|
||||
},
|
||||
"moveDown": {
|
||||
"Move down": "Mover hacia abajo"
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user