j-Code

Jest to prosta alternatywa dla j-CloudEditorMożesz określić główną konfigurację w konfiguracji, a wartość jest {String} (w j-CloudEditor jest częścią wartości konfiguracji). jest to ten sam składnik, który j-CloudEditorSimple.

• Działa w IFRAM
• Wsparcie dla wielu kursorów (shift + cmd + arrow-down/up)
• obsługuje znalezienie wybranego tekstu (cmd + d)
• Wsparcie dla custom scrollbars
• Wsparcie dla DIF TRACKER
• Wspiera prosty emmet plugin
• Wspieranie współpracy w czasie rzeczywistym
• Kod źródłowy: https://github.com/totaljs/editor
• Wykorzystuje to redaktor: Kodek Mirror
• Bardzo mały kod

Konfiguracja:

• parent {String} - selektor dla głównego pojemnika (default: auto)
• autosave {Number} automatycznie przywiązuje wartość z edytora do ścieżki komponentu (w milisekundach, wstępnie: 500)
• event {String} - droga do function(obj)
  • obj.type {String}
    • click
    • errors
    • shortcut
    • cursor zawiera pozycję kursora
    • change zawiera częściowe zmiany współpracy w czasie rzeczywistym (config.realtime musi być true)
  • obj.instance {Editor}
• contextmenu {String} - droga do function(opt)
• realtime {Boolean} umożliwia wysyłanie zmian w czasie rzeczywistym do metody event (nazwa zdarzenia jest change), domyślnie: true
• keywords {String} Słowa kluczowe w formie e.g. ID,PATH
• minheight {Number} opcjonalny, minimalna wysokość (default: 0)
• margin {Number} opcjonalny, margina pionowa (default: 0)
• linenumbers {Boolean} opcjonalny, umożliwia liczbę linii (default: true)
• type {String} Opcjonalny typ treści (default content): clientside)
• url {String} opcjonalny, link do edytora (default: //cdn.componentator.com/editor/1.min.html)
• NEW: lint {Boolean} opcjonalny, umożliwia łańcuch (default: true)

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]) dodaje + modyfikuje (z from) i usuwa (bez argumentu from) marker
• component.change(changes) dla współpracy w czasie rzeczywistym (changes może być generowany w funkcji config.event)
• component.clear() oczyszcza wszystkie zmiany
• component.replaceselections(selections)
• component.replaceselection(selection)
• component.replacerange(value, from, [to])
• component.command(cmd) egzekucja codemirror.execCommand() Metoda
• component.exec(a, [b], [c]) egzekucja document.execCommand(a, b, c) Metoda
• NEW: component.setoption(name, value) wysyła polecenie setOption do CodeMirror

Ważne:

Artykuły from, to, pos muszą być w formie: { line: Number, ch: Number }.

Użyj go z <ui-component name="code">Gdy element nie jest jeszcze ładowany, jComponent Pobierz go po pierwszym użyciu z adresu DEF.fallback (Wydaje się Componentator Autor: Peter Širka Źródło: Componentator Zestaw składników, licencja MIT.

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