Skip to content

SDK-Frontend: WYSIWYG-Editoren und Upload-Felder in Options rendern #214

@MHajoha

Description

@MHajoha

Schneller Überblick

Ein Model

class MyModel(FormModel):
    my_editor: RichTextEditor = rich_text_editor("Editor")
    my_file_upload: list[OptionsFile] = file_upload("File Upload")

baut eine Form

{
  "general": [
    {
      "kind": "wysiwyg_editor",
      "name": "my_editor",
      "label": "Editor",
      "file_uploads": {
        "min_files": 0,
        "max_files": null,
        "max_bytes_per_file": null,
        "max_bytes_total": null
      }
    },
    {
      "kind": "file_upload",
      "name": "my_file_upload"
      "label": "File Upload",
      "min_files": 0,
      "max_files": null,
      "max_bytes_per_file": null,
      "max_bytes_total": null,
    }
  ]
}

die im Moodle-Plugin so gerendert wird:

Image

und Daten wie die folgenden generiert

{
  "my_editor": {
    "text": "<p><img class=\"img-fluid\" src=\"qpy://options/7fc7775a9d890f73618713fb6100b8a2d77032ab-f60547f5829e4ee1\" alt=\"asd\" width=\"200\" height=\"300\"></p>",
    "_textformat": "html",
    "files": [
      {
        "path": "/",
        "filename": "steamed_hams.jpg",
        "file_ref": "7fc7775a9d890f73618713fb6100b8a2d77032ab-f60547f5829e4ee1",
        "uploaded_at": "2025-10-21T11:03:49Z",
        "mime_type": "image/jpeg",
        "size": 6436
      }
    ]
  },
  "my_file_upload": [
    {
      "path": "/",
      "filename": "pug.jpg",
      "file_ref": "05c5a8435dbe109d3ead4078934684019e796f3b-8f061e4328440c6a",
      "uploaded_at": "2025-10-21T11:02:04Z",
      "mime_type": "image/jpeg",
      "size": 7751
    }
  ]
}

Erklärung zum Datei-Upload

Sowohl das einzelne File-Upload-Element als auch die Upload-Funktion im Editor trennen Dateien von ihren Metadaten. Innerhalb der Form-Daten gibt es nur die file_ref, mit der das Paket dann irgendwann mal der LMS Callback API die Dateien abfragen können wird. Das ist aber im Moodle-Plugin noch nicht implementiert, und würde ich hier auch erstmal out-of-scope sehen.

Die File-Ref ist für Server und Paket opak, sollte aber folgendes erfüllen:

  • ^[a-zA-Z0-9\-_=]{1,64}$
  • Ein Umbenennen oder Verschieben (auch zwischen Form-Elementen) der Datei sollte die File-Ref nicht ändern.
  • Eine Änderung des Inhalts muss die File-Ref ändern.

Im Moodle-Plugin ist es {content hash}-{metadata hash}. Letzteres hasht die von Moodle gespeicherten Metadaten Context-ID, User-ID, Autor, Lizenz und Quelle. Ich denke nicht, das wir irgendwas davon im SDK brauchen, daher vermute ich, dass es reicht, den Inhalt zu hashen. Natürlich muss damit umgegangen werden können, dass inhaltlich gleiche Dateien mehrmals und mit unterschiedlichen Metadaten hochgeladen werden.

Erklärung zum Editor

Die erwarteten Form-Daten sind in RichTextEditor definiert. Nur text und files sind vorgeschrieben, aber das LMS kann beliebige weitere Felder abspeichern, solange sie mit _ beginnen. Das Moodle-Plugin benutzt das, um das Markup-Format abzuspeichern.

Weiterhin müssen QPy-URLs umgewandelt werden. Aktuell ist das Format qpy://options/{file_ref}. Mit questionpy-org/moodle-qtype_questionpy#217 wird dann daraus vermutlich qpy://options/{file_ref}[/{path}/{filename}]. Ich würde dir freistellen, ob du das hier schon einbaust.

  • Im Editor Markup muss zwischen HTTP-URLs (die dann auch geserved werden müssen) und QPy-URLs in beide Richtungen konvertiert werden.
  • Beim Anzeigen der Frage müssen QPy-URLs in HTTP-URLs umgewandelt werden.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions