# j-CloudEditorSimple

> Είναι μια απλή εναλλακτική λύση στο j-CloudEditor. Μπορείτε να καθορίσετε την κύρια διαμόρφωση στην επιλογή, και η τιμή είναι {String} (στο j-CloudEditor είναι μέρος της διάταξης της αξίας).

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

Είναι μια απλή εναλλακτική λύση στο `j-CloudEditor`. Μπορείτε να καθορίσετε την κύρια διαμόρφωση στην επιλογή, και η τιμή είναι `{String}` (στο `j-CloudEditor` είναι μέρος της αξίας διαμόσχευσης).

- Λειτουργεί στο iframe
- Υποστήριξη πολλαπλών κούρδων (`shift + cmd + arrow-down/up`)
- Υποστηρίζει την εύρεση επιλεγμένου κειμένου (`cmd + d`)
- Υποστήριξη Custom Scrollbars
- Υποστηρίζει το diff tracker
- Υποστηρίζει ένα απλό plugin
- Υποστηρίζει τη συνεργασία σε πραγματικό χρόνο
- Κωδικός πηγής: <https://github.com/totaljs/editor>
- Χρησιμοποιεί τον εκδότη: [Κωδικός](https://codemirror.net/)
- Πολύ μικρός κώδικας

__ΕΠΙΤΡΟΦΗ__:

- `parent {String}` ένα επιλεκτικό για το κύριο δοχείο (προεπιλεγμένο: `auto`)
- Το `autosave {Number}` ανασυνδέει αυτόματα την τιμή από τον εκδότη στο μονοπάτι του συστατικού (σε δισεκατομμύρια δευτερόλεπτα, προεπιλογή: `500`)
- `event {String}` Ο δρόμος προς την `function(name, value)`
	- `click`
	- `errors`
	- `shortcut`
	- Το `cursor` περιέχει τη θέση του cursor
	- `change` περιέχει μερικές αλλαγές για τη συνεργασία σε πραγματικό χρόνο (`config.realtime` πρέπει να είναι `true`)
- `contextmenu {String}` Ο δρόμος προς την `function(opt)`
- Το `realtime {Boolean}` επιτρέπει την αποστολή αλλαγών σε πραγματικό χρόνο στη μέθοδο `event` (το όνομα του γεγονότος είναι `change`), προεπιλογή: `true`
- `keywords {String}` προσαρμοσμένες λέξεις-κλειδιά στη φόρμα για παράδειγμα `ID,PATH`
- `minheight {Number}` προαιρετική, ελάχιστη ύψος (προεπιλεγμένη: `0`)
- `margin {Number}` προαιρετική, κάθετη περιφέρεια (προεπιλεγμένη: `0`)
- `linenumbers {Boolean}` προαιρετικά, επιτρέπει αριθμούς γραμμής (προεπιλεγμένα: `true`)
- `type {String}` Εναλλακτική, τύπος περιεχομένου (επιλογή: `clientside`)
- __NEW__: `url {String}` προαιρετική, σύνδεση με τον εκδότη (προεπιλογή: `//cdn.componentator.com/editor/1.min.html`)

__Μέθοδος__:

- `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])` προσθέτει + τροποποιεί (με `from`) και αφαιρεί (χωρίς το επιχείρημα `from`)
- `component.change(changes)` για τη συνεργασία σε πραγματικό χρόνο (`changes` μπορεί να δημιουργηθεί στη λειτουργία `config.event`)
- Το `component.clear()` καθαρίζει όλες τις αλλαγές
- `component.replaceselections(selections)`
- `component.replaceselection(selection)`
- `component.replacerange(value, from, [to])`
- `component.command(cmd)` Εκτελέσεις `codemirror.execCommand()` Μέθοδος
- `component.exec(a, [b], [c])` Εκτελέσεις `document.execCommand(a, b, c)` Μέθοδος

__Σημαντικό__:

Τα επιχειρήματα `from`, `to`, `pos` πρέπει να είναι στη μορφή: `{ line: Number, ch: Number }`.

Χρησιμοποιήστε το με `<ui-component name="cloudeditorsimple">`Όταν το στοιχείο δεν έχει φορτωθεί ακόμα, jComponent Κατεβάστε το για πρώτη φορά από τη διεύθυνση `DEF.fallback` (Η Componentator Συγγραφέας: Peter Širka. πηγή: το Componentator Ετικέτες Αξιολόγηση, MIT άδεια.

```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>
```