Run BYOB Online!

Advanced Topics
,
21

That's a great idea! I will definitely be working on that!

22

OK, I added it to the website and it's DONE! You should now see a devlog button.

23

thanks!

24

You are welcome!! I even added Chirp as a bonus.

25

image
image298×235 4.91 KB

Small niche thing: You can use <optgroup> to group options in <select>.

I will review the actual program later, as it takes a while to load for me. I'm uncertain if it will.

26

Thank you for the tip! I'll look into that!!

27

what's dream?https://cdn.forum.snap.berkeley.edu/original/3X/0/6/061bc718fc8dac6ff05afc6a4513edf19337a3bd.png

28

Dream was one of the biggest & most popular Scratch 1.4 mods at the time. It included more then 100 new blocks and included networking capabilities, such as hosting a mesh or getting the contents of a URL. The image for dream took me awhile to track down, so I'm glad I was able to archive this little goodie.

You can find more about the Dream mod on a archived Scratch forum.

I am also going to include lots of Scratch versions and add it to the program, to make it the ultimate retro-block-program-in-the-browser experience! (But I'll be mostly focusing on BYOB more then anything)

29

Guess what! You can now install BYOB as a app again. Read the forum post at the very top to find out more!

31

huh. where do you find all this?

32

I found a archive on the internet archive on some popular scratch mods... If you are taking about BYOB versions, I have downloaded Jens Moëng's (sorry if I misspelled the name, I don't type it out everyday lol) archive, then went into my Windows (via a vm) system, expanded the .rar file, moved the contents onto the USB drive, and onto my Mac for processing.

A lot of effort into creating this archive, but we need to preserve BYOB history in the best ways that we can. If you can, please spread the word so people can give me their versions of BYOB for me to archive. That will be a big help.

33

oh nice. (his name's Mönig, by the way)
Personally I unfortunately don't have any BYOB versions that are not already there.

34

No worries! You can just spread the word or contribute to the Github repo to help out in preserving BYOB versions for years to come.

35

but byob isnt released anymore

36

I think that's the point... OP doesn't want it to become lost media...

37

Finally, it started working for me. Only steps away from perfection:

  • I can't scroll using the scroll wheel/touchpad gestures. I have to use the scrollbars.
  • Keyboard isn't registered. <key [space V] pressed?> does not work, and I can't type into any text box either.
Offtopic

I found out about Simulator too the day I decided to try out Xcode on my Mac!

38

I mean preserving old BYOB versions for years to come

39

So are you updating byob?

40

Cool!

I am actively working patching that bug. The problem is that the <iframe> element that connects to the SqueakJS servers if not focused properly, the the computer OS does not know that you want to type in the text box in the <iframe>.

You see, the way this archive currently working in running the BYOB versions is that is passes the URL to the image file (like github.com/jbluebird/browser-byob/images/myimage.image) to the Squeak <iframe> URL as well as other details required for SqueakJS to run BYOB and then render it on the archive website.

In my case, I worked around hardcoding the iframe to different BYOB versions by using JavaScript.

<label for="imageSelect">Choose a version: </label>
      <select id="imageSelect" onchange="loadImage()">
        <option value="" selected disabled>-- Select a BYOB version --</option>
       <option value="BYOB.image">BYOB</option>

        <!-- Add more options here as needed -->
      </select>


<iframe id="byobFrame" src=""></iframe> <!--render BYOB!-->

<script>
function loadImage() {

const iframe = document.getElementById('byobFrame');
const selectedImage = document.getElementById('imageSelect').value;
  if (!selectedImage) return; //get the current value of the image picker. If one is selected, render the version you picked. If a version is NOT selected, do nothing


  const baseURL = "https://squeak.js.org/run/";
  const imageURL = `https://jbluebird.github.io/Browser-BYOB/images/${selectedImage}`; //You cannot forget this! This is the image file on the version of BYOB you want to run!
  const changes = `https://jbluebird.github.io/Browser-BYOB/BYOB.changes`; //Required as a little devlog to Squeak on how to execute the code, I believe.
  const sources = `https://jbluebird.github.io/Browser-BYOB/SqueakV3.sources`; //Required to know what can run and what cannot

  iframe.src = `${baseURL}?image=${imageURL}&changes=${changes}&sources=${sources}`; //compile the full URL based on the URL paths

} //end of the load image function
</script>

So in some way, I need to know how to make the iframe focused when you click it

I think I can resolve the issue so <key [space V] pressed?> and ask [What yer name?] and wait can work again, by using JavaScript, like this:

document.getElementsByName("byobFrame")[0].contentWindow.document.body.focus();
41

Umm, no. Just preserving known BYOB versions (so they don't get lost) and running it online.