Discuss Scratch

WateryCup
Scratcher
11 posts

Leopard: Edit Scratch projects as JavaScript code

When converting projects is it possible that you could add something where you can type what you
(username)
=too
theXliner
Scratcher
83 posts

Leopard: Edit Scratch projects as JavaScript code

WateryCup wrote:

When converting projects is it possible that you could add something where you can type what you
(username)
=too
Good idea!

@PullJosh, I wonder if you could allow me to contribute to the source code. My username is ThatXliner
PullJosh
Scratcher
1000+ posts

Leopard: Edit Scratch projects as JavaScript code

theXliner wrote:

WateryCup wrote:

When converting projects is it possible that you could add something where you can type what you
(username)
=too
Good idea!

@PullJosh, I wonder if you could allow me to contribute to the source code. My username is ThatXliner
For now, I think username should remain null. But I appreciate your willingness to contribute!
WateryCup
Scratcher
11 posts

Leopard: Edit Scratch projects as JavaScript code

PullJosh wrote:

theXliner wrote:

WateryCup wrote:

When converting projects is it possible that you could add something where you can type what you
(username)
=too
Good idea!

@PullJosh, I wonder if you could allow me to contribute to the source code. My username is ThatXliner
For now, I think username should remain null. But I appreciate your willingness to contribute!
Ok!
-Rex-
Scratcher
500+ posts

Leopard: Edit Scratch projects as JavaScript code

PullJosh wrote:

theXliner wrote:

WateryCup wrote:

When converting projects is it possible that you could add something where you can type what you
(username)
=too
Good idea!

@PullJosh, I wonder if you could allow me to contribute to the source code. My username is ThatXliner
For now, I think username should remain null. But I appreciate your willingness to contribute!
Scratch sets the username to an empty string if you’re signed out.
PullJosh
Scratcher
1000+ posts

Leopard: Edit Scratch projects as JavaScript code

-Rex- wrote:

Scratch sets the username to an empty string if you’re signed out.
That's a very good point. Could consider using an empty string instead.
PullJosh
Scratcher
1000+ posts

Leopard: Edit Scratch projects as JavaScript code

I know some of you are interested in the translation process, and how we parse Scratch projects to convert them to JavaScript.

I just posted this new issue on Github outlining some of my thoughts on where this could go in the future. This is NOT important for people who just want to use Leopard, but if you're curious to get a peek under the hood or want to contribute to the discussion, it could be worth checking out.
BerBoy876
Scratcher
18 posts

Leopard: Edit Scratch projects as JavaScript code

jackfifer99
Scratcher
15 posts

Leopard: Edit Scratch projects as JavaScript code

PullJosh wrote:

Please use this thread to discuss Leopard, share your projects, and ask for help.


That's right! Translating Scratch to JavaScript is now possible! The tool is called Leopard, and it's available here:

Leopard Website – Go here to convert your projects!

Who needs this?
Scratch is amazing. This is the place where I learned to code almost 9 years ago. I love the Scratch community, and the fact that it's so easy to get started with Scratch. However, many of the features that make it easy to start using Scratch also make it underpowered for more experienced programmers.

With a different programming language like JavaScript, you get:
  • More features: You can do cool tricks that simply aren't possible with Scratch.
  • Speed: Your projects run faster and lag isn't as problematic.
  • Publishing options: Run your projects on any website, not just Scratch.
If you want to try a different programming language but find it difficult to get started, Leopard can help.

How is this different than Phosphorus?
Phosphorus is awesome, but it's a little different than Leopard. With Leopard you can view and edit the translated JavaScript code yourself.

What if it doesn't work?
Not every project will translate perfectly.
  • Only projects created using Scratch 3.0 can be translated. If you created your project using Scratch 2.0 or older, you'll need to open it up in the Scratch 3.0 editor, make a small change, and then try again.
  • Some Scratch blocks are not yet supported. Check the translations page to see which blocks have JavaScript equivalents using Leopard. More blocks will be supported over time.
  • Extension blocks won't work (except pen, which works great!)
  • Sometimes there are little inconsistencies. We've done our best to make sure Leopard behaves exactly the same as Scratch, but there will always be little cases we haven't considered. It's possible that your scripts will run slightly out of order, be a little too fast, or some other issue. Fortunately, you can edit the JavaScript code to fix those issues, and I'm happy to help.

