moved GUI from old project
This commit is contained in:
3
nodejs/views/bottom.ejs
Executable file
3
nodejs/views/bottom.ejs
Executable file
@ -0,0 +1,3 @@
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
159
nodejs/views/hosts.ejs
Executable file
159
nodejs/views/hosts.ejs
Executable file
@ -0,0 +1,159 @@
|
||||
<%- include('top') %>
|
||||
<script id="rowTemplate" type="text/html">
|
||||
<tr action="api" class="<<fresh>>">
|
||||
<input type="hidden" name="host" value="<< host >>" />
|
||||
<td><a target="_blank" href="http://<<host>>"><<host>></a></td>
|
||||
<td><<ip>></td>
|
||||
<td class="hidden-xs"><<date>></td>
|
||||
<td>
|
||||
<button type="button" data-host="<< host >>" onclick="editHost(this);" class="btn btn-sm btn-default">Edit</button>
|
||||
<button type="button" onclick="formAJAX(this, true)" class="btn btn-sm btn-default">Delete</button>
|
||||
</td>
|
||||
</tr>
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
var currentEditHost;
|
||||
|
||||
function editHost(btn){
|
||||
var btn = $(btn);
|
||||
currentEditHost = btn.data('host');
|
||||
$.getJSON('api/' + btn.data('host'), function( data ) {
|
||||
$('.editWindow').slideDown('fast');
|
||||
$('.editWindow .panel-body').slideDown('fast');
|
||||
$('.editWindow .panel-title .pull-left').html("Edit "+btn.data('host'))
|
||||
$.each( data, function( key, val ) {
|
||||
$(".editWindow input[name='" + key + "']").attr('value', val);
|
||||
});
|
||||
$("input[name='old_host']").attr('value', btn.data('host'));
|
||||
});
|
||||
}
|
||||
|
||||
function tableAJAX(actionMessage){
|
||||
$('#tableAJAX').html('').hide();
|
||||
$('div.actionMessage').html('Refreshing host list...').show();
|
||||
$.get('hosts' ,function(data){
|
||||
var c = 0;
|
||||
$.each( data, function( key, value ) {
|
||||
if(currentEditHost == value.host){c++}
|
||||
host_row = ich.rowTemplate(value);
|
||||
$('#tableAJAX').append(host_row);
|
||||
});
|
||||
|
||||
$('#tableAJAX').fadeIn('slow');
|
||||
if(c == 0){//host is not in list
|
||||
if(currentEditHost){
|
||||
$('div.editWindow').slideUp('fast');
|
||||
actionMessage = 'Host, <i>'+ currentEditHost+' gone! Editor sleeping...';
|
||||
currentEditHost = null;
|
||||
}
|
||||
}
|
||||
|
||||
if(!actionMessage){
|
||||
$('div.actionMessage').slideUp('fast');
|
||||
}else{
|
||||
$('div.actionMessage').html(actionMessage).slideDown('fast');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/*$.validateSettings(
|
||||
});*/
|
||||
|
||||
$(document).ready(function(){
|
||||
tableAJAX(); //populate the table
|
||||
setInterval(tableAJAX, 30000);
|
||||
});
|
||||
</script>
|
||||
<div class="row" style="display:none">
|
||||
<div class="col-md-4">
|
||||
<div class="panel panel-danger editWindow" style="display:none">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">
|
||||
<div class="pull-left">Edit $host!</div>
|
||||
|
||||
<div class="pull-right">
|
||||
<label class="glyphicon glyphicon-circle-arrow-down"></label>
|
||||
<label class="glyphicon glyphicon-remove-circle"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<form action="api" evalAJAX="$('div.editWindow').slideUp();currentEditHost = null;">
|
||||
<input type="hidden" name="old_host" value="" />
|
||||
<div class="form-group">
|
||||
<label class="control-label">Host</label>
|
||||
<input type="text" class="form-control" name="host" value="" validate="host:3"/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Mapped IP</label>
|
||||
<input type="text" class="form-control" name="ip" value=""/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Last Updated</label>
|
||||
<input type="text" class="form-control" name="updated" value="" />
|
||||
</div>
|
||||
<button type="button" onclick="formAJAX(this)" class="btn btn-danger">Update</button>
|
||||
<button class="btn btn-link" type="reset" onclick="$('div.editWindow').slideUp();">Cancel</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">
|
||||
Add New Proxy
|
||||
<div class="pull-right">
|
||||
<label class="glyphicon glyphicon-circle-arrow-down panel-toggle"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<form action="api" evalAJAX="$form.trigger('reset')" valRules=''>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Hostname</label>
|
||||
<input type="text" name="host" class="form-control" placeholder="ex: proxy.cloud-ops.net" validate="host:3" >
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">IP</label>
|
||||
<input type="text" onkeyup="$(this).validate()" name="ip" class="form-control" placeholder="ex: 10.10.10.10" validate="ip:7" />
|
||||
</div>
|
||||
|
||||
<button type="button" onclick="formAJAX(this)" class="btn btn-default">Add</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-8">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">
|
||||
Proxy List
|
||||
<div class="pull-right">
|
||||
<label class="glyphicon glyphicon-circle-arrow-down panel-toggle"></label>
|
||||
<label class="glyphicon glyphicon-refresh"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body" style="padding-bottom:0">
|
||||
<div class="alert alert-warning actionMessage" style="display:none">
|
||||
<!-- Message after AJAX action is preformed -->
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<th>Hostname</th>
|
||||
<th>target</th>
|
||||
<th class="hidden-xs">Updated</th>
|
||||
<th>Actions</th>
|
||||
</thead>
|
||||
<tbody id="tableAJAX">
|
||||
<!-- ajax loaded table -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<%- include('bottom') %>
|
||||
2
nodejs/views/index.ejs
Executable file
2
nodejs/views/index.ejs
Executable file
@ -0,0 +1,2 @@
|
||||
<% include top %>
|
||||
<% include bottom %>
|
||||
69
nodejs/views/login.ejs
Executable file
69
nodejs/views/login.ejs
Executable file
@ -0,0 +1,69 @@
|
||||
<%- include('top') %>
|
||||
<script type="text/javascript">
|
||||
function actionMessage(message, $target){
|
||||
$target = $target || $('div.actionMessage');
|
||||
|
||||
if($target.html() === message) return;
|
||||
|
||||
if($target.html()){
|
||||
$target.slideUp('fast', function(){
|
||||
$target.html('')
|
||||
if(message) actionMessage(message);
|
||||
})
|
||||
return;
|
||||
}else{
|
||||
$target.html(message).slideDown('fast');
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
$( "form[action='login']" ).submit(function( event ) {
|
||||
$form = $(this);
|
||||
actionMessage('')
|
||||
if($form.attr('isValid') === 'true'){
|
||||
|
||||
app.auth.logIn($form.serializeObject(), function(error, data){
|
||||
|
||||
if(data){
|
||||
actionMessage('Login successful!');
|
||||
window.location.href = app.util.getUrlParameter('redirect') || '/hosts/';
|
||||
|
||||
}else{
|
||||
actionMessage('Login Failed, please try again');
|
||||
}
|
||||
});
|
||||
|
||||
}else{
|
||||
actionMessage('Please fix the errors bellow!')
|
||||
}
|
||||
event.preventDefault();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">Log in</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="alert alert-warning actionMessage" style="display:none">
|
||||
</div>
|
||||
<form method="post" action="login" onsubmit="$(this).validate()">
|
||||
<input type="hidden" name="redirect" value="<%= redirect %>">
|
||||
<div class="form-group">
|
||||
<label class="control-label">User name</label>
|
||||
<input type="text" name="username" class="form-control" placeholder="User" validate="user:3" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Password</label>
|
||||
<input type="password" name="password" class="form-control" placeholder="Password" validate="password:5" />
|
||||
</div>
|
||||
<button type="submit" class="btn btn-default" >Log in</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<%- include('bottom') %>
|
||||
27
nodejs/views/login.ejs_org
Executable file
27
nodejs/views/login.ejs_org
Executable file
@ -0,0 +1,27 @@
|
||||
<% include top %>
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">Log in</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="alert alert-warning actionMessage" style="display:none">
|
||||
</div>
|
||||
<form method="post" action="login" onsubmit="$(this).validate()">
|
||||
<input type="hidden" name="redirect" value="<%= redirect %>">
|
||||
<div class="form-group">
|
||||
<label class="control-label">Username</label>
|
||||
<input type="text" name="username" class="form-control" placeholder="User" validate="user:3" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Password</label>
|
||||
<input type="password" name="password" class="form-control" placeholder="Password" validate="password:5" />
|
||||
</div>
|
||||
<button type="submit" class="btn btn-default" >Log in</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% include bottom %>
|
||||
49
nodejs/views/top.ejs
Executable file
49
nodejs/views/top.ejs
Executable file
@ -0,0 +1,49 @@
|
||||
<!DOCTYPE html>
|
||||
<html >
|
||||
<head>
|
||||
<title>jQuery Validate plugin</title>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
|
||||
<!-- CSS are placed here -->
|
||||
<link rel='stylesheet' href='/static/css/bootstrap.min.css' />
|
||||
<link rel='stylesheet' href='/static/css/styles.css' />
|
||||
<!-- Scripts are placed here -->
|
||||
<script type="text/javascript" src='/static/js/jquery.min.js'></script>
|
||||
<script type="text/javascript" src='/static/js/bootstrap.min.js'></script>
|
||||
<script type="text/javascript" src='/static/js/ICanHaz.js'></script>
|
||||
<script type="text/javascript" src="/static/js/layout.js"></script>
|
||||
<script type="text/javascript" src="/static/js/val.js"></script>
|
||||
|
||||
|
||||
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" href="#">Dynamic Proxy</a>
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div id="navbar-collapse-1" class="collapse navbar-collapse navbar-ex4-collapse">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li><a href="hosts">Hosts</a>
|
||||
<li><a href="users">User Panel</a>
|
||||
<li><a href="logout">Log out</a>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Container -->
|
||||
<div class="container">
|
||||
103
nodejs/views/users.ejs
Executable file
103
nodejs/views/users.ejs
Executable file
@ -0,0 +1,103 @@
|
||||
<% include top %>
|
||||
<script id="rowTemplate" type="text/html">
|
||||
<tr action="users" evalAJAX="$form.trigger('reset')">
|
||||
<td><< user >></td>
|
||||
<input type="hidden" name="username" value="<< user >>" />
|
||||
<td>
|
||||
<label></label>
|
||||
<div class="col-xs-10 form-group">
|
||||
<input type="password" size="30" class="form-control" name="password" placeholder="New password" validate="password:5"/>
|
||||
</div>
|
||||
<button type="button" onclick="formAJAX(this)" class="btn btn-sm btn-default">Change</button>
|
||||
</td>
|
||||
<td><button type="button" onclick="formAJAX(this, true)" class="btn btn-sm btn-default">Delete</button><td>
|
||||
</tr>
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
|
||||
function tableAJAX(actionMessage){
|
||||
$('#tableAJAX').html('').hide();
|
||||
$('div.actionMessage').html('Refreshing user list...').show();
|
||||
$.get('users',function(data){
|
||||
$.each( data, function(key, value) {
|
||||
user_row = ich.rowTemplate({user : value});
|
||||
$('#tableAJAX').append(user_row);
|
||||
});
|
||||
|
||||
$('#tableAJAX').fadeIn('slow');
|
||||
|
||||
if(!actionMessage){
|
||||
$('div.actionMessage').slideUp('fast');
|
||||
}else{
|
||||
$('div.actionMessage').html(actionMessage).slideDown('fast');
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
tableAJAX(); //populate the table
|
||||
});
|
||||
</script>
|
||||
<div class="row" style="display:none">
|
||||
<div class="col-md-4">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">
|
||||
Add new user
|
||||
<div class="pull-right">
|
||||
<label class="glyphicon glyphicon-circle-arrow-down panel-toggle"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<form action="users" evalAJAX="$form.trigger('reset')">
|
||||
<input type="hidden" class="form-control" name="delete" value="false" />
|
||||
<div class="form-group">
|
||||
<label class="control-label">User-name</label>
|
||||
<input type="text" class="form-control" name="username" placeholder="Letter, numbers, -, _, . and @ only" validate="user:3" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Password</label>
|
||||
<input type="password" class="form-control" name="password" placeholder="Atleast 5 char. long" validate="password:5"/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Again</label>
|
||||
<input type="password" class="form-control" name="passwordMatch" placeholder="Retype password" validate="eq:password"/>
|
||||
</div>
|
||||
<button type="button" onclick="formAJAX(this)" class="btn btn-default">Add</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">
|
||||
User List
|
||||
<div class="pull-right">
|
||||
<label class="glyphicon glyphicon-circle-arrow-down panel-toggle"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body" style="padding-bottom:0">
|
||||
<div class="alert alert-warning actionMessage" style="display:none">
|
||||
<!-- Message after AJAX action is preformed -->
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<th>Name</th>
|
||||
<th>Password</th>
|
||||
<th>Delete</th>
|
||||
</thead>
|
||||
<tbody id="tableAJAX">
|
||||
<!-- ajax loaded table -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% include bottom %>
|
||||
103
nodejs/views/users.ejs_org
Executable file
103
nodejs/views/users.ejs_org
Executable file
@ -0,0 +1,103 @@
|
||||
<% include top %>
|
||||
<script id="rowTemplate" type="text/html">
|
||||
<tr action="users" evalAJAX="$form.trigger('reset')">
|
||||
<td><< user >></td>
|
||||
<input type="hidden" name="username" value="<< user >>" />
|
||||
<td>
|
||||
<label></label>
|
||||
<div class="col-xs-10 form-group">
|
||||
<input type="password" size="30" class="form-control" name="password" placeholder="New password" validate="password:5"/>
|
||||
</div>
|
||||
<button type="button" onclick="formAJAX(this)" class="btn btn-sm btn-default">Change</button>
|
||||
</td>
|
||||
<td><button type="button" onclick="formAJAX(this, true)" class="btn btn-sm btn-default">Delete</button><td>
|
||||
</tr>
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
|
||||
function tableAJAX(actionMessage){
|
||||
$('#tableAJAX').html('').hide();
|
||||
$('div.actionMessage').html('Refreshing user list...').show();
|
||||
$.get('users',function(data){
|
||||
$.each( data, function(key, value) {
|
||||
user_row = ich.rowTemplate({user : value});
|
||||
$('#tableAJAX').append(user_row);
|
||||
});
|
||||
|
||||
$('#tableAJAX').fadeIn('slow');
|
||||
|
||||
if(!actionMessage){
|
||||
$('div.actionMessage').slideUp('fast');
|
||||
}else{
|
||||
$('div.actionMessage').html(actionMessage).slideDown('fast');
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
tableAJAX(); //populate the table
|
||||
});
|
||||
</script>
|
||||
<div class="row" style="display:none">
|
||||
<div class="col-md-4">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">
|
||||
Add new user
|
||||
<div class="pull-right">
|
||||
<label class="glyphicon glyphicon-circle-arrow-down panel-toggle"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<form action="users" evalAJAX="$form.trigger('reset')">
|
||||
<input type="hidden" class="form-control" name="delete" value="false" />
|
||||
<div class="form-group">
|
||||
<label class="control-label">User-name</label>
|
||||
<input type="text" class="form-control" name="username" placeholder="Letter, numbers, -, _, . and @ only" validate="user:3" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Password</label>
|
||||
<input type="password" class="form-control" name="password" placeholder="Atleast 5 char. long" validate="password:5"/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label">Again</label>
|
||||
<input type="password" class="form-control" name="passwordMatch" placeholder="Retype password" validate="eq:password"/>
|
||||
</div>
|
||||
<button type="button" onclick="formAJAX(this)" class="btn btn-default">Add</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-title">
|
||||
User List
|
||||
<div class="pull-right">
|
||||
<label class="glyphicon glyphicon-circle-arrow-down panel-toggle"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body" style="padding-bottom:0">
|
||||
<div class="alert alert-warning actionMessage" style="display:none">
|
||||
<!-- Message after AJAX action is preformed -->
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<th>Name</th>
|
||||
<th>Password</th>
|
||||
<th>Delete</th>
|
||||
</thead>
|
||||
<tbody id="tableAJAX">
|
||||
<!-- ajax loaded table -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% include bottom %>
|
||||
Reference in New Issue
Block a user