text:
Making Future Posts Runnable Online with Stack Snippets
Stack Snippets were recently added to PPCG! Reminiscent of JSFiddle, Stack Snippets allow HTML, CSS, and JavaScript to be run directly in posts!
Here is a very simple Stack Snippet:

alert('This is JavaScript')
h3 { color: red } /* This is CSS */

This is HTML

This feature of Stack Exchange would be very useful for us if languages besides JavaScript were supported. (The answers to challenges could be tested on the spot, example inputs could be generated dynamically, etc.) This is where you come in.
Challenge
The goal of this challenge is to write an interpreter for some programming language using Stack Snippets and JavaScript. The point is to make something that can be easily copied and used in future PPCG questions and answers.
More or less, you need to create a Stack Snippet that has a "run" button and two textboxes, one for code and one for input. Clicking the run button will execute the code (written in the language you're interpreting) on the input and display the result (probably in another textbox). The snippet should be something akin to cjam.aditsu.net or the sample answer.
For most languages it would make sense for the input and output to represent stdin and sdout respectively, and you might have another input box for the command line. But not all languages have have such traditional I/O mechanisms. HQ9+, for example, doesn't even have input, making a textbox for it pointless. So feel free to take some liberties, design around the language, not this spec. The main requirement is that your language be "runnable" in a Stack Snippet in the accepted sense of the term.
Notes

Implementing every single feature of your language, though ideal, is not required. Some things like reading and writing files or importing libraries may be unwieldy or impossible. Focus on making an interpreter that maximizes utility for use on this site.
Posting a "language X to JavaScript" interpreter that you didn't write is ok (with attribution).
Stack Exchange limits answers to 30,000 characters, so plan accordingly if your interpreter is likely to be long.
It is best that you make a version of your interpreter as easy as possible to include in future posts. For example, in the sample answer, the raw Markdown for the entire snippet is provided, with obvious places to put code and input.

Although this question is intended to be more a compendium of interpreters than a proper challenge, it is still a popularity-contest, so the highest voted answer wins.
List of Current Interpreters
(sorted alphabetically by language name)

Beam
Befunge-93
Brainfuck
Brainfuck
CHIQRSX9+
Deadfish
Deadfish (only runs preset code)
Fourier
FRACTRAN
Hello++
HQ9+
Insomnia
Japt
JavaScript (sample answer)
JavaScript ES2015
Marbelous
Neoscript
oOo CODE
Ouroboros
Prelude
Python 2
STATA
TI-Basic
Unary (translates to BF)

(This question might be better suited for Meta but it will be more visible here. People might actually produce very useful interpreters, I think they deserve the rep for it.)

It wouldn't be very fun, but the more practical answer for harder languages like Python would probably be to simply outsource it.

I have no idea how to run these snippets using the stack exchange app.

I hope someone tackles C with this challenge.  Here's a head start: http://stackoverflow.com/questions/6142193/c-interpreter-written-in-javascript

Food for thought...

@Sp3000: Or look for libraries... like below.

I tried doing for CJam, but it gave various CSP insecure errors :( .

Would be awesome if someone could do OCaml. There's already http://try.ocamlpro.com/ (source at https://github.com/OCamlPro/tryocaml), and js_of_ocaml, an OCaml to javascript compiler.

What is the bounty winning criteria ? "Larger array of languages" - Do you mean that the same person post answers for more languages ?

@Optimizer It doesn't matter who posts it, I just want to see more languages than the 4 we currently have. The winner will be chosen at my discretion. It is like to be the person who obviously put the most effort in.

I've been working on writing a Befunge-93 interpreter today. It's close to done, so I'm hoping to post it soon. I noticed my old interpreter was flawed, so I decided to start from scratch.

Coming to think about it: aren't answers relying on external resources sort of defying the purpose here? They are in no way "future-proof". If they're okay I'll find a PHP proxy to fire a POST request to the Golfscript parser and parse it's output. :)

I've been wanting to do a self-contained Python 3 builtins-only snippet, but my (broken) parser already takes up 10k, packed...

@IngoBürk The external interpreters are kind of against the point of self-contentedness (and I'm more likely to give my bounty to a local interpreter) but they can still be quite useful.

I am planning on doing a partial C++ to Python 3 after this semester is over, featuring the most common things (input/output, random numbers, loops, if/ternary if, ...).  If someone will write a Python 3 interpreter, we can chain them together.

I wonder if such snippet can send the source to an external server that would transpile it to JS then send it back... Would need to insert back the JS into the answer. Maybe doable...

Are we allowed to add languages written after the creation of this post?

@BetaDecay Sure. Though I don't think I'll be changing the accepted answer.

I'd like to see one for Retina, honestly. An online interpreter would be pretty useful.

Also, if anyone wants to make a snippet for Ruby, there's already a client-side JS interpreter available.

Slightly off-topic but relevant, https://repl.it runs with their own client-side JavaScript interpreters for [Python3, Ruby, Scheme, Lua, Java, QBasic, Forth, APL, Go, C, C++, Bloop, Emoticon, LOLCODE, BrainFuck, Unlambda, PHP, and various JavaScript derivatives].

Not exactly an answer of its own, but something to add to all of these.

Python 2 (No STDIN)
Thanks to Skulpt, it has become very easy to write a Python interpreter.

function out(text) {
  var output = document.getElementById("output");
  output.innerHTML = output.innerHTML + text;
}

function builtinRead(x) {
  if(Sk.builtinFiles === undefined || Sk.builtinFiles["files"][x] === undefined)
    throw "File not found: '" + x + "'";
  return Sk.builtinFiles["files"][x];
}

function run() {
  var program = document.getElementById("python-in").value;
  var output = document.getElementById("output");

  output.innerHTML = "";

  Sk.canvas = "canvas";
  Sk.pre = "output";

  Sk.configure({
    output: out,
    read: builtinRead
  });

  try {
    Sk.importMainWithBody("<stdin>", false, program);
  }
  catch(e) {
    throw new Error(e.toString());
  }
}
#python-in {
  border-radius: 3px;
  background: rgb(250, 250, 250);
  width: 95%;
  height: 200px;
}

#output {
  border-radius: 3px;
  background: lightgray;
  width: 95%;
  height: 200px;
  overflow: auto;
}

#canvas {
  border: 1px solid gray;
  border-radius: 3px;
  height: 400px;
  width: 400px;
}

Python code:

<textarea id="python-in" name="python-in" rows="10" cols="80"></textarea>

<button id="run-code" onclick="run()">Run</button>

Output:

Canvas for turtles:

<canvas height="400" width="400" id="canvas">Your browser does not support HTML5 Canvas!</canvas>

No STDIN, but it's a pretty complete implementation of Python in JS. I would load the libraries from somewhere else but I can't find a host of them.

Wow, from random import randrange even works. Nice!

Now just load the Marbelous source into this interpreter and you got yourself a Marbelous interpreter!

It seems to be python2 since print 2 works. Worth mentioning, I guess.

Yeah, skulpt hasn't built a python3 version yet

Skulpt has since updated and moved a few files, thought you might want to know

@Sp3000 It appears they haven't updated the docs on how to use it in a webpage though... I'm going to have to leave this alone until then

I'm not sure if it's more funny or more cool to think of Marbelous running inside a python interpreter running inside javascript running inside a web browser

This doesn't work anymore, presumably because the links in the JavaScript:
<tt>function(x) {</tt>
<textarea id='c'rows='4'cols='60'></textarea>
<tt>}</tt>

Input string (variable x):
<textarea id='i'rows='4'cols='60'></textarea>
<input type='button'value='Run'onclick='r()'>
Output (return value):
<textarea id='o'rows='4'cols='60'style='background-color:#f0f0f0;'></textarea>

The raw Markdown for including this Stack Snippet in another question or answer is:

BEGIN_CODE
// Put JavaScript code here
// it may be on multiple lines
END_CODE_BEGIN_INPUT
Put input here
it may be on multiple lines
END_INPUT
JavaScript:
<tt>function(x) {</tt>
<textarea id='c'rows='4'cols='60'></textarea>
<tt>}</tt>

Input string (variable x):
<textarea id='i'rows='4'cols='60'></textarea>
<input type='button'value='Run'onclick='r()'>
Output (return value):
<textarea id='o'rows='4'cols='60'style='background-color:#f0f0f0;'></textarea>

To use it simply copy it into a new post and put your code on the lines between BEGIN_CODE and END_CODE_BEGIN_INPUT, and your input on the lines between END_CODE_BEGIN_INPUT and END_INPUT. The interpreter will do the rest. Note that nothing needs to be indented.
I would argue that this BEGIN...END technique is presently the best way we have to write these interpreters in terms of ease of future use because...

When rendered there is only one code block (the HTML one) and only one line of it is "extra".
The user writing the snippet can see exactly where to place their code and input. They don't have to search for the appropriate textarea tag.
Users reading the post can easily distinguish the code without even running the snippet. Of course when the snippet is run the code is obvious.
It only breaks when the begin/end identifiers appear on their own lines within the code or the input. But this is unlikely, and they can be changed if absolutely necessary.
It is self contained. All the code is right there. (I know this might be impossible for a larger interpreter but one of the points of Stack Snippets was to combat dead links to JSFiddle and such, so self-containedness is good.)
It could be expanded to suit any number of (text based) inputs.

The snippet below is the non-minimized general version, complete with example and a bit more styling.

function example() {
  document.getElementById('code').value = "var lines = x.split('\\n')\nvar sum = 0\nfor (var i = 0; i < lines.length; i++) {\n  var val = parseInt(lines[i])\n  if (!isNaN(val)) {\n    sum += val\n  }\n}\nreturn sum"
  document.getElementById('input').value = '1\n2\n3'
  run()
}

function run() {
  var run = null, example = null; //shadow other globals
  eval('var f=function(x) {' + document.getElementById('code').value + '}')
  document.getElementById('output').value = String(f(document.getElementById('input').value))
}
#output {
  background-color: #f0f0f0;
}

#run {
  font-size: 120%;
}
JavaScript:

<tt>function(x) {</tt>

<textarea id='code' rows='12' cols='60'></textarea>

<tt>}</tt>

Input string (variable x):

<textarea id='input' rows='6' cols='60'></textarea>

<input id='run' type='button' value='Run' onclick='run()'>

Output (return value):

<textarea id='output' rows='6' cols='60'></textarea>

Example: Sum Numbers

Brainfuck (with basic debugger)
I saw the brainfuck answer and thought: you know what would be awesome? If I could pretend I understand what brainfuck code is doing. And hence I made a basic brainfuck interpreter and debugger. The debugger is SLOW, but it works pretty well, albeit I havent implemented breakpoints as of now (on the todo list).
Note: the Brainfuck "virtual machine" doesnt auto reset after running the code. Press reset manually or the tape will have the same values on it that existed at the end of the last program run.
The debugger works best in full screen.

var mycode = "++++++++++[>+++++++>++++++++++>+++>+<<<<-]>++.>+.+++++++..+++.>++.<<+++++++++++++++.>.+++.------.--------.>+.>.";

function Brainfuck()    {
    this.cell_max = 255;
    this.read = function()    {return 0;}
    this.reset();
}

Brainfuck.prototype.reset = function()    {
    this.stack = [0];
    this.stackptr = 0;

    this.printbuffer = "";
}

Brainfuck.prototype.setCode = function(code)    {
    this.code = code;
    this.codeptr = 0;

    this.loop_map = {};
    var loops = [];
    for(var i = 0; i < this.code.length; i++)    {
        if(this.code[i] == '[')    {
            loops.push(i);
        }    else if(this.code[i] == ']')    {
            var last = loops.pop();
            this.loop_map[last] = i;
            this.loop_map[i] = last;
        }
    }
}

Brainfuck.prototype.done = function()    {
    return !(this.codeptr < this.code.length);
}

Brainfuck.prototype.step = function()    {
    switch(this.code.charAt(this.codeptr))    {
        case '>':
            if(++this.stackptr >= this.stack.length)    {
                this.stack.push(0);
            }
            break;
        case '<':
            if(--this.stackptr < 0)    {
                this.stackptr = this.stack.length - 1;
            }
            break;
        case '+':
            if(++this.stack[this.stackptr] > this.cell_max)    {
                this.stack[this.stackptr] = 0;
            }
            break;
        case '-':
            if(--this.stack[this.stackptr] < 0)    {
                this.stack[this.stackptr] = this.cell_max;
            }
            break;
        case '.':
            this.print();
            break;
        case ',':
            this.stack[this.stackptr] = this.read();
            break;
        case '[':
            if(this.stack[this.stackptr] == 0)    {
                this.codeptr = this.loop_map[this.codeptr];
            }
            break;
        case ']':
            if(this.stack[this.stackptr] != 0)    {
                this.codeptr = this.loop_map[this.codeptr];
            }
            break;
        default:

    }
    while(!this.done() && '><+-.,[]'.indexOf(this.code[++this.codeptr]) == -1);
}

Brainfuck.prototype.print = function()    {
    this.printbuffer += String.fromCharCode(this.stack[this.stackptr]);
}

// UI File

var $ = document.getElementById.bind(document);
var $_ = document.createElement.bind(document);

String.prototype.decodeHTML = function() {
    var map = {"gt":">", "lt":"<", "nbsp":""};
    return this.replace(/&(#(?:x[0-9a-f]+|\d+)|[a-z]+);?/gi, function($0, $1) {
        if ($1[0] === "#") {
            return String.fromCharCode($1[1].toLowerCase() === "x" ? parseInt($1.substr(2), 16)  : parseInt($1.substr(1), 10));
        } else {
            return map.hasOwnProperty($1) ? map[$1] : $0;
        }
    });
}

