ui: refactor file structure

This commit is contained in:
Jack Pearkes 2014-04-25 13:49:36 -04:00
parent 62955c5b97
commit b5718ac23b
6 changed files with 173 additions and 163 deletions

View File

@ -229,7 +229,11 @@
<script src="javascripts/libs/handlebars-1.1.2.js"></script> <script src="javascripts/libs/handlebars-1.1.2.js"></script>
<script src="javascripts/libs/ember-1.5.0.js"></script> <script src="javascripts/libs/ember-1.5.0.js"></script>
<script src="javascripts/fixtures.js"></script> <script src="javascripts/fixtures.js"></script>
<script src="javascripts/app.js"></script> <script src="javascripts/app/router.js"></script>
<script src="javascripts/app/routes.js"></script>
<script src="javascripts/app/models.js"></script>
<script src="javascripts/app/views.js"></script>
<script src="javascripts/app/controllers.js"></script>
<!-- to activate the test runner, add the "?test" query string parameter --> <!-- to activate the test runner, add the "?test" query string parameter -->
<script src="tests/runner.js"></script> <script src="tests/runner.js"></script>

View File

@ -0,0 +1,15 @@
//
// path: /
//
// The index is for choosing datacenters.
//
App.IndexController = Ember.Controller.extend({
});
//
// path: /:dc
//
App.DcController = Ember.Controller.extend({
})

View File

@ -0,0 +1,78 @@
//
// A Consul service.
//
App.Service = Ember.Object.extend({
//
// The number of failing checks within the service.
//
failingChecks: function() {
return this.get('Checks').filterBy('Status', 'critical').get('length');
}.property('failingChecks'),
//
// The number of passing checks within the service.
//
passingChecks: function() {
return this.get('Checks').filterBy('Status', 'passing').get('length');
}.property('passingChecks'),
//
// The formatted message returned for the user which represents the
// number of checks failing or passing. Returns `1 passing` or `2 failing`
//
checkMessage: function() {
if (this.get('hasFailingChecks') === false) {
return this.get('passingChecks') + ' passing';
} else {
return this.get('failingChecks') + ' failing';
}
}.property('checkMessage'),
//
// Boolean of whether or not there are failing checks in the service.
// This is used to set color backgrounds and so on.
//
hasFailingChecks: function() {
return (this.get('failingChecks') > 0);
}.property('hasFailingChecks')
});
//
// A Consul Node
//
App.Node = Ember.Object.extend({
//
// The number of failing checks within the service.
//
failingChecks: function() {
return this.get('Checks').filterBy('Status', 'critical').get('length');
}.property('failingChecks'),
//
// The number of passing checks within the service.
//
passingChecks: function() {
return this.get('Checks').filterBy('Status', 'passing').get('length');
}.property('passingChecks'),
//
// The formatted message returned for the user which represents the
// number of checks failing or passing. Returns `1 passing` or `2 failing`
//
checkMessage: function() {
if (this.get('hasFailingChecks') === false) {
return this.get('passingChecks') + ' passing';
} else {
return this.get('failingChecks') + ' failing';
}
}.property('checkMessage'),
//
// Boolean of whether or not there are failing checks in the service.
// This is used to set color backgrounds and so on.
//
hasFailingChecks: function() {
return (this.get('failingChecks') > 0);
}.property('hasFailingChecks')
});

View File

@ -0,0 +1,20 @@
window.App = Ember.Application.create({
rootElement: "#app",
LOG_TRANSITIONS: true
});
App.Router.map(function() {
this.resource("dc", {path: "/:dc"}, function() {
this.resource("services", { path: "/services" }, function(){
this.route("show", { path: "/:name" });
});
this.resource("nodes", { path: "/nodes" }, function() {
this.route("show", { path: "/:name" });
});
this.resource("kv", { path: "/kv" });
});
this.route("index", { path: "/" });
});

174
ui/javascripts/app.js → ui/javascripts/app/routes.js Executable file → Normal file
View File

