Gabriel2900 wrote:

Thx jokebookservice1 and bharvey

MichaelOlifant wrote:

Try it here

jokebookservice1 wrote:

Gabriel2900 wrote:

How does this block work?

(JavaScript function \(\ @addInput \)\ \{\ [] } ::operators)

Well, there is a text-based programming language called JavaScript, and if you want to write some code in that language instead of Snap, you can define a function and it will act like a Snap! one.

Let's do an example of a function that joins two strings together.

function (firstParameter, secondParameter) {
    return firstParameter + secondParameter;
}

is how you would write it in JavaScript. Well, you can write that using the Snap! block like so

(JavaScript function \(\ [firstParameter] [secondParameter] @addInput \)\ \{\ [return firstParameter + secondParameter;] } ::operators)

what's great about this is that you can interact with sprites, the canvas (where the result is displayed) and also some features that are only available in JavaScript (perhaps also a flaw with the block).

For example, pop-ups and playing arbitrary audio becomes much easier with the block.

But how do you run it? Well, you can just use the block just like any other reporter block in Snap!, you can call it

call (JavaScript function \(\ [firstParameter] [secondParameter] @addInput \)\ \{\ [return firstParameter + secondParameter;] } ::operators) [Hello ] [World] @addInput ::control reporter

You can use it as a mapping function over an array, and much much more.

As I say, it can also modify lots of things such as the costumes of snap, something that other blocks in Snap can't do. Good luck!

function ExampleFunc ()
{
  this.gotoXY(0,0);
};

ExampleFunc();

ironmannn wrote:

Speaking of which, how come I cant write something like this within the block?

function ExampleFunc ()
{
  this.gotoXY(0,0);
};

ExampleFunc();

it just errors out and returns “this.gotoXY is not a function”

var myself = this;
function exampleFunc ()
{
  myself.gotoXY(0, 0);
}
exampleFunc();

function exampleFunc() { /* ... */ }
exampleFunc = exampleFunc.bind(this);
exampleFunc();

var exampleFunc = () => {
  this.gotoXY(0, 0);
};
exampleFunc();

_nix wrote:

ironmannn wrote:

Speaking of which, how come I cant write something like this within the block?

function ExampleFunc ()
{
  this.gotoXY(0,0);
};

ExampleFunc();

it just errors out and returns “this.gotoXY is not a function”

That's because of JavaScript's annoying scoping issues – basically “this” will become undefined in ExampleFunc. (PS, you should probably be starting your function names with lower case letters, likeThis! That's just the global JS convention.)

var myself = this;
function exampleFunc ()
{
  myself.gotoXY(0, 0);
}
exampleFunc();

That should work. In that case, you're storing the this-object (the sprite) in a variable called “myself”, which you can access from exampleFunc.

You can also use “bind” to change the value of “this” within that function:

function exampleFunc() { /* ... */ }
exampleFunc = exampleFunc.bind(this);
exampleFunc();

Or you could use the “new” ES6 arrow functions, which keep the value of the this-object from the this-object that created it:

var exampleFunc = () => {
  this.gotoXY(0, 0);
};
exampleFunc();

ironmannn wrote:

Is there a way to force updates to the canvas as I'm running JS code?

// Do something..
//-
// Now wait for the canvas to update..
requestAnimationFrame(function() {
  //-
  // And then do further code..
  //-
});

bharvey wrote:

MichaelOlifant wrote:

Try it here

I'm confused; that page is a (presumably modified) Snap!, so I was expecting to see a TUPLE block, like LIST but etc., but instead I'm supposed to use JSFunction?

tyranex wrote:

once I came back to my project after saving it and re opening it at a later time, I find that all the sprites have a weird blur effect on it. For an example, I'd have a red 2x2 dot that's got the exact same colour in each pixel. I exit my work, and come back to it Iater, and then the 2x2 dot is now a 3x3, the new pixels are a lighter shade of the original red.

bharvey wrote:

tyranex wrote:

once I came back to my project after saving it and re opening it at a later time, I find that all the sprites have a weird blur effect on it. For an example, I'd have a red 2x2 dot that's got the exact same colour in each pixel. I exit my work, and come back to it Iater, and then the 2x2 dot is now a 3x3, the new pixels are a lighter shade of the original red.

This is absolutely the right place to ask such questions!

What you are seeing is the dreaded anti-aliasing, [rant]one of the worst ideas in the history of computer science[/rant]. In order to create the appearance of smooth diagonal lines, instead of discrete stairsteps, graphics systems these days change the color of pixels near what would otherwise be an abrupt change in color, to take on intermediate color values. This would be fine if they kept the color values you asked for in the data structures, and only at the very moment of display did the blurring. But instead as you're drawing a line, or the edge of a rectangle, they put down blurred pixels in the remembered picture you're drawing. Not only does this look bad in itself, but it makes things like floodfill not work right.

Someday before I die I'm going to talk Jens into doing this right, or, failing that, just turn off anti-aliasing altogether. But meanwhile, draw your costumes pixel-by-pixel in some other graphics program, and stay out of the costume editor.

bharvey wrote:

What you are seeing is the dreaded anti-aliasing, [rant]one of the worst ideas in the history of computer science[/rant].

((text) reversed :: operators) :: control hat
script variables (i) (result) @delInput @addInput :: grey
set [result v] to (list @addInput :: list)
set [i v] to (length of (text))
repeat (length of (text))
add (letter (i) of (text)) to (result)
change [i v] by (-1)

end
report (join input list: (result) :: operators) :: control cap

((text) scrambled :: operators) :: control hat
script variables (i) (result) @delInput @addInput :: grey
set [result v] to (list @addInput :: list)
set [i v] to [0]
repeat (length of (text))
change [i v] by (1)
insert (letter (i) of (text)) at (random v) of (result)
end
report (join input list: (result) :: operators) :: control cap

bharvey wrote:

MichaelOlifant wrote:

Try it here

I'm confused; that page is a (presumably modified) Snap!, so I was expecting to see a TUPLE block, like LIST but etc., but instead I'm supposed to use JSFunction?

(tuple [] @delInput @addInput:: list)

MichaelOlifant wrote:

bharvey wrote:

MichaelOlifant wrote:

Try it here

I'm confused; that page is a (presumably modified) Snap!, so I was expecting to see a TUPLE block, like LIST but etc., but instead I'm supposed to use JSFunction?

What? There's a

(tuple [] @delInput @addInput:: list)

block!

(list @addInput :: list)

Gabriel2900 wrote:

MichaelOlifant wrote:

bharvey wrote:

MichaelOlifant wrote:

Try it here

I'm confused; that page is a (presumably modified) Snap!, so I was expecting to see a TUPLE block, like LIST but etc., but instead I'm supposed to use JSFunction?

What? There's a

(tuple [] @delInput @addInput:: list)

block!

Effects: same as this block:

(list @addInput :: list)

Gabriel2900 wrote:

MichaelOlifant wrote:

bharvey wrote:

MichaelOlifant wrote:

Try it here

I'm confused; that page is a (presumably modified) Snap!, so I was expecting to see a TUPLE block, like LIST but etc., but instead I'm supposed to use JSFunction?

What? There's a

(tuple [] @delInput @addInput:: list)

block!

Effects: same as this block:

(list @addInput :: list)