var bf = new Brainfuck();

var setup = function()    {
    bf.setCode($('code').value.decodeHTML());
    bf.read = function()    {
        var stdin = $('stdin').value;
        if(bf.read.index < stdin.length)    {
            return stdin[bf.read.index++].charCodeAt(0);
        }
        return 0;
    }
    bf.read.index = 0;
}

var run = function()    {
    setup();

    var stdout = $('stdout');
    var func = function()    {
        for(var i = 0; i < 500000 && !bf.done(); i++)    {
            bf.step();
        }
        stdout.innerHTML = bf.printbuffer;
        setTimeout(func, 0);
    };
    func();
}

var debug = function()    {
    $('debug-area').style.display = 'block';

    setup();

    var running = $('running-code');
        for(var i = 0; i < bf.code.length; i++)    {
            var s = $_('span');
            s.innerHTML = bf.code[i];
            s.style.fontFamily = "Courier";
            running.appendChild(s);
        }
        running.children[bf.codeptr].setAttribute('class', 'selected');

    genStackTable();
}

var genStackTable = function()    {
    var stable = $('stack-table');
    var head = stable.createTHead();
        var row = head.insertRow(0);
            row.insertCell(0).innerHTML = 'ptr';
            row.insertCell(1).innerHTML = 'addr';
            row.insertCell(2).innerHTML = 'value';
            row.insertCell(3).innerHTML = 'ASCII';
    var setStackVal = function(i, num, ascii, changed)    {
        return changed === num ? function() {
            ascii.value = String.fromCharCode(num.value);
            bf.stack[i] = num.value;
        } : function()    {
            num.value = ascii.value.charCodeAt(0);
            bf.stack[i] = num.value;
        }
    }
    for(var i in bf.stack)    {
        row = stable.insertRow();
        row.insertCell(0).innerHTML = i == bf.stackptr ? '>' : '';
        row.insertCell(1).innerHTML = i;
        var cell = row.insertCell(2);
            var numinput = $_('input');
                numinput.type = 'number';
                numinput.value = bf.stack[i];
            cell.appendChild(numinput);
        cell = row.insertCell(3);
            var asciiinput = $_('input');
                asciiinput.type = 'text';
                asciiinput.value = String.fromCharCode(bf.stack[i]);
                asciiinput.setAttribute('maxlength', 1);
            cell.appendChild(asciiinput);

        numinput.oninput = setStackVal(i, numinput, asciiinput, numinput);
        asciiinput.oninput = setStackVal(i, numinput, asciiinput, asciiinput);
    }
}

var debugRun = function()    {
    debugRun.pause = false;
    var func = function()    {
        step();
        if(!bf.done() && !debugRun.pause)    {
            setTimeout(func, $('step-duration').value);
        }
    }
    func();
}

var debugPause = function()    {
    debugRun.pause = true;
}

var step = function()    {
    var running = $('running-code');
    running.children[bf.codeptr].setAttribute('class', '');
    bf.step();
    $('stack-table').innerHTML = '';
    genStackTable();
    if(!bf.done())    {
        running.children[bf.codeptr].setAttribute('class', 'selected');
    }
    $('stdout').innerHTML = bf.printbuffer;
}

var reset = function()    {
    bf.reset();
    bf.read.index = 0;
    $('stdout').innerHTML = '';
    $('running-code').innerHTML = '';
    $('stack-table').innerHTML = '';
    $('debug-area').style.display = 'none';
}

var setStackSize = function()    {
    var sel = $('stackSize');
    bf.cell_max = parseInt(sel.options[sel.selectedIndex].value);
}

$('code').value = mycode;
input    {
    box-sizing:border-box;
    -moz-box-sizing:border-box;
}
div.textarea {
    -moz-appearance: textfield-multiline;
    -webkit-appearance: textarea;
    border: 1px solid gray;
    font: -webkit-small-control;
    font-family:Courier;
    height: 28px;
    overflow: auto;
    padding: 2px;
    resize: both;
    width: 200px;
    white-space:pre;
}
#debug-area    {
    display:none;
}
span.selected    {
    background-color:red;
}

Brainfuck

Code

        <textarea id="code"></textarea>

Stdin

        <textarea id="stdin"></textarea>

Stdout

        Cell Size
        <select id="stackSize" onchange="setStackSize()">
            <option value="255">8-bit</option>
            <option value="65535">16-bit</option>
            <option value="4294967296">32-bit</option>
        </select>

        <button id="run" onclick="run()">Run</button>
        <button id="debug" onclick="debug()">Debug</button>
        <button id="reset" onclick="reset()">Reset</button>

Debug

            <button onclick="debugRun()">Run</button>
            <button onclick="debugPause()">Pause</button>
            Time between instructions
            <input id="step-duration" type="number" value=5 />

            <button onclick="step()">Step</button>

Executing Code

Stack

TODO:

add breakpoints
add range check to stack changing
progress indicator
make it look better
add rewind for debugging
change stdin to some sort of stream?
golf code a bit
?

Usage:
To use in a snippet somewhere on the site, change the first line of the snippet to include your code as "mycode".
To run code without debugger, simply press run. It buffers output for half a million instructions before updating stdout.
To debug, start by pressing the debug button.
The step button will step to the next instruction.
The run button will run the entire program, but one step at a time, updating the stack table every step (which is why this is so slow). The time between instructions is determined by the input box with that name.
The pause button pauses execution of the code. It can be resumed by pressing Run again.
All the values on the stack can be changed live to whatever you want. Be careful though, it doesnt range check if you change the integer value in the cell, so if you put in 300 with an 8-bit stack size, it doesnt really care and wont correct it until the next time it increments.

This is pretty neat. I love the debugger!

Japt
Japt (Javascript shortened) is a language I designed in September 2015. Due to being lazy busy, I didn't create an interpreter until early November. You can find the official interpreter and docs here.
Note: If you have any questions, suggestions, or bug reports, please post them in the Japt chatroom.

* { font-size:12px; font-family: Verdana, Geneva, sans-serif; } textarea { overflow: scroll; overflow-x: hidden; width: 90%; } table { float: left; margin-right: 6px; } table, th, td { border: 1px solid lightgrey; border-collapse: collapse; padding: 3px; } .mono { font-family: Fira Mono, Consolas, DejaVu Sans Mono, Inconsolata, Courier New, monospace; font-size: 10p; } #stderr { color: red; }

Code:

<textarea id="code" class="mono" rows="6">[U,V*Wg0 ,Wg1]qS</textarea>

Input:

<textarea id="input" class="mono" rows="2">"abc" 13 [9 "zyx"]</textarea>

  <input id="run" type="button" value="Run" onclick="Japt.run(document.getElementById('code').value, document.getElementById('input').value, false, null, function(x){Japt.output(x)}, function(x){Japt.error(x)})">
  <input id="stop" type="button" value="Stop" onclick="Japt.stop()">
  <input id="clear" type="button" value="Clear" onclick="Japt.clear_output()">

Output:

<textarea id="output" class="mono" rows="6" readonly></textarea>

Fun fact: this was originally the main interpreter (and in fact the only interpreter). You can see this if you look through the revision history.

Does Japt have a Github?

@Vɪʜᴀɴ Not yet, but I'll set one up in the next 24 hours.

@Vɪʜᴀɴ I should've said 24 minutes. ;) Here you go. Readme is on the way.

You should use rawgit.com instead of raw.githubusercontent.com - Chrome doesn't like the MIME type stuff.

@ןnɟuɐɯɹɐןoɯ Thanks, that saved a few bytes!

How would I convert input number to string? (i.e. input is 314151 and I want to split the input by 1: Uq1. But this only works if I wrap the input in quotes)

@nicael You can use Us q1, I believe.

Ah, thanks. I was looking for it in the wrong table.

A bug: Np0 squares N, but it should produce 1.

@nicael OK, will fix soon

How to replace without g flag?

@nicael  Try r"regex""replacement"P. The third param is the regex flags, so this basically means no regex flags. Can't test right now because I'm away from computer.