@ -1,25 +1,3 @@
window.App = Ember.Application.create({
rootElement: "#app",
LOG_TRANSITIONS: true,
currentPath: ''
});
App.Router.map(function() {
this.resource("dc", {path: "/:dc"}, function() {
this.resource("services", { path: "/services" }, function(){
this.route("show", { path: "/:name" });
});
this.resource("nodes", { path: "/nodes" }, function() {
this.route("show", { path: "/:name" });
});
this.resource("kv", { path: "/kv" });
});
this.route("index", { path: "/" });
});
// //
// Superclass to be used by all of the main routes below. All routes // Superclass to be used by all of the main routes below. All routes
// but the IndexRoute share the need to have a datacenter set. // but the IndexRoute share the need to have a datacenter set.
@ -56,91 +34,20 @@ App.IndexRoute = Ember.Route.extend({
} }
}); });
// // The base DC route
// path: /
// App.DcRoute = App.BaseRoute.extend({
// The index is for choosing datacenters. //
// // Set the model on the route. We look up the specific service
App.IndexController = Ember.Controller.extend({ // by it's identifier passed via the route
//
model: function(params) {
return params.dc;
}
}); });
//
// A Consul service.
//
App.Service = Ember.Object.extend({
//
// The number of failing checks within the service.
//
failingChecks: function() {
return this.get('Checks').filterBy('Status', 'critical').get('length');
}.property('failingChecks'),
// /// services
// The number of passing checks within the service.
//
passingChecks: function() {
return this.get('Checks').filterBy('Status', 'passing').get('length');
}.property('passingChecks'),
//
// The formatted message returned for the user which represents the
// number of checks failing or passing. Returns `1 passing` or `2 failing`
//
checkMessage: function() {
if (this.get('hasFailingChecks') === false) {
return this.get('passingChecks') + ' passing';
} else {
return this.get('failingChecks') + ' failing';
}
}.property('checkMessage'),
//
// Boolean of whether or not there are failing checks in the service.
// This is used to set color backgrounds and so on.
//
hasFailingChecks: function() {
return (this.get('failingChecks') > 0);
}.property('hasFailingChecks')
});
//
// A Consul Node
//
App.Node = Ember.Object.extend({
//
// The number of failing checks within the service.
//
failingChecks: function() {
return this.get('Checks').filterBy('Status', 'critical').get('length');
}.property('failingChecks'),
//
// The number of passing checks within the service.
//
passingChecks: function() {
return this.get('Checks').filterBy('Status', 'passing').get('length');
}.property('passingChecks'),
//
// The formatted message returned for the user which represents the
// number of checks failing or passing. Returns `1 passing` or `2 failing`
//
checkMessage: function() {
if (this.get('hasFailingChecks') === false) {
return this.get('passingChecks') + ' passing';
} else {
return this.get('failingChecks') + ' failing';
}
}.property('checkMessage'),
//
// Boolean of whether or not there are failing checks in the service.
// This is used to set color backgrounds and so on.
//
hasFailingChecks: function() {
return (this.get('failingChecks') > 0);
}.property('hasFailingChecks')
});
// //
// Display all the services, allow to drill down into the specific services. // Display all the services, allow to drill down into the specific services.
@ -161,16 +68,6 @@ App.ServicesRoute = App.BaseRoute.extend({
}); });
App.DcRoute = App.BaseRoute.extend({
//
// Set the model on the route. We look up the specific service
// by it's identifier passed via the route
//
model: function(params) {
return params.dc;
}
});
// //
// Display an individual service, as well as the global services in the left // Display an individual service, as well as the global services in the left
// column. // column.
@ -195,55 +92,8 @@ App.ServicesShowRoute = App.BaseRoute.extend({
} }
}); });
//
// DC
//
App.DcView = Ember.View.extend({
templateName: 'dc',
})
//
// Services
//
App.ServicesView = Ember.View.extend({
templateName: 'services',
})
//
// Services
//
App.ServicesShowView = Ember.View.extend({
//
// We use the same template as we do for the services
// array and have a simple conditional to display the nested
// individual service resource.
//
templateName: 'service'
})
//
// path: /:dc
//
App.DcController = Ember.Controller.extend({
})
//
// Nodes
//
App.NodesView = Ember.View.extend({
templateName: 'nodes'
})
App.NodesShowView = Ember.View.extend({
//
// We use the same template as we do for the nodes
// array and have a simple conditional to display the nested
// individual node resource.
//
templateName: 'node'
})
/// nodes
// //
// Display an individual node, as well as the global nodes in the left // Display an individual node, as well as the global nodes in the left

View File

@ -0,0 +1,43 @@
//
// DC
//
App.DcView = Ember.View.extend({
templateName: 'dc',
})
//
// Services
//
App.ServicesView = Ember.View.extend({
templateName: 'services',
})
App.ServicesShowView = Ember.View.extend({
//
// We use the same template as we do for the services
// array and have a simple conditional to display the nested
// individual service resource.
//
templateName: 'service'
})
//
// Nodes
//
App.NodesView = Ember.View.extend({
templateName: 'nodes'
})
App.NodesShowView = Ember.View.extend({
//
// We use the same template as we do for the nodes
// array and have a simple conditional to display the nested
// individual node resource.
//
templateName: 'node'
})