Lade...
 

CodeEditor

CodeEditor (WebWidget)

Der CodeEditor bietet die Möglichkeit an, Codeschnipsel unterschiedlicher Programmier- und Skriptsprachen zu bearbeiten und automatisch zu formatieren, um die Lesbarkeit des Codes zu erhöhen und eine produktive Code-Editierung und ein besseres Code-Verständnis zu ermöglichen. In Planung sind Features wie Fehlererkennung, automatische Korrektur und das Ausweiten der unterstützten Programmier- und Skriptsprachen.

Um dem CodeEditor mitzuteilen, welche Formatierungsregeln er anwenden muss, werden sogenannte Modi definiert, die eine oder mehrere Programmier- bzw. Skriptsprachen enthalten. In der Regel entspricht ein Modus einer einzigen Programmier- oder Skriptsprache, es gibt allerdings nicht selten Fälle, wo in einem Codeschnipsel mehrere Skript- und Programmiersprachen enthalten sind (CX_FORMULA mit InstantView-Code, HTML mit CSS und JavaScript, ... etc)
Das CodeEditor-WebWidget
Das CodeEditor-WebWidget

Verwendung

Web(codeEditor, APP("codeEditor.html"), 0, 0, 800, 600)

Abhängigkeiten

  • codeEditor.html
  • codeEditor-directive.js
  • standalone/codeEditor/

Nachrichtenschnittstelle

Bei der Richtungsbeschreibung wird das WebWidget in seine zwei Komponenten unterteilt. Das in HTML implementierte WebWidget, welches die Darstellungslogik und Nutzerinteraktion im Browser implementiert und das in InstantView implementierte WebWidget, welches die andere Seite mit den Daten aus ClassiX versorgt und es steuert.

Name Parameter Beschreibung
Push-Nachrichten (IV→HTML)
action Action Diese Nachricht übergibt ein Action-Objekt als CX_JSON_OBJECT ans WebWidget und führt dadurch eine Aktion am CodeEditor von InstantView aus, wie zum Beispiel das Formatieren des Codes oder die Rückgabe des aktuellen Textes im CodeEditor an InstantView. 
data Data Diese Nachricht übergibt ein Data-Objekt als CX_JSON_OBJECT ans WebWidget und legt den Wert des CodeEditors (den Quellcode) sowie weitere relevante Einstellungen fest.
Ereignisse (HTML→IV)
INITIALIZE_SOCKET - Die erste Nachricht, die das WebWidget schickt, sobald es sich initialisiert hat. Dies signalisiert die Bereitschaft des WebWidgets, Push-Nachrichten zu empfangen und zu verarbeiten.
SAVE_DATA_SOCKET String Wird als Antwort auf eine action-Nachricht mit der Aktion "saveData" gefeuert und enthält den aktuellen Text des CodeEditors als Wert.

 

Das Data-Objekt

Das Data-Objekt ist vom Typ CX_JSON_OBJECT und legt den Wert des CodeEditors (den Quellcode) sowie weitere relevante Einstellungen fest. 

Feld Typ Standardwert Beschreibung
text String "" Den zu editierenden und zu formatierenden Quellcode.
mode String "CX_FORMULA" Der Name des anzuwendenden Modus (die Skript- bzw. Programmiersprache(n), deren Formatierungs- und Validierungsregeln angewendet werden sollen). Aktuell werden folgende Modi unterstützt: "CX_FORMULA", InstantView", "clike" und "javascript"
format Boolean true Wenn auf false gesetzt, wird der übermittelte Code nicht automatisch formatiert, was ansonsten der Fall wäre.

 

Das Action-Objekt

Das Action-Objekt ist vom Typ CX_JSON_OBJECT und hat immer ein actionId-Feld, das einen String annimmt, der eine bestimmte Aktion repräsentiert. Je nach Aktion können weitere Parameter erforderlich sein.

Action-ID Parameter Beschreibung
"format" keine

Aktuellen Code formatieren

Formatiert den aktuellen Code im CodeEditor gemäß der Formatierungsregeln des ausgewählten Modus.
"saveData" keine

SaveData

Diese Aktion feuert die Nachricht SAVE_DATA_SOCKET zwecks der Vermittelung des (bearbeiteten) Quellcodes aus dem CodeEditor an ClassiX.

Hinweis: Nach dem Senden dieser Aktionsnachricht wartet das ClassiX-System nicht auf die Antwort, sondern arbeitet eventuelle weitere InstantView-Anweisungen weiter ab. Die Antwort-Nachricht SAVE_DATA_SOCKET mit dem Wert des CodeEditors kommt somit asynchron an. Wenn die weitere Abarbeitung der InstantView-Anweisungen von dem Wert des Code-Editors abhängig sein sollte, kann man den WaitOnInput-Mechanismus anwenden.