No, nothing changes :(

Why does "this is a "+T?"test: produce test and strips anything before +?

@nicael Because the JS code is basically ("this is a "+T) ? "test" : "". Try "this is a "+(T?"test: I'll take a look into the other problem when I'm back on my computer.

Haha, didn't read it properly :D

ceil and floor don't work. Throw "can't find variable: x"

@nicael Thanks for the bug report. I thought I'd fixed this, but I'll look into it again.

Please post any questions, suggestions, or bug reports in the Japt chatroom.

FRACTRAN
An semi-optimised interpreter for my favourite esoteric language! Unfortunately I don't have much time this week, so additional features will have to come later.

var ITERS_PER_SEC = 100000
var TIMEOUT_MILLISECS = 5000

var ERROR_INPUT = "Invalid input"
var ERROR_PARSE = "Parse error: "
var ERROR_TIMEOUT = "Timeout"
var ERROR_INTERRUPT = "Interrupted by user"

var running, instructions, registers, timeout, start_time, iterations;

function clear_output() {
  document.getElementById("output").value = ""
  document.getElementById("stderr").innerHTML = ""
}

function stop() {
  running = false
  document.getElementById("run").disabled = false
  document.getElementById("stop").disabled = true
  document.getElementById("clear").disabled = false
}

function interrupt() {
  error(ERROR_INTERRUPT)
}

function error(msg) {
  document.getElementById("stderr").innerHTML = msg
  stop()
}

function factorise(n) {
  var factorisation = {}
  var divisor = 2

  while (n > 1) {
    if (n % divisor == 0) {
      var power = 0

      while (n % divisor == 0) {
        n /= divisor
        power += 1
      }

      if (power != 0) {
        factorisation[divisor] = power
      }
    }

    divisor += 1
  }

  return factorisation
}

function fact_accumulate(fact1, fact2) {
  for (var reg in fact2) {
    if (reg in fact1) {
      fact1[reg] += fact2[reg]
    } else {
      fact1[reg] = fact2[reg]
    }
  }

  return fact1
}

function exp_to_fact(expression) {
  expression = expression.trim().split(/\s*\*\s*/)
  var factorisation = {}

  for (var i = 0; i < expression.length; ++i) {
    var term = expression[i].trim().split(/\s*\^\s*/)

    if (term.length > 2) {
      throw "error"
    }

    term[0] = parseInt(term[0])

    if (isNaN(term[0])) {
      throw "error"
    }

    if (term.length == 2) {
      term[1] = parseInt(term[1])

      if (isNaN(term[1])) {
        throw "error"
      }
    }

    if (term[0] <= 1) {
      continue
    }

    var fact_term = factorise(term[0])

    if (term.length == 2) {
      for (var reg in fact_term) {
        fact_term[reg] *= term[1]
      }
    }

    factorisation = fact_accumulate(factorisation, fact_term)
  }

  return factorisation
}

function to_instruction(n, d) {
  instruction = []
  divisor = 2

  while (n > 1 || d > 1) {
    if (n % divisor == 0 || d % divisor == 0) {
       reg_offset = 0

       while (n % divisor == 0) {
         reg_offset += 1
         n /= divisor
       }

       while (d % divisor == 0) {
         reg_offset -= 1
         d /= divisor
       }

      if (reg_offset != 0) {
        instruction.push(Array(divisor, reg_offset))
      }
    }

    divisor += 1
  }

  return instruction
}

function run() {
  clear_output()

  document.getElementById("run").disabled = true
  document.getElementById("stop").disabled = false
  document.getElementById("clear").disabled = true

  timeout = document.getElementById("timeout").checked

  var code = document.getElementById("code").value
  var input = document.getElementById("input").value

  instructions = []

  code = code.trim().split(/[\s,]+/)

  for (i = 0; i < code.length; ++i){
    fraction = code[i]

    split_fraction = fraction.split("/")

    if (split_fraction.length != 2){
      error(ERROR_PARSE + fraction)
      return
    }

    numerator = parseInt(split_fraction[0])
    denominator = parseInt(split_fraction[1])

    if (isNaN(numerator) || isNaN(denominator)){
      error(ERROR_PARSE + fraction)
      return
    }

    instructions.push(to_instruction(numerator, denominator))
  }

  try {
    registers = exp_to_fact(input)
  } catch (err) {
    error(ERROR_INPUT)
    return
  }

  running = true
  iterations = 0
  start_time = Date.now()

  fractran_iter(1)
}

function regs_to_string(regs) {
  reg_list = Object.keys(regs)
  reg_list.sort(function(a,b){ return a - b })

  out_str = []

  for (var i = 0; i < reg_list.length; ++i) {
    if (regs[reg_list[i]] != 0) {
      out_str.push(reg_list[i] + "^" + regs[reg_list[i]])
    }
  }

  out_str = out_str.join(" * ")

  if (out_str == "") {
    out_str = "1"
  }

  return out_str
}

function fractran_iter(niters) {
  if (!running) {
    stop()
    return
  }

  var iter_start_time = Date.now()

  for (var i = 0; i < niters; ++i)
  {
    program_complete = true

    for (var instr_ptr = 0; instr_ptr < instructions.length; ++instr_ptr){
      instruction = instructions[instr_ptr]
      perform_instr = true

      for (var j = 0; j < instruction.length; ++j)
      {
        var reg = instruction[j][0]
        var offset = instruction[j][1]

        if (registers[reg] == undefined) {
          registers[reg] = 0
        }

        if (offset < 0 && registers[reg] < -offset) {
          perform_instr = false
          break
        }
      }

      if (perform_instr) {
        for (var j = 0; j < instruction.length; ++j)
        {
           var reg = instruction[j][0]
           var offset = instruction[j][1]

           registers[reg] += offset
        }

        program_complete = false
        break
      }
    }

    if (program_complete) {
      document.getElementById("output").value += regs_to_string(registers)
      stop()
      return
    }

    iterations++

    if (timeout && Date.now() - start_time > TIMEOUT_MILLISECS) {
      error(ERROR_TIMEOUT)
      return
    }
  }

  setTimeout(function() { fractran_iter(ITERS_PER_SEC * (Date.now() - iter_start_time)/1000) }, 0)
}

    Code:

    <textarea id="code" rows="4" style="overflow:scroll;overflow-x:hidden;width:90%;">37789/221 905293/11063 1961/533 2279/481 57293/16211 2279/611 53/559 1961/403 53/299 13/53 1/13 6557/262727 6059/284321 67/4307 67/4661 6059/3599 59/83 1/59 14279/871933 131/9701 102037079/8633 14017/673819 7729/10057 128886839/8989 13493/757301 7729/11303 89/131 1/89 31133/2603 542249/19043 2483/22879 561731/20413 2483/23701 581213/20687 2483/24523 587707/21509 2483/24797 137/191 1/137 6215941/579 6730777/965 7232447/1351 7947497/2123 193/227 31373/193 23533/37327 5401639/458 229/233 21449/229 55973/24823 55973/25787 6705901/52961 7145447/55973 251/269 24119/251 72217/27913 283/73903 281/283 293/281 293/28997 293/271 9320827/58307 9831643/75301 293/313 28213/293 103459/32651 347/104807 347/88631 337/347 349/337 349/33919 349/317 12566447/68753 13307053/107143 349/367 33197/349 135199/38419 389/137497 389/119113 389/100729 383/389 397/383 397/39911 397/373 1203/140141 2005/142523 2807/123467 4411/104411 802/94883 397/401 193/397 1227/47477 2045/47959 2863/50851 4499/53743 241/409 1/241 1/239
</textarea>

Input:

    <textarea id="input" rows="2" style="overflow:scroll;overflow-x:hidden;width:90%;">2^47 * 193</textarea>

      Timeout:
      <input id="timeout" type="checkbox" checked="true"></input>

    Output:

    <textarea id="output" rows="6" style="overflow:scroll;width:90%;"></textarea>

      <input id="run" type="button" value="Run" onclick="run()"></input>
      <input id="stop" type="button" value="Stop" onclick="interrupt()" disabled="true"></input>
      <input id="clear" type="button" value="Clear" onclick="clear_output()"></input>

The example program above is my four squares together program - it takes input 2n * 193, and outputs 3a * 5b * 7c * 11d, such that a2 + b2 + c2 + d2 = n.
To-do

Snippet generator
Allow for factorisation notation for fractions too
Less terrible input validation
Clean up code to be better
Allow for printing of registers under special conditions (e.g. only register 2 is set, in the case of Conway's prime generator). Currently only programs which terminate produce any output.
Performance optimisations?

Usage

Fractions in the code are split by [\s,]+, allowing you to separate fractions by newlines, spaces or commas (or tabs, or even any combination of the above, if you're insane)
Input can be in factorisation notation, e.g. 2^5 * 3^7 * 11
Snippet generator coming some time later

Needs more semicolons. ASI is the work of devil.

Prelude
Maybe I can increase Prelude adoption a bit if people can just play around with it in their browsers, so here is a JavaScript interpreter. It's based on Sp3000's nifty Brainfuck interpreter, whose killer feature is interruptible execution and an optional time out.

var ITERS_PER_SEC = 100000;
var TIMEOUT_MILLISECS = 5000;
var ERROR_LOOP_MISMATCH = "Mismatched parentheses";
var ERROR_LOOP_MULTI = "Multiple parentheses in the same column";
var ERROR_TIMEOUT = "Timeout";
var ERROR_INTERRUPT = "Interrupted by user";

var code, input, timeout, num_input, num_output, loop_stack, loop_map;
var running, start_time, code_ptr, width, input_ptr, voices, iterations;

function clear_output() {
    document.getElementById("output").value = "";
    document.getElementById("stderr").innerHTML = "";
}

function stop() {
    running = false;
    document.getElementById("run").disabled = false;
    document.getElementById("stop").disabled = true;
    document.getElementById("clear").disabled = false;
    document.getElementById("num_input").disabled = false;
    document.getElementById("num_output").disabled = false;
    document.getElementById("timeout").disabled = false;
}

function interrupt() {
    error(ERROR_INTERRUPT);
}

function error(msg) {
    document.getElementById("stderr").innerHTML = msg;
    stop();
}

function run() {
    clear_output();

    document.getElementById("run").disabled = true;
    document.getElementById("stop").disabled = false;
    document.getElementById("clear").disabled = true;
    document.getElementById("num_input").disabled = false;
    document.getElementById("num_output").disabled = false;
    document.getElementById("timeout").disabled = false;

    code = document.getElementById("code").value;
    input = document.getElementById("input").value;
    num_input = document.getElementById("num_input").checked;
    num_output = document.getElementById("num_output").checked;
    timeout = document.getElementById("timeout").checked;

    loop_stack = [];
    loop_map = {};

    if (num_input) {
        input = input.match(/-?\d+/g).map(function (n) {
            return +n;
        });
    } else {
        input = input.split("").map(function (s) {
            return s.charCodeAt(0);
        });
    }

    code = code.split("\n");
    width = 0;
    for (var i = 0; i  width)
            width = code[i].length;
    console.log(code);
    console.log(width);
    for (var i = 0; i < width; ++i) {
        var hasParens = false;
        for (var j = 0; j < code.length; ++j) {
            var char = code[j][i];
            if (char == "(" || char == ")") {
                if (hasParens) {
                    error(ERROR_LOOP_MULTI);
                    return;
                }

                hasParens = true;
                if (char == "(") loop_stack.push({
                    x: i,
                    y: j
                });
                else {
                    if (loop_stack.length == 0) {
                        error(ERROR_LOOP_MISMATCH);
                        return;
                    } else {
                        var last_parens = loop_stack.pop();
                        loop_map[last_parens.x] = {
                            x: i,
                            y: last_parens.y
                        };
                        loop_map[i] = last_parens;
                    }
                }
            }
        }
        console.log(i);
        console.log(loop_stack);
    }

    if (loop_stack.length > 0) {
        error(ERROR_LOOP_MISMATCH);
        return;
    }

    console.log(loop_map);

    running = true;
    start_time = Date.now();
    code_ptr = 0;
    input_ptr = 0;
    voices = code.map(function () {
        return [];
    });
    iterations = 0;

    prelude_iter(1);
}

function prelude_iter(niters) {
    if (code_ptr >= width || !running) {
        stop();
        return;
    }

    console.log(voices);
    var iter_start_time = Date.now();

    for (var i = 0; i < niters; ++i) {
        var previousTops = voices.map(function(v) { return v[v.length-1] || 0; });

        for (var j = 0; j < code.length; ++j) {
            switch (code[j][code_ptr]) {
                case "0":
                case "1":
                case "2":
                case "3":
                case "4":
                case "5":
                case "6":
                case "7":
                case "8":
                case "9":
                    voices[j].push(+code[j][code_ptr]);
                    break;

                case "+":
                    var x = voices[j].pop() || 0;
                    var y = voices[j].pop() || 0;
                    voices[j].push(x + y);
                    break;

                case "-":
                    var x = voices[j].pop() || 0;
                    var y = voices[j].pop() || 0;
                    voices[j].push(y - x);
                    break;

                case "v":
                    voices[j].push(previousTops[j == code.length-1 ? 0 : j + 1]);
                    break;

                case "^":
                    voices[j].push(previousTops[j == 0 ? code.length-1 : j - 1]);
                    break;

                case "#":
                    voices[j].pop();
                    break;

                case "!":
                    var value = voices[j].pop() || 0;
                    document.getElementById("output").value += num_output ? value+"\n" : String.fromCharCode(value);
                    break;

                case "?":
                    if (input_ptr >= input.length) {
                        voices[j].push(0);
                    } else {
                        voices[j].push(input[input_ptr]);
                        ++input_ptr;
                    }
                    break;
            }
        }

        if (loop_map[code_ptr])
        {
            var other = loop_map[code_ptr];
            code_ptr = previousTops[other.y] ? Math.min(code_ptr, other.x) : Math.max(code_ptr, other.x);
        }

        ++code_ptr;
        ++iterations;

        if (timeout && Date.now() - start_time > TIMEOUT_MILLISECS) {
            error(ERROR_TIMEOUT);
            return;
        }
    }

    setTimeout(function () {
        prelude_iter(ITERS_PER_SEC * (Date.now() - iter_start_time) / 1000)
    }, 0);
}

Code:

    <textarea id="code" rows="4" style="overflow:scroll;overflow-x:hidden;width:90%;">1(  #^    #^^   (#^+!
6 9+ 05+5+^#^+! #^ ^+!
   (((1- )#^##)^^+   )7-!)1433545514232323344949145353495314235494040404232323013334492349532333344953493435343584233475234501333449530423232349495323232323495323230494)</textarea>

Input:

    <textarea id="input" rows="2" style="overflow:scroll;overflow-x:hidden;width:90%;">5a-13 11 2e3</textarea>

Numeric Input:
        <input id="num_input" type="checkbox">  Numeric Output:
        <input id="num_output" type="checkbox">  Timeout:
        <input id="timeout" type="checkbox" checked="checked">

        <input id="run" type="button" value="Run" onclick="run()">
        <input id="stop" type="button" value="Stop" onclick="interrupt()" disabled="disabled">
        <input id="clear" type="button" value="Clear" onclick="clear_output()">

Output:

    <textarea id="output" rows="6" style="overflow:scroll;width:90%;"></textarea>

Alternatively, here is a JSFiddle.
The interpreter is prepopulated with my quine, but you can easily find more example programs for to play around with by searching for Prelude answers of mine.
All the features of Prelude are implemented. The only shortcoming is the lack of arbitrary-precision arithmetic, due to JavaScript's number type. I might fix that at some point, since I only need to support addition and subtraction for arbitrary integers.
Input and output are usually the byte values of individual characters, but the interpreter comes with two flags to read and/or write (signed) numbers instead.
ToDo

Add minified version for copying.
Support arbitrary precision arithmetic.
Add snippet generator.

Deadfish

function run() {
  var code = document.getElementById("code").value
  var unicode = document.getElementById("unicode").checked
  var n = 0
  var output = ""

  for (var i = 0; i < code.length; ++i) {
    switch (code[i]) {
      case "i":
        n++
        break
      case "d":
        n--
        break
      case "s":
        n *= n
        break
      case "o":
        if (unicode) {
          output += String.fromCharCode(n)
        } else {
          output += n
          output += "\n"
        }
        break
      default:
        output += "\n"
    }

    if (n == -1 || n == 256) {
      n = 0
    }
  }

  document.getElementById('output').value = output
}

    Code:

    <textarea id="code" rows="8" style="overflow:scroll;overflow-x:hidden;width:90%;" wrap="hard">iiisdsiiiiiiiioiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiiiiiiiiooiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddoddddddddddddddddddddddddsiioiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiioiioddddddddddddoddddodddoiiiiiiiiiiiiiiiiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddodddddddddddddddddddddsdddddodddddodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddodddddddddddddddddddddddsiiiiiiiioiiiiiiiiiiiiiiiiiiiiiioiiiiiiofdddddddddddddddddddddddddddddddddddddddddddddoiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiiiiiiiiooiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddoddddddddddddddddddddddddsiioiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiioiioddddddddddddoddddodddoiiiiiiiiiiiiiiiiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddodddddddddddddddddddddsdddddodddddodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddodddddddddddddddddddddddsiiiiiiiioiiiiiiiiiiiiiiiiiiiiiioiiiiiiofdddddddddddddddddddddddddddddddddddddddddddddoiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiiiiiiiiooiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddoddddddddddddddddddddddddsiioiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiioiioddddddddddddoddddodddoiiiiiiiiiiiiiiiiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddoddddddddddddddddddddddddsiiiioiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiioddddoiiiiiiiiiiiiiiiiioddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddoddddddddddddddddddddddddsiiiioiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiioddddoiiioiioiiioiiiiiiiiiiodddddddddddofddddddddddddddddddddddddddddddddoiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiiiiiiiiooiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddoddddddddddddddddddddddddsiioiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiioiiiiiiiiioiioddddddddddddoddddodddoiiiiiiiiiiiiiiiiiiiiiiiiodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddodddddddddddddddddddddsdddddodddddodddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddodddddddddddddddddddddddsiiiiiiiioiiiiiiiiiiiiiiiiiiiiiioiiiiiio</textarea>

      <input id="unicode" type="checkbox" checked="true" />Use ASCII/Unicode mode

    Output:

    <textarea id="output" rows="6" style="overflow:scroll;width:90%;"></textarea>

    <input id='run' type='button' value='Run' onclick='run()' />

To pre-initialise the code box, just put something in between the textarea tags. Similarly, by adding checked="true" in the checkbox tag, you can have ASCII/Unicode mode on by default (as seen above).
Note that Deadfish itself doesn't actually have ASCII output in its original spec, I just put it in for questions which may allow "the next closest thing". If you're concerned that a question's rules may not allow Deadfish because of this, you can always look at something like Deadfish~ which does have ASCII output.
The example shown is from the Happy Birthday topic.

input elements have no content (nor closing tag). You should use <input />Foo instead of <input>Foo</input>

Needs more semicolons. ASI is the work of devil.

@nyuszika7h Sorry, I'll update when I have time (Too used to Python and I don't JS much)

Deadfish
This does not conform strictly to the requirement, it is my vision on how we could make use of Stack Snippets.
I don't like the amount of boilerplate, especially the need to include custom HTML for another Run button.
In my vision:

place a single

there should be a way to easily include the input as well I guess

Certainly, @SztupY. For now I am undecided whether to include the input also in the CSS piece or in the HTML one. Would not use the JavaScript piece for that, as the browsers will execute it before and some code may result endless loop in JavaScript. Sadly, there is no other way as other pieces are not copied over to the stack snippets server. :(

I think the code is fine in the CSS, and the input can go after the

For permalinks, use ESFiddle

I'm Downgoating this answer because when I try to run it, chrome alerts ERR_NAME_NOT_RESOLVED and then crashes the tab!

Chrome version 57 output ReferenceError: babel is not defined

Insomnia
The specs is ambiguous about the semantic of instruction 8 and 9, so they are not implemented.
Feel free to improve it to support instruction 0 to 7. There is also some incomplete code to run the program in slow motion, but it was buggy so I remove it from the interface.

function toAsciiValue(t) {
    var i = 0;
    var a = "";
    for (i = 0; i < t.length; i++) {
        a += t.charCodeAt(i);
    }
    return a;
}

// http://stackoverflow.com/questions/1219860/html-encoding-in-javascript-jquery
function escapeHTML(str)
{
    var div = document.createElement('div');
    var text = document.createTextNode(str);
    div.appendChild(text);
    return div.innerHTML;
}

var interpreter = (function () {
    var group;
    var ip;
    var gp;
    var bp;
    var code;
    var halted;
    var tid;
    var output = "";

    function flipbit() {
        group[gp] = group[gp] ^ (1 << bp);
    };

    var commands = {
        0: function () {
            flipbit();
            bp = (bp - 1) & 0x7;
        },
        1: function () {
            flipbit();
            bp = (bp + 1) & 0x7;
        },
        2: flipbit,
        3: function () { gp++; bp = 7; },
        4: function () { gp--; bp = 7; },
        5: function () { output += ~~group[gp]; },
        6: function () { output += String.fromCharCode(~~group[gp]); },
        7: function () {}
    };

    var nonprint = {
        "\0": "NUL",
        "\x01": "SOH",
        "\x02": "STX",
        "\x03": "ETX",
        "\x04": "EOT",
        "\x05": "ENQ",
        "\x06": "ACK",
        "\x07": "BEL",
        "\x08": "BS",
        "\x09": "TAB",
        "\x0a": "LF",
        "\x0b": "VT",
        "\x0c": "FF",
        "\x0d": "CR",
        "\x0e": "SO",
        "\x0f": "SI",
        "\x10": "DLE",
        "\x11": "DC1",
        "\x12": "DC2",
        "\x13": "DC3",
        "\x14": "DC4",
        "\x15": "NAK",
        "\x16": "SYN",
        "\x17": "ETB",
        "\x18": "CAN",
        "\x19": "EM",
        "\x1a": "SUB",
        "\x1b": "ESC",
        "\x1c": "FS",
        "\x1d": "GS",
        "\x1e": "RS",
        "\x1f": "US",
        "\x7f": "DEL",
        "\x80": "PAD",
        "\x81": "HOP",
        "\x82": "BPH",
        "\x83": "NBH",
        "\x84": "IND",
        "\x85": "NEL",
        "\x86": "SSA",
        "\x87": "ESA",
        "\x88": "HTS",
        "\x89": "HTJ",
        "\x8a": "LTS",
        "\x8b": "PLD",
        "\x8c": "PLU",
        "\x8d": "RI",
        "\x8e": "SS2",
        "\x8f": "SS3",
        "\x90": "DCS",
        "\x91": "PU1",
        "\x92": "PU2",
        "\x93": "STS",
        "\x94": "CCH",
        "\x95": "MW",
        "\x96": "SPA",
        "\x97": "EPA",
        "\x98": "SOS",
        "\x99": "SGCI",
        "\x9a": "SCI",
        "\x9b": "CSI",
        "\x9c": "ST",
        "\x9d": "OSC",
        "\x9e": "PM",
        "\x9f": "APC"
    }

    function exec(opcode) {
        var instruction = commands[opcode];
        if (typeof instruction === "function") {
            instruction();
        } else {
            halted = true;
            alert("Unsupported operation: " + opcode + ". Execution halted.");
        }
    }

    return {
        init: function (src) {
            group = [];
            ip = 0;
            gp = 0;
            bp = 7;
            halted = false;
            code = toAsciiValue(src);
            output = "";
            tid = void 0;

            this.update();
        },
        output: function () {
            return output;
        },
        update: function () {
            var dispCode = code + " ";
            document.getElementById('execcode').innerHTML =
                dispCode.substring(0, ip) + "" + dispCode[ip] + "" + dispCode.substring(ip + 1);

            document.getElementById('output').innerHTML =
                escapeHTML(output).replace(/[\x00-\x1f\x7f-\x9f]/g, function ($0) {
                    return "" + nonprint[$0] + "";
                });

            document.getElementById('gp').textContent = gp;
            document.getElementById('bp').textContent = bp;

            var dispByte = ("0000000" + (~~group[gp]).toString(2)).substr(-8);
            document.getElementById('currgr').innerHTML =
                dispByte.substring(0, 7 - bp) + "" + dispByte[7 - bp] + "" + dispByte.substring(8 - bp);
        },
        step: function () {
            if (ip >= code.length) {
                alert("The program has terminated. Reload the program to run from the beginning.");
                return;
            }

            if (halted) {
                alert("Execution has been halted and cannot be recovered");
                return;
            }

            exec(code[ip]);
            if (!halted) {
                ip++;
                this.update();
            }
        },
        slow: function () {
            // TODO: Complete this feature. May need to modify run and step.
            if (typeof tid == "number") {
                clearTimeout(tid);
                tid = void 0;
            } else {
                (function auto() {
                    if (!halted && ip = code.length) {
                alert("The program has terminated. Reload the program to run from the beginning.");
                return;
            }

            if (halted) {
                alert("Execution has been halted and cannot be recovered");
                return;
            }

            while (ip < code.length) {
                exec(code[ip]);

                if (!halted) {
                    ip++;
                } else {
                    // Break out of the loop and update the UI
                    break;
                }
            }

            this.update();
        }
    }
})();

document.addEventListener('DOMContentLoaded', function () {

    var $ascii = document.getElementById("ascii");
    var $workspace = document.getElementById("workspace");

    $ascii.textContent = toAsciiValue($workspace.value);

    $workspace.onkeypress = $workspace.onkeyup = function () {
        $ascii.textContent = toAsciiValue(this.value);
    }

    interpreter.init('');

    document.getElementById("load").onclick = function () {
        interpreter.init($workspace.value);
    }

    document.getElementById("run").onclick = function () {
        interpreter.run();
    }

    document.getElementById("step").onclick = function () {
        interpreter.step();
    }

});
body {
    font-family: 'Franklin Gothic Book', 'Trebuchet MS', 'Arial', sans-serif;
}

.code {
    font-family: monospace;
    word-wrap: break-word;
    white-space: pre-wrap;
}

pre.code, textarea.code {
    width: 100%;
}

table th {
    padding: 0 10px;
}

table .code {
    width: 100px;
    text-align: center;
}

td {
    border: 1px solid;
}

.highlight {
    background: pink;
}

.non-printable {
    background: black;
    color: white;
    border-radius: 4px;
    margin: 0 1px;
    padding: 0 1px;
}

.box {
    border: 2px groove;
    height: 6em;
}

Insomnia[?]

Currently only supports commands 0-7. Semantics of command 8 and 9 (WHILE loop) is not clearly understood, so it is not implemented.

This interpreter is greatly inspired by Ian's Befunge-93 interpreter.

Source code

<textarea cols="80" rows="5" id="workspace" class="code"></textarea>

ASCII sequence

<input type="button" id="load" value="Load program" />

Execution

<input type="button" id="run" value="Run" />
<input type="button" id="step" value="Step" />

Debug

    Group Pointer

    Bit Pointer

    Current group

Output

HQ9+
Since Calvin's Hobbies even used HQ9+ as an example, I decided to write a quick implementation for it. Well, partial implementation, as I decided to leave out the accumulator (you may hate me for that).
The interpreter is, let's say, partially golfed. I don't know why I sort of golfed it, but not really.

(function () {
    var bottles = (function beerMe(amount) {
        return "012, 01.\n3, 412.5".replace(/\d/g, function (c) {
            return [amount || "No more", " bottles of beer", " on the wall", amount ? "Take one down, pass it around" : "Go to the store and buy some more", ((amount || 100) - 1) || "no more", amount ? "\n\n" : ""][c];
        }) + (amount ? beerMe(amount - 1) : "");
    })(99);

    document.getElementById('run').onclick = function () {
        var source = document.getElementById('source').value,
            output = '';
        source.split('').forEach(function (command) {
            var index = ['H', 'Q', '9'].indexOf(command);
            (index + 1 && (output += ['Hello, world!', source, bottles][index], !0)) || alert('illegal command: ' + command);
        });

        document.getElementById('stdout').value = output;
    };
})();
#source, #stdout {
    display: block;
    width: 100%;
}

#stdout {
    white-space: pre;
    height: 50px;
}

#stdout, #run {
    margin-top: 3px;
}

    <input type="text" id="source" placeholder="Enter your HQ9+ program here" />
    <textarea id="stdout" wrap="off" readonly></textarea>
    <input type="button" id="run" value="Execute HQ9+" />

your if on the 9 command is backwards... says go to the store and buy some more every time but the last time

@pseudonym117 Oops. Fixed. A language with three (useful) commands and I still manage to print the wrong output. :)

Bug: "1 bottles of beer on the wall."

Your interpreter doesn't support increasing the accumulator!

I meant you should at least ignore the + command instead of throwing an error.

No plus! That means it's not HQ9+.

Whitespace

function interpret() {
    function num(sign, bits) { return sign * parseInt(bits.replace("S", "0").replace("T", "1"), 2); }
    var prog = document.getElementById("prog").value, esc = document.getElementById("esc").checked;
    if (!esc)
        prog = prog.replace(" ", "S").replace("\t", "T").replace("\n", "L");
    prog = prog.replace(/[^STL]/g, "");
    var stack = [], labels = {}, heap = [], input = document.getElementById("in").value, output = document.getElementById("out"), inPos = 0, callStack = [];
    for (var i = 0; i < prog.length; i++) {
        switch (prog[i]) {
            case "S":
                switch (prog[++i]) {
                    case "S":
                        stack.push(num(prog[++i] == "S" ? 1 : -1, prog.slice(++i, prog.indexOf("L", i) - 1)));
                        i = prog.indexOf("L", i);
                        break;
                    case "T":
                        switch (prog[++i]) {
                            case "S":
                                stack.push(stack[stack.length - num(prog[++i] == "S" ? 1 : -1, prog.slice(++i, prog.indexOf("L", i) - 1))]);
                                i = prog.indexOf("L", i);
                                break;
                            case "L":
                                var num = num(prog[++i] == "S" ? 1 : -1, prog.slice(++i, prog.indexOf("L", i) - 1));
                                i = prog.indexOf("L", i);
                                stack.splice(stack.length - num - 1, num);
                                break;
                        }
                        break;
                    case "L":
                        switch (prog[++i]) {
                            case "S":
                                stack.push(stack[stack.length - 1]);
                                break;
                            case "T":
                                stack.push.apply(stack, stack.slice(-2).reverse());
                                break;
                            case "L":
                                stack.pop();
                                break;
                        }
                        break;
                }
                break;
            case "T":
                switch (prog[++i]) {
                    case "S":
                        switch (prog[++i]) {
                            case "S":
                                switch (prog[++i]) {
                                    case "S":
                                        stack.push(stack.pop() + stack.pop());
                                        break;
                                    case "T":
                                        stack.push(stack.pop() - stack.pop());
                                        break;
                                    case "L":
                                        stack.push(stack.pop() * stack.pop());
                                        break;
                                }
                                break;
                            case "T":
                                switch (prog[++i]) {
                                    case "S":
                                        stack.push(Math.floor(stack.pop() / stack.pop()));
                                        break;
                                    case "T":
                                        stack.push(stack.pop() % stack.pop());
                                        break;
                                }
                                break;
                        }
                        break;
                }
                break;
            case "T":
                switch (prog[++i]) {
                    case "S":
                        heap[stack[stack.length - 2]] = stack.pop();
                        stack.pop();
                        break;
                    case "T":
                        stack.push(heap[stack.pop()]);
                        break;
                }
                break;
            case "L":
                switch (prog[++i]) {
                    case "S":
                        switch (prog[++i]) {
                            case "S":
                                output.value += String.fromCharCode(stack.pop());
                                break;
                            case "T":
                                output.value += stack.pop();
                                break;
                        }
                        break;
                    case "T":
                        switch (prog[++i]) {
                            case "S":
                                heap[stack.pop()] = input.charCodeAt(inPos++);
                                break;
                            case "T":
                                heap[stack.pop()] = parseInt(input.slice(inPos, input.indexOf("\n", inPos) - 1));
                                break;
                        }
                }
                break;
            case "L":
                switch (prog[++i]) {
                    case "S":
                        switch (prog[++i]) {
                            case "S":
                                labels[num(1, prog.slice(++i, prog.indexOf("L", i) - 1))] = i = prog.indexOf("L", i);
                                break;
                            case "T":
                                callStack.push(prog.indexOf("L", ++i));
                                i = labels[num(1, prog.slice(i, prog.indexOf("L", i) - 1))];
                                break;
                            case "L":
                                i = labels[num(1, prog.slice(++i, prog.indexOf("L", i) - 1))];
                                break;
                        }
                        break;
                    case "T":
                        switch (prog[++i]) {
                            case "S":
                                if (stack.pop() == 0)
                                    i = labels[num(1, prog.slice(++i, prog.indexOf("L", i) - 1))];
                                else
                                    i = prog.indexOf("L", ++i);
                                break;
                            case "T":
                                if (stack.pop() < 0)
                                    i = labels[num(1, prog.slice(++i, prog.indexOf("L", i) - 1))];
                                else
                                    i = prog.indexOf("L", ++i);
                                break;
                        }
                        break;
                    case "L":
                        i = callStack.pop();
                        break;
                }
                break;
            case "L":
                if (prog[++i] == "L")
                    return JSON.stringify(stack);
                break;
        }
    }
    return JSON.stringify(stack);
}
Program:

<textarea id="prog" rows="4" cols="60"></textarea>

Input:

<textarea id="in" rows="4" cols="60"></textarea>

<form>
    Is escaped as STL: <input id="esc" type="checkbox"/>

</form>
<button onclick="document.getElementById('stack').innerText = interpret()">Interpret</button>

Output:

<textarea id="out" rows="4" cols="60"></textarea>

Resulting stack:

Beam
I really think this language deserved to have an interpreter and it appeared simple enough for a non programmer like me to have a go at.
I hope that I got it right.  It appears to work for the examples I have tried.  A lot of the code is plagiarized from other answers in this question.
My apologies to the real programmers out there if I have committed any cardinal sins in my code:)
I have put the 'Reverse STDIN' example in from the Esolangs page.

var ITERS_PER_SEC = 100000;
var TIMEOUT_SECS = 50;
var ERROR_INTERRUPT = "Interrupted by user";
var ERROR_TIMEOUT = "Maximum iterations exceeded";
var ERROR_LOSTINSPACE = "Beam is lost in space";

var code, store, beam, ip_x, ip_y, dir, input_ptr, mem;
var input, timeout, width, iterations, running;

function clear_output() {
document.getElementById("output").value = "";
document.getElementById("stderr").innerHTML = "";
}

function stop() {
running = false;
document.getElementById("run").disabled = false;
document.getElementById("stop").disabled = true;
document.getElementById("clear").disabled = false;
document.getElementById("timeout").disabled = false;
}

function interrupt() {
error(ERROR_INTERRUPT);
}

function error(msg) {
document.getElementById("stderr").innerHTML = msg;
stop();
}

function run() {
clear_output();
document.getElementById("run").disabled = true;
document.getElementById("stop").disabled = false;
document.getElementById("clear").disabled = true;
document.getElementById("input").disabled = false;
document.getElementById("timeout").disabled = false;

code = document.getElementById("code").value;
input = document.getElementById("input").value;
timeout = document.getElementById("timeout").checked;

code = code.split("\n");
width = 0;
for (var i = 0; i  width){
  width = code[i].length;
 }
}
console.log(code);
console.log(width);

running = true;
dir = 0;
ip_x = 0;
ip_y = 0;
input_ptr = 0;
beam = 0;
store = 0;
mem = [];

input = input.split("").map(function (s) {
  return s.charCodeAt(0);
 });

iterations = 0;

beam_iter();
}

function beam_iter() {
while (running) {
 var inst;
 try {
  inst = code[ip_y][ip_x];
 }
 catch(err) {
  inst = "";
 }
 switch (inst) {
  case ">":
   dir = 0;
   break;
  case "<":
   dir = 1;
   break;
  case "^":
   dir = 2;
   break;
  case "v":
   dir = 3;
   break;
  case "+":
   if(++beam > 255)
    beam = 0;
   break;
  case "-":
   if(--beam < 0)
    beam = 255;
   break;
  case "@":
   document.getElementById("output").value += String.fromCharCode(beam);
   break;
  case ":":
   document.getElementById("output").value += beam;
   break;
  case "/":
   dir ^= 2;
   break;
  case "\\":
   dir ^= 3;
   break;
  case "!":
   if (beam != 0) {
    dir ^= 1;
   }
   break;
  case "?":
   if (beam == 0) {
    dir ^= 1;
   }
   break;
  case "_":
   switch (dir) {
   case 2:
    dir = 3;
    break;
   case 3:
    dir = 2;
    break;
   }
   break;
  case "|":
   switch (dir) {
   case 0:
    dir = 1;
    break;
   case 1:
    dir = 0;
    break;
   }
   break;
  case "H":
   stop();
   break;
  case "S":
   store = beam;
   break;
  case "L":
   beam = store;
   break;
  case "s":
   mem[beam] = store;
   break;
  case "g":
   store = mem[beam];
   break;
  case "P":
   mem[store] = beam;
   break;
  case "p":
   beam = mem[store];
   break;
  case "u":
   if (beam != store) {
    dir = 2;
   }
   break;
  case "n":
   if (beam != store) {
    dir = 3;
   }
   break;
  case "`":
   --store;
   break;
  case "'":
   ++store;
   break;
  case ")":
   if (store != 0) {
    dir = 1;
   }
   break;
  case "(":
   if (store != 0) {
    dir = 0;
   }
   break;
  case "r":
   if (input_ptr >= input.length) {
    beam = 0;
   } else {
    beam = input[input_ptr];
    ++input_ptr;
   }
   break;
  }
 // Move instruction pointer
 switch (dir) {
  case 0:
   ip_x++;
   break;
  case 1:
   ip_x--;
   break;
  case 2:
   ip_y--;
   break;
  case 3:
   ip_y++;
   break;
 }
 if (running && (ip_x < 0 || ip_y < 0 || ip_x >= width || ip_y >= code.length)) {
  error(ERROR_LOSTINSPACE);
 }
 ++iterations;
 if (iterations > ITERS_PER_SEC * TIMEOUT_SECS) {
  error(ERROR_TIMEOUT);
 }
}
}

Code:

    <textarea id="code" rows="8" style="overflow:scroll;overflow-x:hidden;width:90%;">v
(>``v
!  H(p`@`p)H
P   H
'
r
'
P
!
>^
 </textarea>

Input:

    <textarea id="input" rows="2" style="overflow:scroll;overflow-x:hidden;width:90%;">Reverse this string</textarea>

Timeout:
        <input id="timeout" type="checkbox" checked="checked">

        <input id="run" type="button" value="Run" onclick="run()">
        <input id="stop" type="button" value="Stop" onclick="interrupt()" disabled="disabled">
        <input id="clear" type="button" value="Clear" onclick="clear_output()">

Output:

    <textarea id="output" rows="6" style="overflow:scroll;width:90%;"></textarea>

How did I not notice this before? This is great! I love to see languages rescued from the Pit of Unimplementation. ;)

I hope you don't mind, but I cleaned up the JS section somewhat.

@ETHproductions  I have no problem with that at all.  I'm not a real programmer as I mentioned above, but I really wanted something to test out some ideas that you sparked with your answer to the Hello World challenge.

The timeout feature currently doesn't seem to work. If I insert an infinite loop, it crashes my browser, and I remember one time trying to print every ASCII character from ! to ~, and having it always time out after the first three, even with timeout turned off. I'll take a look into this in a little bit.

@ETHproductions that came over with the snippet that I largely copied to start this one.  Must admit I've had a few issues with the timeouts.

Ouroboros
An esoteric language created by me, DLosc, in October 2015. The execution model is based on each line of code being an ouroboros snake. Control proceeds from the head to the tail and loops back to the head; instructions allow the snake to swallow part of its tail or regurgitate what it has swallowed, thus changing the flow of execution. All snakes execute in parallel. Data is stored on a shared stack as well as an individual stack for each snake. For more information, sample programs, and the most up-to-date interpreter, see the Github repository.

// Define Stack class
function Stack() {
  this.stack = [];
  this.length = 0;
}
Stack.prototype.push = function(item) {
  this.stack.push(item);
  this.length++;
}
Stack.prototype.pop = function() {
  var result = 0;
  if (this.length > 0) {
    result = this.stack.pop();
    this.length--;
  }
  return result;
}
Stack.prototype.top = function() {
  var result = 0;
  if (this.length > 0) {
    result = this.stack[this.length - 1];
  }
  return result;
}
Stack.prototype.toString = function() {
  return "" + this.stack;
}

// Define Snake class
function Snake(code) {
  this.code = code;
  this.length = this.code.length;
  this.ip = 0;
  this.ownStack = new Stack();
  this.currStack = this.ownStack;
  this.alive = true;
  this.wait = 0;
  this.partialString = this.partialNumber = null;
}
Snake.prototype.step = function() {
  if (!this.alive) {
    return null;
  }
  if (this.wait > 0) {
    this.wait--;
    return null;
  }
  var instruction = this.code.charAt(this.ip);
  var output = null;
  console.log("Executing instruction " + instruction);
  if (this.partialString !== null) {
    // We're in the middle of a double-quoted string
    if (instruction == '"') {
      // Close the string and push its character codes in reverse order
      for (var i = this.partialString.length - 1; i >= 0; i--) {
        this.currStack.push(this.partialString.charCodeAt(i));
      }
      this.partialString = null;
    } else {
      this.partialString += instruction;
    }
  } else if (instruction == '"') {
    this.partialString = "";
  } else if ("0" <= instruction && instruction <= "9") {
    if (this.partialNumber !== null) {
      this.partialNumber = this.partialNumber + instruction;  // NB: concatenation!
    } else {
      this.partialNumber = instruction;
    }
    next = this.code.charAt((this.ip + 1) % this.length);
    if (next < "0" || "9" < next) {
      // Next instruction is non-numeric, so end number and push it
      this.currStack.push(+this.partialNumber);
      this.partialNumber = null;
    }
  } else if ("a" <= instruction && instruction <= "f") {
    // a-f push numbers 10 through 15
    var value = instruction.charCodeAt(0) - 87;
    this.currStack.push(value);
  } else if (instruction == "$") {
    // Toggle the current stack
    if (this.currStack === this.ownStack) {
      this.currStack = this.program.sharedStack;
    } else {
      this.currStack = this.ownStack;
    }
  } else if (instruction == "s") {
    this.currStack = this.ownStack;
  } else if (instruction == "S") {
    this.currStack = this.program.sharedStack;
  } else if (instruction == "l") {
    this.currStack.push(this.ownStack.length);
  } else if (instruction == "L") {
    this.currStack.push(this.program.sharedStack.length);
  } else if (instruction == ".") {
    var item = this.currStack.pop();
    this.currStack.push(item);
    this.currStack.push(item);
  } else if (instruction == "m") {
    var item = this.ownStack.pop();
    this.program.sharedStack.push(item);
  } else if (instruction == "M") {
    var item = this.program.sharedStack.pop();
    this.ownStack.push(item);
  } else if (instruction == "y") {
    var item = this.ownStack.top();
    this.program.sharedStack.push(item);
  } else if (instruction == "Y") {
    var item = this.program.sharedStack.top();
    this.ownStack.push(item);
  } else if (instruction == "\\") {
    var top = this.currStack.pop();
    var next = this.currStack.pop()
    this.currStack.push(top);
    this.currStack.push(next);
  } else if (instruction == "@") {
    var c = this.currStack.pop();
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(b);
    this.currStack.push(c);
    this.currStack.push(a);
  } else if (instruction == ";") {
    this.currStack.pop();
  } else if (instruction == "+") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(a + b);
  } else if (instruction == "-") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(a - b);
  } else if (instruction == "*") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(a * b);
  } else if (instruction == "/") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(a / b);
  } else if (instruction == "%") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(a % b);
  } else if (instruction == "_") {
    this.currStack.push(-this.currStack.pop());
  } else if (instruction == "I") {
    var value = this.currStack.pop();
    if (value < 0) {
      this.currStack.push(Math.ceil(value));
    } else {
      this.currStack.push(Math.floor(value));
    }
  } else if (instruction == ">") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(+(a > b));
  } else if (instruction == "<") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(+(a < b));
  } else if (instruction == "=") {
    var b = this.currStack.pop();
    var a = this.currStack.pop();
    this.currStack.push(+(a == b));
  } else if (instruction == "!") {
    this.currStack.push(+ !this.currStack.pop());
  } else if (instruction == "?") {
    this.currStack.push(Math.random());
  } else if (instruction == "n") {
    output = "" + this.currStack.pop();
  } else if (instruction == "o") {
    output = String.fromCharCode(this.currStack.pop());
  } else if (instruction == "r") {
    var input = this.program.io.getNumber();
    this.currStack.push(input);
  } else if (instruction == "i") {
    var input = this.program.io.getChar();
    this.currStack.push(input);
  } else if (instruction == "(") {
    this.length -= Math.floor(this.currStack.pop());
    this.length = Math.max(this.length, 0);
  } else if (instruction == ")") {
    this.length += Math.floor(this.currStack.pop());
    this.length = Math.min(this.length, this.code.length);
  } else if (instruction == "w") {
    this.wait = this.currStack.pop();
  }
  // Any unrecognized character is a no-op
  if (this.ip >= this.length) {
    // We've swallowed the IP, so this snake dies
    this.alive = false;
    this.program.snakesLiving--;
  } else {
    // Increment IP and loop if appropriate
    this.ip = (this.ip + 1) % this.length;
  }
  return output;
}
Snake.prototype.getHighlightedCode = function() {
  var result = "";
  for (var i = 0; i < this.code.length; i++) {
    if (i == this.length) {
      result += '';
    }
    if (i == this.ip) {
      if (this.wait > 0) {
        result += '';
      } else {
        result += '';
      }
      result += escapeEntities(this.code.charAt(i)) + '';
    } else {
      result += escapeEntities(this.code.charAt(i));
    }
  }
  if (this.length < this.code.length) {
    result += '';
  }
  return result;
}

