JavaScript-Bibliothek agorum.cards/js/decorators

Diese JavaScript-Bibliothek dient zur Unterstützung der Entwicklung von decorators und enthält Funktionen, mit denen Sie Elemente in einem gegebenen cardlet finden und ändern können.

Verwendung

---

Diese Bibliothek binden Sie stets am Anfang eines Skripts ein:

let decorators = require('/agorum/roi/customers/agorum.cards/js/decorators');

Funktionen

---

down

Sucht innerhalb einer cardlet-Definition nach einem Element mit dem gegebenen Namen und gibt dieses zurück.

Syntax

let element = decorators.down(cardlet, name);

Parameter

Parameter	Beschreibung	Pflicht
cardlet	Definiert die cardlet-Definition, in der das System sucht.	ja
name	Definiert den Namen des Elements, nach dem das System sucht.	ja

Beispiel

let decorators = require('/agorum/roi/customers/agorum.cards/js/decorators');

let cardlet = {
  type: 'agorum.card',
  items: [
    {
      type: 'agorum.horizontal',
      items: [
        {
          type: 'agorum.text',
          name: 'test',
          text: 'Test-Element'
        }
      ]
    }
  ]
};

let element = decorators.down(cardlet, 'test');

element;

with

Sucht innerhalb einer cardlet-Definition nach einem Element mit dem gegebenen Namen und ruft die übergebene Funktion mit diesem als Parameter auf.

Das System ruft die Funktion nicht auf, wenn es kein passendes Element findet.

Syntax

let element = decorators.with(cardlet, name, fn);

Parameter

Parameter	Beschreibung	Pflicht
cardlet	Definiert die cardlet-Definition, in der das System sucht.	ja
name	Definiert den Namen des Elements, nach dem das System sucht.	ja
fn	Definiert die Funktion, die das System mit dem gefundenen Element aufruft.	ja

Beispiel

let decorators = require('/agorum/roi/customers/agorum.cards/js/decorators');

let cardlet = {
  type: 'agorum.card',
  items: [
    {
      type: 'agorum.horizontal',
      items: [
        {
          type: 'agorum.text',
          name: 'test',
          text: 'Test-Element'
        }
      ]
    }
  ]
};

decorators.with(cardlet, 'test', element => {
  // ...
});

remove

Entfernt innerhalb einer cardlet-Definition ein Element mit dem gegebenen Namen.

Syntax

decorators.remove(cardlet, name);

Parameter

Parameter	Beschreibung	Pflicht
cardlet	Definiert die cardlet-Definition, die das System ändert.	ja
name	Definiert den Namen des Elements, das das System entfernt.	ja

Beispiel

let decorators = require('/agorum/roi/customers/agorum.cards/js/decorators');

let cardlet = {
  type: 'agorum.card',
  items: [
    {
      type: 'agorum.horizontal',
      items: [
        {
          type: 'agorum.text',
          name: 'test',
          text: 'Test-Element'
        }
      ]
    }
  ]
};

decorators.remove(cardlet, 'test');

state

Ruft ein Objekt ab, in dem ein decorator Zustandsinformationen hinterlegen kann, die erhalten bleiben, auch wenn das zugehörige agorum.object-cardlet neu erzeugt wird.

Syntax

let state = decorators.state(def, key, defaults);

Parameter

Parameter	Beschreibung	Pflicht
def	Definiert die agorum.object-cardlets-Definition, die decorators als Parameter erhalten.	ja
key	Definiert eine eindeutige Bezeichnung für das Zustandsobjekt.	ja
defaults	Definiert eine Vorbelegung, die das System verwendet, wenn das Zustandsobjekt initial erzeugt wird.	nein

Beispiel

let decorators = require('/agorum/roi/customers/agorum.cards/js/decorators');

module.exports = (cardlet, object, def) => {
  let state = decorators.state(def, 'my.decorator.state', {
    expanded: false
  });

  if (state.expanded) {
    // ...
  }
};

Verwendung

Das zurückgelieferte Zustandsobjekt wird typischerweise an ein cardlet weitergereicht, das vom decorator erzeugt wird und das dieses verwendet, um seinen Zustand bei Neuerstellung beizubehalten. Das hier verwendete Pfadanzeige-cardlet hinterlegt etwa, ob der Benutzer es aktuell aufgeklappt hat oder nicht.

text, html, defaultText, defaultHtml

Diese Funktionen vereinfachen die Arbeit mit den beiden Attributen text und html, die von cardlets angeboten werden, die Text darstellen, etwa agorum.text oder agorum.button.

Syntax

decorators.text(cardlet, name, fn);
decorators.html(cardlet, name, fn);
decorators.defaultText(cardlet, name, fn);
decorators.defaultHtml(cardlet, name, fn);

Parameter

Die Parameter dieser Funktionen verhalten sich analog zu denen der Funktion with. Lediglich der Rückgabewert der Funktion fn wird zusätzlich verwendet, um den Wert des Attributs (text oder html) festzulegen.

Parameter	Beschreibung	Pflicht
cardlet	Definiert die cardlet-Definition, in der das System sucht.	ja
name	Definiert den Namen des Elements, nach dem das System sucht.	ja
fn	Definiert die Funktion, die das System mit dem gefundenen Element aufruft. Der Rückgabewert dieser Funktion wird als Wert des zu setzenden Attributs verwendet.	ja

Funktionsweise

Funktion	Beschreibung
text	Setzt den Wert des Attributs text und löscht das Attribut html, sofern dieses vorhanden ist.
html	Setzt den Wert des Attributs html und löscht das Attribut text, sofern dieses vorhanden ist.
defaultText	Setzt den Wert des Attributs text, sofern weder text noch html bisher einen Wert besitzen.
defaultHtml	Setzt den Wert des Attributs html, sofern weder text noch html bisher einen Wert besitzen.

Beispiel

decorators.text(cardlet, 'title', () => 'Neuer Titel im Text-Format');

decorators.html(cardlet, 'title', () => 'Neuer Titel im <strong>HTML</strong>-Format');

decorators.defaultText(cardlet, 'subject', () => 'Kein Betreff');

decorators.defaultText(cardlet, 'subject', () => '<em>Kein Betreff</em>');