From 87b1a6ef590ab1c13963f7d6f593dcbf383e8d5b Mon Sep 17 00:00:00 2001 From: ddededodediamante Date: Sun, 15 Feb 2026 01:15:44 -0300 Subject: [PATCH] fix typos and add serialization/deserialization example Lol! fix typos and add serialization/deserialization example --- .../extensions/api/custom-types.md | 46 +++++++++++++------ 1 file changed, 33 insertions(+), 13 deletions(-) diff --git a/docs/development/extensions/api/custom-types.md b/docs/development/extensions/api/custom-types.md index 70bd66e..66dcf32 100644 --- a/docs/development/extensions/api/custom-types.md +++ b/docs/development/extensions/api/custom-types.md @@ -2,31 +2,31 @@ title: Custom Type APIs --- -systems for displaying/saving types other then the standard string|boolean|number +System for displaying and saving types other than the standard `string`, `boolean`, and `number`. -## object structure -the core system of custom types is an object that represents the data of that custom type and the functions required to show it to the user. -| signiture | fallback | description | +## Object Structure +The core system of a custom type is an object that represents the data of that custom type and the functions required to show it to the user. +| Signature | fallback | Description | | --------- | -------- | ----------- | -| `customId: String` | `null` | the id of this custom type, used only to identify this object for serialization | +| `customId: String` | `null` | the ID of this custom type, used only to identify this object for serialization | | `toReporterContent(): HTMLElement` | `toString` | inner content for a script reporter | | `toMonitorContent(): HTMLElement` | `toReporterContent` | inner content for a variable monitor | | `toListItem(): HTMLElement` | `toMonitorContent` | inner content for a single list item | | `toListEditor(): String` | `toString` | string-based representation of this type for the list item editor | -| `fromListEditor(edit: String): this` | `replaceItem` | takes the users edits to the string produced by toListEditor and modifies the custom types content according to the input, returning the object that should take place of this type (normally just self/this) | +| `fromListEditor(edit: String): this` | `replaceItem` | takes the user's edits to the string produced by toListEditor and modifies the custom types content according to the input, returning the object that should replace this type (normally just self/this) | -note that *anything* can be inside this object, its is just that the above functions are things already used internally both as signifiers of a custom type but also to show that custom types content +Note that *anything* can be inside this object, it's just that the above functions are things already used internally both as signifiers of a custom type but also to show the custom type's content. -example of function: +Example function: ```js class CustomType { toString() { - return 'look at me im custom reporter content!' + return 'look at me im a custom reporter content!' } toReporterContent() { const emWrap = document.createElement('em'); emWrap.style.color = '#0e0efe'; - emWrap.innerText = 'look at me im custom reporter content!'; + emWrap.innerText = 'look at me im a custom reporter content!'; return emWrap; } } @@ -68,8 +68,28 @@ Scratch.extensions.register(new Extension()); ## serialization registration ### `registerSerializer(id: string, serialize: function(toSerialize: CustomType) {}: any, deserialize: function(fromSerialize: any) {}: CustomType)` -id must match the customId property of a custom type +The ID must match the customId property of a custom type. -serialize and deserialize must exist together +Serialize and deserialize must exist together. +Serialize must be a function that takes the custom type and returns some data that is then consumed by the deserialize function to remake the instance of custom type. -serialize must be a function that takes the custom type and returns some data that is then consumed by the deserialize function to remake the instance of custom type \ No newline at end of file +Example serializer registration: +```js +Scratch.vm.runtime.registerSerializer( + "customId", // Must match the customId defined on the custom type + value => { + // Receives the custom type instance and must return a JSON object that represents it. + if (value instanceof CustomType) { + return { + data: value._data + }; + } + }, + data => { + // Receives the previously serialized data and must return a new instance of the custom type. + if (data && data.data) { + return new CustomType(data.data); + } + } +); +```