// Define Program class
function Program(source, speed, io) {
  this.sharedStack = new Stack();
  this.snakes = source.split(/\r?\n/).map(function(snakeCode) {
    var snake = new Snake(snakeCode);
    snake.program = this;
    snake.sharedStack = this.sharedStack;
    return snake;
  }.bind(this));
  this.snakesLiving = this.snakes.length;
  this.io = io;
  this.speed = speed || 10;
  this.halting = false;
}
Program.prototype.run = function() {
  this.step();
  if (this.snakesLiving) {
    this.timeout = window.setTimeout(this.run.bind(this), 1000 / this.speed);
  }
}
Program.prototype.step = function() {
   for (var s = 0; s < this.snakes.length; s++) {
    var output = this.snakes[s].step();
    if (output) {
      this.io.print(output);
    }
  }
  this.io.displaySource(this.snakes.map(function (snake) {
      return snake.getHighlightedCode();
    }).join("
"));
 }
Program.prototype.halt = function() {
  window.clearTimeout(this.timeout);
}

var ioFunctions = {
  print: function (item) {
    var stdout = document.getElementById('stdout');
    stdout.value += "" + item;
  },
  getChar: function () {
    if (inputData) {
      var inputChar = inputData[0];
      inputData = inputData.slice(1);
      result = inputChar.charCodeAt(0);
    } else {
      result = -1;
    }
    var stdinDisplay = document.getElementById('stdin-display');
    stdinDisplay.innerHTML = escapeEntities(inputData);
    return result;
  },
  getNumber: function () {
    while (inputData && (inputData[0] < "0" || "9" < inputData[0])) {
      inputData = inputData.slice(1);
    }
    if (inputData) {
      var inputNumber = inputData.match(/\d+/)[0];
      inputData = inputData.slice(inputNumber.length);
      result = +inputNumber;
    } else {
      result = -1;
    }
    var stdinDisplay = document.getElementById('stdin-display');
    stdinDisplay.innerHTML = escapeEntities(inputData);
    return result;
  },
  displaySource: function (formattedCode) {
    var sourceDisplay = document.getElementById('source-display');
    sourceDisplay.innerHTML = formattedCode;
  }
};
var program = null;
var inputData = null;
function showEditor() {
  var source = document.getElementById('source'),
    sourceDisplayWrapper = document.getElementById('source-display-wrapper'),
    stdin = document.getElementById('stdin'),
    stdinDisplayWrapper = document.getElementById('stdin-display-wrapper');

  source.style.display = "block";
  stdin.style.display = "block";
  sourceDisplayWrapper.style.display = "none";
  stdinDisplayWrapper.style.display = "none";

  source.focus();
}
function hideEditor() {
  var source = document.getElementById('source'),
    sourceDisplay = document.getElementById('source-display'),
    sourceDisplayWrapper = document.getElementById('source-display-wrapper'),
    stdin = document.getElementById('stdin'),
    stdinDisplay = document.getElementById('stdin-display'),
    stdinDisplayWrapper = document.getElementById('stdin-display-wrapper');

  source.style.display = "none";
  stdin.style.display = "none";
  sourceDisplayWrapper.style.display = "block";
  stdinDisplayWrapper.style.display = "block";

  var sourceHeight = getComputedStyle(source).height,
    stdinHeight = getComputedStyle(stdin).height;
  sourceDisplayWrapper.style.minHeight = sourceHeight;
  sourceDisplayWrapper.style.maxHeight = sourceHeight;
  stdinDisplayWrapper.style.minHeight = stdinHeight;
  stdinDisplayWrapper.style.maxHeight = stdinHeight;
  sourceDisplay.textContent = source.value;
  stdinDisplay.textContent = stdin.value;
}
function escapeEntities(input) {
  return input.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
}
function resetProgram() {
  var stdout = document.getElementById('stdout');
  stdout.value = null;
  if (program !== null) {
    program.halt();
  }
  program = null;
  inputData = null;
  showEditor();
}
function initProgram() {
  var source = document.getElementById('source'),
    stepsPerSecond = document.getElementById('steps-per-second'),
    stdin = document.getElementById('stdin');
  program = new Program(source.value, +stepsPerSecond.innerHTML, ioFunctions);
  hideEditor();
  inputData = stdin.value;
}
function runBtnClick() {
  if (program === null || program.snakesLiving == 0) {
    resetProgram();
    initProgram();
  } else {
    program.halt();
    var stepsPerSecond = document.getElementById('steps-per-second');
    program.speed = +stepsPerSecond.innerHTML;
  }
  program.run();
}
function stepBtnClick() {
  if (program === null) {
    initProgram();
  } else {
    program.halt();
  }
  program.step();
}
function sourceDisplayClick() {
  resetProgram();
}
.container {
    width: 100%;
}
.so-box {
    font-family:'Helvetica Neue', Arial, sans-serif;
    font-weight: bold;
    color: #fff;
    text-align: center;
    padding: .3em .7em;
    font-size: 1em;
    line-height: 1.1;
    border: 1px solid #c47b07;
    -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3), 0 2px 0 rgba(255, 255, 255, 0.15) inset;
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    background: #f88912;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3), 0 2px 0 rgba(255, 255, 255, 0.15) inset;
}
.control {
    display: inline-block;
    border-radius: 6px;
    float: left;
    margin-right: 25px;
    cursor: pointer;
}
.option {
    padding: 10px 20px;
    margin-right: 25px;
    float: left;
}
h1 {
    text-align: center;
    font-family: Georgia, 'Times New Roman', serif;
}
a {
    text-decoration: none;
}
input, textarea {
    box-sizing: border-box;
}
textarea {
    display: block;
    white-space: pre;
    overflow: auto;
    height: 100px;
    width: 100%;
    max-width: 100%;
    min-height: 25px;
}
span[contenteditable] {
    padding: 2px 6px;
    background: #cc7801;
    color: #fff;
}
#stdout-container, #stdin-container {
    height: auto;
    padding: 6px 0;
}
#reset {
    float: right;
}
#source-display-wrapper , #stdin-display-wrapper{
    display: none;
    width: 100%;
    height: 100%;
    overflow: auto;
    border: 1px solid black;
    box-sizing: border-box;
}
#source-display , #stdin-display{
    font-family: monospace;
    white-space: pre;
    padding: 2px;
}
.activeToken {
    background: #f93;
}
.nextActiveToken {
    background: #bbb;
}
.swallowedCode{
    color: #999;
}
.clearfix:after {
    content:".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {
    display: inline-block;
}
* html .clearfix {
    height: 1%;
}
.clearfix {
    display: block;
}

