Runnable Code Blocks Using a User Script
var canvas = document.createElement( "canvas" ),
ctx = canvas.getContext( "2d" );
canvas.width = 640;
canvas.height = 320;
canvas.style.margin = "0 auto";
canvas.style.background = "rgb( 0, 0, 32 )";
ctx.lineWidth = 5;
out.appendChild( canvas );
for ( var i = 0; i < 1024; ++i ) {
ctx.strokeStyle = "rgba( 200, " + ((128 + Math.random() * 127)|0) + ", 0, " + 0.1 * Math.random() + " )";
ctx.beginPath();
ctx.arc( 320 - 40 * Math.random(), 160 - 20 * Math.random(), Math.random() * 256,
Math.random() * Math.PI * 1.5, Math.random() * Math.PI * 0.5, true );
ctx.stroke();
}
[ run with user script ]
$( out ).append( $( "<p>Hello World</p>" ) );
[ run with user script ]
var message = "Hello World",
messageEl = document.createElement( "p" );
messageEl.textContent = message;
out.appendChild( messageEl );
[ run with user script ]
Want to be able to run your code like that? Just add this line following a code block:
<img src="http://i.stack.imgur.com/V6KuG.gif" width="480" height="1" /><sup><sup><sup><sup><sup>**[` [ run with user script ] `](http://scripts.jeremybanks.ca/run-stackexchange-code-0.0.user.js)**</sup></sup></sup></sup></sup>
Your code's wrapped in a function under the global context, only given the out element as an argument.
Prevent Scroll Bars From Being Hidden on Code Blocks on Mac OS X 10.7 "Lion"
Here's a code block that's probably scrollable in both directions. If you're using a trackpad with Mac OS X 10.7 "Lion", you can install this user script that uses this code to prevent scroll bars from being hidden on code blocks.
atest( "TO FAIL | return false", function () { return false; } );
atest( "TO FAIL | do nothing", function () { } );
atest( "TO FAIL | error", function () { throw new Error; } );
atest( "TO FAIL | don't let more than 2 seconds pass", function ( assert, pass, toCleanUp ) {
var start = new Date;
return function poll () {
assert( ((new Date) - start) < 2000, "two seconds must not pass" );
return poll;
}
} );
atest( "return true", function () { return true; } );
atest( "Count to 10 Over 1 Second", function ( assert, pass, toCleanUp ) {
var val = 0,
incInterval = setInterval( incVal, 100 );
function incVal () {
val += 1;
}
toCleanUp(function () {
clearInterval( incInterval );
})
return function poll () {
return ( val > 10 ) ? true : poll;
};
});
atest( "Load /", function ( assert, pass, toCleanUp ) {
jQuery.ajax( "/" ).done(function ( data ) {
pass( "Loaded " + data.length + " chars." );
});
});
atest( "Adding even integers doesn't produce an odd one", function ( assert, pass, toCleanUp ) {
for (var n = -10000; n < 10000; n += 2) {
assert( n % 2 === 0, "" + n + " is not a multiple of two." )
}
pass();
});
/*\
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
atest( name, body( assert, pass, toCleanUp ) ); *
Declares an test with the specifed name and body. It will be *
run synconously with other tests defined syncronously with it. *
*
runaTest( body( assert, pass, toCleanUp ) ); *
Executes a test body and returns a promise of the result. *
*
A test body can return true to pass, false to fail or a function *
to continue to it asyncronously. This happens with a delay, so it *
can be used to poll some state. *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
\*/
runaTest.timeout = 5000;
runaTest.tickDelay = 100;
atest.cooldown = 250;
function atest ( name, body ) {
if ( !atest.buffer ) {
atest.buffer = [];
setTimeout( triggerTests, 0 );
}
atest.buffer.push( [ name, body ] );
function triggerTests () {
var buffer = atest.buffer,
i = 0;
delete atest.buffer;
triggerNext();
function triggerNext () {
if ( i < buffer.length ) {
var name = buffer[ i ][ 0 ],
body = buffer[ i ][ 1 ],
testRun = runaTest( body );
testRun.then(function passed () {
$("<p/>").text( [ "pass [" + name + "]" ].concat( [].slice.call( arguments ) ).join(" - ") ).appendTo(out);
}, function failed () {
$("<p/>").text( [ "FAIL [" + name + "]" ].concat( [].slice.call( arguments ) ).join(" - ") ).css("color", "red").appendTo(out);
});
testRun.always(function () {
setTimeout( triggerNext, atest.cooldown );
});
++i;
}
}
}
}
function runaTest ( body ) {
var result = new jQuery.Deferred,
tickInterval = setInterval( tick, runaTest.tickDelay ),
timeoutTimeout = setTimeout( result.reject, runaTest.timeout, "Timeout" ),
active = body;
return result.promise();
function assert ( condition, msg ) {
if ( !condition ) {
var failArgs = [ "Assertion failed" ].concat( [].slice.call( arguments, 1 ) );
result.reject.apply( result, failArgs ) ;
}
}
function tick () {
if ( result.state() === "pending" ) {
if ( typeof active === "function" ) {
try {
active = active.call( result, assert, result.resolve, result.always );
} catch ( ex ) {
result.reject( "Uncaught exception", ex );
$("<p/>").text(ex.stack).appendTo(out);
}
} else if ( active === true ) {
result.resolve();
} else if ( active === false ) {
result.reject();
}
} else {
clearInterval( tickInterval );
}
}
}
[ run with user script ]
Tag Markup Castle
lhello-and-welcome-to
lbanks--sand--castle+
l
l
l
llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll
l llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll l
llllll llllll l l llllll llllll llllll l l llllll llllll
l llllll llllll llllll llllll llllll llllll llllll llllll l
llllll llllll l l llllll llllll llllll l l llllll llllll
llll llllll llllll llllll llllll llllll llllll llllll llllll llllll llll
llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll
l llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll l
llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll
l llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll l
llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll
l llllll llllll llllll llllll llllll llllll l l llllll llllll llllll llllll llllll llllll l
llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll
l llllll llllll llllll llllll llllll llllll l l llllll llllll llllll llllll llllll llllll l
llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll llllll
Stack Overflow
Meta Stack Overflow
Stack Overflow Careers 2.0
1` 1` characters – agf Oct 2 '11 at 0:43for (var i = 0; i < list.length; i++) (function(i) { ...})(i);This gives each run of the loop body an independent variablei. If the loop body needs write access to the loop variable, you can instead enclose the inner function:(function(i){return( ...original function(..){..} goes here...)})(i)– Matt Aug 3 at 11:34