Scratch

scimonster wrote:

We plan to mod Scratch, in HTML. BBP is block based programming.

I don't understand quite what you're planning... 

ProgrammingFreak wrote:

blob8108 wrote:

scimonster wrote:

We plan to mod Scratch, in HTML. BBP is block based programming.

I don't understand quite what you're planning... 

I believe that they are trying to 'recreate' Scratch in a web format. 

But I thought we already had Snap! (And JSScratch, sb2.js, etc — but they're only players)

scimonster wrote:

Well, Snap! is a Scratch mod made in HTML5, right? We plan on doing something sort of like that. I actually want to take some ideas from them.

Snap is not a mod(ification), it's a web application inspired by Scratch.

Last edited by nXIII (2012-09-22 15:26:18)

nXIII wrote:

scimonster wrote:

Well, Snap! is a Scratch mod made in HTML5, right? We plan on doing something sort of like that. I actually want to take some ideas from them.

Snap is not a mod(ification), it's a web application inspired by Scratch.

So call BBP.HTM a web app inspired by Scratch.

Fine, i modified the title. Better?

scimonster wrote:

Fine, i modified the title. Better?

The topic post still says mod.

Hardmath123 wrote:

blob8108 wrote:

scimonster wrote:

We plan to mod Scratch, in HTML. BBP is block based programming.

I don't understand quite what you're planning... 

... me neither. If you're planning to rewrite Scratch in HTML4/5 with some added features, then a) it wouldn't be a mod, b) we already have Snap!. We could mod Snap!, though. 

I changed it so that it doesn't say mod. As several people have pointed out. 

Snap! runs somewhat slowly. I think that pure elements would work faster. We could use ScratchBlocks for rendering, obviously modified.

I want it to be similar to Scratch, with many of the same blocks, but with some new ones, and the ability to create functions (i.e. reporters and booleans, not just stacks).

I want to implement Snap!'s idea of first class lists. Lambda is rather complicated, and i'm not sure about that. (I never fully understood it myself.)

There's also several new blocks i want to add to the default set, such as:
<if <bool> then [str1] else [str2]>
<true>
<false>
(type of [])
((num1) ^ (num2))
(ascii from [str])
([str] to ascii)
(letters (n1) to (n1) of [str])
([reverse/uppercase/lowercase/shuffle] of [str])
(index of [str1] in [str2])
(split [str1] into list by [str2])
(join [list] into string by [str])
(index of [str] in [list])
([reverse/shuffle/alphabetization] of [list])
(current [date/month/year/day of week/hour/minute/seconds/timezone])
(Unix timestamp)

If possible, i want to add some sort of regex support.

Ok, I see what you're trying to do now, but I personally don't really agree with everything you said. Just to be clear, though: this is similar to what you're talking about, right?

I like the idea of trying to do a version of Scratch with elements, but I'm not sure about your aims. As many people point out, when you make a mod, you want to develop one feature extremely well rather than just shine it up with lots of random features and new blocks. I think we should pick one aim, and develop a block-based toolkit for that aim.

My suggestion would be to try to do something like Apple's Quartz Composer, except optimized for 2D interactive graphics/screensavers/visuals. The interface would be nested blocks instead of patches with data wires, because that's easier to code and more intuitive to use. We could add options to export your finished product as a pure image or a JS file which you could embed in a webpage and use as, for example, a fancy menu bar. Instead of focusing on stacks and scripts, it might be cool to work with functional programming concepts (i.e. Scheme). A rectangle linked to Google might look like this:

rect
 > (collapse-me triangle thing)