Ouroboros

    <textarea id="source" placeholder="Enter your program here" wrap="off"></textarea>

    <textarea id="stdin" placeholder="Input" wrap="off"></textarea>

    <input type="button" id="run" class="control so-box" value="Run" onclick="runBtnClick()" />
    <input type="button" id="pause" class="control so-box" value="Pause" onclick="program.halt()" />
    <input type="button" id="step" class="control so-box" value="Step" onclick="stepBtnClick()" />
    <input type="button" id="reset" class="control so-box" value="Reset" onclick="resetProgram()" />

    <textarea id="stdout" placeholder="Output" wrap="off" readonly></textarea>

Steps per Second: 10

Todo

Debug output: contents of stacks; how much input is left done
During execution, display code with current instructions highlighted and swallowed portions of tails grayed-out done

K5
This is a thin, simple wrapper around my JavaScript based K implementation, oK, and references the github repo. I've already built a much nicer browser-based frontend. oK implements a very substantial portion of K5, aside from IO, and has been used in the past to solve a number of problems here on stack overflow. The code isn't golfed, per se, but is well under 1000 lines including comments, the parser, all the primitive operations, the interpreter and the prettyprinter.

* {
  font-size:12px;
  font-family:Verdana, Geneva, sans-serif;
}
textarea {
  overflow:scroll;
  overflow-x:hidden;
  width:90%;
  font-family:Consolas, Courier New, monospace;
  font-size:10p
}

Code:

<textarea id="code" rows="8">2*!10</textarea>

<input id="run" type="button" value="Run" onclick="runk()">

Output:

<textarea id="output" rows="6" style="overflow:scroll;width:90%;"></textarea>

oOo CODE
A very simple interpreter for oOo CODE (first time I use javascript). oOo CODE is an esoteric language based on brainfuck that uses uppercase and lowercase to store it's information, the actual text doesn't matter. As oOo CODE is based on brainfuck, I reused one of the brainfuck answers and added a function to translate oOo CODE to brainfuck.

var NUM_CELLS = 30000;
var ITERS_PER_SEC = 100000;
var TIMEOUT_MILLISECS = 5000;
var ERROR_BRACKET = "Mismatched brackets";
var ERROR_TIMEOUT = "Timeout";
var ERROR_INTERRUPT = "Interrupted by user";

var code, input, wrap, timeout, eof, loop_stack, loop_map;
var running, start_time, code_ptr, input_ptr, cell_ptr, cells, iterations;

function clear_output() {
  document.getElementById("output").value = "";
  document.getElementById("stderr").innerHTML = "";
}

function stop() {
  running = false;
  document.getElementById("run").disabled = false;
  document.getElementById("stop").disabled = true;
  document.getElementById("clear").disabled = false;
  document.getElementById("wrap").disabled = false;
  document.getElementById("timeout").disabled = false;
  document.getElementById("eof").disabled = false;
}

function interrupt() {
  error(ERROR_INTERRUPT);
}

function error(msg) {
  document.getElementById("stderr").innerHTML = msg;
  stop();
}

function oOoCODE(code){
    code = code.match(/[a-z]/gi).join('');
    code = code.match(/.../g);
    for (var i = 0; i<code.length; i++) {
        code[i] = [/[A-Z]/.test(code[i][0]),/[A-Z]/.test(code[i][1]),/[A-Z]/.test(code[i][2])];
        if (code[i][0]) {
            if (code[i][1]) {
                if (code[i][2]) {
                    code[i] = ",";
                } else {
                    code[i] = ".";
                }
            } else {
                if (code[i][2]) {
                    code[i] = "+";
                } else {
                    code[i] = "-";
                }
            }
        } else {
            if (code[i][1]) {
                if (code[i][2]) {
                    code[i] = "]";
                } else {
                    code[i] = "[";
                }
            } else {
                if (code[i][2]) {
                    code[i] = ">";
                } else {
                    code[i] = "<";
                }
            }
        }
    }
    return code.join('');
}

function run() {
  clear_output();

  document.getElementById("run").disabled = true;
  document.getElementById("stop").disabled = false;
  document.getElementById("clear").disabled = true;
  document.getElementById("wrap").disabled = true;
  document.getElementById("timeout").disabled = true;
  document.getElementById("eof").disabled = true;

  code = document.getElementById("code").value;
  input = document.getElementById("input").value;
  wrap = document.getElementById("wrap").value;
  timeout = document.getElementById("timeout").checked;
  eof = document.getElementById("eof").value;

  code = oOoCODE(code);

  loop_stack = [];
  loop_map = {};

  for (var i = 0; i  0) {
    error(ERROR_BRACKET);
    return;
  }

  running = true;
  start_time = Date.now();
  code_ptr = 0;
  input_ptr = 0;
  cell_ptr = Math.floor(NUM_CELLS / 2);
  cells = {};
  iterations = 0;

  bf_iter(1);
}

function bf_iter(niters) {
  if (code_ptr >= code.length || !running) {
    stop();
    return;
  }

  var iter_start_time = Date.now();

  for (var i = 0; i < niters; ++i) {
    if (cells[cell_ptr] == undefined) {
      cells[cell_ptr] = 0;
    }

    switch (code[code_ptr]) {
      case "+":
        if ((wrap == "8" && cells[cell_ptr] == 255) ||
            (wrap == "16" && cells[cell_ptr] == 65535) ||
            (wrap == "32" && cells[cell_ptr] == 2147483647)) {
            cells[cell_ptr] = 0;
        } else {
          cells[cell_ptr]++;
        }
        break;

      case "-":
        if (cells[cell_ptr] == 0){
          if (wrap == "8"){ cells[cell_ptr] = 255; }
          if (wrap == "16"){ cells[cell_ptr] = 65535; }
          if (wrap == "32"){ cells[cell_ptr] = 2147483647; }
        } else {
          cells[cell_ptr]--;
        }
        break;

      case "<": cell_ptr--; break;
      case ">": cell_ptr++; break;

      case ".":
        document.getElementById("output").value += String.fromCharCode(cells[cell_ptr]);
        break;

      case ",":
        if (input_ptr >= input.length) {
          if (eof != "nochange") {
            cells[cell_ptr] = parseInt(eof);
          }
        } else {
          cells[cell_ptr] = input.charCodeAt(input_ptr);
          input_ptr++;
        }
        break;

      case "[":
        if (cells[cell_ptr] == 0) {
          code_ptr = loop_map[code_ptr];
        }
        break;

      case "]":
        if (cells[cell_ptr] != 0) {
          code_ptr = loop_map[code_ptr];
        }
        break;
    }

    code_ptr++;
    iterations++;

    if (timeout && Date.now() - start_time > TIMEOUT_MILLISECS) {
      error(ERROR_TIMEOUT);
      return;
    }
  }

  setTimeout(function() { bf_iter(ITERS_PER_SEC * (Date.now() - iter_start_time)/1000) }, 0);
}

    Code:

    <textarea id="code" rows="4" style="overflow:scroll;overflow-x:hidden;width:90%;">JuLIeT
   O rOMeO, RoMEo! WHeREfOrE art tHoU RoMEo?
   DEnY ThY FaTHeR AnD ReFuse ThY NaME;
   oR, If ThoU wiLT not, BE but SWoRn mY loVe,
   aND i'Ll NO lONgER bE A cAPuLEt.
