Commit 043a3d07 authored by Thomas Lechauve's avatar Thomas Lechauve

Initialisation of new Vifib project

Currently do a simple ajax call over sinonJS server and display data
received.
parent b2d855b6
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="static/css/bootstrap.min.css" />
</head>
<body>
<header><h1>Vifib</h1></header>
<nav>
<ul>
<li><a href="#form">Form</a></li>
<li><a href="#disp">List</a></li>
</ul>
</nav>
<aside></aside>
<section></section>
<script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>
<script type="text/javascript" src="static/js/mustache.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/slapOs.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/form.js"></script>
</body>
</html>
\ No newline at end of file
var comp0 = {computer_id: "COMP-0",
software: [{software_release: "http://example.com/example.cfg",status: "install"}],
partition: [
{title: "slapart1",
instance_id: "foo",
status: "start",
software_release: "http://example.com/example.cfg"},
{title: "slapart2",
instance_id: "bar",
status: "stop",
software_release: "http://example.com/example.cfg"}
]
};
var comp1 = {computer_id: "COMP-1",
software: [{software_release: "http://example.com/example.cfg",status: "install"}],
partition: [
{title: "slapart1",
instance_id: "foo",
status: "start",
software_release: "http://example.com/example.cfg"},
{title: "slapart2",
instance_id: "bar",
status: "stop",
software_release: "http://example.com/example.cfg"}
]
};
var inst0 =
{instance_id: "INST-0",
status: "start",
software_release: "http://example.com/example.cfg",
software_type: "type_provided_by_the_software",
slave: "False",
connection: {
custom_connection_parameter_1: "foo",
custom_connection_parameter_2: "bar"},
parameter: {
Custom1: "one string",
Custom2: "one float",
Custom3: ["abc", "def"]},
sla: {computer_id: "COMP-0"},
children_id_list: ["subinstance1", "subinstance2"],
partition: {
public_ip: ["::1", "91.121.63.94"],
private_ip: ["127.0.0.1"],
tap_interface: "tap2"}
};
var inst1 =
{instance_id: "INST-1",
status: "start",
software_release: "http://example.com/example.cfg",
software_type: "type_provided_by_the_software",
slave: "False",
connection: {
custom_connection_parameter_1: "foo",
custom_connection_parameter_2: "bar"},
parameter: {
Custom1: "one string",
Custom2: "one float",
Custom3: ["abc", "def"]},
sla: {computer_id: "COMP-0"},
children_id_list: ["subinstance1", "subinstance2"],
partition: {
public_ip: ["::1", "91.121.63.94"],
private_ip: ["127.0.0.1"],
tap_interface: "tap2"}
};
var fakeserver = sinon.fakeServer.create();
// Get instance
fakeserver.respondWith("GET", "/instance/200",[200, {"Content-Type":"application/json; charset=utf-8"}, JSON.stringify(inst1)]);
// Get instance FAIL
fakeserver.respondWith("GET", "/instance/408",[408, {"Content-Type":"application/json; charset=utf-8"}, "NOT FOUND"]);
var tmp = $.ajax;
$.ajax = function(url, options){
var result = tmp(url, options);
fakeserver.respond();
return result;
}
\ No newline at end of file
/**
* NEXEDI
* Author: Thomas Lechauve
* Date: 4/17/12
*/
;(function($) {
var methods = {
init: function() {
// Initialize slapos in this context
$(this).slapos({host: ''});
// Bind to urlChange event
return this.each(function(){
var self = $(this);
$.subscribe("urlChange", function(e, d){
if(d.route == "form") { self.form('displayForm'); }
else if(d.route == "disp") { self.form('displayData'); }
});
});
},
displayData: function(){
$(this).html("<p>Ajax loading ...</p>")
.slapos('getInstance', '200', function(data){
$(this).html(JSON.stringify(data));
});
},
displayForm: function() {
var form = '' +
'<form>' +
'<input type="text"/>' +
'<input type="submit" value="Add"/>' +
'</form>';
$(this).html(form);
$(this).find("form").submit(function(){
$.redirect({route:'disp'});
return false;
});
}
};
$.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);
$("section").form();
/**
* NEXEDI
* Author: Thomas Lechauve
* Date: 4/18/12
*/
;
// Hash parser utility
$.parseHash = function(hashTag){
var splitted = hashTag.substr(1).split('/');
return {
route : splitted[0],
id : splitted[1],
method : splitted[2]
}
};
$.genHash = function(url){
if('id' in url){ url['id'] = '/' + url['id']; }
if('method' in url){ url['method'] = '/' + url['method']; }
return url['route'] + (url['id'] || '') + (url['method'] || '');
};
/* Pub / Sub Pattern
WARNING
What's happening when we destroy a DOM object subscribed ?
*/
var o = $({});
$.subscribe = function() {
o.on.apply(o, arguments);
};
$.unsubscribe = function() {
o.off.apply(o, arguments);
};
$.publish = function() {
o.trigger.apply(o, arguments);
};
// Event Handlers
$.hashHandler = function(){ $.publish("urlChange", $.parseHash(window.location.hash)); };
$.redirectHandler = function(event, url){ window.location.hash = $.genHash(url); };
// redirections manager
$.redirect = function(url){ $.publish('redirect', url); };
$.subscribe('redirect', $.redirectHandler)
$(window).bind('hashchange', $.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