Upcoming Improvements
Based on the feedback I'm seeing on the forums and in comments, these are the top-priority issues to solve (most important first):
  1. Sprite layering doesn't work! go to front/back & go forward/backward blocks need to be implemented. Sprite layering now works in Leopard!
  2. Projects run too fast! Leopard projects currently run at 60fps, but it should also be possible to slow them down to 30fps. Frame rate is now a configuration option, and the default is 30fps–the same as Scratch.
  3. Variable watchers don't work Variable watchers now work in Leopard!
  4. If touching edge and if on edge, bounce blocks don't work.
  5. Lots of little bugs that all add up to cause issues

Thank you so much to the contributors who made Leopard possible!
how does it work though?
j5155
Scratcher
71 posts

Leopard: Edit Scratch projects as JavaScript code

jackfifer99 wrote:

PullJosh wrote:

-snip-

how does it work though?

PullJosh wrote:

I know some of you are interested in the translation process, and how we parse Scratch projects to convert them to JavaScript.

I just posted this new issue on Github outlining some of my thoughts on where this could go in the future. This is NOT important for people who just want to use Leopard, but if you're curious to get a peek under the hood or want to contribute to the discussion, it could be worth checking out.

Last edited by j5155 (July 12, 2020 17:50:05)

theXliner
Scratcher
83 posts

Leopard: Edit Scratch projects as JavaScript code

jackfifer99 wrote:

PullJosh wrote:

Please use this thread to discuss Leopard, share your projects, and ask for help.


That's right! Translating Scratch to JavaScript is now possible! The tool is called Leopard, and it's available here:

Leopard Website – Go here to convert your projects!

Who needs this?
Scratch is amazing. This is the place where I learned to code almost 9 years ago. I love the Scratch community, and the fact that it's so easy to get started with Scratch. However, many of the features that make it easy to start using Scratch also make it underpowered for more experienced programmers.

With a different programming language like JavaScript, you get:
  • More features: You can do cool tricks that simply aren't possible with Scratch.
  • Speed: Your projects run faster and lag isn't as problematic.
  • Publishing options: Run your projects on any website, not just Scratch.
If you want to try a different programming language but find it difficult to get started, Leopard can help.

How is this different than Phosphorus?
Phosphorus is awesome, but it's a little different than Leopard. With Leopard you can view and edit the translated JavaScript code yourself.

What if it doesn't work?
Not every project will translate perfectly.
  • Only projects created using Scratch 3.0 can be translated. If you created your project using Scratch 2.0 or older, you'll need to open it up in the Scratch 3.0 editor, make a small change, and then try again.
  • Some Scratch blocks are not yet supported. Check the translations page to see which blocks have JavaScript equivalents using Leopard. More blocks will be supported over time.
  • Extension blocks won't work (except pen, which works great!)
  • Sometimes there are little inconsistencies. We've done our best to make sure Leopard behaves exactly the same as Scratch, but there will always be little cases we haven't considered. It's possible that your scripts will run slightly out of order, be a little too fast, or some other issue. Fortunately, you can edit the JavaScript code to fix those issues, and I'm happy to help.

Upcoming Improvements
Based on the feedback I'm seeing on the forums and in comments, these are the top-priority issues to solve (most important first):
  1. Sprite layering doesn't work! go to front/back & go forward/backward blocks need to be implemented. Sprite layering now works in Leopard!
  2. Projects run too fast! Leopard projects currently run at 60fps, but it should also be possible to slow them down to 30fps. Frame rate is now a configuration option, and the default is 30fps–the same as Scratch.
  3. Variable watchers don't work Variable watchers now work in Leopard!
  4. If touching edge and if on edge, bounce blocks don't work.
  5. Lots of little bugs that all add up to cause issues

