817 lines
29 KiB
HTML
817 lines
29 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Welcome - Ace Docs</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
|
|
<link href="../assets/css/bootstrap.css" rel="stylesheet">
|
|
<link href="../assets/css/font-awesome.css" rel="stylesheet" />
|
|
|
|
<link href="../assets/css/prettify.css" rel="stylesheet">
|
|
|
|
<link rel="stylesheet" href="../assets/css/ace-fonts.css" />
|
|
<link rel="stylesheet" href="../assets/css/ace.css" class="ace-main-stylesheet" />
|
|
<!--[if lte IE 9]>
|
|
<link rel="stylesheet" href="../assets/css/ace-part2.css" class="ace-main-stylesheet" />
|
|
<![endif]-->
|
|
<link rel="stylesheet" href="../assets/css/ace-skins.css" />
|
|
|
|
<link href="assets/js/themes/sunburst.css" rel="stylesheet" />
|
|
|
|
<style>
|
|
.navbar {
|
|
background: #438EB9 !important;
|
|
}
|
|
body {
|
|
font-size: 14px;
|
|
}
|
|
.skin-3 .main-container:before {
|
|
background: #F6F6F6;
|
|
}
|
|
.page-content {
|
|
padding-top: 25px;
|
|
padding-bottom: 75px;
|
|
max-width: 700px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.help-content {
|
|
background-color: #FFF;
|
|
max-width: 680px;
|
|
margin: 0 auto;
|
|
padding: 12px 24px;
|
|
border:1px solid #C5D0DC;
|
|
}
|
|
.help-content > .widget-box > .widget-header > .info-title {
|
|
cursor: pointer;
|
|
}
|
|
.help-content > .widget-box > .widget-header > .info-title:hover {
|
|
background-color: #DCE8F1;
|
|
}
|
|
.help-content > .widget-box.collapsed > .widget-header {
|
|
border-bottom-width: 0;
|
|
}
|
|
|
|
.help-content > .widget-box {
|
|
border-bottom: 1px solid #DCE8F1;
|
|
margin-bottom: 10px;
|
|
padding-bottom: 5px;
|
|
transition: none;
|
|
}
|
|
.help-content > .widget-box.collapsed {
|
|
padding-bottom: 10px;
|
|
transition: padding-bottom 0.1s;
|
|
}
|
|
.help-content > .widget-box:last-child {
|
|
border-bottom-width: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.help-content > .widget-box:only-child {
|
|
padding-bottom: 0;
|
|
padding-bottom: 5px;
|
|
}
|
|
|
|
|
|
.info-list {
|
|
margin: 0;
|
|
}
|
|
.info-list > li:nth-child(odd) > .ace-icon:first-child {
|
|
color: #478FCA;
|
|
}
|
|
.info-list > li:nth-child(even) > .ace-icon:first-child {
|
|
color: #69AA46;
|
|
}
|
|
.info-list > li:not(.hr) {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
padding: 16px 12px;
|
|
line-height: 22px;
|
|
}
|
|
.info-list > li:not(.hr):nth-child(even) {
|
|
background-color: #FFF;
|
|
border: 1px solid #E9E9E9;
|
|
}
|
|
.info-list > li:not(.hr):nth-child(odd) {
|
|
background-color: #F0F4F9;
|
|
}
|
|
|
|
.info-list > li:not(.hr):nth-child(even) code
|
|
{
|
|
background-color: #F0F4F9;
|
|
}
|
|
.info-list > li:not(.hr):nth-child(odd) code
|
|
{
|
|
background-color: #FFF;
|
|
}
|
|
|
|
|
|
.help-more {
|
|
color: #4E82A3;
|
|
border-bottom: 1px dotted #8BA8BA;
|
|
padding: 0 1px 1px;
|
|
}
|
|
.help-more:hover {
|
|
text-decoration: none;
|
|
border-bottom-color: #628DB2;
|
|
background-color: #E4EAC7;
|
|
}
|
|
|
|
u.dotted {
|
|
text-decoration: none;
|
|
border-bottom: 1px dotted #999;
|
|
}
|
|
|
|
@media only screen and (min-width: 992px) {
|
|
.sidebar {
|
|
padding-top: 4px;
|
|
}
|
|
}
|
|
|
|
pre .close {
|
|
float: inherit;
|
|
font-size: inherit;
|
|
font-weight: inherit;
|
|
line-height: inherit;
|
|
opacity: inherit;
|
|
text-shadow: inherit;
|
|
}
|
|
|
|
.open-file {
|
|
cursor: pointer;
|
|
-webkit-transition: all 0.12s;
|
|
transition: all 0.12s;
|
|
}
|
|
.open-file:hover {
|
|
background-color: #CEE0EA !important;
|
|
}
|
|
.open-file .brief-show {
|
|
display: none;
|
|
}
|
|
.open-file:hover .brief-show {
|
|
display: inline;
|
|
}
|
|
|
|
.code-modal .modal-dialog {
|
|
margin-top: 6px;
|
|
margin-bottom: 6px;
|
|
}
|
|
.code-modal .modal-header {
|
|
padding-top: 6px;
|
|
padding-bottom: 6px;
|
|
}
|
|
.code-modal .modal-body {
|
|
padding: 10px 12px
|
|
}
|
|
|
|
|
|
pre {
|
|
border-width: 0;
|
|
box-shadow: none;
|
|
border-radius: 0;
|
|
margin-top: 8px;
|
|
}
|
|
|
|
a[href^="http"]:before {
|
|
font-family: FontAwesome;
|
|
font-size: 15px;
|
|
content: "\f08e";
|
|
display: inline;
|
|
margin-right: 3px;
|
|
}
|
|
a.external_link[href^="http"]:before {
|
|
display: none;
|
|
}
|
|
|
|
.thumbnail {
|
|
margin: 12px 0 8px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body class="no-skin skin-3">
|
|
<div id="navbar" class="navbar navbar-default navbar-fixed-top h-navbar">
|
|
<div class="navbar-container container" id="navbar-container">
|
|
<div class="navbar-header pull-left ace-navbar-brand">
|
|
<span class="no-skin">
|
|
<button data-target="#sidebar" type="button" class="navbar-toggle menu-toggler pull-left" id="menu-toggler">
|
|
<span class="sr-only">Toggle sidebar</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
</span>
|
|
<a href="#" class="navbar-brand">
|
|
<small>
|
|
<i class="glyphicon glyphicon-book"></i>
|
|
Help <span class="smaller-75">(v1.3.4)</span>
|
|
</small>
|
|
</a><!-- /.brand -->
|
|
</div>
|
|
|
|
<div class="navbar-header pull-right ace-navbar-buttons">
|
|
<ul class="nav ace-nav">
|
|
<li class="margin-2 no-border">
|
|
<a href="#" id="help-move-prev"><i class="ace-icon fa fa-chevron-left"></i></a>
|
|
</li>
|
|
<li class="margin-2 no-border">
|
|
<a href="#" id="help-move-next"><i class="ace-icon fa fa-chevron-right"></i></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="main-container container">
|
|
<script>
|
|
if(document.location.protocol == 'file:') {
|
|
document.write('<div class="alert alert-danger">\
|
|
<strong>Please open this page using <span class="text-info">`http` protocol</span>, i.e. access it like this <span class="text-primary">http://127.0.0.1/path/to/ace/docs/index.html</span></strong><br />\
|
|
Demo pages, documentation & CSS/JS builder pages, load data dynamically using ajax and <b>`file` protocol</b> prevents that due to browser restrictions.\<br />\
|
|
Also some browsers such as Firefox don\'t load fonts when resource files are inside an upper level directory.\
|
|
</div>');
|
|
}
|
|
</script>
|
|
<div class="sidebar responsive sidebar-fixed" id="sidebar">
|
|
<ul class="nav nav-list">
|
|
<li class="highlight">
|
|
<a href="#intro">
|
|
<span class="menu-icon">ⅰ.</span>
|
|
<span class="menu-text">Introduction</span>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
</li>
|
|
|
|
<li class="highlight hover">
|
|
<a href="#changes" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅱ.</span>
|
|
<span class="menu-text">Changes & Updates</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#changes.v9"><i class="menu-icon fa fa-caret-right"></i> v1.3.3 <i class="fa fa-long-arrow-right"></i> v1.3.4</a></li>
|
|
<li class="hover"><a href="#changes.v8"><i class="menu-icon fa fa-caret-right"></i> v1.3.2 <i class="fa fa-long-arrow-right"></i> v1.3.3</a></li>
|
|
<li class="hover"><a href="#changes.v7"><i class="menu-icon fa fa-caret-right"></i> v1.3.1 <i class="fa fa-long-arrow-right"></i> v1.3.2</a></li>
|
|
<li class="hover"><a href="#changes.v6"><i class="menu-icon fa fa-caret-right"></i> v1.3.0 <i class="fa fa-long-arrow-right"></i> v1.3.1</a></li>
|
|
<li class="hover"><a href="#changes.v5"><i class="menu-icon fa fa-caret-right"></i> v1.2.0 <i class="fa fa-long-arrow-right"></i> v1.3.0</a></li>
|
|
<li class="hover"><a href="#changes.v4"><i class="menu-icon fa fa-caret-right"></i> v1.1.3 <i class="fa fa-long-arrow-right"></i> v1.2.0</a></li>
|
|
<li class="hover"><a href="#changes.v3"><i class="menu-icon fa fa-caret-right"></i> v1.1.2 <i class="fa fa-long-arrow-right"></i> v1.1.3</a></li>
|
|
<li class="hover"><a href="#changes.v2"><i class="menu-icon fa fa-caret-right"></i> v1.1.0 <i class="fa fa-long-arrow-right"></i> v1.1.2</a></li>
|
|
<li class="hover"><a href="#changes.fontawesome"><i class="menu-icon fa fa-caret-right"></i> Fontawesome & Icons</a></li>
|
|
</ul>
|
|
<b class="arrow"></b>
|
|
</li>
|
|
|
|
<li class="highlight hover">
|
|
<a href="#" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅲ.</span>
|
|
<span class="menu-text">Files</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#files/html"><i class="menu-icon fa fa-caret-right"></i> HTML Files</a></li>
|
|
<li class="hover"><a href="#files/mustache"><i class="menu-icon fa fa-caret-right"></i> Mustache Files</a></li>
|
|
<li class="hover"><a href="#files/css"><i class="menu-icon fa fa-caret-right"></i> CSS/LESS Files</a></li>
|
|
<li class="hover"><a href="#files/javascript"><i class="menu-icon fa fa-caret-right"></i> Javascript Files</a></li>
|
|
<li class="hover"><a href="#files/examples"><i class="menu-icon fa fa-caret-right"></i> Example Files</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="highlight hover">
|
|
<a href="#" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅳ.</span>
|
|
<span class="menu-text">Basics</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#basics/layout"><i class="menu-icon fa fa-caret-right"></i> Page Layout</a></li>
|
|
<li class="hover"><a href="#basics/navbar"><i class="menu-icon fa fa-caret-right"></i> Navbar</a></li>
|
|
<li class="hover"><a href="#basics/sidebar"><i class="menu-icon fa fa-caret-right"></i> Sidebar</a></li>
|
|
<li class="hover"><a href="#basics/content"><i class="menu-icon fa fa-caret-right"></i> Content</a></li>
|
|
<li class="hover"><a href="#basics/ajax"><i class="menu-icon fa fa-caret-right"></i> Ajax Content</a></li>
|
|
<li class="hover"><a href="#basics/footer"><i class="menu-icon fa fa-caret-right"></i> Footer</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="highlight hover">
|
|
<a href="#elements" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅴ.</span>
|
|
<span class="menu-text">Elements</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#elements.button"><i class="menu-icon fa fa-caret-right"></i> Buttons</a></li>
|
|
<li class="hover"><a href="#elements.label-badge"><i class="menu-icon fa fa-caret-right"></i> Labels & Badges</a></li>
|
|
<li class="hover"><a href="#elements.icon"><i class="menu-icon fa fa-caret-right"></i> Icons</a></li>
|
|
<li class="hover"><a href="#elements.form"><i class="menu-icon fa fa-caret-right"></i> Form Control</a></li>
|
|
<li class="hover"><a href="#elements.tab"><i class="menu-icon fa fa-caret-right"></i> Tabs</a></li>
|
|
<li class="hover"><a href="#elements.accordion"><i class="menu-icon fa fa-caret-right"></i> Accordion</a></li>
|
|
<li class="hover"><a href="#elements.tooltip"><i class="menu-icon fa fa-caret-right"></i> Tooltip & Popover</a></li>
|
|
<li class="hover"><a href="#elements.dropdown"><i class="menu-icon fa fa-caret-right"></i> Dropdown</a></li>
|
|
<li class="hover"><a href="#elements.other"><i class="menu-icon fa fa-caret-right"></i> Other</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="highlight hover">
|
|
<a href="#" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅵ.</span>
|
|
<span class="menu-text">Custom Elements</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#custom/widget-box"><i class="menu-icon fa fa-caret-right"></i> Widget Boxes</a></li>
|
|
<li class="hover"><a href="#custom/scrollbar"><i class="menu-icon fa fa-caret-right"></i> Scrollbars</a></li>
|
|
<li class="hover"><a href="#custom/file-input"><i class="menu-icon fa fa-caret-right"></i> File Input</a></li>
|
|
<li class="hover"><a href="#custom/checkbox"><i class="menu-icon fa fa-caret-right"></i> Checkbox & Switches</a></li>
|
|
<li class="hover"><a href="#custom/colorpicker"><i class="menu-icon fa fa-caret-right"></i> Simple Color Picker</a></li>
|
|
<li class="hover"><a href="#custom/inline-editable"><i class="menu-icon fa fa-caret-right"></i> Inline Editable Addons</a></li>
|
|
<li class="hover"><a href="#custom/content-slider"><i class="menu-icon fa fa-caret-right"></i> Content Slider</a></li>
|
|
<li class="hover"><a href="#custom/onpage-help"><i class="menu-icon fa fa-caret-right"></i> Onpage Help</a></li>
|
|
<li class="hover"><a href="#custom/extra"><i class="menu-icon fa fa-caret-right"></i> Extra Classes</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="highlight hover">
|
|
<a href="#" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅶ.</span>
|
|
<span class="menu-text">Pages</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#pages/dashboard"><i class="menu-icon fa fa-caret-right"></i> Dashboard</a></li>
|
|
<li class="hover"><a href="#pages/gallery"><i class="menu-icon fa fa-caret-right"></i> Gallery</a></li>
|
|
<li class="hover"><a href="#pages/pricing"><i class="menu-icon fa fa-caret-right"></i> Pricing</a></li>
|
|
<li class="hover"><a href="#pages/invoice"><i class="menu-icon fa fa-caret-right"></i> Invoice</a></li>
|
|
<li class="hover"><a href="#pages/faq"><i class="menu-icon fa fa-caret-right"></i> FAQ</a></li>
|
|
<li class="hover"><a href="#pages/inbox"><i class="menu-icon fa fa-caret-right"></i> Inbox</a></li>
|
|
<li class="hover"><a href="#pages/email"><i class="menu-icon fa fa-caret-right"></i> Email Templates</a></li>
|
|
<li class="hover"><a href="#pages/profile"><i class="menu-icon fa fa-caret-right"></i> Profile</a></li>
|
|
<li class="hover"><a href="#pages/timeline"><i class="menu-icon fa fa-caret-right"></i> Timeline</a></li>
|
|
<li class="hover"><a href="#pages/login"><i class="menu-icon fa fa-caret-right"></i> Login</a></li>
|
|
<li class="hover"><a href="#pages/error"><i class="menu-icon fa fa-caret-right"></i> Error</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="highlight hover">
|
|
<a href="#" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅷ.</span>
|
|
<span class="menu-text">Plugins</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover">
|
|
<a href="#plugins/tools" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> Tools
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/tools.node-js">Node.js</a></li>
|
|
<li class="hover"><a href="#plugins/tools.less-js">Less.js</a></li>
|
|
<li class="hover"><a href="#plugins/tools.mustache">Mustache Compilers</a></li>
|
|
<li class="hover"><a href="#plugins/tools.uglifyjs">UglifyJS</a></li>
|
|
<li class="hover"><a href="#plugins/tools.yui-compressor">YUI Compressor</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="hover"><a href="#plugins/bootstrap"><i class="menu-icon fa fa-caret-right"></i> Bootstrap</a></li>
|
|
<li class="hover"><a href="#plugins/jquery"><i class="menu-icon fa fa-caret-right"></i> jQuery</a></li>
|
|
<li class="hover">
|
|
<a href="#plugins/date-time" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> Date & Time
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/date-time.datepicker">Date picker</a></li>
|
|
<li class="hover"><a href="#plugins/date-time.daterangepicker">Daterange Picker</a></li>
|
|
<li class="hover"><a href="#plugins/date-time.timepicker">Time Picker</a></li>
|
|
<li class="hover"><a href="#plugins/date-time.datetimepicker">Datetime Picker</a></li>
|
|
<li class="hover"><a href="#plugins/date-time.fullcalendar">FullCalendar</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="hover">
|
|
<a href="#plugins/charts" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> Charts
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/charts.flot">jQuery Flot Charts</a></li>
|
|
<li class="hover"><a href="#plugins/charts.sparkline">jQuery Sparklines</a></li>
|
|
<li class="hover"><a href="#plugins/charts.easypiechart">Easy Pie Chart</a></li>
|
|
<li class="hover"><a href="#plugins/charts.knob">jQuery Knob</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="hover">
|
|
<a href="#plugins/tables" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> Table & Grids
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/tables.datatables">jQuery dataTables</a></li>
|
|
<li class="hover"><a href="#plugins/tables.jqgrid">jQuery jqGrid</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="hover">
|
|
<a href="#plugins/input" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> Input & Controls
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/input.chosen">Chosen</a></li>
|
|
<li class="hover"><a href="#plugins/input.select2">Select2</a></li>
|
|
<li class="hover"><a href="#plugins/input.tag-input">Tag Input</a></li>
|
|
<li class="hover"><a href="#plugins/input.duallist">Dual listbox</a></li>
|
|
<li class="hover"><a href="#plugins/input.multiselect">Multiselect</a></li>
|
|
|
|
<li class="hover"><a href="#plugins/input.masked-input">Masked Input</a></li>
|
|
<li class="hover"><a href="#plugins/input.limiter">Input Limiter</a></li>
|
|
|
|
<li class="hover"><a href="#plugins/input.autosize">Textarea Autosize</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="hover">
|
|
<a href="#plugins/editor" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> Editors
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/editor.wysiwyg">Wysiwyg Editor</a></li>
|
|
<li class="hover"><a href="#plugins/editor.markdown">Markdown Editor</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="hover">
|
|
<a href="#plugins/fuelux" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> FuelUX
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/fuelux.spinner">Spinner</a></li>
|
|
<li class="hover"><a href="#plugins/fuelux.wizard">Wizard</a></li>
|
|
<li class="hover"><a href="#plugins/fuelux.treeview">Treeview</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
|
|
<li class="hover">
|
|
<a href="#plugins/misc" class="dropdown-toggle">
|
|
<i class="menu-icon fa fa-caret-right"></i> Miscellaneous
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#plugins/misc.inline-editable">Inline Editable</a></li>
|
|
<li class="hover"><a href="#plugins/misc.jquery-validate">jQuery Validate</a></li>
|
|
<li class="hover"><a href="#plugins/misc.colorbox">Colorbox</a></li>
|
|
<li class="hover"><a href="#plugins/misc.dropzone">Dropzone.js</a></li>
|
|
<li class="hover"><a href="#plugins/misc.colorpicker">Colorpicker</a></li>
|
|
|
|
<li class="hover"><a href="#plugins/misc.bootbox">Bootbox</a></li>
|
|
<li class="hover"><a href="#plugins/misc.gritter">Gritter</a></li>
|
|
<li class="hover"><a href="#plugins/misc.nestable-list">Nestable Lists</a></li>
|
|
<li class="hover"><a href="#plugins/misc.slimscroll">SlimScroll</a></li>
|
|
|
|
<li class="hover"><a href="#plugins/misc.raty">Star Rating</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
</ul>
|
|
</li>
|
|
|
|
|
|
<li class="highlight hover">
|
|
<a href="#settings" class="dropdown-toggle">
|
|
<span class="menu-icon">ⅸ.</span>
|
|
<span class="menu-text">Settings</span>
|
|
<b class="arrow fa fa-angle-right"></b>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
<ul class="submenu">
|
|
<li class="hover"><a href="#settings.page"><i class="menu-icon fa fa-caret-right"></i> Page options</a></li>
|
|
<li class="hover"><a href="#settings.sidebar"><i class="menu-icon fa fa-caret-right"></i> Sidebar options</a></li>
|
|
<li class="hover"><a href="#settings.skins"><i class="menu-icon fa fa-caret-right"></i> Skins</a></li>
|
|
<li class="hover"><a href="#settings.rtl"><i class="menu-icon fa fa-caret-right"></i> RTL (right to left)</a></li>
|
|
<li class="hover"><a href="#settings.storage"><i class="menu-icon fa fa-caret-right"></i> Cookies & Storage</a></li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="highlight">
|
|
<a href="#credits">
|
|
<span class="menu-icon">ⅹ.</span>
|
|
<span class="menu-text">Credits</span>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
</li>
|
|
|
|
|
|
<li class="highlight">
|
|
<a href="#issues">
|
|
<i class="menu-icon fa fa-gavel"></i>
|
|
<span class="menu-text">Notes & Issues</span>
|
|
</a>
|
|
<b class="arrow"></b>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
<div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse">
|
|
<i class="ace-icon fa fa-angle-double-left" data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="main-content">
|
|
<div class="page-content">
|
|
|
|
|
|
</div><!-- /.page-content -->
|
|
</div><!-- /.main-content -->
|
|
|
|
|
|
<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
|
|
<i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
|
|
</a><!-- /.btn-scroll-up -->
|
|
|
|
</div><!-- /.main-container -->
|
|
|
|
|
|
<!--[if !IE]> -->
|
|
<script src="../assets/js/jquery.js"></script>
|
|
<!-- <![endif]-->
|
|
<!--[if IE]>
|
|
<script src="../assets/js/jquery1x.js"></script>
|
|
<![endif]-->
|
|
|
|
<script src="../assets/js/bootstrap.js"></script>
|
|
<script src="../assets/js/prettify.js"></script>
|
|
|
|
<script src="../assets/js/ace-extra.js"></script>
|
|
<script src="../assets/js/ace-elements.js"></script>
|
|
<script src="../assets/js/ace.js"></script>
|
|
|
|
|
|
<script>
|
|
$(function() {
|
|
//$('body').scrollspy({ target: '.sidebar' })
|
|
|
|
//used for top next/prev buttons
|
|
var section_list = [], section_map = {}, current = 0;
|
|
var sindex = 0;
|
|
$('.sidebar .nav-list a').each(function() {
|
|
var href = getHref($(this).attr('href'));
|
|
if(href) {
|
|
section_list.push(href);
|
|
section_map[href] = sindex++;
|
|
}
|
|
});
|
|
|
|
$('#help-move-prev').on('click', function(e) {
|
|
e.preventDefault();
|
|
if( --current >= 0 ) {
|
|
var href = section_list[current];
|
|
document.location.hash = href;
|
|
}
|
|
if(current < 0) current = 0;
|
|
});
|
|
$('#help-move-next').on('click', function(e) {
|
|
e.preventDefault();
|
|
if( ++current < section_list.length ) {
|
|
var href = section_list[current];
|
|
document.location.hash = href;
|
|
}
|
|
if(current >= section_list.length) current = section_list.length - 1;
|
|
});
|
|
|
|
|
|
|
|
//$(document).on('show.ace.widget hide.ace.widget', '.help-content > .widget-box', function(e) {
|
|
//disable button action
|
|
//e.preventDefault();
|
|
//});
|
|
$(document).on(ace.click_event, '.help-content > .widget-box > .widget-header > .info-title', function(e) {
|
|
var widget_box = $(this).closest('.widget-box').widget_box('toggle');
|
|
//widget_box.siblings('.widget-box').widget_box('hide');
|
|
});
|
|
|
|
|
|
$(document).off(ace.click_event+'.ace.submenu', '.sidebar .nav-list');
|
|
$(document).on(ace.click_event+'.ace.submenu', '.sidebar .nav-list a', function(e) {
|
|
var href = getHref($(this).attr('href'));
|
|
if(!href) return false;
|
|
});
|
|
|
|
$(window).on('hashchange.help', function(e) {
|
|
var href = getHref(window.location.hash);
|
|
if(!href) return false;
|
|
return gotoUrl(href);
|
|
})
|
|
$(document).on(ace.click_event+'.help', '.help-more', function(ev) {
|
|
//clicking on a link triggers 'hashchange', so it's not needed
|
|
//but if we already are on a hash such as '#hash1'
|
|
//and click a '#hash1' link, 'hashchange' won't be triggered and we won't scroll to our content
|
|
var href = $(this).attr('href');
|
|
if(window.location.hash == href) gotoUrl(href);
|
|
});
|
|
|
|
|
|
var href = getHref(window.location.hash);
|
|
if(!href) window.location.hash = '#intro';
|
|
else $(window).triggerHandler('hashchange.help');
|
|
|
|
var prev_target = null;
|
|
|
|
function gotoUrl(href) {
|
|
current = section_map[href];
|
|
|
|
var url = href.replace(/\..*$/g, '').replace(/#/gi , '')
|
|
var parts = url.split('/');
|
|
if(parts.length == 1) {
|
|
if(url.length == 0) url = 'intro';
|
|
url = url+'/index.html';
|
|
}
|
|
else if(parts.length > 1) {
|
|
url = url+'.html';
|
|
}
|
|
|
|
$('.sidebar .active').removeClass('active');
|
|
var link = $('a[href="'+href+'"]').eq(0);
|
|
link.parents('li').addClass('active');
|
|
|
|
var text = $.trim(link.find('.menu-text').text());
|
|
if(text.length == 0) text = $.trim(link.text());
|
|
document.title = text + " - Ace Docs";
|
|
//if(text == '');
|
|
|
|
var ret = scrollToTarget(href);
|
|
if(ret === false) {
|
|
$('.page-content').empty().html('<i class="ace-icon fa fa-spinner fa-spin blue fa-2x"></i>');
|
|
|
|
//otherwise try downloading the page
|
|
$.ajax({url: 'sections/'+url}).done(function(result) {
|
|
result = result.replace(/\<pre(?:\s+)data\-language=["'](?:html|javascript|php)["']\>([\S|\s]+?)\<\/pre\>/ig, function(a, b){
|
|
return a.replace(b , b.replace(/\</g , '<').replace(/\>/g , '>'));
|
|
});
|
|
|
|
$('.page-content').addClass('hidden').empty().html(result);
|
|
formatResult();
|
|
|
|
ret = scrollToTarget(href);
|
|
if(ret) document.title = ret + " - Ace Docs";
|
|
}).fail(function() {
|
|
$('.page-content').empty().html('<div class="alert alert-danger"><i class="fa fa-warning"></i> Unable to load page!</div>');
|
|
});
|
|
}
|
|
else if(ret) document.title = ret + " - Ace Docs";
|
|
|
|
|
|
return true;
|
|
}
|
|
|
|
function formatResult() {
|
|
$('.page-content .info-section').each(function() {
|
|
var header = $(this).prevAll('.info-title').eq(0).addClass('widget-title').wrap('<div class="widget-header" />')
|
|
.parent().append('<div class="widget-toolbar no-border">\
|
|
<a href="#" data-action="collapse">\
|
|
<i data-icon-hide="fa-minus" data-icon-show="fa-plus" class="ace-icon fa fa-plus"></i>\
|
|
</a>\
|
|
</div>').closest('.widget-header');
|
|
|
|
$(this).wrap('<div class="widget-box transparent'+(header.length > 0 ? ' collapsed':'')+'"><div class="widget-body"><div class="widget-main"></div></div></div>');
|
|
$(this).closest('.widget-box').prepend(header);
|
|
|
|
$(this).ace_scroll({size: parseInt($(window).height() - 200), reset: true});
|
|
//.parent().css({'max-height':400, 'overflow-y':'scroll'});//
|
|
});
|
|
|
|
Rainbow.color();
|
|
|
|
$('.page-content').removeClass('hidden');
|
|
}
|
|
|
|
function getHref(href) {
|
|
href = href && href.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
|
|
href = $.trim(href);
|
|
if(href.match(/[\#\/]$/i)) return false;
|
|
return href;
|
|
}
|
|
|
|
function scrollToTarget(href) {
|
|
target = $('[data-id="'+href+'"]').eq(0);
|
|
if(target.length == 1) {
|
|
target.closest('.widget-box').widget_box('show');
|
|
|
|
//if target exists on page scroll to it
|
|
$('html,body').animate({scrollTop: target.offset().top - 75} , 300);
|
|
if(prev_target) prev_target.find('.fa-angle-right').remove();
|
|
|
|
if(!target.is('h1')) target.prepend('<i class="fa fa-angle-right red"></i> ');
|
|
prev_target = target;
|
|
|
|
return target.text().replace(/^[\d\s\.]+/ig, '');//convert "4. something" to "something"
|
|
}
|
|
return false;//section not found, go back and get it via ajax
|
|
}
|
|
|
|
|
|
$(document).on(ace.click_event, '.open-file[data-open-file]', function() {
|
|
var url = $(this).text();
|
|
var language = $(this).attr('data-open-file');
|
|
$.ajax({url: '../'+url, dataType:'text'}).done(function(content) {
|
|
if(language != 'json') {
|
|
if(language != 'css') {
|
|
//replace each tab character with two spaces (only those that start at a new line)
|
|
content = content.replace(/\n[\t]{1,}/g, function(p, q) {
|
|
return p.replace(/\t/g, " ");
|
|
});
|
|
} else {
|
|
content = content.replace(/\t/g , " ")
|
|
}
|
|
}
|
|
else {
|
|
content = JSON.stringify(JSON.parse(content), null, 2);
|
|
}
|
|
content = content.replace(/\>/g, '>').replace(/\</g, '<')
|
|
Rainbow.color(content, language, function(highlighted_code) {
|
|
display_code(url, highlighted_code);
|
|
|
|
});
|
|
});
|
|
});
|
|
|
|
function display_code(url, highlighted_code) {
|
|
var modal = $(document.body).find('#code-modal');
|
|
if(modal.length == 0) {
|
|
modal = $('<div id="code-modal" class="modal fade code-modal" tabindex="-1" role="dialog" aria-labelledby="CodeDialog" aria-hidden="true">\
|
|
<div class="modal-dialog modal-lg">\
|
|
<div class="modal-content">\
|
|
<div class="modal-header">\
|
|
<button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>\
|
|
<i class="fa fa-file-o"></i>\
|
|
<code class="code-url"></code>\
|
|
</div>\
|
|
<div class="modal-body"><pre class="code-content"></pre></div>\
|
|
</div>\
|
|
</div>\
|
|
</div>').appendTo('body');
|
|
}
|
|
|
|
modal.find('.code-url').html(url);
|
|
modal.find('.code-content').html(highlighted_code);
|
|
modal.modal('show');
|
|
}
|
|
|
|
$(document).on('click', 'a[href^="http"]', function(ev) {
|
|
//go to a url, using meta refresh tag, to avoid sending 'referrer' url,
|
|
//maybe because of hiding development server's directory and folders
|
|
|
|
ev.preventDefault();
|
|
var url = $(this).attr('href');
|
|
|
|
var win = window.open('blank.html');
|
|
win.onload = function() {
|
|
win.document.write('<meta http-equiv="refresh" content="0; url='+url+'">');
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<script src="assets/js/rainbow.js"></script>
|
|
<script src="assets/js/language/generic.js"></script>
|
|
<script src="assets/js/language/html.js"></script>
|
|
<script src="assets/js/language/javascript.js"></script>
|
|
<script src="assets/js/language/css.js"></script>
|
|
<script src="assets/js/language/php.js"></script>
|
|
|
|
|
|
</body>
|
|
</html>
|