Skip to content

Instantly share code, notes, and snippets.

/index.html

Created July 24, 2015 00:40
Show Gist options
  • Save anonymous/667fc147e42c8afc5c9d to your computer and use it in GitHub Desktop.
Save anonymous/667fc147e42c8afc5c9d to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin livewriter // source https://jsbin.com/ruvagu
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="livewriter">
<meta charset="utf-8">
<title>JS Bin</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://rawgit.com/Paul-Browne/f20cc6c735021f6e3790/raw/56e2b6fae22811a3e44f7e2d51d7fcfada8b68b8/caret.js"></script>
<style id="jsbin-css">
body{margin:0}
textarea {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
width: 100%;
height: 100px;
outline: 0;
padding: 1em;
border: 0;
font-size: 1.2em;
resize: none;
background:#fef;
}
</style>
</head>
<body>
<textarea id="stuff"></textarea>
<div id="bob"></div>
<script id="jsbin-javascript">
function gst() {
var t = "",
w = window.getSelection,
d = document.selection;
if (w) {
t = w().toString();
} else if (d && d.type != "Control") {
t = d.createRange().text;
}
return t;
}
var sel;
$('#stuff').bind('keydown mousedown',function (){
sel = gst();
});
var x = [];
var y = [""];
var z = [0];
$('#stuff').bind('input propertychange', function() {
var pos = $("#stuff").caret();
var b = this.value;
var l = this.textLength;
var q = z[0];
var r = y[0];
var c = pos-sel.length-l+q;
z.push(l);
y.push(b);
if(pos===l&&sel===""&&l>q){
x.push(this.value.substr(c,pos-c));
//console.log(this.value.substr(c,pos-c));
}
if(q>l&&c>=pos){
x.push([pos,r.substr(pos,q-l)]);
//console.log([pos,r.substr(pos,q-l)]);
}
if(q<l&&pos>c&&pos!==l&&sel===""){
//console.log([this.value.substr(c,pos-c),c]);
x.push([this.value.substr(c,pos-c),c]);
}
if(pos>c &&! (pos===l&&sel===""&&l>q) &&! (q>l&&c>=pos) &&! (q<l&&pos>c&&pos!==l&&sel==="")){
//console.log([this.value.substr(c,pos-c),c,r.substr(c,q-l+pos-c)]);
x.push([this.value.substr(c,pos-c),c,r.substr(c,q-l+pos-c)]);
}
console.log(x);
if(z.length>1){
z.shift();
}
if(y.length>1){
y.shift();
}
});
$(document).keydown(function (e) {
var K = e.which;
if (e.ctrlKey) {
if (K == 90||K == 89||K == 123) {
e.preventDefault();
}
}
});
</script>
<script id="jsbin-source-css" type="text/css">body{margin:0}
textarea {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
width: 100%;
height: 100px;
outline: 0;
padding: 1em;
border: 0;
font-size: 1.2em;
resize: none;
background:#fef;
}</script>
<script id="jsbin-source-javascript" type="text/javascript">function gst() {
var t = "",
w = window.getSelection,
d = document.selection;
if (w) {
t = w().toString();
} else if (d && d.type != "Control") {
t = d.createRange().text;
}
return t;
}
var sel;
$('#stuff').bind('keydown mousedown',function (){
sel = gst();
});
var x = [];
var y = [""];
var z = [0];
$('#stuff').bind('input propertychange', function() {
var pos = $("#stuff").caret();
var b = this.value;
var l = this.textLength;
var q = z[0];
var r = y[0];
var c = pos-sel.length-l+q;
z.push(l);
y.push(b);
if(pos===l&&sel===""&&l>q){
x.push(this.value.substr(c,pos-c));
//console.log(this.value.substr(c,pos-c));
}
if(q>l&&c>=pos){
x.push([pos,r.substr(pos,q-l)]);
//console.log([pos,r.substr(pos,q-l)]);
}
if(q<l&&pos>c&&pos!==l&&sel===""){
//console.log([this.value.substr(c,pos-c),c]);
x.push([this.value.substr(c,pos-c),c]);
}
if(pos>c &&! (pos===l&&sel===""&&l>q) &&! (q>l&&c>=pos) &&! (q<l&&pos>c&&pos!==l&&sel==="")){
//console.log([this.value.substr(c,pos-c),c,r.substr(c,q-l+pos-c)]);
x.push([this.value.substr(c,pos-c),c,r.substr(c,q-l+pos-c)]);
}
console.log(x);
if(z.length>1){
z.shift();
}
if(y.length>1){
y.shift();
}
});
$(document).keydown(function (e) {
var K = e.which;
if (e.ctrlKey) {
if (K == 90||K == 89||K == 123) {
e.preventDefault();
}
}
});</script></body>
</html>
Raw
jsbin.ruvagu.css
body{margin:0}
textarea {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
width: 100%;
height: 100px;
outline: 0;
padding: 1em;
border: 0;
font-size: 1.2em;
resize: none;
background:#fef;
}
Raw
jsbin.ruvagu.js
function gst() {
var t = "",
w = window.getSelection,
d = document.selection;
if (w) {
t = w().toString();
} else if (d && d.type != "Control") {
t = d.createRange().text;
}
return t;
}
var sel;
$('#stuff').bind('keydown mousedown',function (){
sel = gst();
});
var x = [];
var y = [""];
var z = [0];
$('#stuff').bind('input propertychange', function() {
var pos = $("#stuff").caret();
var b = this.value;
var l = this.textLength;
var q = z[0];
var r = y[0];
var c = pos-sel.length-l+q;
z.push(l);
y.push(b);
if(pos===l&&sel===""&&l>q){
x.push(this.value.substr(c,pos-c));
//console.log(this.value.substr(c,pos-c));
}
if(q>l&&c>=pos){
x.push([pos,r.substr(pos,q-l)]);
//console.log([pos,r.substr(pos,q-l)]);
}
if(q<l&&pos>c&&pos!==l&&sel===""){
//console.log([this.value.substr(c,pos-c),c]);
x.push([this.value.substr(c,pos-c),c]);
}
if(pos>c &&! (pos===l&&sel===""&&l>q) &&! (q>l&&c>=pos) &&! (q<l&&pos>c&&pos!==l&&sel==="")){
//console.log([this.value.substr(c,pos-c),c,r.substr(c,q-l+pos-c)]);
x.push([this.value.substr(c,pos-c),c,r.substr(c,q-l+pos-c)]);
}
console.log(x);
if(z.length>1){
z.shift();
}
if(y.length>1){
y.shift();
}
});
$(document).keydown(function (e) {
var K = e.which;
if (e.ctrlKey) {
if (K == 90||K == 89||K == 123) {
e.preventDefault();
}
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment