Skip to content

S
slapos.core
Commit 3e8436aa authored by Thomas Lechauve's avatar Thomas Lechauve
Browse files
Options

Authentication process implemented (with OAuth2) 

The fake server has been commented so instance information page won't
appear anymore.
parent ea194c88
Hide whitespace changes
Inline Side-by-side
Showing with 291 additions and 195 deletions
jQuery/vifib/index.html
View file @ 3e8436aa
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title></title> <title></title>
<link href="static/css/bootstrap.edited.css" rel="stylesheet"/> <link href="static/css/bootstrap.min.css" rel="stylesheet"/>
<!--<link href="static/css/bootstrap.min.css" rel="stylesheet"/>-->
<script id="service" type="text/html"> <script id="form.new.instance" type="text/html">
{{! Service page template }} <article>
<article> <form class="form-horizontal">
<form class="form-horizontal"> <fieldset>
<fieldset> <legend>Request a new instance</legend>
<legend> <div class="control-group">
{{ instance_id }} <label class="control-label">Name</label>
<div class="pull-right"> <div class="controls">
<div class="btn">Bang</div> <input type="text" class="input-large" required name="title"/>
<div class="btn">Destroy</div> </div>
<div class="btn">Certificates</div> </div>
</div> <div class="control-group">
</legend> <label class="control-label">Software release</label>
<div class="control-group"> <div class="controls">
<label class="control-label">Reference</label> <input type="text" class="input-xlarge" required name="software_release"/>
<div class="controls"> </div>
<span class="uneditable-input">{{ instance_id }}</span> </div>
</div> <div class="form-actions">
</div> <button type="submit" class="btn btn-primary" name="submit">Request</button>
<div class="control-group"> </div>
<label class="control-label">Software release</label> </fieldset>
<div class="controls"> </form>
<span class="uneditable-input">{{ software_release }}</span> </article>
</div> </script>
</div>
<div class="control-group">
<label class="control-label">Software type</label>
<div class="controls">
<span class="uneditable-input">{{ software_type }}</span>
</div>
</div>
<div class="control-group">
<label class="control-label">Status</label>
<div class="controls">
<div class="btn-group">
<button class="btn">Stop</button>
<button class="btn btn-success disabled">Started</button>
</div>
</div>
</div>
</fieldset>
</form>
<table class="table"> <script id="auth" type="text/html">
<caption>Connection parameters</caption> <article>
{{# connection}} <p>Authentification needed. Are you agree to be redirect to login ?</p>
<tr><td>key</td><td>{{ key }}</td></tr> <a href="http://{{ host }}?response_type=token&client_id={{ client_id }}&redirect_uri={{ redirect }}">Redirect</a>
{{/ connection}} </article>
</table> </script>
<form> <script id="service" type="text/html">
<fieldset> {{! Service page template }}
<legend> <article>
Parameter XML <form class="form-horizontal">
<div class="pull-right"> <fieldset>
<button type="submit" class="btn btn-primary">Save changes</button> <legend>
<button class="btn">Cancel</button> {{ instance_id }}
</div> <div class="pull-right">
</legend> <div class="btn">Bang</div>
<textarea name="xml" style="width: 98%; height: 110px;"> <div class="btn">Destroy</div>
<div class="btn">Certificates</div>
</div>
</legend>
<div class="control-group">
<label class="control-label">Reference</label>
<div class="controls">
<span class="uneditable-input">{{ instance_id }}</span>
</div>
</div>
<div class="control-group">
<label class="control-label">Software release</label>
<div class="controls">
<span class="uneditable-input">{{ software_release }}</span>
</div>
</div>
<div class="control-group">
<label class="control-label">Software type</label>
<div class="controls">
<span class="uneditable-input">{{ software_type }}</span>
</div>
</div>
<div class="control-group">
<label class="control-label">Status</label>
<div class="controls">
<div class="btn-group">
<button class="btn">Stop</button>
<button class="btn btn-success disabled">Started</button>
</div>
</div>
</div>
</fieldset>
</form>
<table class="table">
<caption>Connection parameters</caption>
{{# connection}}
<tr><td>key</td><td>{{ key }}</td></tr>
{{/ connection}}
</table>
<form>
<fieldset>
<legend>
Parameter XML
<div class="pull-right">
<button type="submit" class="btn btn-primary">Save changes</button>
<button class="btn">Cancel</button>
</div>
</legend>
<textarea name="xml" style="width: 98%; height: 110px;">
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<instance> <instance>
<parameter id="nbd_ip">2a01:e35:2e27:460:e2cb:4eff:fed9:48dc</parameter> <parameter id="nbd_ip">2a01:e35:2e27:460:e2cb:4eff:fed9:48dc</parameter>
<parameter id="nbd_port">1024</parameter> <parameter id="nbd_port">1024</parameter>
</instance> </instance>
</textarea> </textarea>
</fieldset> </fieldset>
</form> </form>
</article> </article>
</script> </script>
<script id="simple-form" type="text/html"> <script id="simple-form" type="text/html">
<form class="form-inline"> <form class="form-inline">
<fieldset> <fieldset>
<div class="input-append"> <div class="input-append">
<input required class="span2" size="16" type="text"/> <input required class="span2" size="16" type="text"/>
<button class="btn" type="submit">Go !</button> <button class="btn" type="submit">Go !</button>
</div> </div>
</fieldset> </fieldset>
</form> </form>
</script> </script>
<script id="service-error" type="text/html"> <script id="service-error" type="text/html">
<div class="alert alert-error" style="text-align: center;"> <div class="alert alert-error" style="text-align: center;">
<h4>Service : {{ id }} not found !</h4> <h4>Service : {{ id }} not found !</h4>
</div> </div>
</script> </script>
</head> </head>
<body> <body>
<div class="navbar"> <div class="navbar">
<div class="navbar-inner"> <div class="navbar-inner">
<div class="container-fluid"> <div class="container-fluid">
<div class="row-fluid"> <div class="row-fluid">
<div class="span2"> <div class="span2">
<!--<a href="#" class="brand">Vifib</a>--> <!--<a href="#" class="brand">Vifib</a>-->
<img src="static/img/vifib_logo.gray.png" style="max-height: 40px" /> <img src="static/img/vifib_logo.gray.png" style="max-height: 40px" />
</div> </div>
<div class="span10"> <div class="span10">
<ul class="nav"> <ul class="nav">
<li><a href="#">Dashboard</a></li> <li><a href="#">Dashboard</a></li>
<li><a href="#about">About</a></li> <li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li> <li><a href="#contact">Contact</a></li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="container-fluid"> <div class="container-fluid">
<div class="row-fluid"> <div class="row-fluid">
<div class="span2"> <div class="span3">
<div class="well"> <div class="well">
<ul class="nav nav-list"> <ul class="nav nav-list">
<li class="nav-header">Servers</li> <li class="nav-header">Servers</li>
<li><a href="#"><i class="icon-list"></i>List all servers</a></li> <li autofocus="autofocus"><a href="#"><i class="icon-list"></i>List all servers</a></li>
<li><a href="#"><i class="icon-plus-sign"></i>Add new server</a></li> <li><a href="#"><i class="icon-plus-sign"></i>Add new server</a></li>
<li><a href="#"><i class="icon-star"></i>Favorites</a></li> <li><a href="#"><i class="icon-star"></i>Favorites</a></li>
<li class="nav-header">Services</li> <li class="nav-header">Services</li>
<li><a href="#"><i class="icon-list"></i>List all services</a></li> <li><a href="#"><i class="icon-list"></i>List all services</a></li>
<li><a href="#"><i class="icon-plus-sign"></i>Add new service</a></li> <li><a href="#service"><i class="icon-plus-sign"></i>Add new service</a></li>
<li><a href="#"><i class="icon-star"></i>Favorites</a></li> <li><a href="#"><i class="icon-star"></i>Favorites</a></li>
<ul style="list-style: none"> <ul style="list-style: none">
<li><a href="#service/200"><i class="icon-"></i>inst-0</a></li> <li><a href="#service/200"><i class="icon-"></i>inst-0</a></li>
<li><a href="#service/201"><i class="icon-"></i>inst-1</a></li> <li><a href="#service/401"><i class="icon-"></i>inst-1</a></li>
</ul> </ul>
<li class="nav-header">Account</li> <li class="nav-header">Account</li>
<li><a href="#"><i class="icon-inbox"></i>Invoices</a></li> <li><a href="#"><i class="icon-inbox"></i>Invoices</a></li>
<li><a href="#"><i class="icon-cog"></i>Settings</a></li> <li><a href="#"><i class="icon-cog"></i>Settings</a></li>
<li class="nav-header">Quick search</li> <li class="nav-header">Quick search</li>
<li><form class="form-search"> <!--<li><form class="form-search">
<i class="icon-search"></i> <i class="icon-search"></i>
<input type="text" class="input-mini search-query"> <input type="text" class="input-mini search-query">
</form></li> </form></li>-->
</ul> </ul>
</div> </div>
</div> </div>
<section class="span10" id="main"> <section class="span9" id="main">
<!--Body content--> <!--Body content-->
</section> </section>
</div> </div>
</div> </div>
<script type="text/javascript" src="static/js/jquery-1.7.2.js"></script> <script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>
<script type="text/javascript" src="static/js/ICanHaz.min.js"></script> <script type="text/javascript" src="static/js/ICanHaz.min.js"></script>
<script type="text/javascript" src="static/js/modernizr-2.5.3.js"></script> <script type="text/javascript" src="static/js/modernizr-2.5.3.js"></script>
<script type="text/javascript" src="static/js/sinon-1.3.2.js"></script> <script type="text/javascript" src="static/js/sinon-1.3.2.js"></script>
<script type="text/javascript" src="static/js/slapOs.js"></script> <script type="text/javascript" src="static/js/slapOs.js"></script>
<script type="text/javascript" src="static/js/fake.js"></script> <script type="text/javascript" src="static/js/fake.js"></script>
<script type="text/javascript" src="static/js/renderer.js"></script> <script type="text/javascript" src="static/js/urlHandler.js"></script>
<script type="text/javascript" src="static/js/urlHandler.js"></script> <script type="text/javascript" src="static/js/form.js"></script>
<script type="text/javascript" src="static/js/form.js"></script>
</body> </body>
</html> </html>
\ No newline at end of file
jQuery/vifib/static/js/fake.js
View file @ 3e8436aa
...@@ -68,17 +68,18 @@ var inst1 = ...@@ -68,17 +68,18 @@ var inst1 =
tap_interface: "tap2"} tap_interface: "tap2"}
}; };
var fakeserver = sinon.fakeServer.create(); /*var fakeserver = sinon.fakeServer.create();
// Get instance // Get instance
fakeserver.respondWith("GET", "/instance/200",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst0)]); fakeserver.respondWith("GET", "/instance/200",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst0)]);
fakeserver.respondWith("GET", "/instance/201",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst1)]); fakeserver.respondWith("GET", "/instance/201",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst1)]);
// Get instance FAIL // Get instance FAIL
fakeserver.respondWith("GET", "/instance/408",[408, {"Content-Type":"application/json; charset=utf-8"}, "NOT FOUND"]); fakeserver.respondWith("GET", "/instance/408",[408, {"Content-Type":"application/json; charset=utf-8"}, "NOT FOUND"]);
fakeserver.respondWith("GET", "/instance/401",[401, {"Content-Type":"application/json; charset=utf-8"}, "NEED AUTH"]);
var tmp = $.ajax; var tmp = $.ajax;
$.ajax = function(url, options){ /*$.ajax = function(url, options){
var result = tmp(url, options); var result = tmp(url, options);
fakeserver.respond(); fakeserver.respond();
return result; return result;
} }*/
\ No newline at end of file
jQuery/vifib/static/js/form.js
View file @ 3e8436aa
...@@ -4,51 +4,96 @@ ...@@ -4,51 +4,96 @@
* Date: 4/17/12 * Date: 4/17/12
*/ */
;(function($) { ;(function($) {
var methods = { var methods = {
init: function() { init: function() {
// Initialize slapos in this context // Initialize slapos in this context
$(this).slapos({host: ''}); $(this).slapos({host: '10.0.1.139:12002/erp5/portal_vifib_rest_api_v1'});
// Bind to urlChange event // Bind to urlChange event
return this.each(function(){ return this.each(function(){
var self = $(this); var self = $(this);
$.subscribe("urlChange", function(e, d){ $.subscribe("urlChange", function(e, d){
if(d.route == "form") { self.form('displayForm'); } if(d.route == "service" && d.id) { self.form('displayData', d.id); }
else if(d.route == "service" && d.id) { self.form('displayData', d.id); } else if(d.route == "service") { self.form('displayForm'); }
}); });
}); $.subscribe("auth", function(e, d){
}, $(this).form("authenticate", d);
});
displayData: function(id){ });
$(this).html("<p>Ajax loading...</p>") },
.slapos('getInstance', id, function(data){
$(this).form('render', 'service', data); authenticate: function(data){
}, {408: function(){ $(this).form('render', 'service-error', {id:id})}}); for(var d in data){
}, $(this).slapos('store', d, data[d]);
}
displayForm: function() { },
$(this).form('render', 'simple-form');
displayData: function(id){
$(this).find("form").submit(function(){ $(this).html("<p>Ajax loading...</p>")
$.redirect({route:'disp', id:$(this).find("input:text").val()}); .slapos('getInstance', id, function(data){
return false; $(this).form('render', 'service', data);
}); }, {401: function(){
}, $(this).form('render', 'auth', {
'host':'t139:12002/erp5/web_site_module/hosting/request-access-token',
render: function(template, data){ 'client_id': 'client',
$(this).html(ich[template](data, true)); 'redirect':escape(window.location.href)
} })
}; }});
},
$.fn.form = function(method){
if ( methods[method] ) { displayForm: function() {
return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 )); $(this).form('render', 'form.new.instance');
} else if ( typeof method === 'object' || ! method ) { var data = {};
return methods.init.apply( this, arguments ); $(this).find("form").submit(function(){
} else { $(this).find('input').serializeArray().map(function(elem){
$.error( 'Method ' + method + ' does not exist on jQuery.form' ); data[elem["name"]] = elem["value"];
} });
}; $(this).form('displayAsking', data);
return false;
});
},
displayAsking: function(data){
var request = {
software_type: "type_provided_by_the_software",
slave: false,
status: "started",
parameter: {
Custom1: "one string",
Custom2: "one float",
Custom3: ["abc", "def"],
},
sla: {
computer_id: "COMP-0",
}
};
$.extend(request, data);
$(this).html("<p>Requesting a new instance "+request["title"]+" ...</p>")
.slapos('newInstance', request, function(data){
$(this).html(data);}, {401: function(){
$(this).form('render', 'auth', {
'host':'t139:12002/erp5/web_site_module/hosting/request-access-token',
'client_id': 'client',
'redirect':escape(window.location.href)
})
}
});
},
render: function(template, data){
$(this).html(ich[template](data, true));
}
};
$.fn.form = function(method){
if ( methods[method] ) {
return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
return methods.init.apply( this, arguments );
} else {
$.error( 'Method ' + method + ' does not exist on jQuery.form' );
}
};
})(jQuery); })(jQuery);
$("#main").form(); $("#main").form();
jQuery/vifib/static/js/urlHandler.js
View file @ 3e8436aa
...@@ -7,6 +7,11 @@ ...@@ -7,6 +7,11 @@
; ;
// Hash parser utility // Hash parser utility
$.parseHash = function(hashTag){ $.parseHash = function(hashTag){
var tokenized = $.extractAuth(hashTag);
if( tokenized ){
console.log(tokenized);
$.publish('auth', tokenized);
}
var splitted = hashTag.substr(1).split('/'); var splitted = hashTag.substr(1).split('/');
return { return {
route : splitted[0], route : splitted[0],
...@@ -15,6 +20,21 @@ $.parseHash = function(hashTag){ ...@@ -15,6 +20,21 @@ $.parseHash = function(hashTag){
} }
}; };
$.extractAuth = function(hashTag){
var del = hashTag.indexOf('&');
if( del != -1){
var splitted = hashTag.substring(del+1).split('&');
var result = {};
for( p in splitted ){
var s = splitted[p].split('=');
result[s[0]] = s[1];
}
return result;
}
return false;
};
$.genHash = function(url){ $.genHash = function(url){
if('id' in url){ url['id'] = '/' + url['id']; } if('id' in url){ url['id'] = '/' + url['id']; }
if('method' in url){ url['method'] = '/' + url['method']; } if('method' in url){ url['method'] = '/' + url['method']; }
...@@ -45,4 +65,4 @@ $.redirect = function(url){ $.publish('redirect', url); }; ...@@ -45,4 +65,4 @@ $.redirect = function(url){ $.publish('redirect', url); };
$.subscribe('redirect', $.redirectHandler) $.subscribe('redirect', $.redirectHandler)
$(window).bind('hashchange', $.hashHandler); $(window).bind('hashchange', $.hashHandler);
$(window).bind('load', $.hashHandler); $(window).bind('load', $.hashHandler);
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7