ROMeO
   [AsIdE] ShALl I HEar moRE, or sHAlL I sPEaK At THiS?
JuLIeT
   'TiS BUt Thy NamE thAt iS my EneMy;
   tHou ARt ThYSeLF, tHOUgH noT a mOntAguE.
   whAt's MOnTagUe? iT is Nor HanD, noR foOt,
   nOR arm (...)  </textarea>

Input:

    <textarea id="input" rows="2" style="overflow:scroll;overflow-x:hidden;width:90%;"></textarea>

      Wrap:
      <select id="wrap">
        <option value="8">8-bit</option>
        <option value="16">16-bit</option>
        <option value="32">32-bit</option>
      </select>

      Timeout:
      <input id="timeout" type="checkbox" checked="true" />  EOF:
      <select id="eof">
        <option value="nochange">Same</option>
        <option value="0">0</option>
        <option value="-1">-1</option>
      </select>

    Output:

    <textarea id="output" rows="6" style="overflow:scroll;width:90%;"></textarea>

      <input id="run" type="button" value="Run" onclick="run()" />
      <input id="stop" type="button" value="Stop" onclick="interrupt()" disabled="true" />
      <input id="clear" type="button" value="Clear" onclick="clear_output()" />

Needs more semicolons. ASI is the work of devil.

@nyuszika7h Interesting, I didn't knew it works that way... (python programmer) The code without semi-colons was from the original brainfuck answer from Sp3000 so I didn't notice the lack of semi-colons.

@Sp3000 No problem, I wrote my answer for fun and to learn a bit of javascript, not for the bounty

STATA
Edit: added replace and checks for generate.
Has support for some parts of display, forvalues, list, generate, and set obs. In addition, it has some supports for macro (STATA's variables) creation and use. It supports enough operations for some of the simpler answers that have been posted on this site, such as Evolution of "Hello World!", Generate the Stöhr sequence, Make me an alphabet tree (replace single quotes with double quotes and make it 3 lines instead of 1). This is a work in progress, and I hope to continue it soon, but I figured I would at least put something here for now.

Input
<textarea id="input"></textarea>

Code
<textarea id="code"></textarea>

<button>Run</button>

Output:
<textarea id="output"></textarea>

Bug: In a generate expression, only the first _n is replaced.

I'm guessing JS replace method only replaces the first instance. Is there a way to change that?

str.replace(/_n/g,i+1)

ಠ_ಠ you used jQuery.

Fourier
This is now a complete version of Fourier, translated directly from the Python. This should stay up to date.

<!DOCTYPE html>   <title>FourIDE - Editor</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
Fourier Interpreter

Code:
 <textarea id="code" rows="4" oninput="javascript:chars()" cols="40"></textarea>
 Function: <select id="funcSelect"> <option value="exec">Execute code</option> <option value="expl">Explode code</option> <option value="debg">Debug code</option> </select>

Input:
 <textarea id="input" rows="4" cols="40"></textarea>

 <button id="run" onclick="javascript:main()">Engage</button> <button id="clear" onclick="javascript:clearText()">Clear</button>
 Character count: 0 characters
Output:
 <textarea id="output" readonly="readonly" rows="4" cols="40" style="cursor: default;"></textarea>
 Get permalink

Character reference

ASCII code reference
 <input id="charRef" cols="40" oninput="javascript:getCharCode()">
 <input id="asciiRef" readonly="readonly" cols="40" style="background-color: #c2c2c2; cursor: default;">

See more:

Esolangs page: http://esolangs.org/wiki/Fourier
Python interpreter: https://github.com/beta-decay/Fourier
Try it online: http://fourier.tryitonline.net
FourIDE: https://beta-decay.github.io/editor

ᴜɢʜ ɴᴏ ᴊQᴜᴇʀʏʏʏ

@CᴏɴᴏʀO'Bʀɪᴇɴ Gah, stop with the small caps :D

Pure JS master race! Subvert the dominant jQuery paradigm!

Labyrinth
An interpreter for Labyrinth, a totally awesome language! (My interpreter doesn't have big integers...)

/*jshint esnext: true */
//Note labyrinth X Y are swapped!
//Syntax highlighting?
//Bigint library?
//Use: https://developers.google.com/web/updates/2014/05/Web-Animations-element.animate-is-now-in-Chrome-36
//Save option
//a => ASCII code (Explanation of the commands)

var p; //pointer
var labyrinth; //code
var main, auxiliary; //stacks, main.length-1=top
var direction; //N=0,E=1,S=2,W=3;
var inpLoc;
var sucide;
var step;
var debug;

var spiders = false;

var pointerIcons = ["▲", "►", "▼", "◄", "X"];

function mod(x, y) {
  return ((x % y) + y) % y;
}

Array.prototype.top = function() {
  if (this.length === 0) {
    return 0;
  }
  return this[this.length - 1];
};

Array.prototype._pop = Array.prototype.pop;
Array.prototype.pop = function(x) {
  var temp = this._pop();
  return temp !== undefined ? temp : 0;
};

function reset() {
  p = [0, 0];
  labyrinth = lab.innerHTML.replace(/\[/g, " ").replace(/\]/g, " ").replace(/</g, "<").replace(/>/g, ">").replace(/\n*$|(
)*$/, "").split(/
|\n/g);
  var maxLength = 0;
  for (var i = 0; i < labyrinth.length; i++) {
    if (maxLength < labyrinth[i].length)
      maxLength = labyrinth[i].length;
  }

  for (i = 0; i < labyrinth.length; i++) {
    labyrinth[i] = (labyrinth[i] + " ".repeat(maxLength - labyrinth[i].length)).split("");
  }

  //Pointer pos
  loop:
    for (i = 0; i < labyrinth.length; i++) {
      for (j = 0; j < labyrinth[i].length; j++) {
        if (labyrinth[i][j] !== " ") {
          p = [j, i];
          break loop;
        }
      }
    }

  main = [];
  auxiliary = [];
  direction = 1;
  sucide = false;
  inpLoc = 0;
  step = 1;
  O.value = "";
}

function run() {
  reset();
  if (debug) {
    spiderContainer.innerHTML = "";
    debugButton.disabled = false;
    lab.contentEditable = false;
    stepButton.disabled = false;
  }
  //Start if
  if (lab.innerHTML.replace(/\[/g, "").replace(/\]/g, "").replace(/
|\n/g, "") !== "") {
    if (!debug) {
      while (!sucide) {
        updatePointer();
      }
    } else {
      updatePointer();
    }
  } else {
    stepButton.disabled = "disabled";
    lab.contentEditable = "true";
  }
}

function updatePointer() {
  if (sucide) {
    stepButton.disabled = "disabled";
    lab.contentEditable = "true";
    pointerOverlay.innerHTML = "";
    return -1; //End
  }
  stepDiv.innerHTML = step;
  step++;
  execChar(labyrinth[p[1]][p[0]]);

  var ret = updateDirection();
  //If there are walls
  if (ret != -1) {
    direction = mod(direction, 4);

    if (direction === 0) {
      p[1] --;
    } else if (direction == 1) {
      p[0] ++;
    } else if (direction == 2) {
      p[1] ++;
    } else if (direction == 3) {
      p[0] --;
    }
  }
  deb.value =
    "Pointer: " + p +
    "\nCommand: " + labyrinth[p[1]][p[0]] +
    "\nMain [" + main + " | " + auxiliary.slice().reverse() + "] Auxiliary";
  if (debug) {
    pointerOverlay.innerHTML = "\n".repeat(p[1]) + " ".repeat(p[0]) + (pointerIcons[ret == -1 ? 4 : direction]);
  }

}

function updateGrid() {
  lab.innerHTML = "";
  labyrinth.forEach(s => lab.innerHTML += s.join("") + "\n");
}

function rotVert(rotWhich) {
  var temp;
  for (var i = 0; i < labyrinth.length; i++) {
    if (i === 0) {
      temp = labyrinth[0][rotWhich];
    }
    if (i == labyrinth.length - 1) {
      labyrinth[i][rotWhich] = temp;
    } else {
      labyrinth[i][rotWhich] = labyrinth[i + 1][rotWhich];
    }
    if (labyrinth[i][rotWhich] === undefined) {
      labyrinth[i].splice(rotWhich, 1);
    }
  }
}

function rotVert2(rotWhich) {
  var temp;
  for (var i = labyrinth.length - 1; i >= 0; i--) {
    if (i == labyrinth.length - 1) {
      temp = labyrinth[i][rotWhich];
    }
    if (i === 0) {
      labyrinth[i][rotWhich] = temp;
    } else {
      labyrinth[i][rotWhich] = labyrinth[i - 1][rotWhich];
    }
    if (labyrinth[i][rotWhich] === undefined) {
      labyrinth[i].splice(rotWhich, 1);
    }
  }
}

function lookAt(d) {
  if (mod(d, 4) === 0) {
    try {
      return labyrinth[p[1] - 1][p[0]];
    } catch (e) {
      return " ";
    }
  } else if (mod(d, 4) == 1) {
    try {
      return labyrinth[p[1]][p[0] + 1];
    } catch (e) {
      return " ";
    }
  } else if (mod(d, 4) == 2) {
    try {
      return labyrinth[p[1] + 1][p[0]];
    } catch (e) {
      return " ";
    }
  } else if (mod(d, 4) == 3) {
    try {
      return labyrinth[p[1]][p[0] - 1];
    } catch (e) {
      return " ";
    }
  }
}

function isWall(d) {
  if (lookAt(d) == " " || lookAt(d) === undefined) {
    return true;
  } else {
    return false;
  }
}

function updateDirection() {
  var numOfWalls = 0;
  if (!isWall(0)) {
    numOfWalls++;
  }
  if (!isWall(1)) {
    numOfWalls++;
  }
  if (!isWall(2)) {
    numOfWalls++;
  }
  if (!isWall(3)) {
    numOfWalls++;
  }

  if (numOfWalls == 4) {
    if (main.top() < 0) {
      direction -= 1;
    } else if (main.top() > 0) {
      direction += 1;
    }
  } else if (numOfWalls == 3) {
    if (main.top() < 0) {
      direction -= 1;
    } else if (main.top() > 0) {
      direction += 1;
    }
    if (isWall(direction)) {
      direction += 2;
    }
  } else if (numOfWalls == 2) {
    if (isWall(direction + 2)) {
      if (isWall(direction)) {
        //Special case
        if (main.top() < 0) {
          direction -= 1;
        } else if (main.top() > 0) {
          direction += 1;
        } else {
          direction += Math.random() < 0.5 ? -1 : 1;
        }
      } else {
        //Keep moving..
      }
    } else {
      for (var i = 0; i <= 3; i++) {
        if (!isWall(i) && i != mod((direction + 2), 4)) {
          direction = i;
          break;
        }
      }
    }
  } else if (numOfWalls == 1) {
    if (!isWall(0)) {
      direction = 0;
    } else
    if (!isWall(1)) {
      direction = 1;
    } else
    if (!isWall(2)) {
      direction = 2;
    } else
    if (!isWall(3)) {
      direction = 3;
    }
  } else {
    return -1;
  }
}

function execChar(char) {
  var a;
  var b;
  if (/\d/.exec(char)) {
    main.push(main.pop() * 10 + (+char));
  } else switch (char) {
    case '!':
      O.value += main.pop();
      break;
    case '"': //Nothing...
      break;
    case '#':
      main.push(main.length);
      break;
    case '$':
      main.push(main.pop() ^ main.pop());
      break;
    case '%':
      a = main.pop();
      b = main.pop();
      main.push(mod(b, a));
      break;
    case '&':
      main.push(main.pop() & main.pop());
      break;
    case "'":
      //Debug-Unimplemented
      break;
    case '(':
      main.push(main.pop() - 1);
      break;
    case ')':
      main.push(main.pop() + 1);
      break;
    case '*':
      main.push(main.pop() * main.pop());
      break;
    case '+':
      main.push(main.pop() + main.pop());
      break;
    case ',':
      a = I.value.charCodeAt(inpLoc);
      if (Number.isNaN(a)) {
        main.push(-1);
      } else {
        main.push(a);
        inpLoc++;
      }
      break;
    case '-':
      a = main.pop();
      b = main.pop();
      main.push(b - a);
      break;
    case '.':
      O.value += String.fromCharCode(mod(main.pop(), 256));
      break;
    case '/':
      a = main.pop();
      b = main.pop();
      if (a === 0) {
        sucide = true;
        throw "Stop that";
      }
      main.push(Math.floor(b / a));
      break;
    case ':':
      main.push(main.top());
      break;
    case ';':
      main.pop();
      break;
    case '<':
      //MOVE IP
      b = main.pop();
      a = mod(p[1] + b, labyrinth.length);
      labyrinth[a].push(labyrinth[a].shift());
      updateGrid();
      if (b === 0) {
        p[0] = mod(p[0] - 1, labyrinth[a].length);
      }
      break;
    case '=':
      a = main.pop();
      b = auxiliary.pop();
      main.push(b);
      auxiliary.push(a);
      break;
    case '>':
      //MOVE IP
      b = main.pop();
      a = mod(p[1] + b, labyrinth.length);
      labyrinth[a].unshift(labyrinth[a].pop());
      updateGrid();
      if (b === 0) {
        p[0] = mod(p[0] + 1, labyrinth[a].length);
      }
      break;
    case '?':
      try {
        a = I.value.substr(inpLoc);
        b = (+(/[\+-]?\d+/.exec(a)[0]));
        main.push(b);
        inpLoc += a.search(/[\+-]?\d+/) + (b + "").length;
      } catch (e) {
        main.push(0);
        inpLoc = I.value.length;
      }
      break;
    case '@':
      sucide = true;
      break;
    case '\\':
      O.value += "\n";
      break;
    case '^': //Fix!
      b = main.pop();
      labyrinth = transpose(labyrinth);
      a = mod(p[0] + b, labyrinth[p[1]].length);
      labyrinth[a].unshift(labyrinth[a].pop());
      if (b === 0) {
        p[1] = mod(p[1] - 1, labyrinth.length);
      }
      labyrinth = transpose(labyrinth);
      updateGrid();
      break;
    case '_':
      main.push(0);
      break;
    case '`':
      main.push(-main.pop());
      break;
    case 'v': //Fix!
      b = main.pop();
      a = mod(p[0] + b, labyrinth[p[1]].length);
      rotVert2(a);
      updateGrid();
      if (b === 0) {
        p[1] = mod(p[1] + 1, labyrinth.length);
      }
      break;
    case '{':
      main.push(auxiliary.pop());
      break;
    case '|':
      main.push(main.pop() | main.pop());
      break;
    case '}':
      auxiliary.push(main.pop());
      break;
    case '~':
      main.push(~main.pop());
      break;
  }
}

function transpose(array) {
  var newArray = array[0].map(function(col, i) {
    return array.map(function(row) {
      return row[i];
    });
  });
  return newArray;
}

//Spiders
function startDebug() {
  if (spiders && document.cookie.split("youWereHere=")[1] === undefined) {
    document.cookie = "youWereHere=yep";
    debugButton.disabled = 'disabled';
    var spiderImg = document.createElement('img');
    spiderImg.src = "http://i.imgur.com/fsYfS9H.png"; //http://i.imgur.com/PRPmqMJ.gif
    spiderImg.className = "spider";

    var svg = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    svg.setAttribute("stroke-width", 2);
    var rn = Math.random() * 10 + 5;
    for (var i = 0; i < rn; i++) {
      var tempSpider = spiderImg.cloneNode(true);

      var left = Math.min(Math.random() * innerWidth, innerWidth - 50);
      var top = -Math.random() * 300;
      tempSpider.style.left = left - 26 + "px";
      tempSpider.style.top = top - 5 + "px";

      var tempSvg = svg.cloneNode(true);
      tempSvg.setAttribute("y1", top - innerHeight - 100);
      tempSvg.setAttribute("y2", top);
      tempSvg.setAttribute("x1", left);
      tempSvg.setAttribute("x2", left);

      spiderContainer.appendChild(tempSpider);
      svgId.appendChild(tempSvg);
      // Make sure the initial state is applied.
      window.getComputedStyle(tempSpider).transform; // jshint ignore:line
      window.getComputedStyle(tempSvg).transform; // jshint ignore:line

      tempSpider.style.transform = "translateY(" + (innerHeight + 48 + top) + "px)";
      tempSvg.style.transform = "translateY(" + (innerHeight + 48 + top) + "px)";
    }
    setTimeout(fallDown, 2500);
    debug = true;
    setTimeout(run, 4000);
  } else {
    debug = true;
    run();
  }
}

function fallDown() {
  svgId.innerHTML = "";
  var spiders = document.getElementsByClassName("spider");
  for (var i = 0; i < spiders.length; i++) {
    spiders[i].style.top = innerHeight + "px";
  }
}

//Maze proper copy
lab.addEventListener("paste", function(e) {
  // cancel paste
  e.preventDefault();

  // get text representation of clipboard
  var text = e.clipboardData.getData("text/plain");

  // insert text manually
  //document.execCommand("insertHTML", false, text);
  lab.innerHTML = text;
});
body {
  background: #484848;
}
h3{
  font-family: sans-serif;
  color: white;
  font-weight: bolder;
  margin: 6px;
  margin-bottom: 0px;
}
#inputHeader, #outputHeader, #debugHeader{
  flex: 1;
}
#debugHeader{
  display: none;
}
#deb {
  display: none;
}
.container {
  width: 100%;
  position: relative;
  display: flex;
  flex-flow: row wrap;
}
.container pre,textarea {
  flex: 1;
  min-height: 175px;
  background: #202020;
  color: white;
  border: #202020;
  margin: 6px;
  font: monospace;
  resize: vertical;
}
.container pre[contentEditable=false] {
  cursor: not-allowed;
}

