Calliope Simulator

Das Modul einbinden

Um das Modul nutzen zu können, muss die Einbindung des Moduls über den Meta-Tag features erfolgen (siehe auch Abschnitt "Javascript"):

Das Modul verwenden

Für die Verwendung sind folgende Schritte zu erledigen:

1. Im Calliope Editor MakeCode ein Programm anlegen oder öffnen.
2. Das Teilen Symbol oben rechts anklicken, mit "Publish project" bestätigen und aus dem Link die ID kopieren, das ist der hintere Teil nach dem /.
3. Den HTML Tag <div class="calliope-sim" data-config="..."></div> an der gewünschten Stelle im Schulbuch einfügen und in der Konfiguration (siehe nächster Abschnitt) die gewünschte Höhe sowie die ID übergeben.

Konfiguration vornehmen

data-config - Übergabe der Konfiguration im JSON Format, Reihenfolge beliebig

• makeCodeID Die ID von MakeCode, siehe oben Schritt 2.
• width Damit wird die Breite des Elementes festgelegt (Standardwert: 300px).
• link Es kann optional ein Link angezeigt werden, der das Projekt in MakeCode öffnet (Standardwert: false).

Beispiel mit Breite 200px

<div class='calliope-sim' data-config='{"makeCodeID":"_fJ6c3qb4A9Du", "width":"200px"}'></div>

Beispiel mit Standardbreite und Link

<div class='calliope-sim' data-config='{"makeCodeID":"_fJ6c3qb4A9Du", "link": true}'></div>