/** * In fact, you're looking at ACE right now. Go ahead
and play with it! * * We are currently showing off the
JavaScript mode. ACE has support for 45 * language modes
and 24 color themes! */ function add(x, y) { var resultString
= "Hello, ACE! The result of your math is: "; var result
= x + y; return resultString + result; } var addResult
= add(3, 2); console.log(addResult);
<html> <head> <title>Demo</title>
</head> <body> <nav> <ul> <li><a
href="#">Home</a></li> <li><a
href="#">About</a></li> <li><a
href="#">Clients</a></li> <li><a
href="#">Contact Us</a></li> </ul>
<ul> <li><a href="#nowhere" title="Lorum
ipsum dolor sit amet">Lorem</a></li> <li><a
href="#nowhere" title="Aliquam tincidunt mauris eu risus">Aliquam</a></li>
<li><a href="#nowhere" title="Morbi in sem quis
dui placerat ornare">Morbi</a></li> <li><a
href="#nowhere" title="Praesent dapibus, neque id cursus
faucibus">Praesent</a></li> <li><a
href="#nowhere" title="Pellentesque fermentum dolor">Pellentesque</a></li>
</ul> </nav> </body> </html>
Get all keyboard shortcut options from here
Auto Resize
<html> <head> <title>Demo</title>
</head> <body> <nav> <ul> <li><a
href="#">Home</a></li> <li><a
href="#">About</a></li> <li><a
href="#">Clients</a></li> <li><a
href="#">Contact Us</a></li> </ul>
<ul> <li><a href="#nowhere" title="Lorum
ipsum dolor sit amet">Lorem</a></li> <li><a
href="#nowhere" title="Aliquam tincidunt mauris eu risus">Aliquam</a></li>
<li><a href="#nowhere" title="Morbi in sem quis
dui placerat ornare">Morbi</a></li> <li><a
href="#nowhere" title="Praesent dapibus, neque id cursus
faucibus">Praesent</a></li> <li><a
href="#nowhere" title="Pellentesque fermentum dolor">Pellentesque</a></li>
</ul> </nav> </body> </html>
Keyboard Shortcuts
<html> <head> <title>Demo</title>
</head> <body> <nav> <ul> <li><a
href="#">Home</a></li> <li><a
href="#">About</a></li> <li><a
href="#">Clients</a></li> <li><a
href="#">Contact Us</a></li> </ul>
<ul> <li><a href="#nowhere" title="Lorum
ipsum dolor sit amet">Lorem</a></li> <li><a
href="#nowhere" title="Aliquam tincidunt mauris eu risus">Aliquam</a></li>
<li><a href="#nowhere" title="Morbi in sem quis
dui placerat ornare">Morbi</a></li> <li><a
href="#nowhere" title="Praesent dapibus, neque id cursus
faucibus">Praesent</a></li> <li><a
href="#nowhere" title="Pellentesque fermentum dolor">Pellentesque</a></li>
</ul> </nav> </body> </html>
CSS Editor
body { overflow: hidden; } #editor { margin: 0; position:
absolute; top: 0; bottom: 20px; left: 0; right: 0; }
#statusBar { margin: 0; padding: 0; position: absolute;
left: 0; right: 0; bottom: 0; height: 20px; background-color:
rgb(245, 245, 245); color: gray; } .ace_status-indicator
{ color: gray; position: absolute; right: 0; border-left:
1px solid; }
SASS
// sass ace mode; @import url(http://fonts.googleapis.com/css?family=Ace:700)
html, body :background-color #ace text-align: center
height: 100% .toggle $size: 14px :background url(http://subtlepatterns.com/patterns/dark_stripes.png)
border-radius: 8px height: $size &:before $radius: $size
* 0.845 $glow: $size * 0.125 box-shadow: 0 0 $glow $glow
/ 2 #fff border-radius: $radius &:active ~ .button box-shadow:
0 15px 25px -4px rgba(0,0,0,0.4) ~ .tag font-size: 40px
color: rgba(0,0,0,0.45) &:checked ~ .button box-shadow:
0 15px 25px -4px #ace ~ .tag font-size: 40px color: #c9c9c9
JSON Editor
{"widget": { "debug": "on", "window": { "title": "Sample Konfabulator Widget", "name":
"main_window", "width": 500, "height": 500 }, "image":
{ "src": "Images/Sun.png", "name": "sun1", "hOffset":
250, "vOffset": 250, "alignment": "center" }, "text":
{ "data": "Click Here", "size": 36, "style": "bold",
"name": "text1", "hOffset": 250, "vOffset": 100, "alignment":
"center", "onMouseUp": "sun1.opacity = (sun1.opacity
/ 100) * 90;" } }}
PHP Code Editor
<?php $referenceTable = array(); $referenceTable['val1'] = array(1, 2); $referenceTable['val2']
= 3; $referenceTable['val3'] = array(4, 5); $testArray
= array(); $testArray = array_merge($testArray, $referenceTable['val1']);
var_dump($testArray); $testArray = array_merge($testArray,
$referenceTable['val2']); var_dump($testArray); $testArray
= array_merge($testArray, $referenceTable['val3']); var_dump($testArray);
?>