<html>
<head>
<title>Locche!</title>
<script type="text/javascript" src="http://cdn.jsdelivr.net/jquery/1.10.2/jquery-1.10.2.min.js"></script>
</head>
<body>
<h1>Locche!</h1>
<a href="#magic" id="older">Previous version</a></br>
<textarea id="editor" cols="80" rows="20"></textarea>
</br>
<textarea id="thisislocche" cols="80" rows="20" style="display: none;"></textarea>
</br>
<button onClick="$('#thisislocche').show(1000)">Edit Locche Itself</button>
<button onCLick="do_paste()">Paste!</button>
<script>
var markup = document.documentElement.innerHTML;
$('#thisislocche').val(markup);
pastedata = 'WRITE HERE';
$('#editor').val(pastedata);

function do_paste() {
    // Get the value from the editor and "save it"
    data = JSON.stringify($('#editor').val()).substr(1);
    data = data.substr(0,data.length-1); // The substrs are to remove quotes
    old_locche = $('#thisislocche').val()
    new_locche = old_locche.replace(RegExp("pastedata = '.*';"), "pastedata = '"+data+"';")
    new_locche = new_locche.replace(RegExp("<a href=.*revious.*</a>"), '<a href="'+window.location+'" id="older">Previous version</a>')
    console.log(new_locche);
    bdata = window.btoa(new_locche)
    window.location = 'data:text/html;base64,'+ bdata
}
</script>
</body>
</html>