/* jshint esversion: 8 */ const human = { /** * Executes the asynchronous (you only get one [at a time?]), * but highly mutable (did I mean miserable?) existence of a * human's prototype and awaits the Promise that is death. * * @param {boolean} life Where there is life, there is death * @param {integer} age Alias for your life's setTimeout() * @param {boolean} dead Death is one of life's const */ "alive": async function (life, age, dead = false) { if (life) { let dying = false; while (!dead) { let upkeep = await eat(); let reboot = await sleep(); let career = await code(); // Oxymoronic condition if ((parseInt(career) !== Number.isNaN(upkeep)) && !reboot) { console.log("You're born to die!"); continue; } else { dying = true; } if (dying) { setTimeout(function() { console.warn("Unexpected end of execution!"); break; }, age); } } } else { throw new Error("Unexpected end of script!"); } }, /** * Death is just the end of biological IIFE */ "dead": void function () { return new Promise(resolve => { return resolve(eval(null)); }); } };
*:root { font-size: 16px; } * { transition: all 500ms ease-in; } body { padding: 0; margin: 0; box-sizing: border-box; } body:before, body:after { box-sizing: border-box; } section { background: #ddd; display: flex; justify-content: center; align-items: center; font-size: 0.7rem; height: 100vh; width: 100vw; border: 2px solid red; } section .container { float: left; border: 1px solid #000; } section .container .human { background: #16365c; width: 19em; height: 31em; position: relative; border: 2px solid green; display: flex; justify-content: center; } .cheveux:nth-child(1) { width: 7.1em; height: 4em; transform: translateY(2em); border-radius: 0.5em; background: #de4c0e; } .cheveux:nth-child(2) { width: 4em; height: 2.4em; position: absolute; top: 1em; transform: translateX(1.5em); border-radius: 0 1em 0 1em; background: #de4c0e; z-index: 11; } .cheveux:nth-child(3) { width: 6em; height: 3.4em; position: absolute; transform: translateX(-0.1em); border-radius: 0 2em 0 2em; background: #fe802b; z-index: 10; } .cheveux:nth-child(4) { width: 3em; height: 2.5em; position: absolute; top: 0.7em; transform: translateX(-3em); border-radius: 0 2em; background: #c32a03; z-index: 9; } .visage { width: 6em; height: 7.7em; padding: 0.8em; position: absolute; top: 3.5em; border-radius: 0 0 3em 3em; box-sizing: border-box; z-index: 9999; box-shadow: 0 1.5em 0 -0.7em rgba(0, 0, 0, 0.1), 0 3em 0 -0.5em #f2b191; background: #fccdab; } .visage .longmay { width: 1.6em; height: 0.4em; background: #de4c0e; border-radius: 1em; box-shadow: 0.1em 0.2em 0 0 rgba(0, 0, 0, 0.2), 2.5em 0em 0 0 #de4c0e, 2.6em 0.2em 0 0 rgba(0, 0, 0, 0.2); } .visage .yeux { opacity: 1; width: 0.6em; height: 1.3em; background: #183a65; margin: 0.8em 0.65em; border-radius: 1em; box-shadow: 0 0 0 0.25em white, 2.5em 0 0 0 #183a65, 2.5em 0 0 0.25em white; } .visage .mouth { padding: 1em 2em; background: #183a65; border-radius: 0 0 5em 5em; position: relative; overflow: hidden; } .visage .mouth .rang { padding: 0.3em 1.8em; position: absolute; top: 0; left: 0; background: white; border-radius: 0 0 0.5em 0; } .visage .mouth:before { content: ""; display: block; clear: 0; padding: 1.5em; background: #eb1b68; border-radius: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin-top: 1.5em; } .oreille { padding: 0.5em 4em; background: #fccdab; position: absolute; top: 6em; border-radius: 0.5em; z-index: 5; } .cothe { width: 9em; height: 14.9em; background: #0771dd; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin-top: 1.3em; border-radius: 5em; overflow: hidden; z-index: 12; } .cothe .tui { padding: 0.8em; border: 0.1em solid #000; position: absolute; overflow: hidden; } .cothe .tui:before { display: block; clear: both; content: ""; width: 100%; height: 100%; border: 0.1em solid #000; transform: rotate(45deg); position: absolute; top: 0; left: 0; margin-top: -1.2em; } .cothe .tui:after { content: ""; display: block; clear: both; padding: 0.3em; position: absolute; background: #41b3fc; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 100%; } .cothe .tui:nth-child(1) { top: 5.5em; left: 0.9em; } .cothe .tui:nth-child(2) { top: 5.6em; left: 6.3em; } .cothe .quan { width: 100%; height: 100%; background: #490689; position: absolute; margin-top: 8.6em; } .cothe .quan .thanglung { padding: 0.5em; background: #2c0559; position: relative; } .cothe .quan .thanglung:before { content: ""; display: block; clear: both; padding: 0.5em; background: #f0d319; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .vai { width: 14.5em; height: 3em; background: #0261b1; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin-top: -3em; border-radius: 2em 2em 0 0; z-index: 11; } .tay { width: 13.5em; height: 6em; background: #fccdab; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin-top: 1em; z-index: 0; } .mains { padding: 2.3em; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 100%; margin: 4.5em 5.7em; box-shadow: -11.5em 0 0 0 #fccdab; background: #fccdab; } .jamb { width: 7em; height: 7em; border-bottom-style: solid; border-width: 0.5em; background: #490689; position: absolute; bottom: 2em; display: flex; justify-content: center; align-items: center; overflow: hidden; } .jamb:before { content: ""; display: block; clear: both; padding: 5em; border: 0.5em solid #2c0559; position: absolute; bottom: 3.8em; border-radius: 100%; box-shadow: 0 0 1em 0 #2c0559; } .jamb:after { content: ""; display: block; clear: both; width: 0.5em; height: 10em; background: #2c0559; } .pieds { position: absolute; bottom: 0.5em; width: 10.5em; height: 1.5em; background: #0472de; border-radius: 2em 2em 0 0; overflow: hidden; z-index: 10; } .pieds:before { content: ""; display: block; clear: both; width: 0.5em; height: 4em; border: 1px solid #000; background: #2c0559; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .dat { width: 15em; height: 0.5em; background: #ec3e88; position: absolute; bottom: 0.2em; border-radius: 2em; z-index: 0; }
cod[e]ditor
HumanObject.js
File
ctrl + n
New
ctrl + o
Open...
ctrl + s
Save...
ctrl + shift + s
Save As...
Recent
alive.js
Encoding
ANSI
Unicode
Unicode Big Endian
UTF-8
More...
Recode
Default...
Line Endings
Windows
Unix
Mac
Default...
Download As...
Publish To Web
Google Docs
Google Drive
Dropbox
Adobe Creative Cloud
Private FTP
Another Service...
Close
Edit
ctrl + z
Undo
ctrl + y
Redo
ctrl + x
Cut
ctrl + c
Copy
ctrl + v
Paste
del
Clear
ctrl + a
Select All
ctrl + f
Find...
ctrl + h
Replace...
View
Syntax Highlighter
Interface Theme
Auto
Light
Dark
Dim
Font
Font Size
ctrl + shift + f
Fullscreen
Word Wrap
Show Whitespace
Show Line Endings
Highlight Current Line
Matching Braces
Lint Gutter Markers
Settings
Languages
Tabs as Spaces
Auto Indent Text
Auto Close Brackets
Auto Close Tags
Show Toolbar
Show Statusbar
f7
Export Settings...
Reset Settings...
Help
f1
About...
░▒█▀▀▄░▄▀▀▄░█▀▄░█▀▀░█▀▄░░▀░░▀█▀░▄▀▀▄░█▀▀▄ ░▒█░░░░█░░█░█░█░█▀▀░█░█░░█▀░░█░░█░░█░█▄▄▀ ░▒█▄▄▀░░▀▀░░▀▀░░▀▀▀░▀▀░░▀▀▀░░▀░░░▀▀░░▀░▀▀
A Semantic-UI In-Browser
IDE
Code Editor
Codeditor is still under heavy development. In fact, not to brag but Codeditor is the tool used in its own development. Imagine having a hand in your own inception. Quite the self-made story, right?
Many of the configuration options you see available have yet to be implemented. However, Codeditor is being developed as you view this modal prompt.
Other Creative Outlets
File Explorer
assets
css
style.css
js
script.js
components
HumanObject.js
Format Settings
🔅 Coming Soon
JavaScript
CSS
HTML
JavaScript Settings
CSS Settings
HTML Settings
cod[e]ditor Shell
cod[e]ditor con[s]ole
/* jshint esversion: 8 */ const human = { /** * Executes the asynchronous (you only get one [at a time?]), * but highly mutable (did I mean miserable?) existence of a * human's prototype and awaits the Promise that is death. * * @param {boolean} life Where there is life, there is death * @param {integer} age Alias for your life's setTimeout() * @param {boolean} dead Death is one of life's const */ "alive": async function (life, age, dead = false) { if (life) { let dying = false; while (!dead) { let upkeep = await eat(); let reboot = await sleep(); let career = await code(); // Oxymoronic condition if ((parseInt(career) !== Number.isNaN(upkeep)) && !reboot) { console.log("You're born to die!"); continue; } else { dying = true; } if (dying) { setTimeout(function() { console.warn("Unexpected end of execution!"); break; }, age); } } } else { throw new Error("Unexpected end of script!"); } }, /** * Death is just the end of biological IIFE */ "dead": void function () { return new Promise(resolve => { return resolve(eval(null)); }); } };