CODEWITHSUNDEEP
mit-scratch
Luane
Luane

Reputation: 91

How to Load Project Files into the Editor when the Scratch app starts?

I have a .sb3 file that is returned from an API, and I want to load it into the editor when the app starts.

It seems that I need to set the project files into scratch-storage, but I am not sure if this is correct or how to do it.

Could someone please guide me on how to load the .sb3 file into the editor when the app starts?

Upvotes: -1

Views: 91

Answers (1)

qkhuyit
qkhuyit

Reputation: 21

You can edit componentDidMount of vm-manager-hoc.jsx as bellow:

// Define download file function
async function loadSb3FromApi(url, vm) {
    const response = await fetch(url);
    const projectBlob = await response.blob();
    const arrayBuffer = await projectBlob.arrayBuffer();
    await vm.loadProject(arrayBuffer);  // Loads the project into the Scratch VM
}

componentDidMount () {
  if (!this.props.vm.initialized) {
      this.audioEngine = new AudioEngine();
      this.props.vm.attachAudioEngine(this.audioEngine);
      this.props.vm.setCompatibilityMode(true);
      this.props.vm.initialized = true;
      this.props.vm.setLocale(this.props.locale, this.props.messages);
  }
  if (!this.props.isPlayerOnly && !this.props.isStarted) {
      this.props.vm.start();
  }

  // Fetch and load the project from the API when the app starts
  loadSb3FromApi("URL_FILE", this.props.vm).then(() => {
      console.log('Project loaded successfully');
  }).catch(err => {
      console.error('Error loading project:', err);
  });

  // Initialize and start the VM
  this.props.vm.start();
}

Upvotes: 1

Related Questions