agorum.cards.view

Dieses Widget bildet den Kern von agorum core cards und enthält diverse Funktionen, mit denen Sie den Inhalt Ihrer cards erzeugen und bearbeiten.

Verwendung

---

Dieses Widget zeigt etwa eine Liste von agorum.object-cardlets an:

let aguila = require('common/aguila');
let objects = require('common/objects');

let widget = aguila.create({
  type: 'agorum.cards.view',
  scrolling: true,
  background: 'light',
  width: 600,
  height: 800
});

aguila
.fork(() => objects.find('home:MyFiles').items().map(item => item.UUID))
.then(ids => {
  widget.replace({
    type: 'agorum.vertical',
    items: ids.map(id => ({
      type: 'agorum.object',
      id: id,
      name: id,
      selectable: true
    }))
  });
});

widget;

 

Parameter

---

scrolling

Wert	Beschreibung
true	Blendet Scrollbalken ein, wenn die Höhe des Inhalts die Höhe des Widgets übersteigt.
false (Standard)	Scrollbalken aus, wenn die Höhe des Inhalts die Höhe des Widgets übersteigt.

selection

Enthält ein Array mit den name-Attributen aller aktuell selektierten Elemente.

• Ändert sich dieser Parameter, ändert sich auch die dargestellte Selektion.
• Das System kann ein Element nur selektieren, wenn es die Eigenschaft name besitzt und der Parameter selectable auf true gesetzt ist.

Events

---

Sie können neben den fest definierten Ereignissen auf diesem Widget cardlet-Ereignisse auslösen, wenn diese nicht schon von cardlet-Handlern behandelt wurden.

more

Löst aus, sobald das System das Widget mit scrolling: true erzeugt hat und sich die Scrollposition dem unteren Ende nähert.

Verwenden Sie diesen Event, um dynamisch weitere Einträge einer größeren Liste nachzuladen und hinzuzufügen.

Funktionen

---

Allgemeines zu Modifikator-Funktionen

Modifikator-Funktionen (remove, replace, insert, append) erwarten unter anderem eine Folge von Namen als Parameter, um das Basiselement für die jeweilige Modifikation anzugeben. Hierbei wird jeweils das erste passende Element über eine Breitensuche gewählt. Geben Sie keinen Namen an, spricht das System immer das oberste Element an (root element).

Wird hier etwa die Kombination 'list', 'item2' als Parameter angegeben, wird ausgehend vom obersten Element zunächst nach einem Element mit dem Namen list gesucht, dann von dort aus weiter ein Element mit dem Namen item2. Das gefundene Element ist dann das Basiselement für die Modifikation, im Fall von remove würde dieses also entfernt werden.

more()

Weist das Widget an, das Ereignis wieder freizugeben, sodass es erneut ausgelöst werden kann, wenn das gleichnamige Ereignis more bereits ausgelöst wurde und aktuell unterdrückt wird.

Für dynamisch nachladende Listen ergibt sich folgender Ablauf:

1. Liste erzeugen und initiale Einträge darstellen.
2. Sobald das Ereignis more ausgelöst wird, weitere Einträge erzeugen und darstellen. Abbrechen, wenn keine weiteren Einträge vorhanden sind.
3. Die Funktion more() aufrufen.
4. Zurück zu 2.

reset()

Setzt die horizontale und vertikale Scrollposition des Widgets zurück auf den Anfang.

remove(name, ...)

Entfernt das referenzierte Basiselement.

view.remove('list', '12345');

replace(name, ..., def)

Ersetzt das referenzierte Basiselement durch das über def beschriebene cardlet.

view.replace('list', '12345', {
  type: 'agorum.object',
  name: '12345',
  id: '12345'
});

insert(name, ..., def)

Fügt dem referenzierten Basiselement das über def beschriebene cardlet als Unterelement hinzu.

view.insert('list', {
  type: 'agorum.object',
  name: '12345',
  id: '12345'
});

append(name, ..., def)

Fügt hinter dem referenzierten Basiselement das über def beschriebene cardlet hinzu.

Führen Sie diese Änderung nicht auf dem äußersten Element (root-Element) durch.

view.append('list', '12344', {
  type: 'agorum.object',
  name: '12345',
  id: '12345'
});