YunoHost/yunohost-admin
1
0
Fork 0
mirror of https://github.com/YunoHost/yunohost-admin.git synced 2024-09-03 20:06:15 +02:00
Code Issues Projects Releases Packages Wiki Activity

Sexyness is everything

Browse source
This commit is contained in:
Kload 2013-09-22 21:31:51 +02:00
parent 2452cc0d06
commit e9849c5a5d
7 changed files with 104 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
css/style.css
View file

@ -6,8 +6,8 @@ html, body {
margin-left: auto;
margin-right: auto;
/*margin-top: 2%;*/
padding: 15px;
background: #e8e8e8;
padding: 5px;
/*background: #e8e8e8;*/
width: 500px;
height: 100%;
position: relative;
@ -21,10 +21,8 @@ html, body {
}
#main {
background: #e8e8e8;
/*background: #e8e8e8;*/
float: left;
width: 500px;
height: 100%;
position: relative;
overflow: hidden;
}
@ -32,4 +30,13 @@ html, body {
.block {
display: inline-block;
height: 100%;
width: 470px;
height: 100%;
padding: 5px;
}
.panel-title {
font-size: 18px;
font-weight: bold;
line-height: 25px;
}

10
index.html
View file

@ -9,15 +9,19 @@
</head>
<body>
<div id="slider">
<h1><a class="logo" href="#/">YunoHost</a></h1>
<div class="page-header">
<h1 class="pull-left">YunoHost <small>Administration</small></h1>
<a id="disconnect-button" href="#/disconnect" class="pull-right" style="padding-top: 29px; padding-right: 5px; font-size: 24px;"><span class="glyphicon glyphicon-log-out"></span></a>
<div class="clearfix"></div>
</div>
<br />
<div id="flash">
<div id="flash" class="alert" style="display: none">
</div>
<br />
<div id="slider-container">
<div id="slideBack" class="block"></div>
<div id="main" class="block">
<a class="slide" href="#/login">Meh</a>
<a class="slide" href="#/login">Login</a>
</div>
<div id="slideTo" class="block"></div>
</div>

31
js/app.js
View file

@ -29,7 +29,11 @@ app = Sammy('#main', function (sam) {
html += '<div class="'+ lvl +'">'+ msg +'</div>';
});
}
$('#flash').html(html);
if (level == 'fail') { alertClass = 'alert-danger'; }
else if (level == 'success') { alertClass = 'alert-success'; }
else { alertClass = 'alert-info'; }
$('#flash').removeClass().addClass('alert '+ alertClass).html(html).fadeIn();
},
// API connection helper
@ -37,7 +41,7 @@ app = Sammy('#main', function (sam) {
method = typeof method !== 'undefined' ? method : 'GET';
data = typeof data !== 'undefined' ? data : {};
auth = "Basic "+ btoa(store.get('user') +':'+ atob(store.get('password')));
this.swap('<img src="img/ajax-loader.gif" />');
//this.swap('<img src="img/ajax-loader.gif" />');
jQuery.ajax({
url: store.get('url') + uri,
type: method,
@ -53,7 +57,7 @@ app = Sammy('#main', function (sam) {
result = data;
})
.fail(function() {
alert('fail');
req.redirect('#/login');
result = false;
})
.always(function() {
@ -70,6 +74,7 @@ app = Sammy('#main', function (sam) {
$('#slideTo').hide().html('');
rendered.swap(function() {
$('.slide').on('click', function() {
$(this).addClass('active');
if ($(this).hasClass('back')) {
store.set('slide', 'back');
} else {
@ -90,6 +95,7 @@ app = Sammy('#main', function (sam) {
$('#main').css('margin-left', '0');
leSwap();
});
store.clear('slide');
} else if (store.get('slide') == 'to') {
$('#slideTo').show().css('display', 'inline-block');
rendered.appendTo($('#slideTo'));
@ -98,11 +104,10 @@ app = Sammy('#main', function (sam) {
$('#main').css('margin-left', '0');
leSwap();
});
store.clear('slide');
} else {
leSwap();
}
//this.render('views/'+ view +'.ms', data).swap();
}
});
@ -124,7 +129,7 @@ app = Sammy('#main', function (sam) {
// Clear flash display
if (!store.get('flash')) {
$('#flash').html('');
$('#flash').fadeOut(function() { $('#flash').html(''); });
}
});
@ -132,8 +137,6 @@ app = Sammy('#main', function (sam) {
// Clear flash notifications
store.clear('flash');
// Clear sliding preference
store.clear('slide');
});
@ -149,17 +152,19 @@ app = Sammy('#main', function (sam) {
});
sam.get('#/login', function (c) {
$('#disconnect-button').hide();
c.view('login');
});
sam.post('#/login', function (c) {
store.set('url', c.params['url']);
store.set('url', 'http://'+ c.params['url']);
store.set('user', 'admin');
store.set('password', btoa(c.params['password']));
c.api('/users', function(data) {
if (data.error) {
c.flash('fail', 'Error: '+ data.error);
} else {
$('#disconnect-button').fadeIn();
c.flash('success', 'Connected :)');
}
if (store.get('path')) {
@ -170,8 +175,14 @@ app = Sammy('#main', function (sam) {
});
});
sam.get('#/users', function (c) {
c.api('/users', function(data) {
console.log(data);
c.view('user_list', data);
});
});
sam.get('#/users/:user', function (c) {
c.swap('');
c.api('/users/'+ c.params['user'], function(data) {
c.view('user_info', data);
});

29
views/home.ms
View file

@ -1 +1,28 @@
Hello :)
<div class="list-group">
<a href="#/users" class="list-group-item slide">
<h4 class="pull-left list-group-item-heading">Users</h4>
<span class="glyphicon glyphicon-chevron-right pull-right"></span>
<div class="clearfix"></div>
</a>
<a href="#/domains" class="list-group-item slide">
<h4 class="pull-left list-group-item-heading">Domains</h4>
<span class="glyphicon glyphicon-chevron-right pull-right"></span>
<div class="clearfix"></div>
</a>
<a href="#/apps" class="list-group-item slide">
<h4 class="pull-left list-group-item-heading">Applications</h4>
<span class="glyphicon glyphicon-chevron-right pull-right"></span>
<div class="clearfix"></div>
</a>
<a href="#/monitor" class="list-group-item slide">
<h4 class="pull-left list-group-item-heading">Monitor</h4>
<span class="glyphicon glyphicon-chevron-right pull-right"></span>
<div class="clearfix"></div>
</a>
<a href="#/backups" class="list-group-item slide">
<h4 class="pull-left list-group-item-heading">Backups</h4>
<span class="glyphicon glyphicon-chevron-right pull-right"></span>
<div class="clearfix"></div>
</a>
</div>

14
views/login.ms
View file

@ -1,6 +1,14 @@
<form action="#/login" id="form" method="post">
<input type="text" name="url" placeholder="YunoHost API URL" /><br />
<input type="password" name="password" placeholder="Password" /><br />
<input id="submit" type="submit" value="Login" class="btn btn-primary"/>
<div class="input-group">
<span class="input-group-addon">http://</span>
<input type="text" name="url" class="form-control" placeholder="myserver.org:6767">
</div>
<br />
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
<input type="password" name="password" class="form-control" placeholder="Password">
</div>
<br />
<input id="submit" type="submit" value="Login" class="btn btn-success pull-right"/>
</form>

16
views/user_info.ms
View file

@ -1,5 +1,11 @@
<ul>
<li>Fullname: {{Fullname}}</li>
<li>Username: {{Username}}</li>
<li>Mail: {{Mail}}</li>
</ul>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">{{Username}}</h3>
</div>
<!--<div class="panel-body"></div>-->
<ul class="list-group">
<li class="list-group-item"><strong>Fullname</strong>&nbsp;&nbsp; {{Fullname}}</li>
<li class="list-group-item"><strong>Username</strong>&nbsp;&nbsp; {{Username}}</li>
<li class="list-group-item"><strong>Mail</strong>&nbsp;&nbsp; {{Mail}}</li>
</ul>
</div>

14
views/user_list.ms Normal file
View file

@ -0,0 +1,14 @@
<div class="panel panel-default">
<div class="panel-heading">
<h1 class="panel-title">Users</h1>
</div>
<div class="list-group">
{{#Users}}
<a href="#/users/{{Username}}" class="list-group-item slide">
<h4 class="pull-left list-group-item-heading">{{Fullname}}</h4>
<span class="glyphicon glyphicon-chevron-right pull-right"></span>
<div class="clearfix"></div>
</a>
{{/Users}}
</div>
</div>