<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300" rel="stylesheet">
</head>
<body id="theBodyOfAModel">
<form onkeypress="handle(event)" action="#">
<input onclick="stylejs();" autocomplete="off" placeholder="Type Something..." type="text" id="every" />
</form>
<div id="outwrapper">
<p id="output"></p>
</div>
</body
</html>
body {
padding: 0;
background-color: #ecf0f1;
}
#every {
font-size: 25px;
position: absolute;
top: 50%;
left: 50%;
margin-right: 0px;
margin-bottom: 0px: ;
width: 300px;
/*340px*/
height: 30px;
/*70px*/
margin-left: -173.4px;
margin-top: -38.08px;
padding: 20px;
vertical-align: middle;
font-family: 'Open Sans', sans-serif;
border: 1px solid #000;
border-radius: 5px;
background-color: #fff;
color: #000;
transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
}
#every:hover {
border-color: #2980b9;
background-color: #fff;
color: #000;
}
#every:focus {
transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
}
#every:not(:focus) {
cursor: pointer;
}
#output {
padding: 0px;
font-size: 28px;
font-family: 'Open Sans', sans-serif;
margin: 0px;
text-align: center;
user-select: none;
user-select: none;
user-select: none;
user-select: none;
transition: opacity 0.5s ease-in-out;
transition: opacity 0.5s ease-in-out;
transition: opacity 0.5s ease-in-out;
transition: opacity 0.5s ease-in-out;
}
#outwrapper {
height: 120px;
width: 500px;
position: absolute;
top: 55%;
left: 50%;
padding: 0px;
margin-left: -250px;
margin-top: 0px;
margin-bottom: 0px: margin-right: 0px;
text-align: center;
}
function handle(e) {
if (e.keyCode === 13) {
e.preventDefault();
theaction();
}
}
function sleep(milliseconds) {
var start = new Date().getTime();
for (var i = 0; i < 1e7; i++) {
if ((new Date().getTime() - start) > milliseconds) {
break;
}
}
}
function titleCase(str) {
str = str.toLowerCase().split(' ');
for (var i = 0; i < str.length; i++) {
str[i] = str[i].split('');
str[i][0] = str[i][0].toUpperCase();
str[i] = str[i].join('');
}
return str.join(' ');
}
function theaction() {
var int = document.getElementById("every").value;
var inp = int.toUpperCase();
var lop;
var dom = [".AERO", ".BIZ", ".CAT", ".COM", ".COOP", ".EDU", ".GOV", ".INFO", ".INT", ".JOBS", ".MIL", ".MOBI", ".MUSEUM",
".NAME", ".NET", ".ORG", ".TRAVEL", ".AC", ".AD", ".AE", ".AF", ".AG", ".AI", ".AL", ".AM", ".AN", ".AO", ".AQ", ".AR", ".AS", ".AT", ".AU", ".AW",
".AZ", ".BA", ".BB", ".BD", ".BE", ".BF", ".BG", ".BH", ".BI", ".BJ", ".BM", ".BN", ".BO", ".BR", ".BS", ".BT", ".BV", ".BW", ".BY", ".BZ", ".CA",
".CC", ".CD", ".CF", ".CG", ".CH", ".CI", ".CK", ".CL", ".CM", ".CN", ".CO", ".CR", ".CS", ".CU", ".CV", ".CX", ".CY", ".CZ", ".DE", ".DJ", ".DK", ".DM",
".DO", ".DZ", ".EC", ".EE", ".EG", ".EH", ".ER", ".ES", ".ET", ".EU", ".FI", ".FJ", ".FK", ".FM", ".FO", ".FR", ".GA", ".GB", ".GD", ".GE", ".GF", ".GG", ".GH",
".GI", ".GL", ".GM", ".GN", ".GP", ".GQ", ".GR", ".GS", ".GT", ".GU", ".GW", ".GY", ".HK", ".HM", ".HN", ".HR", ".HT", ".HU", ".ID", ".IE", ".IL", ".IM",
".IN", ".IO", ".IQ", ".IR", ".IS", ".IT", ".JE", ".JM", ".JO", ".JP", ".KE", ".KG", ".KH", ".KI", ".KM", ".KN", ".KP", ".KR", ".KW", ".KY", ".KZ", ".LA", ".LB",
".LC", ".LI", ".LK", ".LR", ".LS", ".LT", ".LU", ".LV", ".LY", ".MA", ".MC", ".MD", ".MG", ".MH", ".MK", ".ML", ".MM", ".MN", ".MO", ".MP", ".MQ",
".MR", ".MS", ".MT", ".MU", ".MV", ".MW", ".MX", ".MY", ".MZ", ".NA", ".NC", ".NE", ".NF", ".NG", ".NI", ".NL", ".NO", ".NP", ".NR", ".NU",
".NZ", ".OM", ".PA", ".PE", ".PF", ".PG", ".PH", ".PK", ".PL", ".PM", ".PN", ".PR", ".PS", ".PT", ".PW", ".PY", ".QA", ".RE", ".RO", ".RU", ".RW",
".SA", ".SB", ".SC", ".SD", ".SE", ".SG", ".SH", ".SI", ".SJ", ".SK", ".SL", ".SM", ".SN", ".SO", ".SR", ".ST", ".SU", ".SV", ".SY", ".SZ", ".TC", ".TD", ".TF",
".TG", ".TH", ".TJ", ".TK", ".TM", ".TN", ".TO", ".TP", ".TR", ".TT", ".TV", ".TW", ".TZ", ".UA", ".UG", ".UK", ".UM", ".US", ".UY", ".UZ", ".VA", ".VC",
".VE", ".VG", ".VI", ".VN", ".VU", ".WF", ".WS", ".YE", ".YT", ".YU", ".ZA", ".ZM", ".ZR", ".ZW"
];
if (dom.some(function(v) {
return inp.indexOf(v) >= 0;
})) {
if (inp.includes("HTTP://") || inp.includes("HTTPS://")) {
window.location.href = inp.toLowerCase();
} else {
var ht = "http://";
var loplink = ht.concat(inp);
window.location.href = loplink;
}
} else if (inp.includes("GOOGLE:")) {
var googlesearch = inp.substr(7);
window.location.href = "https://www.google.fi/search?q=" + googlesearch.toLowerCase();
} else if (inp.includes("DDG:")) {
var ddgsearch = inp.substr(4);
window.location.href = "https://duckduckgo.com/?q=" + ddgsearch.toLowerCase();
} else if (inp.includes("QWANT:")) {
var qwantsearch = inp.substr(6);
window.location.href = "https://www.qwant.com/?l=en&h=1&hc=1&a=1&s=0&b=1&i=1&r=en&sr=en&q=" + qwantsearch.toLowerCase();
} else if (inp.includes("HSL:")) {
var hslsearch = inp.substr(4);
window.location.href = "https://m.reittiopas.fi/en/index.php?mod=ls&txtSearch=" + hslsearch.toLowerCase() + "&search=Search";
} else if (inp.includes("MY NAME IS")) {
var nameis = inp.split("IS ")[1];
var namelow = nameis.toLowerCase();
var namefcap = titleCase(namelow);
var namefinal = namefcap.split(' ').filter(function(v) {
return v !== ' '
});
if (namefinal.length < 3) {
lop = "Hello " + namefinal + "! My name is DAT BOIYIIYIYIYIYI!";
lop = lop.replace(",", " ");
document.getElementById("output").innerHTML = lop;
} else {
lop = "You have a beutiful name!";
document.getElementById("output").innerHTML = lop;
sleep(5000);
window.location.href = "http://www.zombo.com";
}
} else if (inp.includes("BG:")) {
var bgGoodness = inp.substr(3);
document.getElementById("theBodyOfAModel").style.backgroundColor = bgGoodness;
} else {
switch (inp) {
case 'HEY':
case 'HEY!':
case 'HI!':
case 'HI':
case 'HELLO':
case 'HELLO!':
lop = "Hey!";
break;
case 'HEY SIRI!':
case 'HEY SIRI':
case 'HI SIRI':
case 'HI SIRI!':
case 'HELLO SIRI':
case 'HELLO SIRI!':
lop = "I'm not Siri! I'm dat BOiiii!";
break;
case 'FOO':
lop = "Bar";
break;
case 'BAR':
lop = "Foo";
break;
case 'FOOBAR':
case 'FOO BAR':
lop = 'Searching for bars called "Foo".....';
break;
case 'WHAT TIME IS IT?':
case 'WHAT TIME IS IT':
case 'WHAT IS THE TIME?':
case 'WHAT IS THE TIME?':
lop = "DEMO: " + Date();
break;
default:
lop = "U WOT M8??";
break;
}
document.getElementById("output").innerHTML = lop;
}
}
function stylejs() {
document.getElementById("every").style.width = "600px";
document.getElementById("every").style.borderColor = "blue";
document.getElementById("every").style.cursor = "auto";
}
Output
You can jump to the latest bin by adding /latest
to your URL
Keyboard Shortcuts
Shortcut | Action |
---|---|
ctrl + [num] | Toggle nth panel |
ctrl + 0 | Close focused panel |
ctrl + enter | Re-render output. If console visible: run JS in console |
Ctrl + l | Clear the console |
ctrl + / | Toggle comment on selected lines |
ctrl + ] | Indents selected lines |
ctrl + [ | Unindents selected lines |
tab | Code complete & Emmet expand |
ctrl + shift + L | Beautify code in active panel |
ctrl + s | Save & lock current Bin from further changes |
ctrl + shift + s | Open the share options |
ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts |
JS Bin URLs
URL | Action |
---|---|
/ | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
/edit | Edit the current bin |
/watch | Follow a Code Casting session |
/embed | Create an embeddable version of the bin |
/latest | Load the very latest bin (/latest goes in place of the revision) |
/[username]/last | View the last edited bin for this user |
/[username]/last/edit | Edit the last edited bin for this user |
/[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
/quiet | Remove analytics and edit button from rendered output |
.js | Load only the JavaScript for a bin |
.css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. |