Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen RevisionVorhergehende Überarbeitung
Nächste Überarbeitung		Vorhergehende Überarbeitung
visualizer:3d-sets [2024/01/25 13:27] – [Attributwert-Änderungen] juliavisualizer:3d-sets [2025/03/07 08:36] (aktuell) – [Parameter der neo-code-Komponente] adminwiki
Zeile 1: Zeile 1:
 ===== 3D-Sets ===== ===== 3D-Sets =====
 +
 +{{INLINETOC 3}}
 +
 3D-Sets sind Code-Elemente, die anstelle von 3D-Objekten in die Szene eingefügt werden können. Sie werden verwendet, wenn komplexe zusammengesetzte Elemente, die eine Einheit bilden und wie ein einzelnes Modell reagieren sollen, gewünscht sind. 3D-Sets können Interaktionselemente, Animationen und Audio-Clips enthalten. Zudem können 3D-Sets auch mit anderen Elementen in einer Szene interagieren. 3D-Sets sind Code-Elemente, die anstelle von 3D-Objekten in die Szene eingefügt werden können. Sie werden verwendet, wenn komplexe zusammengesetzte Elemente, die eine Einheit bilden und wie ein einzelnes Modell reagieren sollen, gewünscht sind. 3D-Sets können Interaktionselemente, Animationen und Audio-Clips enthalten. Zudem können 3D-Sets auch mit anderen Elementen in einer Szene interagieren.
  
Zeile 8: Zeile 11:
   * Eine Animation mit Geräuschen: Es wird eine Animation gezeigt, bei der ein Akku-Schrauber eine Schraube festzieht. Dabei wird ein Geräusch abgespielt.   * Eine Animation mit Geräuschen: Es wird eine Animation gezeigt, bei der ein Akku-Schrauber eine Schraube festzieht. Dabei wird ein Geräusch abgespielt.
  
-3D-Sets werden in AFRAME (https://aframe.io) definiert. Zusätzlich zu allen Möglichkeiten die AFRAME bietet, können viele weitere Komponenten verwendet werden, die durch vrdoro bereitgestellt werden.+3D-Sets werden mit AFRAME (https://aframe.io) in der neo-code-Komponente definiert. Zusätzlich zu allen Möglichkeiten die AFRAME bietet, können viele weitere Komponenten verwendet werden, die durch vrdoro bereitgestellt werden.
  
 Das UI, mit dem die Elemente angepasst werden können, kann durch ein EditorConfig- bzw. EditorConfigGlobal-Attribut an jedem a-entity-Tag konfiguriert werden. Das UI, mit dem die Elemente angepasst werden können, kann durch ein EditorConfig- bzw. EditorConfigGlobal-Attribut an jedem a-entity-Tag konfiguriert werden.
Zeile 18: Zeile 21:
 {{:visualizer:pasted:20230929-103438.png?direct}} {{:visualizer:pasted:20230929-103438.png?direct}}
  
-==== Syntax ====+==== Parameter der neo-code-Komponente ==== 
 + 
 +  - <String> ''name'': Name der neo-code-Komponents 
 +  - <Boolean> ''enabled'': Aktiviert/deaktiviert die Komponente 
 +  - <String> ''code'': Selektor auf den auszuführenden Code-Block (optional) 
 +  - <Array> ''params'': Namen der Parameter p0-p14 in fortlaufender Reihenfolge 
 +  - <String> ''p0...'': Wert des jeweiligen Parameters 
 +  - <Number> ''codeRunDelay'': Verzögerung der Ausführung des Code-Blocks 
 +  - <Boolean> ''updateShadowMap'': Aktiviert/deaktiviert ein Update der shadowMap nach Ausführen des Code-Blocks 
 + 
 +=== Parsen der Parameter-Werte === 
 + 
 +Der default Parameter-Typ ist ''String''. Ein automatisiertes Parsen findet in folgenden Fällen statt: 
 +  - Wert: 'true' oder 'false' -> ''Boolean'' 
 +  - Wert: '123.45' (einzelner nummerischer Wert) -> ''Number'' 
 +  - Wert: '0 1' (zwei durch Leerzeichen getrennte nummerische Werte) -> ''Vector2'' 
 +  - Wert: '0 1 2' (drei durch Leerzeichen getrennte nummerische Werte) -> ''Vector3'' 
 +  - Wert: 'val1, val2, val3' (kommasepariert Werte) oder Parameter-Name endet mit '[]' -> ''Array'' 
 + 
 +==== Syntax des editorConfig-Attributes ====
  
 Es gilt diese Syntax: Es gilt diese Syntax:
Zeile 25: Zeile 47:
   - Wertebereich: ''von~bis'' oder ''bool'' oder ''color'' oder ''select''   - Wertebereich: ''von~bis'' oder ''bool'' oder ''color'' oder ''select''
  
-==== editorConfigGlobal vs. editorConfig ====+=== editorConfigGlobal vs. editorConfig ===
  
 Die durch editorConfigGlobal definierten Controls werden im oberen Abschnitt 'Szeneneinstellungen' des Room-Viewer-UIs angezeigt. Die editorConfig-Werte werden zu dem einzelnem Raumelement unterhalb von Raumelemente angezeigt. Die durch editorConfigGlobal definierten Controls werden im oberen Abschnitt 'Szeneneinstellungen' des Room-Viewer-UIs angezeigt. Die editorConfig-Werte werden zu dem einzelnem Raumelement unterhalb von Raumelemente angezeigt.
  
-==== Labels ==== +=== Attribute vs. Property ===
- +
-==== Attribute vs. Property ====+
  
 Werte für Eigenschaften wie Position oder Color sind Werte an den entsprechenden Entity-Attributen. Dabei können die Attribute auch Komponenten sein, die wiederum Attribute haben. Diese werden (vergl. die AFRAME-Docs) dann Properties genannt. So hat z. B. die Komponente ''material'' (gesetzt als Attribute an einer ''a-entity'') die Properties ''src'' und ''color''. Werte für Eigenschaften wie Position oder Color sind Werte an den entsprechenden Entity-Attributen. Dabei können die Attribute auch Komponenten sein, die wiederum Attribute haben. Diese werden (vergl. die AFRAME-Docs) dann Properties genannt. So hat z. B. die Komponente ''material'' (gesetzt als Attribute an einer ''a-entity'') die Properties ''src'' und ''color''.
Zeile 39: Zeile 59:
 Im weiteren wird in der Regel von Attributen gesprochen, in der Regel gelten die Aussagen dann aber auch für Komponenten-Properties.  Im weiteren wird in der Regel von Attributen gesprochen, in der Regel gelten die Aussagen dann aber auch für Komponenten-Properties. 
  
-==== Attributwert-Änderungen ====+=== Attributwert-Änderungen ===
  
  
Zeile 86: Zeile 106:
 Im UI wird dann ein Farbwahlelement angezeigt. Im UI wird dann ein Farbwahlelement angezeigt.
  
-==== Übersetzungen ====+=== Labels === 
 +Labels für UI-Elemente können nach der Property getrennt durch eine Tilde ('~') angefügt werden. Die Labels werden dabei in englisch angegeben. Findet sich im Dictionary eine Übersetzung für das Label, dann wird das Wort in die jeweilige Sprache übersetzt. Bei durch Unterstrich ('_') getrennten Wörtern werden die einzelnen Wörter getrennt übersetzt und der Unterstrich wird durch ein Leerzeichen ersetzt. 
 + 
 +Beispiel: ''functionName~Info:button~show'' 
 +  * functionName: Name der aufzurufenden Funkion 
 +  * Info: Text vor dem Button 
 +  * button: Typ der Definition (kann auch bool oder ein Wertebereich sein (s. u.) 
 +  * show: Label-Text auf dem Button 
 + 
 +=== Übersetzungen ===
 Die Label-Namen ergeben sich, sofern sie nicht explizit angegeben sind, aus den Attribute-Namen, die in der editorConfig angegeben sind. Die Label-Namen ergeben sich, sofern sie nicht explizit angegeben sind, aus den Attribute-Namen, die in der editorConfig angegeben sind.
  
-=== Bildung von Translation-Keys ===+== Bildung von Translation-Keys ==
  
 Die Bildung der Keys folgt diesen Regeln (in den Beispielen hinter dem ':' ist der Key fett markiert): Die Bildung der Keys folgt diesen Regeln (in den Beispielen hinter dem ':' ist der Key fett markiert):
Zeile 104: Zeile 133:
 Die Prüfung erfolgt in der angegebenen Reihenfolge. D. h. die Übersetzung der Standard-Control-Labels kann nicht von Element-Übersetzungen überschrieben werden.  Die Prüfung erfolgt in der angegebenen Reihenfolge. D. h. die Übersetzung der Standard-Control-Labels kann nicht von Element-Übersetzungen überschrieben werden. 
  
-**Hinweis: Translation-Keys sind (wie bei dem benutzten ember-intl) case sensitive zu benutzen**+//Hinweis: Translation-Keys sind (wie bei dem benutzten ember-intl) case sensitive zu benutzen//
  
 Durch einen Unterstrich '_' angehängte Zeichen werden bei der Suche nach einer Übersetzung entfernt. Der Unterstrich wird durch ein Leerzeichen ersetzt. Dadurch ist es möglich, nur den ersten Teilstring zu übersetzen. Durch einen Unterstrich '_' angehängte Zeichen werden bei der Suche nach einer Übersetzung entfernt. Der Unterstrich wird durch ein Leerzeichen ersetzt. Dadurch ist es möglich, nur den ersten Teilstring zu übersetzen.
Zeile 112: Zeile 141:
   * Bed_Whiteline -> Bett Whiteline (Whiteline ist ein Produktname, der nicht übersetzt wird)   * Bed_Whiteline -> Bett Whiteline (Whiteline ist ein Produktname, der nicht übersetzt wird)
  
-=== Übersetzung von Keys ===+== Übersetzung von Keys ==
  
 Der Key wird zunächst ganz geprüft (ohne den Teil nach '_') und dann von hinten bis zum '-' gekürzt um einen neuen zu prüfenden Key zu bilden. Der Key wird zunächst ganz geprüft (ohne den Teil nach '_') und dann von hinten bis zum '-' gekürzt um einen neuen zu prüfenden Key zu bilden.
Zeile 121: Zeile 150:
   * Undsoweiter, bis der Key nicht weiter gekürzt werden kann   * Undsoweiter, bis der Key nicht weiter gekürzt werden kann
  
-**Hinweis:** Übersetzungen können aktuell im Visualizer nicht hinzugefügt werden. Es können jedoch vorhandene Schlüssel benutzt werden.+//Hinweis: Übersetzungen können aktuell im Visualizer nicht hinzugefügt werden. Es können jedoch vorhandene Schlüssel benutzt werden.//
  
-==== Konfigurationsbeispiele ====+=== Konfigurationsbeispiele ===
  
   * ''wallFlip''   * ''wallFlip''
Zeile 129: Zeile 158:
     * Therefore all objects must first fit to the right wall.     * Therefore all objects must first fit to the right wall.
   * ''scale''   * ''scale''
-    * => scale in the default range of '''0 0 0~2 2 2''' which mean from current value / 2 until current value * 2+    * => scale in the default range of '''0 0 0~2 2 2''
   * ''scale=0.5 0.5 0.5~2 2 2''   * ''scale=0.5 0.5 0.5~2 2 2''
     * Adjust the scale from 0 to 2 for x, y and z.     * Adjust the scale from 0 to 2 for x, y and z.
     * The range '''0.5 0.5 0.5~2 2 2''' can also written as '''0.5~2'''.     * The range '''0.5 0.5 0.5~2 2 2''' can also written as '''0.5~2'''.
-  * ''scale=*0~*2'' +  * ''scale=0~2'' 
-    * Adjust the values from half of the current value to the current value multiplied by 2. +    * Adjust the values from 0 to 2 for x, y and z. 
-  * ''scale|position=*0 *2'' +  * ''scale|position=0 2'' 
-    * Adjust the values for scale and position.+    * Adjust the values for scale (with default values) and position from 0, 0, 0 to 0, 2, 2.
   * ''color=color;''   * ''color=color;''
     * Adjust the color of the entity with a color picker.     * Adjust the color of the entity with a color picker.