Thank you so much to the contributors who made Leopard possible!
how does it work though?


So, it basically gets the project info (in JSON format), translates that into JavaScript by processing the JSON. This is done with sb-edit Leopard is actually a library to make JavaScript projects like scratch (basically scratch in text form). Then, sb-edit builds the Leopard according to the JSON.
Cybercircut
Scratcher
92 posts

Leopard: Edit Scratch projects as JavaScript code

a bug i saw was that when i converted my animation, and at ac certain part. it would stay there not switch like it's programmed here is my project exposing the issue. https://scratch.mit.edu/projects/411189940/
Owlet_Animations
Scratcher
6 posts

Leopard: Edit Scratch projects as JavaScript code

OMG it is so cool I love it keep I love it!
say [I love it so mucj please keep it!]
TheGeniusCoder
Scratcher
100+ posts

Leopard: Edit Scratch projects as JavaScript code

No suggestions yet just a question.

since you are converting scratch projecting to js and custom extensions are written in js would you consider adding custom extension support similar to Sheep_maker's htmlifier?

I understand that if you were to consider this is would be far into the future after the current official scratch blocks are all working properly.

follow up question since cloud variables are not supported, do you think you would just cut them or try and implement them as locally stored variables, or a server also similar to sheep_maker's htmlifier (sorry for referencing it again I understand that these are two separate projects from each other.
Sheep_maker
Scratcher
1000+ posts

Leopard: Edit Scratch projects as JavaScript code

TheGeniusCoder wrote:

No suggestions yet just a question.

since you are converting scratch projecting to js and custom extensions are written in js would you consider adding custom extension support similar to Sheep_maker's htmlifier?

I understand that if you were to consider this is would be far into the future after the current official scratch blocks are all working properly.

follow up question since cloud variables are not supported, do you think you would just cut them or try and implement them as locally stored variables, or a server also similar to sheep_maker's htmlifier (sorry for referencing it again I understand that these are two separate projects from each other.
Here's a hacky solution for using blocks from unofficial extensions:
window.Scratch = {
  extensions: {
    register (extension) {
      this[extension.getInfo().id] = extension
    }
  }
}
 
// Then import the URLs of the extensions you want to load
import 'https://mikedev101.github.io/cloudlink/cloudlink.js'
 
// Use blocks from the extension
Scratch.extensions.cloudlink.openSocket({ WS: 'ws://127.0.0.1:3000/' })

You should probably use the native localStorage methods directly if you want to save values locally
pengmacale
Scratcher
0 posts

Leopard: Edit Scratch projects as JavaScript code

Wow! I should try this!
Navaneet1234
Scratcher
45 posts

Leopard: Edit Scratch projects as JavaScript code

How Do You Make a 3D Cloud Platformer?
theXliner
Scratcher
83 posts

Leopard: Edit Scratch projects as JavaScript code

Guys, do not go off-topic. Unless you have questions, bug reports, or a suggestion, please do not post.
TheGeniusCoder
Scratcher
100+ posts

Leopard: Edit Scratch projects as JavaScript code

Not my project but I have found a project that Is severely broken using this. The project is called tetris dash (version 1.1) https://scratch.mit.edu/projects/24863616/ the rendering of the the tetrominos do not work and causes severe malfunctioning of the project this is disregarding the cloud variables. I think the issue is because of how lists are handled but it is definitely more than just that.

Although since I am not the creator of this project I can't say what could be causing this but I think if this project is to be fixed with leopard many other problems would be fixed too.
I am going to inform the creator of the game of this and link them to this post in case you would like to ask them anything.

Thank you @Sheep_maker for the solution for custom extensions.
theXliner
Scratcher
83 posts

Leopard: Edit Scratch projects as JavaScript code

Actually, Leopard doesn't support cloud variables: they'll have to buy servers for which they have no budget for

Powered by DjangoBB