# j-CloudEditorSimple

> Je to jednoduchá alternativa k j-CloudEditorMůžete určit hlavní konfigurace v konfiguraci a hodnota je {String} (v j-CloudEditor Je to součást hodnoty).

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: cs
Content-SHA256: e2f0e9e61db516028b00b82d0372bcf0fc5db8671cc4441a1a2d25b3803ff37b
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Je to jednoduchá alternativa k `j-CloudEditor`Můžete určit hlavní konfigurace v konfiguraci a hodnota je `{String}` (v případě `j-CloudEditor` Je to součást hodnoty).

- A to funguje v Iframu.
- Podporuje více kurzorů (`shift + cmd + arrow-down/up`)
- Podporuje nalezení vybraného textu (`cmd + d`)
- Podporuje custom scrollbars
- Podporuje diff tracker
- Podporuje jednoduchý emmet plugin
- Podporuje spolupráci v reálném čase
- zdrojový kód: <https://github.com/totaljs/editor>
- Používá se redakce: [Kódový zrcadlo](https://codemirror.net/)
- Velmi malý kód

__Konfigurace__:

- `parent {String}` Výběr hlavního kontejneru (default): `auto`)
- `autosave {Number}` automaticky přidává hodnotu z editoru na cestu komponentu (v milisekundách, v předvolebním nastavení: `500`)
- `event {String}` je cesta k `function(name, value)`
	- `click`
	- `errors`
	- `shortcut`
	- `cursor` obsahuje kurzorovou pozici
	- `change` obsahuje částečné změny pro spolupráci v reálném čase (`config.realtime` musí být `true`)
- `contextmenu {String}` je cesta k `function(opt)`
- `realtime {Boolean}` umožňuje v reálném čase odesílání změn na metodu `event` (jméno události je `change`), dle předvolby: `true`
- Klíčové slovo `keywords {String}` ve formě např. `ID,PATH`
- `minheight {Number}` volitelné, minimální výška (default: `0`)
- `margin {Number}` volitelný, vertikální (default: `0`)
- `linenumbers {Boolean}` volitelné, povolené číslicové čísla (předvolené: `true`)
- `type {String}` volitelný, obsahový typ (předvolený: `clientside`)
- __NEW__: `url {String}` volitelné, odkaz na editor (podmínkou: `//cdn.componentator.com/editor/1.min.html`)

__Metoda__:

- `component.insert('some text')`
- `component.replace('text', 'newvalue')`
- `component.search('text', callback(output))`
- `component.select(from, [to])`
- `component.goto(pos)`
- `component.focus()`
- `component.save(callback(value))`
- `component.marker(name, [from], [to], [color])` přidává + modifikuje (s `from`) a odstraňuje (bez argumentu `from`)
- `component.change(changes)` pro spolupráci v reálném čase (`changes` může být generován ve funkci `config.event`)
- `component.clear()` vyčistí všechny změny
- `component.replaceselections(selections)`
- `component.replaceselection(selection)`
- `component.replacerange(value, from, [to])`
- `component.command(cmd)` Exekuce `codemirror.execCommand()` Metoda
- `component.exec(a, [b], [c])` Exekuce `document.execCommand(a, b, c)` Metoda

__Důležité__:

Argumenty `from`, `to`, `pos` musí být ve formě: `{ line: Number, ch: Number }`.

Použijte ji s `<ui-component name="cloudeditorsimple">`Pokud je součástka ještě nezačleněna, jComponent Stáhnout ji na první použití z adresy `DEF.fallback` a) The Componentator CDN dle předvolby. autor: Peter Širka. zdroj: Componentator Výrobce je autorizován, MIT licence.

```html example.html
<ui-component name="LAZY menu"></ui-component>

<div style="width:600px;height:200px;border:1px solid #E0E0E0">
	<ui-component name="cloudeditorsimple" path="editorbody" config="contextmenu:editor_contextmenu;realtime:1"></ui-component>
</div>
<div class="clearfix"></div>

<script>

	var editorbody = '\n\n<h1>HELLO WORLD</h1>\n\n';

	function editor_contextmenu(obj) {
		var opt = {};
		opt.x = obj.x;
		opt.y = obj.y;
		opt.items = [];
		opt.items.push({ id: '1', name: 'Test item 1' });
		opt.items.push({ id: '2', name: 'Test item 2' });
		opt.items.push({ id: '3', name: 'Test item 3' });
		opt.items.push({ id: '4', name: 'Test item 4' });
		opt.callback = function(selected) {
			console.log(selected);
		};
		SETTER('menu/show', opt);
	}

</script>
```