/**
* 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);
?>