Commit 4fc92b8e authored by Francesc Guasch's avatar Francesc Guasch
Browse files

angular templates for the frontend

parent cd586269
......@@ -209,6 +209,21 @@ sub list_bases {
return @domains;
}
=head2 list_bases_data
List information about the bases
=cut
sub list_bases_data {
my $self = shift;
my @data;
for ($self->list_bases ) {
push @data,{ id => $_->id , name => $_->name };
}
return \@data;
}
=head2 list_images
List all ISO images
......@@ -229,6 +244,21 @@ sub list_images {
return @domains;
}
=head2 list_images_data
List information about the images
=cut
sub list_images_data {
my $self = shift;
my @data;
for ($self->list_images ) {
push @data,{ id => $_->{id} , name => $_->{name} };
}
return \@data;
}
=head2 remove_volume
......
angular.module("ravada.app",[])
.controller("new_base",[ '$scope', '$http', function($scope, $http) {
$http.get('/list_images.json').then(function(response) {
$scope.images = response.data;
});
}])
.directive("solShowNewbase",function() {
return {
restrict: "E",
templateUrl: '/templates/new_base.html',
};
})
<h2>New Base</h2>
<form name="new_base" method="post" action="#">
<label for "name">Name</label><input type="text" size="20" name="name" ><br/>
<label for="id_base">ISO image</label>
<select name ="id_iso"
ng-model="id_iso"
ng-options="item.id as item.name for item in images"
>
</select>
<br/>
Backend:<br/>
<input type="radio" name="backend" value="kvm">kvm</input><br/>
<input type="radio" name="backend" value="lxc"
disabled="true"
>lxc</input><br/>
Disk: <input type="text" name="disk" size="2"> Gb<br/>
Ram: <input type="text" name="ram" size="2"> Gb<br/>
<input type="button" value="create">
</form>
......@@ -103,6 +103,17 @@ any '/users' => sub {
};
get '/list_bases.json' => sub {
my $c = shift;
$c->render(json => $RAVADA->list_bases_data);
};
get '/list_images.json' => sub {
my $c = shift;
$c->render(json => $RAVADA->list_images_data);
};
###################################################
......
<!DOCTYPE html>
<html>
<html ng-app="ravada.app">
%= include 'bootstrap/header'
<body role="document">
<div id="wrapper">
......@@ -8,39 +8,8 @@
<div id="page-wrapper">
<div class="container-fluid">
<div class="row">
<h2>New Base</h2>
<form method="post">
<input type="text" size="20" name="name" value="<%= $name %>"><br/>
% if ($images->[0]) {
boot CD: <select name="id_iso">
% for my $image (@$images) {
<option value="<%= $image->{id} %>"><%= $image->{name} %></option>
% }
</select><br/>
% } else {
<b>Error :</b> No base ISO Images available.
% }
Backend:<br/>
<input type="radio" name="backend" value="kvm">kvm</input><br/>
<input type="radio" name="backend" value="lxc"
disabled="true"
>lxc</input><br/>
Disk: <input type="text" name="disk" size="2"
value="<%= $disk %>">Gb<br/>
Ram: <input type="text" name="ram" size="2"
value="<%= $ram %>">Gb<br/>
<input type="submit" name="submit" value="create">
</form>
% if (scalar @$error) {
<ul>
% for my $i (@$error) {
<li><%= $i %></li>
% }
</ul>
% }
<div ng-controller="new_base">
<sol-show-newbase></sol-show-newbase>
</div>
</div>
......
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="/js/plugins/morris/raphael.min.js"></script>
<script src="/js/plugins/morris/morris.min.js"></script>
<script src="/js/plugins/morris/morris-data.js"></script>
<script src="/js/form.js"></script>
%#<script src="/js/plugins/morris/raphael.min.js"></script>
%#<script src="/js/plugins/morris/morris.min.js"></script>
%#<script src="/js/plugins/morris/morris-data.js"></script>
%#<script src="/js/form.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="/js/ravada.js"></script>
Supports Markdown
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