Commit 47c02662 authored by Thomas Lechauve's avatar Thomas Lechauve

Added skeleton for dashboard page

parent daafad53
...@@ -3,6 +3,43 @@ ...@@ -3,6 +3,43 @@
<head> <head>
<title></title> <title></title>
<link href="static/css/bootstrap.min.css" rel="stylesheet"/> <link href="static/css/bootstrap.min.css" rel="stylesheet"/>
<style type="text/css" media="screen">
[class*="span"] h3 { text-align: center; }
.dashboard{ text-align: center; }
</style>
<script id="dashboard" type="text/html">
<div class="row-fluid">
<div class="span12">
<div id="carousel" class="carousel slide">
<div class="carousel-inner">
<div class="item active" style="min-height: 200px; background-color: red">
image 1
<div class="carousel-caption">
<h4>Order online applications that are hosted in Vifib's distributed cloud.</h4>
</div>
</div>
<div class="item" style="min-height: 200px; background-color: green">
image 2
<div class="carousel-caption">
<h4>Bring your own servers to the clouds and extend Vifib's distributed cloud with your own machines.</h4>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row-fluid">
<div class="span6 dashboard">
<h3>Get a Virtual Machine from Vifib for 1/month</h3>
<a class="btn btn-info" href="#/">Order a KVM now</a>
</div>
<div class="span6 dashboard">
<h3>Explore the world of Vifib provided software</h3>
<a class="btn btn-info" href="#/">Browse the Catalog</a>
</div>
</div>
</script>
<script id="server.list" type="text/html"> <script id="server.list" type="text/html">
<article> <article>
...@@ -199,9 +236,9 @@ ...@@ -199,9 +236,9 @@
</div> </div>
<div class="span10"> <div class="span10">
<ul class="nav"> <ul class="nav">
<li><a href="#">Dashboard</a></li> <li><a href="#/dashboard">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>
...@@ -238,8 +275,9 @@ ...@@ -238,8 +275,9 @@
</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/bootstrap-transition.js"></script>
<script type="text/javascript" src="static/js/bootstrap-alert.js"></script> <script type="text/javascript" src="static/js/bootstrap-alert.js"></script>
<script type="text/javascript" src="static/js/bootstrap-modal.js"></script> <script type="text/javascript" src="static/js/bootstrap-carousel.js"></script>
<script type="text/javascript" src="static/js/spin.js"></script> <script type="text/javascript" src="static/js/spin.js"></script>
<script type="text/javascript" src="static/js/jquery-spin.js"></script> <script type="text/javascript" src="static/js/jquery-spin.js"></script>
<script type="text/javascript" src="static/js/ICanHaz.min.js"></script> <script type="text/javascript" src="static/js/ICanHaz.min.js"></script>
......
...@@ -11,7 +11,8 @@ ...@@ -11,7 +11,8 @@
'/instance/:url/bang' : 'showBangInstance', '/instance/:url/bang' : 'showBangInstance',
'/computers' : 'listComputers', '/computers' : 'listComputers',
'/instances' : 'listInstances', '/instances' : 'listInstances',
'/invoices' : 'listInvoices' '/invoices' : 'listInvoices',
'/dashboard' : 'showDashboard'
}, },
router = function (e, d) { router = function (e, d) {
var $this = $(this); var $this = $(this);
...@@ -62,7 +63,7 @@ ...@@ -62,7 +63,7 @@
serverError = function (jqxhr) { serverError = function (jqxhr) {
var message = jqxhr.responseText; var message = jqxhr.responseText;
if (typeof message == 'object') { if (typeof message === 'object') {
message = $.parseJSON(jqxhr.responseText).error; message = $.parseJSON(jqxhr.responseText).error;
} }
$(this).vifib('popup', message); $(this).vifib('popup', message);
...@@ -70,13 +71,13 @@ ...@@ -70,13 +71,13 @@
bad_request = function (jqxhr) { bad_request = function (jqxhr) {
var message = jqxhr.responseText; var message = jqxhr.responseText;
if (typeof message == 'object') { if (typeof message === 'object') {
message = $.parseJSON(jqxhr.responseText).error; message = $.parseJSON(jqxhr.responseText).error;
} }
$(this).vifib('popup', message); $(this).vifib('popup', message);
}, },
spinOptions = {color: "#FFFFFF", lines:30, length:0, width:5, radius:7, rotate:0, trail:60, speed:1.6}, spinOptions = {color: "#FFFFFF", lines: 30, length: 0, width: 5, radius: 7, rotate: 0, trail: 60, speed: 1.6},
methods = { methods = {
init: function () { init: function () {
...@@ -111,7 +112,6 @@ ...@@ -111,7 +112,6 @@
extractInstanceURIFromHashtag: function () { extractInstanceURIFromHashtag: function () {
var loc = window.location.href.split('#')[1].split('/'), var loc = window.location.href.split('#')[1].split('/'),
i = $.inArray("instance", loc); i = $.inArray("instance", loc);
console.log(loc)
return (i !== -1 && loc.length > i) ? decodeURIComponent(loc[i + 1]) : ""; return (i !== -1 && loc.length > i) ? decodeURIComponent(loc[i + 1]) : "";
}, },
...@@ -141,6 +141,13 @@ ...@@ -141,6 +141,13 @@
}); });
}, },
showDashboard: function () {
return this.each(function () {
$(this).vifib('render', 'dashboard');
$(this).find("#carousel").carousel();
});
},
showInstance: function (uri) { showInstance: function (uri) {
var statusCode = { var statusCode = {
401: redirect, 401: redirect,
...@@ -150,7 +157,7 @@ ...@@ -150,7 +157,7 @@
}; };
$(this).slapos('instanceInfo', uri, { $(this).slapos('instanceInfo', uri, {
success: function (infos) { success: function (infos) {
if (typeof(infos) !== "object") { if (typeof (infos) !== "object") {
infos = $.parseJSON(infos); infos = $.parseJSON(infos);
} }
infos.status = $(this).vifib('getRender', 'instance.' + infos.status); infos.status = $(this).vifib('getRender', 'instance.' + infos.status);
...@@ -165,7 +172,7 @@ ...@@ -165,7 +172,7 @@
}); });
}, },
bindStopStartButtons: function() { bindStopStartButtons: function () {
$("#startInstance").click($.proxy(methods.startInstance, $(this))); $("#startInstance").click($.proxy(methods.startInstance, $(this)));
$("#stopInstance").click($.proxy(methods.stopInstance, $(this))); $("#stopInstance").click($.proxy(methods.stopInstance, $(this)));
}, },
...@@ -173,7 +180,7 @@ ...@@ -173,7 +180,7 @@
prepareForm: function () { prepareForm: function () {
$(this).vifib('bindStopStartButtons'); $(this).vifib('bindStopStartButtons');
$("#bangInstance").click(); $("#bangInstance").click();
$(this).vifib('refresh', methods.refreshInstanceForm, 30); $(this).vifib('refresh', methods.refreshInstanceForm, 30);
}, },
refreshInstanceForm: function () { refreshInstanceForm: function () {
...@@ -181,10 +188,10 @@ ...@@ -181,10 +188,10 @@
var uri = $(this).vifib("extractInstanceURIFromHashtag"); var uri = $(this).vifib("extractInstanceURIFromHashtag");
$(this).slapos('instanceInfo', uri, { $(this).slapos('instanceInfo', uri, {
success: function (response) { success: function (response) {
if (typeof(response) !== "object") { if (typeof (response) !== "object") {
response = $.parseJSON(response); response = $.parseJSON(response);
} }
var status = $(this).vifib('getRender', 'instance.' + response.status) var status = $(this).vifib('getRender', 'instance.' + response.status);
$("[name=software_type]").val(response.software_type); $("[name=software_type]").val(response.software_type);
$("#instanceStatus").html(status); $("#instanceStatus").html(status);
$(this).vifib('bindStopStartButtons'); $(this).vifib('bindStopStartButtons');
...@@ -193,12 +200,12 @@ ...@@ -193,12 +200,12 @@
}); });
}, },
stopInstance: function() { stopInstance: function () {
$(this).vifib('changeStatusInstance', 'stopped'); $(this).vifib('changeStatusInstance', 'stopped');
return false; return false;
}, },
startInstance: function() { startInstance: function () {
$(this).vifib('changeStatusInstance', 'started'); $(this).vifib('changeStatusInstance', 'started');
return false; return false;
}, },
...@@ -209,7 +216,7 @@ ...@@ -209,7 +216,7 @@
401: redirect, 401: redirect,
402: payment, 402: payment,
404: notFound, 404: notFound,
500: serverError, 500: serverError
}; };
return this.each(function () { return this.each(function () {
$(this).vifib("render", 'form.bang.instance'); $(this).vifib("render", 'form.bang.instance');
...@@ -232,7 +239,7 @@ ...@@ -232,7 +239,7 @@
var uri = methods.extractInstanceURIFromHashtag(), var uri = methods.extractInstanceURIFromHashtag(),
data = $(this).vifib('extractInstanceInfo'); data = $(this).vifib('extractInstanceInfo');
data.status = status; data.status = status;
$(this).vifib('requestAsking', data, function (){ $(this).vifib('requestAsking', data, function () {
$(this).vifib('refreshInstanceForm'); $(this).vifib('refreshInstanceForm');
}); });
}, },
...@@ -260,7 +267,7 @@ ...@@ -260,7 +267,7 @@
return this.each(function () { return this.each(function () {
$(this).slapos('instanceInfo', url, { $(this).slapos('instanceInfo', url, {
success: function (instance) { success: function (instance) {
if (typeof(instance) !== "object") { if (typeof (instance) !== "object") {
instance = $.parseJSON(instance); instance = $.parseJSON(instance);
} }
$.extend(instance, {'url': methods.genInstanceUrl(url)}); $.extend(instance, {'url': methods.genInstanceUrl(url)});
...@@ -274,7 +281,7 @@ ...@@ -274,7 +281,7 @@
var currentList = $(this).vifib('getCurrentList'); var currentList = $(this).vifib('getCurrentList');
$(this).slapos('instanceList', { $(this).slapos('instanceList', {
success: function (data) { success: function (data) {
if (typeof(data) !== "object") { if (typeof (data) !== "object") {
data = $.parseJSON(data); data = $.parseJSON(data);
} }
var $this = $(this), var $this = $(this),
...@@ -302,7 +309,7 @@ ...@@ -302,7 +309,7 @@
table.vifib('refresh', methods.refreshListInstance, 30); table.vifib('refresh', methods.refreshListInstance, 30);
$(this).slapos('instanceList', { $(this).slapos('instanceList', {
success: function (data) { success: function (data) {
if (typeof(data) !== "object") { if (typeof (data) !== "object") {
data = $.parseJSON(data); data = $.parseJSON(data);
} }
$.each(data.list, function () { $.each(data.list, function () {
...@@ -418,17 +425,17 @@ ...@@ -418,17 +425,17 @@
/* Thanks to Ben Alman /* Thanks to Ben Alman
* https://raw.github.com/cowboy/jquery-misc/master/jquery.ba-serializeobject.js * https://raw.github.com/cowboy/jquery-misc/master/jquery.ba-serializeobject.js
*/ */
$.fn.serializeObject = function(){ $.fn.serializeObject = function () {
var obj = {}; var obj = {};
$.each( this.serializeArray(), function(i,o){ $.each(this.serializeArray(), function (i, o) {
var n = o.name, var n = o.name,
v = o.value; v = o.value;
obj[n] = obj[n] === undefined ? v obj[n] = obj[n] === undefined ? v
: $.isArray( obj[n] ) ? obj[n].concat( v ) : $.isArray(obj[n]) ? obj[n].concat(v)
: [ obj[n], v ]; : [ obj[n], v ];
}); });
return obj; return obj;
}; };
})(jQuery); }(jQuery));
$('#main').vifib(); $('#main').vifib();
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