Discord
Login
Community
DARK THEME

Exporting OBJECT JSON with multiple images inside

How do i manage to export JSONS that contain Images, since i'm making a several layered JSON with images inside lists, that are inside lists, i.e really deep

Are you doing the project in MicroScript or JavaScript?

The information saved always has the same structure? List of all lists > list of images > andy Can it be more complicated (dynamic) .

Search for Serialization and Deserialization - it will be something like .


class Serializable {
  toJSON() {
    return {
      __class__: this.constructor.name,
      ...this
    };
  }

  static fromJSON(obj) {
    const classMap = {
      ImageItem,
      ImageList
    };
    const Cls = classMap[obj.__class__];
    if (!Cls) throw new Error("Unknown class: " + obj.__class__);
    const instance = new Cls();
    Object.assign(instance, obj);
    delete instance.__class__;
    return instance;
  }
}

class ImageItem extends Serializable {
  constructor(url = '', description = '') {
    super();
    this.url = url;
    this.description = description;
  }
}

class ImageList extends Serializable {
  constructor(name = '') {
    super();
    this.name = name;
    this.images = []; // Array of ImageItem objects
  }

  addImage(image) {
    this.images.push(image);
  }

  static fromJSON(obj) {
    const list = super.fromJSON(obj);
    list.images = list.images.map(imageObj => Serializable.fromJSON(imageObj));
    return list;
  }
}

Is there a way i can encode the Image object for text export

https://microstudio.dev/i/TinkerSmith/pixianim/

See code getSpriteAnim .

frame.canvas.toDataURL()

Exports animation frame ( image ) to url 9 ( text ) .

so how can i decode it back to what it was,, in the code, because I need the conversion to be only temporary, just to bypass some JSON export of images/ The encode was good, it does the job i only need the decoding, to turn it back to image

Using JavaScript, create an Image with the data URL as the src. Create a msImage with the width and height of the image and draw the image to its canvas.

  img = new Image( 100, 100 )
  img.drawSprite( "icon", 0, 0, 100, 100 )
  str = img.canvas.toDataURL()
  print(str)
  

  img2 = new Image(100, 100)
  imgTemp = new Image(100, 100)
  imgTemp.src = str

  img2.drawImage(imgTemp, 0, 0, 100, 100)
// img2.drawSprite(str, 0, 0, 100, 100)
  print( imgTemp.canvas.toDataURL() )
  print( img2.canvas.toDataURL() )

img2.canvas.src - I think this should work in MicroScript too. But for some reason img2.canvas.toDataURL() returns shorter text than received.

Post a reply

Progress

Status

Preview
Cancel
Post
Validate your e-mail address to participate in the community