# j-Code

> È un'alternativa semplice al j-CloudEditor. Puoi specificare la configurazione principale nella configurazione, e il valore è {String} (in j-CloudEditor la configuration fa parte del valore).

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

È una semplice alternativa a `j-CloudEditor`Puoi specificare la configurazione principale nella configurazione, e il valore è `{String}` (in `j-CloudEditor` è la configurazione parte di valore). è lo stesso componente come `j-CloudEditorSimple`.

- Funziona in iframe
- Supporta i multi-cursori (`shift + cmd + arrow-down/up`)
- Supporta la ricerca del testo selezionato (`cmd + d`)
- Supporto per scrollbars
- Supporto di diff tracker
- Supporta un semplice emmet plugin
- Supporta la collaborazione in tempo reale
- Codice di sorgente: <https://github.com/totaljs/editor>
- Utilizza l’editore: [Il codice](https://codemirror.net/)
- Il codice molto piccolo

__Configurazione__:

- `parent {String}` un selettore per il contenitore principale (default: `auto`)
- `autosave {Number}` rimbone automaticamente il valore dall'editore al percorso del componente (in millisecondi, predefinito: `500`)
- `event {String}` un cammino verso il `function(obj)`
	- `obj.type {String}`
		- `click`
		- `errors`
		- `shortcut`
		- `cursor` contiene la posizione del cursore
		- `change` contiene modifiche parziali per la collaborazione in tempo reale (`config.realtime` deve essere `true`)
	- `obj.instance {Editor}`
- `contextmenu {String}` un cammino verso il `function(opt)`
- `realtime {Boolean}` consente di inviare cambiamenti in tempo reale al metodo `event` (nome dell'evento è `change`), predefinito: `true`
- `keywords {String}` Le parole chiave in forma di e.g. `ID,PATH`
- `minheight {Number}` opzionale, altezza minima (default: `0`)
- `margin {Number}` opzionale, una margine verticale (default: `0`)
- `linenumbers {Boolean}` opzionale, consentono i numeri di linea (default: `true`)
- `type {String}` opzionale, tipo di contenuto (default: `clientside`)
- `url {String}` opzionale, un collegamento all'editore (default: `//cdn.componentator.com/editor/1.min.html`)
- __NEW__: `lint {Boolean}` opzionale, permette lente (default: `true`)

__Metodo__:

- `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])` aggiunge + modifiche (con `from`) e rimuove (senza argomento `from`)
- `component.change(changes)` per la collaborazione in tempo reale (`changes` può essere generato nella funzione `config.event`)
- `component.clear()` chiarisce tutti i cambiamenti
- `component.replaceselections(selections)`
- `component.replaceselection(selection)`
- `component.replacerange(value, from, [to])`
- Il metodo `component.command(cmd)` esegue il metodo `codemirror.execCommand()`
- Il metodo `component.exec(a, [b], [c])` esegue il metodo `document.execCommand(a, b, c)`
- __NEW__: `component.setoption(name, value)` invia il comando `setOption` al CodeMirror

__Importante__:

Gli argomenti `from`, `to`, `pos` devono essere nella forma: `{ line: Number, ch: Number }`.

Utilizzare con `<ui-component name="code">`Quando il componente non è ancora caricato, jComponent Scarica il codice in prima utilizzazione dall'indirizzo `DEF.fallback` (Il Componentator La storia di Peter Širka.Fonte: il Componentator Ristorante dei componenti, licenza MIT.

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

<div style="width:600px;height:200px;border:1px solid #E0E0E0">
	<ui-component name="code" path="editorbody" config="contextmenu:editor_contextmenu"></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>
```