#lab {
  width: 100%;
  min-height: 150px;
}

#pointerOverlay{
  width: 100%;
  position: absolute;
  background: rgba(0,0,0,0);
  /*width: 100%;*/
  resize: vertical;
  height: 200px;
  pointer-events: none;
  color: rgba(255,0,0,0.7);
  left: 0px;
}
button:not(.run) {
  vertical-align: top;
  border: #303030;
  color: white;
  font-weight: bold;
  font-size: 1em;
  letter-spacing: 1px;
  background: #303030;
  cursor: pointer;
  min-width: 100px;
  min-height: 45px;
  margin: 5px;
  line-height: 50px;
}
button:not(.run):hover {
  background: #202020;
}

button:not(.run)[disabled] {
  background: #404040;
  cursor: not-allowed;
}
.buttonImg{
  width: 40px;
  vertical-align: middle;
  transform: translateX(-10px);
}
<!DOCTYPE html>

  <meta charset="utf-8">
  <title>Labyrinth</title>

  <button onclick="debug=false; run(); deb.style.display = 'none'; debugHeader.style.display = 'none';">Run</button>
  <button id="debugButton" onclick="startDebug(); deb.style.display='flex'; debugHeader.style.display = 'flex';">Debug</button>
  <button id="stepButton" onclick="updatePointer();" disabled>Step: 1
  </button>
  <button onclick="sucide = true; updatePointer();">Stop</button>

Maze:

,)@
.(

Input:

Output:

Debugging:

    <textarea id="I">Labyrinth rocks!</textarea>
    <textarea id="O"></textarea>
    <textarea id="deb"></textarea>

  <svg width="100%" id="svgId">
  </svg>

Here is the most up-to-date version: http://output.jsbin.com/cuzoxu

Nice interpreter design! And the debugger. You made me want to learn this language!

@Soaku Thank you! If you have any suggestions/complaints/etc, feel free to tell me. I'm happy to implement pretty much anything!

Unary (to Brainfuck)
Simply converts Unary to Brainfuck. This could very easily be coupled with one of the Brainfuck interpreters to run Unary code directly - no need to reinvent the wheel!

function interpret() {
  var result = "";
  var table = "><+-.,[]"
  var option = document.getElementById("option").checked
  var code = document.getElementById("code").value
  var number = option ? parseInt(code, 10) : code.length;
  number = number.toString(2)
  if (number.length % 3 == 1) {
    number = number.slice(1)
    for (var i = 0; i < number.length; i += 3) {
      var instruction = number[i] + number[i + 1] + number[i + 2]
      instruction = parseInt(instruction, 2)
      result += table[instruction];
    }
  } else {
    result = "Error: program binary cannot be split into triplets."
  }
  document.getElementById("result").value = result;
}
Input as Number of 0's
<input id="option" type="checkbox" />

<input id="code" type="text" style="width:90%;" />

<input id="run" type="button" value="Run!" onclick="interpret()" />

<input id="result" type="text" style="width:90%;" />

Hello++
The easiest language to implement AND learn!

Hello++ Interpreter

Code

<textarea id=c></textarea>

<button onclick='o.value="",c.value.replace(/[^h]/ig,"").split("").map(function($){$&&(o.value+="Hello World\n")})'>Say hello to the output!</button>

Output

<textarea id=o readonly></textarea>

CHIQRSX9+
HQ9+ with Turing-completeness. I stuck as closely to the specs as possible.

function interpret(c,i){
 c.split('').map(function(v,I){
  if(v=='c'||v=='C')out.push(i);
  else if(v=='h'||v=='H')out.push('Hello, world!\n');
  else if(v=='i'||v=='I')interpret(i,"");
  else if(v=='q'||v=='Q')out.push(c);
  else if(v=='r'||v=='R')out.push(i.replace(/[a-zA-Z]/g,function(C){return String.fromCharCode((C<="Z"?90:122)>=(C=C.charCodeAt(0)+13)?C:C-26);}));
  else if(v=='s'||v=='S')out.push(i.split('\n').sort().join('\n'));
  else if(v=='x'||v=='X')eval(c.split().join(0|Math.random()*256));
  else if(v=='9')for(var o,e,n=100,t=" on the wall";n-->-1;)o=e+t+", "+e+".\n"+(n>-1?"Take one down, pass it around, ":"Go to the store and buy some more, ")+(e=(0>n?99:n||"no more")+" bottle"+(1!=n?"s":"")+" of beer")+t+".\n",99>n&&out.push(o);
  else if(v=='+')acc++;
  else out.push("\n\t!ERROR!\t\n");
 });
  return out.join('').match(/\n\t!ERROR!\t\n/g)?'ERROR: Unknown command':out.join('')
}

CHIQRSX9+ Interpreter

Code

<textarea id=c></textarea>

Input

<textarea id=i></textarea>

<button onclick='out=[],acc=0;o.value=interpret(c.value,i.value)'>Run!</button>

Output

<textarea id=o readonly></textarea>

Neoscript
Only work on ES6 browsers

"use strict";

function nodejswrapper(url) {
    let data = $.ajax({
        type: "GET",
        url: url,
        async: false
    }).responseText;
    return new Function("let module={};" + data + "return module.exports;")();
}

let tokenize, parse, transpile;

function compile(code) {
    return transpile(parse(tokenize(code)));
}

console.log = function(msg) {
    $("#console").append((""+msg).replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">") + "
");
}
console.clear = function(msg) {
    $("#console").html("");
}

$(function() {
    tokenize = nodejswrapper("http://crossorigin.me/https://raw.githubusercontent.com/tuxcrafting/neoscript/master/src/tokenizer.js").tokenize;
    parse = nodejswrapper("http://crossorigin.me/https://raw.githubusercontent.com/tuxcrafting/neoscript/master/src/parser.js").parse;
    transpile = nodejswrapper("http://crossorigin.me/https://raw.githubusercontent.com/tuxcrafting/neoscript/master/src/transpilers/javascript.js").transpile;
    $("#run").on("click", function() {
        let code = $("#code").val();
        let js = compile(code);
        new Function(js)();
    });
});
#console {
    width: 400px;
    height: 400px;
    overflow: auto;
    background: black;
    color: white;
    float: right;
    font-family: monospace;
}

<textarea id="code" cols="40" rows="15"></textarea>

<button id="run">Run</button>

Brainfuck
What, this is still code golf, r-r-right?
On a serious note, I implemented a bunch of esoteric languages in javascript a while ago, feel free to use them, it is pretty much plug and play: https://dl.dropboxusercontent.com/u/69377299/lang%20js/main.html

function run () {
  var code = document.getElementById("code").value;
  var inp  = document.getElementById("in").value;
  var ret  = x(code, inp);

  document.getElementById("out").value = ret;
}

function B(s,i,c) {
 i+=1+-c*2
 return s[i]==']['[+c]?i:B(s,s[i]==']['[+!c]?B(s,i,c):i,c)
}

function x(c, a) {
 var y, l=0, p=0, i=0, q=0, r='', t=[]
 for (; q<1000; q++) t[q] = 0

 for (;i<c.length; i++) {
  y = c.charCodeAt(i)
  p -= (y==60) - (y==62)
    t[p] += y==44? (l>a.length? 0: a.charCodeAt(l++))-t[p]: -((y==45) - (y==43))
  if (y==46) r += String.fromCharCode(t[p])
  if (y==91 + (t[p]>0)*2) i = B(c,i,y==93)
 }

 return r;
}
Code: <input id="code"></input>
<button onclick="run()">Run</button>

Input: <input id="in"></input>

Output: <input id="out" disabled></input>

;# (Semicolon hash)

function interpreter() {
  document.getElementById('out').innerHTML = ''
  acc = 0
  s = document.getElementById('in').value
  for (let x of s) {
    if (x == ';') {
      acc++
    }
    if (x == '#') {
      k = String.fromCharCode(acc % 127)
      f = document.getElementById('out').innerHTML
      document.getElementById('out').innerHTML = f + k
      acc = 0
    }
  }
}

;# Interpreter

<input type="text" id="in" value="" />
<input type="button" value="Run!" onclick="interpreter()" />

Output

My first ever JavaScript answer!!!