|x: 0
|y: 0
|h: 0
|w: 0
|color: [#00FF00]
|border: 1
... (you get the point) ...
|url: [http://www.google.com]

P.S. Lambda is basically a function without a name. So while in JS you do

function a() {...}

to make a normal name function, you would use

function() {}

to make an anonymous function. This would be useful if, for example, you want to input a function to some procedure:

function do_three_times(f) {
  f(); f(); f();
}
do_three_times(function() {alert("Hello, world!");});

Last edited by Hardmath123 (2012-09-23 05:43:06)

Let's chat.

@Chat: Fair enough.

@Regexes: I think regexes are really overkill for block-based programming
(\b(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b kind of overkill). Scratch was designed for young users, and so the block-based programming was optimized for their use. When you're using regexes, you want to just bang it out on the keyboard, not stack many blocks together to get it right—in fact, regexes were designed for compactness originally. Also, regexes use a sort of notation which introduces lots of data types. For example, I assume you would represent /abc*/ as (join [a] [b] (zero or more of [c])). What data type would (zero or more of [c]) be? For that matter, what data type does the regex return? And what are flags? It's too many questions, and it really complicated stuff. I'm not saying someone needs to come up with a GUI for regexes, because I honestly agree with you there. I'm saying blocks are a bad way to handle it.

@More features of a "real" language: Though I'm impressed by how powerful Scratch is, I don't think it's worth it to make it a full-fledged programming language. In the end, it's more convenient to anyone to just type it out. We don't want to recreate Scratch for the heck of it, or for that matter add blocks because they are useful. Like BYOB (my role-model mod), aesthetics is important, too. We want maximum functionality out of a set of blocks.    Besides, as I mentioned above, we need to make sure we don't introduce too many data types of error catching will be a pain.

@Quatrz: What's wrong with Quartz? I really liked the way you could create totally beautiful screensavers out of a set of patches and shaders and stuff. Flurry was made in Quartz. That's impressive. I think functional graphics is a new twist to drag and drop which people haven't tried yet. Novelty is good! Imagine a programming language like this:

(rect
    origin: (point 0, 0)
    bounds: (point 100, 100)
    color: (color "red")
    color-if-highlighted: (color "green")
    color-if-hovered: (color "yellow")
    on-click-javascript: "…"
    link-to:"http://scratch.mit.edu"
)
(circle
    origin: (mouse position)
    radius: (timer)
)

It's like a combination of simplified CSS, PostScript, and Scheme, and it's interactive.

EDIT: I once made a toolkit where something like this makes a totally plausible menu:

window.onload=function() {
    World = document.getElementById("world");
    var can = new SpellCanvas(World);
    
    var box1 = new SpellObject(30,30,100,50);
    var box2 = new SpellObject(140,20,80,60);
    var box3 = new SpellObject(50,90,80,50);
    var box4 = new SpellObject(140,90,130,50);
    can.render=function(ctx) {
        box1.style={borderSize:5, r1:10, r2:10, r3:0, r4:10, borderColor:"darkOrange", color:"orange", text:"Search", shadow:true, fontColor:"darkOrange"};
        box2.style={borderSize:5, r1:10, r2:10, r3:10, r4:0, borderColor:"darkBlue", color:"blue", text:"Apps", shadow:true, fontColor:"darkBlue"};
        box3.style={borderSize:5, r1:10, r2:0, r3:10, r4:10, borderColor:"darkRed", color:"red", text:"Maps", shadow:true};
        box4.style={borderSize:5, r1:0, r2:10, r3:10, r4:10, borderColor:"green", color:"limeGreen", text:"Translate", shadow:true};
        
        box1.hover={shadow:false};
        box2.hover={shadow:false};
        box3.hover={shadow:false};
        box4.hover={shadow:false};
        
        box1.onclick=function() {
            window.open("http://www.google.com");
        }
        box2.onclick=function() {
            window.open("http://translate.google.com");
        }
        box3.onclick=function() {
            window.open("http://maps.google.com");
        }
        box4.onclick=function() {
            window.open("http://apps.google.com");
        }
        
        box1.render(can);
        box2.render(can);
        box3.render(can);
        box4.render(can);
    }
}

Last edited by Hardmath123 (2012-09-23 07:12:46)

blob8108 wrote:

Hardmath123 wrote:

I think regexes are really overkill for block-based programming
(\b(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b kind of overkill).

Have you seen the regex for validating email addresses according to the spec?

blob8108 wrote:

Hardmath123 wrote:

blob8108 wrote:

Have you seen the regex for validating email addresses according to the spec?

Email addresses are so complicated that most (sensible) people now recommend validating emails by simply checking they contain "@". 

Or actually writing a script to send a dummy email and recording any error messages.