D7net
Home
Console
Upload
information
Create File
Create Folder
About
Tools
:
/
home
/
importfo
/
public_html
/
snakefamilyspa.com
/
admin
/
Filename :
code-editor.html
back
Copy
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc."> <meta name="author" content="Coderthemes"> <link rel="shortcut icon" href="images/favicon_1.ico"> <title>Moltran - Responsive Admin Dashboard Template</title> <!-- Base Css Files --> <link href="css/bootstrap.min.css" rel="stylesheet" /> <!-- Font Icons --> <link href="assets/font-awesome/css/font-awesome.min.css" rel="stylesheet" /> <link href="assets/ionicon/css/ionicons.min.css" rel="stylesheet" /> <link href="css/material-design-iconic-font.min.css" rel="stylesheet"> <!-- animate css --> <link href="css/animate.css" rel="stylesheet" /> <!-- Waves-effect --> <link href="css/waves-effect.css" rel="stylesheet"> <!--Plugin Css--> <link rel="stylesheet" href="assets/codemirror/codemirror.css" /> <link rel="stylesheet" href="assets/codemirror/ambiance.css"> <!-- Custom Files --> <link href="css/helper.css" rel="stylesheet" type="text/css" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script> <![endif]--> <script src="js/modernizr.min.js"></script> </head> <body class="fixed-left"> <!-- Begin page --> <div id="wrapper"> <!-- Top Bar Start --> <div class="topbar"> <!-- LOGO --> <div class="topbar-left"> <div class="text-center"> <a href="index.html" class="logo"><i class="md md-terrain"></i> <span>Moltran </span></a> </div> </div> <!-- Button mobile view to collapse sidebar menu --> <div class="navbar navbar-default" role="navigation"> <div class="container"> <div class=""> <div class="pull-left"> <button class="button-menu-mobile open-left"> <i class="fa fa-bars"></i> </button> <span class="clearfix"></span> </div> <form class="navbar-form pull-left" role="search"> <div class="form-group"> <input type="text" class="form-control search-bar" placeholder="Type here for search..."> </div> <button type="submit" class="btn btn-search"><i class="fa fa-search"></i></button> </form> <ul class="nav navbar-nav navbar-right pull-right"> <li class="dropdown hidden-xs"> <a href="#" data-target="#" class="dropdown-toggle waves-effect waves-light" data-toggle="dropdown" aria-expanded="true"> <i class="md md-notifications"></i> <span class="badge badge-xs badge-danger">3</span> </a> <ul class="dropdown-menu dropdown-menu-lg"> <li class="text-center notifi-title">Notification</li> <li class="list-group"> <!-- list item--> <a href="javascript:void(0);" class="list-group-item"> <div class="media"> <div class="pull-left"> <em class="fa fa-user-plus fa-2x text-info"></em> </div> <div class="media-body clearfix"> <div class="media-heading">New user registered</div> <p class="m-0"> <small>You have 10 unread messages</small> </p> </div> </div> </a> <!-- list item--> <a href="javascript:void(0);" class="list-group-item"> <div class="media"> <div class="pull-left"> <em class="fa fa-diamond fa-2x text-primary"></em> </div> <div class="media-body clearfix"> <div class="media-heading">New settings</div> <p class="m-0"> <small>There are new settings available</small> </p> </div> </div> </a> <!-- list item--> <a href="javascript:void(0);" class="list-group-item"> <div class="media"> <div class="pull-left"> <em class="fa fa-bell-o fa-2x text-danger"></em> </div> <div class="media-body clearfix"> <div class="media-heading">Updates</div> <p class="m-0"> <small>There are <span class="text-primary">2</span> new updates available</small> </p> </div> </div> </a> <!-- last list item --> <a href="javascript:void(0);" class="list-group-item"> <small>See all notifications</small> </a> </li> </ul> </li> <li class="hidden-xs"> <a href="#" id="btn-fullscreen" class="waves-effect waves-light"><i class="md md-crop-free"></i></a> </li> <li class="hidden-xs"> <a href="#" class="right-bar-toggle waves-effect waves-light"><i class="md md-chat"></i></a> </li> <li class="dropdown"> <a href="" class="dropdown-toggle profile" data-toggle="dropdown" aria-expanded="true"><img src="images/avatar-1.jpg" alt="user-img" class="img-circle"> </a> <ul class="dropdown-menu"> <li><a href="javascript:void(0)"><i class="md md-face-unlock"></i> Profile</a></li> <li><a href="javascript:void(0)"><i class="md md-settings"></i> Settings</a></li> <li><a href="javascript:void(0)"><i class="md md-lock"></i> Lock screen</a></li> <li><a href="javascript:void(0)"><i class="md md-settings-power"></i> Logout</a></li> </ul> </li> </ul> </div> <!--/.nav-collapse --> </div> </div> </div> <!-- Top Bar End --> <!-- ========== Left Sidebar Start ========== --> <div class="left side-menu"> <div class="sidebar-inner slimscrollleft"> <div class="user-details"> <div class="pull-left"> <img src="images/users/avatar-1.jpg" alt="" class="thumb-md img-circle"> </div> <div class="user-info"> <div class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">John Doe <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="javascript:void(0)"><i class="md md-face-unlock"></i> Profile<div class="ripple-wrapper"></div></a></li> <li><a href="javascript:void(0)"><i class="md md-settings"></i> Settings</a></li> <li><a href="javascript:void(0)"><i class="md md-lock"></i> Lock screen</a></li> <li><a href="javascript:void(0)"><i class="md md-settings-power"></i> Logout</a></li> </ul> </div> <p class="text-muted m-0">Administrator</p> </div> </div> <!--- Divider --> <div id="sidebar-menu"> <ul> <li> <a href="index.html" class="waves-effect"><i class="md md-home"></i><span> Dashboard </span></a> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-mail"></i><span> Mail </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="inbox.html">Inbox</a></li> <li><a href="email-compose.html">Compose Mail</a></li> <li><a href="email-read.html">View Mail</a></li> </ul> </li> <li> <a href="calendar.html" class="waves-effect"><i class="md md-event"></i><span> Calendar </span></a> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-palette"></i> <span> Elements </span> <span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="typography.html">Typography</a></li> <li><a href="buttons.html">Buttons</a></li> <li><a href="panels.html">Panels</a></li> <li><a href="checkbox-radio.html">Checkboxs-Radios</a></li> <li><a href="tabs-accordions.html">Tabs & Accordions</a></li> <li><a href="modals.html">Modals</a></li> <li><a href="bootstrap-ui.html">BS Elements</a></li> <li><a href="progressbars.html">Progress Bars</a></li> <li><a href="notification.html">Notification</a></li> <li><a href="sweet-alert.html">Sweet-Alert</a></li> </ul> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-invert-colors-on"></i><span> Components </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="grid.html">Grid</a></li> <li><a href="portlets.html">Portlets</a></li> <li><a href="widgets.html">Widgets</a></li> <li><a href="nestable-list.html">Nesteble</a></li> <li><a href="ui-sliders.html">Sliders </a></li> <li><a href="gallery.html">Gallery </a></li> <li><a href="pricing.html">Pricing Table </a></li> </ul> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-redeem"></i> <span> Icons </span> <span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="material-icon.html">Material Design</a></li> <li><a href="ion-icons.html">Ion Icons</a></li> <li><a href="font-awesome.html">Font awesome</a></li> </ul> </li> <li class="has_sub"> <a href="#" class="waves-effect active"><i class="md md-now-widgets"></i><span> Forms </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="form-elements.html">General Elements</a></li> <li><a href="form-validation.html">Form Validation</a></li> <li><a href="form-advanced.html">Advanced Form</a></li> <li><a href="form-wizard.html">Form Wizard</a></li> <li><a href="form-editor.html">WYSIWYG Editor</a></li> <li class="active"><a href="code-editor.html">Code Editors</a></li> <li><a href="form-uploads.html">Multiple File Upload</a></li> <li><a href="form-xeditable.html">X-editable</a></li> </ul> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-view-list"></i><span> Data Tables </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="tables.html">Basic Tables</a></li> <li><a href="table-datatable.html">Data Table</a></li> <li><a href="tables-editable.html">Editable Table</a></li> <li><a href="responsive-table.html">Responsive Table</a></li> </ul> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-poll"></i><span> Charts </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="morris-chart.html">Morris Chart</a></li> <li><a href="chartjs.html">Chartjs</a></li> <li><a href="flot-chart.html">Flot Chart</a></li> <li><a href="peity-chart.html">Peity Charts</a></li> <li><a href="charts-sparkline.html">Sparkline Charts</a></li> <li><a href="chart-radial.html">Radial charts</a></li> <li><a href="other-chart.html">Other Chart</a></li> </ul> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-place"></i><span> Maps </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="gmap.html"> Google Map</a></li> <li><a href="vector-map.html"> Vector Map</a></li> </ul> </li> <li class="has_sub"> <a href="#" class="waves-effect"><i class="md md-pages"></i><span> Pages </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul class="list-unstyled"> <li><a href="profile.html">Profile</a></li> <li><a href="timeline.html">Timeline</a></li> <li><a href="invoice.html">Invoice</a></li> <li><a href="email-template.html">Email template</a></li> <li><a href="contact.html">Contact-list</a></li> <li><a href="login.html">Login</a></li> <li><a href="register.html">Register</a></li> <li><a href="recoverpw.html">Recover Password</a></li> <li><a href="lock-screen.html">Lock Screen</a></li> <li><a href="blank.html">Blank Page</a></li> <li><a href="maintenance.html">Maintenance</a></li> <li><a href="coming-soon.html">Coming-soon</a></li> <li><a href="404.html">404 Error</a></li> <li><a href="404_alt.html">404 alt</a></li> <li><a href="500.html">500 Error</a></li> </ul> </li> <li class="has_sub"> <a href="javascript:void(0);" class="waves-effect"><i class="md md-share"></i><span>Multi Level </span><span class="pull-right"><i class="md md-add"></i></span></a> <ul> <li class="has_sub"> <a href="javascript:void(0);" class="waves-effect"><span>Menu Level 1.1</span> <span class="pull-right"><i class="md md-add"></i></span></a> <ul style=""> <li><a href="javascript:void(0);"><span>Menu Level 2.1</span></a></li> <li><a href="javascript:void(0);"><span>Menu Level 2.2</span></a></li> <li><a href="javascript:void(0);"><span>Menu Level 2.3</span></a></li> </ul> </li> <li> <a href="javascript:void(0);"><span>Menu Level 1.2</span></a> </li> </ul> </li> </ul> <div class="clearfix"></div> </div> <div class="clearfix"></div> </div> </div> <!-- Left Sidebar End --> <!-- ============================================================== --> <!-- Start right Content here --> <!-- ============================================================== --> <div class="content-page"> <!-- Start content --> <div class="content"> <div class="container"> <!-- Page-Title --> <div class="row"> <div class="col-sm-12"> <h4 class="pull-left page-title">Code Editors</h4> <ol class="breadcrumb pull-right"> <li><a href="#">Moltran</a></li> <li><a href="#">Forms</a></li> <li class="active">Code Editors</li> </ol> </div> </div> <div class="row"> <div class="col-sm-12"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">XML/HTML Mode</h3> <small>The XML mode supports two configuration parameters <code>htmlMode</code> and <code>alignCDATA</code>. To learn more visit <a target="_blank" href="http://codemirror.net/mode/xml/index.html">here</a>. To view more languages visit <a href="http://codemirror.net/mode/index.html" target="_blank">here</a></small> </div> <div class="panel-body code-edit-wrap"> <textarea id="code" name="code"> <html style="color: green"> <!-- this is a comment --> <head> <title>HTML Example</title> </head> <body> The indentation tries to be <em>somewhat &quot;do what I mean&quot;</em>... but might not match your style. </body> </html> </textarea> </div> </div> </div> </div> <!-- End row --> <div class="row"> <div class="col-sm-12"> <div class="panel panel-inverse panel-color"> <div class="panel-heading"> <h3 class="panel-title">Code Editor Theme</h3> <small class="text-white">The code editor comes with different themes such as below. You can view more theme demos from the CodeMirror site by going here</small> </div> <div class="panel-body code-edit-wrap"> <textarea id="code2" name="code"> function findSequence(goal) { function find(start, history) { if (start == goal) return history; else if (start > goal) return null; else return find(start + 5, "(" + history + " + 5)") || find(start * 3, "(" + history + " * 3)"); } return find(1, "1"); } </textarea> </div> </div> </div> </div> <!-- End row --> <div class="row"> <div class="col-sm-12"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">AutoFormatting Of Code</h3> <small>Select a piece of code and click one of the links below to apply automatic formatting to the selected text or comment/uncomment the selected text. Note that the formatting behavior depends on the current block's mode. </small> <div class="m-t-10"></div> <button class="btn btn-primary waves-effect waves-light btn-sm m-r-5 autoformat">Autoformat Selected</button> <button class="btn btn-primary waves-effect waves-light btn-sm m-r-5 comment">Comment Selected</button> <button class="btn btn-primary waves-effect waves-light btn-sm uncomment">Uncommment Selected</button> </div><!-- panel-heading --> <div class="panel-body code-edit-wrap"> <textarea id="code3" name="code"><script> function (s,e){ for(var i=0; i < 1; i++) test("test();a=1");} </script> <script> function test(c){ for (var i = 0; i < 10; i++){ process("a.b();c = null;", 300);} } </script> <table><tr><td>test 1</td></tr><tr><td>test 2</td></tr></table> <script> function test() { return 1;} </script> <style> .test { font-size: medium; font-family: monospace; } </style></textarea> </div><!-- panel-body --> </div><!-- panel --> </div> </div> <!-- End row --> </div> <!-- container --> </div> <!-- content --> <footer class="footer text-right"> 2015 © Moltran. </footer> </div> <!-- ============================================================== --> <!-- End Right content here --> <!-- ============================================================== --> <!-- Right Sidebar --> <div class="side-bar right-bar nicescroll"> <h4 class="text-center">Chat</h4> <div class="contact-list nicescroll"> <ul class="list-group contacts-list"> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-1.jpg" alt=""> </div> <span class="name">Chadengle</span> <i class="fa fa-circle online"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-2.jpg" alt=""> </div> <span class="name">Tomaslau</span> <i class="fa fa-circle online"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-3.jpg" alt=""> </div> <span class="name">Stillnotdavid</span> <i class="fa fa-circle online"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-4.jpg" alt=""> </div> <span class="name">Kurafire</span> <i class="fa fa-circle online"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-5.jpg" alt=""> </div> <span class="name">Shahedk</span> <i class="fa fa-circle away"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-6.jpg" alt=""> </div> <span class="name">Adhamdannaway</span> <i class="fa fa-circle away"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-7.jpg" alt=""> </div> <span class="name">Ok</span> <i class="fa fa-circle away"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-8.jpg" alt=""> </div> <span class="name">Arashasghari</span> <i class="fa fa-circle offline"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-9.jpg" alt=""> </div> <span class="name">Joshaustin</span> <i class="fa fa-circle offline"></i> </a> <span class="clearfix"></span> </li> <li class="list-group-item"> <a href="#"> <div class="avatar"> <img src="images/users/avatar-10.jpg" alt=""> </div> <span class="name">Sortino</span> <i class="fa fa-circle offline"></i> </a> <span class="clearfix"></span> </li> </ul> </div> </div> <!-- /Right-bar --> </div> <!-- END wrapper --> <script> var resizefunc = []; </script> <!-- jQuery --> <script src="js/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/waves.js"></script> <script src="js/wow.min.js"></script> <script src="js/jquery.nicescroll.js" type="text/javascript"></script> <script src="js/jquery.scrollTo.min.js"></script> <script src="assets/jquery-detectmobile/detect.js"></script> <script src="assets/fastclick/fastclick.js"></script> <script src="assets/jquery-slimscroll/jquery.slimscroll.js"></script> <script src="assets/jquery-blockui/jquery.blockUI.js"></script> <!-- CUSTOM JS --> <script src="js/jquery.app.js"></script> <!--codemirror--> <script src="assets/codemirror/codemirror.js"></script> <script src="assets/codemirror/formatting.js"></script> <script src="assets/codemirror/xml.js"></script> <script src="assets/codemirror/javascript.js"></script> <script src="assets/codemirror/custom.codemirror.js"></script> </body> </html>