tyler.durden
/
glass-isc-dhcp
mirror of https://github.com/Akkadius/glass-isc-dhcp.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Re-format API Examples page

This commit is contained in:
Akkadius 2017-09-21 16:08:21 -05:00
parent f9dec38ad9
commit 9205491af8
7 changed files with 143 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -12,6 +12,7 @@ pids
*.pid.lock
config_backups
config/glass_config.json
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

19
public/assets/js/api-examples.js
View File

@ -3,15 +3,21 @@
*/
function api_example(example) {
var start_time = new Date().getTime();
switch(example) {
case "get_active_leases":
$("#get_active_leases").html(loader_html);
$.getJSON( "/api/get_active_leases", function( data ) {
$("#get_active_leases").html('<pre>' + JSON.stringify(data, null, 2) + '</pre>').fadeOut(100).fadeIn(100);
var request_time = (new Date().getTime() - start_time) / 1000;
$("#get_active_leases").html('Server Response Time: ' + request_time + 'ms <pre style="margin-top:20px">' + JSON.stringify(data, null, 2) + '</pre>');
});
break;
case "get_subnet_details":
$("#get_subnet_details").html(loader_html);
$.getJSON( "/api/get_subnet_details", function( data ) {
$("#get_subnet_details").html('<pre>' + JSON.stringify(data, null, 2) + '</pre>').fadeOut(100).fadeIn(100);
var request_time = (new Date().getTime() - start_time) / 1000;
$("#get_subnet_details").html('Server Response Time: ' + request_time + 'ms <pre style="margin-top:20px">' + JSON.stringify(data, null, 2) + '</pre>');
});
break;
default:
@ -19,6 +25,15 @@ function api_example(example) {
}
}
function raw_api(call){
switch(call) {
default:
var win = window.open(window.location.protocol + '//' + window.location.hostname + ':' + window.location.port + call, '_blank');
win.focus();
return;
}
}
function clear_api(example) {
$("#" + example).html('');
}

76
public/assets/js/glass-core.js
View File

@ -13,42 +13,8 @@ var loader_html = '<div class="preloader"> \
</div> \
</div>';
$( document ).ajaxComplete(function( event, request, settings ) {
/*
* Form input focus event
*/
$('.form-control').focus(function () {
$(this).parent().addClass('focused');
});
//On focusout event
$('.form-control').focusout(function () {
var $this = $(this);
if ($this.parents('.form-group').hasClass('form-float')) {
if ($this.val() == '') { $this.parents('.form-line').removeClass('focused'); }
}
else {
$this.parents('.form-line').removeClass('focused');
}
});
//On label click
$('body').on('click', '.form-float .form-line .form-label', function () {
$(this).parent().find('input').focus();
});
//Not blank form
$('.form-control').each(function () {
if ($(this).val() !== '') {
$(this).parents('.form-line').addClass('focused');
}
});
$('.form-line').removeClass("focused");
});
$( document ).ready(function() {
$('.form-line').removeClass("focused");
remove_init_form();
});
/*
@ -60,8 +26,48 @@ $(document).on('on_pjax_complete',function(){
$('body').removeClass('overlay-open');
$('.overlay').css("display", "none");
}
/*
* Form input focus event
*/
$('.form-control').focus(function () {
$(this).parent().addClass('focused');
});
//On focusout event
$('.form-control').focusout(function () {
var $this = $(this);
if ($this.parents('.form-group').hasClass('form-float')) {
if ($this.val() == '') { $this.parents('.form-line').removeClass('focused'); }
}
else {
$this.parents('.form-line').removeClass('focused');
}
});
//On label click
$('body').on('click', '.form-float .form-line .form-label', function () {
$(this).parent().find('input').focus();
});
//Not blank form
$('.form-control').each(function () {
if ($(this).val() !== '') {
$(this).parents('.form-line').addClass('focused');
}
});
remove_init_form();
remove_init_form();
});
function remove_init_form(){
setTimeout(function(){
$('.form-line').removeClass("focused");
}, 10);
}
function modal (title, content, buttons) {
$('#modal-buttons').html('');
$('#modal-title').html(title);

82
public/templates/api_examples.html
View File

@ -1,14 +1,76 @@
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="card">
<div class="header">
<h2>
[title]
</h2>
<!-- Get Active Leases -->
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="card">
<div class="header">
<h2>
GET: Active Leases
</h2>
</div>
<div class="body">
<label>Call</label>
<div class="form-group">
<div class="form-line">
<input disabled type="input" class="form-control" value="/api/get_active_leases" autocomplete="off">
</div>
</div>
<div class="body">
[example_body]
<label>URL Example</label>
<div class="form-group">
<div class="form-line">
<input disabled type="input" class="form-control api_url" value="/api/get_active_leases" autocomplete="off">
</div>
</div>
<label>Test</label>
<div class="form-group">
<div>
<button type="button" onclick="api_example('get_active_leases')" class="btn btn-default waves-effect">Try It!</button>
<button type="button" onclick="raw_api('/api/get_active_leases')" class="btn btn-default waves-effect">Raw</button>
<button type="button" onclick="clear_api('get_active_leases')" class="btn btn-default waves-effect">Clear</button>
<div id="get_active_leases" style="margin-top:20px"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Get Subnet Details -->
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="card">
<div class="header">
<h2>
GET: Subnet Details
</h2>
</div>
<div class="body">
<label>Call</label>
<div class="form-group">
<div class="form-line">
<input disabled type="input" class="form-control" value="/api/get_subnet_details" autocomplete="off">
</div>
</div>
<label>URL Example</label>
<div class="form-group">
<div class="form-line">
<input disabled type="input" class="form-control api_url" value="/api/get_subnet_details" autocomplete="off">
</div>
</div>
<label>Test</label>
<div class="form-group">
<div>
<button type="button" onclick="api_example('get_subnet_details')" class="btn btn-default waves-effect">Try It!</button>
<button type="button" onclick="raw_api('/api/get_subnet_details')" class="btn btn-default waves-effect">Raw</button>
<button type="button" onclick="clear_api('get_subnet_details')" class="btn btn-default waves-effect">Clear</button>
<div id="get_subnet_details" style="margin-top:20px"></div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$( ".api_url" ).each(function( index ) {
$(this).val(window.location.protocol + '//' + window.location.hostname + ':' + window.location.port + $(this).val());
});
$('.form-line').removeClass("focused");
</script>

3
public/templates/dhcp_config.html
View File

@ -32,5 +32,4 @@
<script src="assets/js/ace_editor/ace.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/ace_editor/theme-terminal.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/glass-pages/dhcp-config.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/glass-pages/dhcp-config.js" type="text/javascript" charset="utf-8"></script>

15
public/templates/index.html
View File

@ -198,10 +198,15 @@
<script src="assets/plugins/raphael/raphael.min.js"></script>
<script src="assets/plugins/morris/morris.min.js"></script>
<!-- Glass -->
<script src="assets/js/api-examples.js"></script>
<script src="assets/js/glass-core.js"></script>
<script src="assets/js/glass-websockets.js"></script>
<section class="content">
<div class="container-fluid">
<div class="block-header">
<h2>Dashboard</h2>
<div class="block-header" style="display:none">
<h2 id="block-header">Dashboard</h2>
</div>
<div id="body-content">
[body_content]
@ -227,12 +232,10 @@
<!-- Custom Js -->
<script src="assets/js/admin.js"></script>
<script src="assets/js/api-examples.js"></script>
<script src="assets/js/glass-core.js"></script>
<script src="assets/js/glass-websockets.js"></script>
<!-- File Saver: Used in DHCP Logs -->
<script src="assets/js/file-saver.js"></script>
<!-- PJAX Framework -->
<script src="assets/js/pjax.js"></script>
<script type="text/javascript">

26
routes/api_examples.js
View File

@ -8,33 +8,11 @@ var template_render = require('../lib/render_template.js');
router.get('/', function(req, res, next) {
/* Get Active Leases */
get_active_leases = template_render.get_template("api_examples");
get_active_leases = template_render.set_template_variable(get_active_leases, "title", "Get Active Leases");
example_body = 'URL: <code>/api/get_active_leases</code><br><br>';
example_body = example_body + '<button type="button" onclick="api_example(\'get_active_leases\')" class="btn btn-default waves-effect">Try It!</button> ';
example_body = example_body + '<button type="button" onclick="clear_api(\'get_active_leases\')" class="btn btn-default waves-effect">Clear</button><br><br>';
example_body = example_body + '<div id="get_active_leases"></div>';
get_active_leases = template_render.set_template_variable(get_active_leases, "example_body", example_body);
/* Get Subnet Details */
get_subnet_details = template_render.get_template("api_examples");
get_subnet_details = template_render.set_template_variable(get_subnet_details, "title", "Get Subnet Details");
example_body = 'URL: <code>/api/get_subnet_details</code><br><br>';
example_body = example_body + '<button type="button" onclick="api_example(\'get_subnet_details\')" class="btn btn-default waves-effect">Try It!</button> ';
example_body = example_body + '<button type="button" onclick="clear_api(\'get_subnet_details\')" class="btn btn-default waves-effect">Clear</button><br><br>';
example_body = example_body + '<div id="get_subnet_details"></div>';
get_subnet_details = template_render.set_template_variable(get_subnet_details, "example_body", example_body);
api_template = template_render.get_template("api_examples");
res.send (
template_render.get_index_template(
get_active_leases +
get_subnet_details
,
api_template,
req.url
)
);