Skip to content

S
slapos.core
Commit 267dfdb0 authored by Thomas Lechauve's avatar Thomas Lechauve
Browse files
Options

Update desktop and tablet views

parent 6852c1d9
Hide whitespace changes
Inline Side-by-side
Showing with 218 additions and 70 deletions
vifib/Makefile
View file @ 267dfdb0
......@@ -3,16 +3,16 @@
NAME = build
TARBALL = vifib.tar.gz
TARBALL = slapos.tar.gz
DEVDIR = ${NAME}_dev
RELDIR = ${NAME}
JSDIR = js
DEVJS = vifib.js
DEVCSS = vifib.css
FINALJS = vifib.js
FINALCSS = vifib.css
DEVJS = slapos.js
DEVCSS = slapos.css
FINALJS = slapos.js
FINALCSS = slapos.css
all: dev release
......@@ -132,7 +132,7 @@ ${DEVDIR}/tests/%_test.html.ok: ${DEVDIR}/tests/%_test.html ${DEVDIR}/tests/%_te
#########################################
clean:
@echo soft cleaning
rm -rf ${DEVDIR}/index.html ${DEVDIR}/vifib.* ${DEVDIR}/js
rm -rf ${DEVDIR}/index.html ${DEVDIR}/slapos.* ${DEVDIR}/js
cleanall:
@echo cleaning
rm -rf ${DEVDIR} ${RELDIR} $(TARBALL)
vifib/index.html
View file @ 267dfdb0
......@@ -4,7 +4,7 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="vifib.js"></script>
<script src="slapos.js"></script>
<style>
.ui-content{
padding: 0px;
......
vifib/js/init.js
View file @ 267dfdb0
......@@ -12,6 +12,13 @@ $(document).bind("mobileinit", function () {
// Google application id
'ggappid': '380290002359.apps.googleusercontent.com'
});
// show loading during ajax request
$(document).ajaxStart(function () {
$("#loading").spin(spinOptions);
}).ajaxStop(function () {
$("#loading").spin(false);
});
//$(document).slapos('store', 'host', '/fake');
......
vifib/js/main.js
View file @ 267dfdb0
'use strict';
var getDevice = function (w) {
return 'mobile';
if (w < 500) {
return 'mobile';
}
......@@ -24,7 +23,7 @@ $.vifib.devices = {
$('body')
.route('add', '/login/google')
.done($.vifib.login.google);
// when oogle send back the token, it reset hashtag from url
// when Google send back the token, it reset hashtag from url
$('body')
.route('add', 'access_token=<path:path>')
.done($.vifib.login.googleRedirect);
......@@ -42,6 +41,16 @@ $.vifib.devices = {
$('body')
.route('add', '')
.done($.vifib.tablet.overview);
$('body')
.route('add', '/login/facebook')
.done($.vifib.login.facebook);
$('body')
.route('add', '/login/google')
.done($.vifib.login.google);
// when Google send back the token, it reset hashtag from url
$('body')
.route('add', 'access_token=<path:path>')
.done($.vifib.login.googleRedirect);
$('body')
.route('add', '/overview')
.done($.vifib.tablet.overview);
......
vifib/js/pages.desktop.js
View file @ 267dfdb0
......@@ -14,7 +14,7 @@ $.vifib.desktop = {
]}
]);
// header
page.prepend(Mustache.render($.vifib.header.default, {title: 'Vifib'}));
page.prepend(Mustache.render($.vifib.header.default, {title: 'SlapOs'}));
// rendering
$.vifib.changepage($(page));
$('#panel-1')
......@@ -26,6 +26,16 @@ $.vifib.desktop = {
$('#panel-1')
.route('add', '/dashboard<path:url>', 1)
.done($.vifib.desktop.dashboard.dispatch);
$('#panel-1')
.route('add', '/login/facebook', 1)
.done($.vifib.login.facebook);
$('#panel-1')
.route('add', '/login/google', 1)
.done($.vifib.login.google);
// when Google send back the token, it reset hashtag from url
$('#panel-1')
.route('add', 'access_token=<path:path>', 1)
.done($.vifib.login.googleRedirect);
$('#panel-1')
.route('go', $.url.getPath(), 1)
.fail(function () { $.vifib.replacepanel($(this), $.vifib.panel.failed)});
......@@ -69,10 +79,10 @@ $.vifib.desktop = {
overview: function (route) {
$.vifib.replacepanel($(this), $.vifib.panel.library, {
most: [
{url: '#/library/software/id/fake/software_info/kvm', name: 'Kvm'},
{url: '#/library/software/id/fake/software_info/Kvm', name: 'Kvm'},
],
newest: [
{url: '#/library/software/id/fake/software_info/html5', name: 'html5 AS'}
{url: '#/library/software/id/fake/software_info/Html5as', name: 'html5 AS'}
]
});
},
......@@ -93,7 +103,6 @@ $.vifib.desktop = {
$.vifib.replacepanel($(this), $.vifib.panel.simplelist, {
links: [
{url: '#/dashboard/instance/list', name: 'Instances'},
{url: '#/dashboard/computer/list', name: 'Computers'}
]
});
$('#panel-2')
......@@ -103,39 +112,91 @@ $.vifib.desktop = {
.route('add', '/dashboard/instance/list', 2)
.done($.vifib.desktop.dashboard.instancelist);
$('#panel-2')
.route('add', '/dashboard/instance/id/<instid>', 2)
.route('add', '/dashboard/instance/request', 2)
.done($.vifib.desktop.dashboard.instancerequest);
$('#panel-2')
.route('add', '/dashboard/instance/id<path:instid>', 2)
.done($.vifib.desktop.dashboard.instance);
$('#panel-2')
.route('add', '/dashboard/computer/list', 2)
.done($.vifib.desktop.dashboard.computerlist);
.route('add', '/dashboard/instance/start<path:instid>', 2)
.done($.vifib.desktop.dashboard.instancestart);
$('#panel-2')
.route('add', '/dashboard/computer/id/<compid>', 2)
.done($.vifib.desktop.dashboard.computer);
.route('add', '/dashboard/instance/stop<path:instid>', 2)
.done($.vifib.desktop.dashboard.instancestop);
$('#panel-2')
.route('add', '/dashboard/instance/destroy<path:instid>', 2)
.done($.vifib.desktop.dashboard.instancedestroy);
$('#panel-2')
.route('go', $.url.getPath(), 2)
.fail(function () { $.vifib.replacepanel($(this), $.vifib.panel.failed)});
},
instancelist: function (route) {
$.vifib.replacepanel($(this), $.vifib.panel.allinstance);
$.vifib.replacepanel($(this), $.vifib.panel.instancelist);
$.vifib.instanceList($(this));
},
instancerequest: function (route) {
$.vifib.replacepanel($(this), $.vifib.panel.instancerequest);
$("#instancerequest").submit(function () {
var data = {
"status": "start_requested",
"slave": false,
"software_type": "type_provided_by_the_software",
};
$.extend(data, $(this).serializeObject());
$(this).slapos('instanceRequest', {
data: data,
success: function (response) {
$.url.redirect('/dashboard/instance/list');
},
statusCode: $.extend(false, $.vifib.statuscode, {})
});
return false;
});
},
instance: function (instid) {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
response[response.status] = true;
response.stop_url = '#/dashboard/instance/stop' + instid;
response.start_url = '#/dashboard/instance/start' + instid;
response.destroy_url = '#/dashboard/instance/destroy' + instid;
$.vifib.replacepanel($(this), $.vifib.panel.instance, response);
}
});
},
computerlist: function (route) {
$.vifib.replacepanel($(this), $.vifib.panel.allcomputer);
$.vifib.computerList($(this));
instancestop: function (instid) {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
if (response.status === 'start_requested') {
response.status = 'stop_requested';
$(this).slapos('instanceRequest', {
data: response,
success: function (response) {
$.url.redirect('/dashboard/instance/id' + instid);
},
statusCode: $.extend(false, $.vifib.statuscode, {})
})
}
},
statusCode: $.extend(false, $.vifib.statuscode, {})
});
},
computer: function (compid) {
$(this).slapos('computerInfo', compid, {
instancestart: function (instid) {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
$.vifib.replacepanel($(this), $.vifib.panel.computer, response);
}
if (response.status === 'stop_requested') {
response.status = 'start_requested';
$(this).slapos('instanceRequest', {
data: response,
success: function (response) {
$.url.redirect('/dashboard/instance/id' + instid);
},
statusCode: $.extend(false, $.vifib.statuscode, {})
})
}
},
statusCode: $.extend(false, $.vifib.statuscode, {})
});
}
},
}
};
vifib/js/pages.js
View file @ 267dfdb0
......@@ -33,19 +33,51 @@ $.vifib.login = {
}
$.vifib.statuscode = {
400: function (jqxhr, textstatus) {
$.vifib.replacepanel($(this), $.vifib.panel.badrequest);
var page;
if(device === 'mobile') {
page = $.vifib.onepanel($.vifib.panel.badrequest);
page.prepend(Mustache.render($.vifib.header.default, {title: 'An error as occured'}));
page.append($.vifib.footer.overview);
$.vifib.changepage($(page));
} else {
$.vifib.replacepanel($(this), $.vifib.panel.badrequest);
}
},
401: function (jqxhr, textstatus) {
$.url.redirect('/login');
$.url.redirect('/overview');
},
402: function (jqxhr, textstatus) {
$.vifib.replacepanel($(this), $.vifib.panel.payment);
var page;
if(device === 'mobile') {
page = $.vifib.onepanel($.vifib.panel.payment);
page.prepend(Mustache.render($.vifib.header.default, {title: 'An error as occured'}));
page.append($.vifib.footer.overview);
$.vifib.changepage($(page));
} else {
$.vifib.replacepanel($(this), $.vifib.panel.payment);
}
},
404: function (jqxhr, textstatus) {
$.vifib.replacepanel($(this), $.vifib.panel.notfound);
var page;
if(device === 'mobile') {
page = $.vifib.onepanel($.vifib.panel.notfound);
page.prepend(Mustache.render($.vifib.header.default, {title: 'An error as occured'}));
page.append($.vifib.footer.overview);
$.vifib.changepage($(page));
} else {
$.vifib.replacepanel($(this), $.vifib.panel.notfound);
}
},
500: function (jqxhr, textstatus) {
$.vifib.replacepanel($(this), $.vifib.panel.internalerror);
var page;
if(device === 'mobile') {
page = $.vifib.onepanel($.vifib.panel.internalerror);
page.prepend(Mustache.render($.vifib.header.default, {title: 'An error as occured'}));
page.append($.vifib.footer.overview);
$.vifib.changepage($(page));
} else {
$.vifib.replacepanel($(this), $.vifib.panel.internalerror);
}
},
}
$.vifib.softwareList = function (context) {
......
vifib/js/pages.mobile.js
View file @ 267dfdb0
......@@ -9,7 +9,7 @@ $.vifib.mobile = {
// rendering
page = $.vifib.onepanel($.vifib.panel.login);
// header
page.prepend(Mustache.render($.vifib.header.default, {title: 'Vifib'}));
page.prepend(Mustache.render($.vifib.header.default, {title: 'SlapOs'}));
// footer navbar
page.append($.vifib.footer.overview);
// rendering
......@@ -33,10 +33,10 @@ $.vifib.mobile = {
overview: function () {
page = $.vifib.onepanel($.vifib.panel.library, {
most: [
{url: '#/library/software/id/fake/software_info/kvm', name: 'Kvm'},
{url: '#/library/software/id/fake/software_info/Kvm', name: 'Kvm'},
],
newest: [
{url: '#/library/software/id/fake/software_info/html5', name: 'html5 AS'}
{url: '#/library/software/id/fake/software_info/Html5', name: 'Html5as'}
]
});
// header
......@@ -63,7 +63,8 @@ $.vifib.mobile = {
page.append($.vifib.footer.overview);
// rendering
$.vifib.changepage($(page));
}
},
statusCode: $.extend(false, $.vifib.statuscode, {})
});
},
all: function () {
......@@ -97,12 +98,6 @@ $.vifib.mobile = {
$('body')
.route('add', '/dashboard/instance/destroy<path:instid>', 1)
.done($.vifib.mobile.dashboard.instancedestroy);
$('body')
.route('add', '/dashboard/computer/list', 1)
.done($.vifib.mobile.dashboard.computerlist);
$('body')
.route('add', '/dashboard/computer/id/<compid>', 1)
.done($.vifib.mobile.dashboard.computer);
$('body')
.route('go', $.url.getPath(), 1)
.fail($.vifib.mobile.nopage);
......@@ -162,7 +157,7 @@ $.vifib.mobile = {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
if (response.status === 'stop_requested') {
response.status = 'started';
response.status = 'start_requested';
$(this).slapos('instanceRequest', {
data: response,
success: function (response) {
......@@ -179,7 +174,7 @@ $.vifib.mobile = {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
if (response.status === 'start_requested') {
response.status = 'stopped';
response.status = 'stop_requested';
$(this).slapos('instanceRequest', {
data: response,
success: function (response) {
......
vifib/js/pages.tablet.js
View file @ 267dfdb0
......@@ -10,7 +10,7 @@ $.vifib.tablet = {
]}
]);
// header
page.prepend(Mustache.render($.vifib.header.default, {title: 'Vifib'}));
page.prepend(Mustache.render($.vifib.header.default, {title: 'SlapOs'}));
// rendering
$.vifib.changepage($(page));
},
......@@ -47,8 +47,8 @@ $.vifib.tablet = {
},
overview: function () {
$.vifib.replacepanel($(this), $.vifib.panel.library, {
most: [{url: '#/library/software/id/fake/software_info/kvm', name: 'Kvm'},],
newest: [{url: '#/library/software/id/fake/software_info/html5', name: 'html5 AS'}]
most: [{url: '#/library/software/id/fake/software_info/Kvm', name: 'Kvm'},],
newest: [{url: '#/library/software/id/fake/software_info/Html5as', name: 'html5 AS'}]
});
},
software: function (softid) {
......@@ -78,7 +78,6 @@ $.vifib.tablet = {
{url: '#/library/', name: 'Library'},
{url: 'http://packages.python.org/slapos.core/', name: 'Documentation'},
{url: '#/dashboard/instance/list', name: 'Instances'},
{url: '#/dashboard/computer/list', name: 'Computers'}
]}
]);
page.prepend(Mustache.render($.vifib.header.default, {title: 'Dashboard'}));
......@@ -90,25 +89,35 @@ $.vifib.tablet = {
.route('add', '/dashboard/instance/list', 1)
.done($.vifib.tablet.dashboard.instancelist);
$('#panel-1')
.route('add', '/dashboard/instance/id/<instid>', 1)
.route('add', '/dashboard/instance/request', 1)
.done($.vifib.tablet.dashboard.instancerequest);
$('#panel-1')
.route('add', '/dashboard/instance/id<path:instid>', 1)
.done($.vifib.tablet.dashboard.instance);
$('#panel-1')
.route('add', '/dashboard/computer/list', 1)
.done($.vifib.tablet.dashboard.computerlist);
.route('add', '/dashboard/instance/start<path:instid>', 1)
.done($.vifib.tablet.dashboard.instancestart);
$('#panel-1')
.route('add', '/dashboard/instance/stop<path:instid>', 1)
.done($.vifib.tablet.dashboard.instancestop);
$('#panel-1')
.route('add', '/dashboard/computer/id/<compid>', 1)
.done($.vifib.tablet.dashboard.computer);
.route('add', '/dashboard/instance/destroy<path:instid>', 1)
.done($.vifib.tablet.dashboard.instancedestroy);
$('#panel-1')
.route('go', $.url.getPath(), 1)
.fail(function () { $.vifib.replacepanel($(this), $.vifib.panel.failed)});
},
instancelist: function (route) {
$.vifib.replacepanel($(this), $.vifib.panel.allinstance);
$.vifib.replacepanel($(this), $.vifib.panel.instancelist);
$.vifib.instanceList($(this));
},
instance: function (instid) {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
response[response.status] = true;
response.stop_url = '#/dashboard/instance/stop' + instid;
response.start_url = '#/dashboard/instance/start' + instid;
response.destroy_url = '#/dashboard/instance/destroy' + instid;
$.vifib.replacepanel($(this), $.vifib.panel.instance, response);
},
statusCode: $.extend(false, $.vifib.statuscode, {
......@@ -118,21 +127,58 @@ $.vifib.tablet = {
})
});
},
computerlist: function (route) {
$.vifib.replacepanel($(this), $.vifib.panel.allcomputer);
$.vifib.computerList($(this));
instancerequest: function (route) {
$.vifib.replacepanel($(this), $.vifib.panel.instancerequest);
$("#instancerequest").submit(function () {
var data = {
"status": "start_requested",
"slave": false,
"software_type": "type_provided_by_the_software",
};
$.extend(data, $(this).serializeObject());
$(this).slapos('instanceRequest', {
data: data,
success: function (response) {
$.url.redirect('/dashboard/instance/list');
},
statusCode: $.extend(false, $.vifib.statuscode, {})
});
return false;
});
},
computer: function (compid) {
$(this).slapos('computerInfo', compid, {
instancestop: function (instid) {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
$.vifib.replacepanel($(this), $.vifib.panel.computer, response);
if (response.status === 'start_requested') {
response.status = 'stop_requested';
$(this).slapos('instanceRequest', {
data: response,
success: function (response) {
$.url.redirect('/dashboard/instance/id' + instid);
},
statusCode: $.extend(false, $.vifib.statuscode, {})
})
}
},
statusCode: $.extend(false, $.vifib.statuscode, {
404: function (jqxhr, textstatus) {
$.vifib.replacepanel($(this), $.vifib.panel.nocomputer, {name: compid});
statusCode: $.extend(false, $.vifib.statuscode, {})
});
},
instancestart: function (instid) {
$(this).slapos('instanceInfo', instid, {
success: function (response) {
if (response.status === 'stop_requested') {
response.status = 'start_requested';
$(this).slapos('instanceRequest', {
data: response,
success: function (response) {
$.url.redirect('/dashboard/instance/id' + instid);
},
statusCode: $.extend(false, $.vifib.statuscode, {})
})
}
})
},
statusCode: $.extend(false, $.vifib.statuscode, {})
});
}
},
}
};
vifib/js/panels.js
View file @ 267dfdb0
......@@ -207,7 +207,7 @@ $.vifib.panel = {
}
$.vifib.header = {
default: '<header data-role="header"><a href="#" data-icon="home" data-iconpos="notext"></a><h2>{{ title }}</h2><div id="loading" style="h"></div></header>'
default: '<header data-role="header"><a href="#" data-icon="home" data-iconpos="notext"></a><h2>{{ title }}</h2></div></header><div id="loading" style="position: absolute; top: 20px; right: 20px;"></div>'
}
$.vifib.footer = {
......
vifib/js/utils/fake.js
View file @ 267dfdb0
......@@ -103,10 +103,8 @@ fakeserver.respondWith("POST", '/fake/instance', function (xhr) {
inst = JSON.parse(xhr.requestBody),
iadd = {},
ilist = instance_list();
if (instances.hasOwnProperty(inst.title) === false) {
iadd[inst.title] = inst;
storejs.extend('instances', iadd);
}
iadd[inst.title] = inst;
storejs.extend('instances', iadd);
xhr.respond(201, {'Content-Type': 'application/json'}, JSON.stringify({
title: inst.title,
status: inst.status
......
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