commit
94b47466fc
106
ui/index.html
106
ui/index.html
|
@ -145,9 +145,9 @@
|
|||
<div class="panel">
|
||||
<div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-light-gray" }}></div>
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">
|
||||
<h4 class="panel-title">
|
||||
Create Key
|
||||
</h3>
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<div class="panel-body panel-form">
|
||||
|
@ -203,41 +203,62 @@
|
|||
{{/each}}
|
||||
</div>
|
||||
|
||||
<div class="border-left hidden-xs hidden-sm">
|
||||
</div>
|
||||
<div class="border-left hidden-xs hidden-sm">
|
||||
</div>
|
||||
|
||||
<div class="visible-xs visible-sm">
|
||||
<hr>
|
||||
</div>
|
||||
<div class="visible-xs visible-sm">
|
||||
<hr>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-7 border-left">
|
||||
<div class="padded-border">
|
||||
<div class="panel">
|
||||
<div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-green" }}></div>
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">
|
||||
{{model.Key}}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="panel-body panel-form">
|
||||
<div class="form-group">
|
||||
{{errorMessage}}
|
||||
</div>
|
||||
<form class="form">
|
||||
<div class="form-group">
|
||||
{{ textarea value=model.valueDecoded class="form-control"}}
|
||||
</div>
|
||||
<button {{ action "updateKey"}} {{bind-attr disabled=isLoading }} {{ bind-attr class=":btn isLoading:btn-warning:btn-success" }}>Update</button>
|
||||
<button {{ action "cancelEdit"}} {{bind-attr disabled=isLoading }} {{ bind-attr class=":btn isLoading:btn-warning:btn-default" }}>Cancel</button>
|
||||
<button {{ action "deleteKey"}} {{bind-attr disabled=isLoading }} {{ bind-attr class=":btn :pull-right isLoading:btn-warning:btn-danger" }}>Delete key</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-green isLocked:bg-light-gray" }}></div>
|
||||
<div class="panel-heading">
|
||||
<h4 {{bind-attr class=":panel-title isLocked:locked"}}>
|
||||
{{model.Key}}
|
||||
{{#if model.isLocked}}
|
||||
<small class="pull-right">
|
||||
KEY LOCKED
|
||||
</small>
|
||||
{{/if}}
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<div class="panel-body panel-form">
|
||||
<div class="form-group">
|
||||
{{errorMessage}}
|
||||
</div>
|
||||
<form class="form">
|
||||
<div class="form-group">
|
||||
{{ textarea value=model.valueDecoded class="form-control" disabled=model.isLocked}}
|
||||
</div>
|
||||
<button {{action "updateKey"}} {{bind-attr disabled=isLoading}} {{bind-attr class=":btn isLoading:btn-warning:btn-success"}} {{bind-attr disabled=isLocked}}>Update</button>
|
||||
<button {{action "cancelEdit"}} {{bind-attr disabled=isLoading}} {{bind-attr class=":btn isLoading:btn-warning:btn-default"}}>Cancel</button>
|
||||
<button {{action "deleteKey"}} {{bind-attr disabled=isLoading}} {{bind-attr class=":btn :pull-right isLoading:btn-warning:btn-danger"}} {{bind-attr disabled=isLocked}}>Delete key</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#if model.isLocked}}
|
||||
<h5>Lock Session</h5>
|
||||
|
||||
{{#link-to 'nodes.show' model.session.Node tagName="div" href=false class="list-group-item list-condensed-link" }}
|
||||
<div class="bg-light-gray list-bar-horizontal"></div>
|
||||
<div class="name">
|
||||
{{session.Node}}
|
||||
<small class="pull-right">
|
||||
{{session.ID}}
|
||||
</small>
|
||||
</div>
|
||||
{{/link-to}}
|
||||
{{/if}}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/x-handlebars" data-template-name="item/loading">
|
||||
|
@ -306,7 +327,7 @@
|
|||
<hr>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-7 border-left">
|
||||
<div class="col-md-6 col-lg-7 border-left scrollable">
|
||||
<div class="row padded-border">
|
||||
{{outlet}}
|
||||
</div>
|
||||
|
@ -408,7 +429,7 @@
|
|||
<div class="border-left hidden-xs hidden-sm">
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 col-lg-7 border-left">
|
||||
<div class="col-md-6 col-lg-7 border-left scrollable">
|
||||
<div class="row padded-border">
|
||||
{{outlet}}
|
||||
</div>
|
||||
|
@ -424,7 +445,6 @@
|
|||
|
||||
<h3 class="no-margin">{{ model.Node }} <small> {{ model.Address }}</small></h3>
|
||||
<hr>
|
||||
{{foobar}}
|
||||
|
||||
<h5>Service Tags</h5>
|
||||
{{#if model.nodeTags}}
|
||||
|
@ -471,6 +491,30 @@
|
|||
</div>
|
||||
|
||||
{{/each}}
|
||||
|
||||
<h5>Lock Sessions</h5>
|
||||
|
||||
{{#if sessions }}
|
||||
{{errorMessage}}
|
||||
|
||||
{{#each session in sessions }}
|
||||
<div class="list-group-item list-condensed double-line">
|
||||
<div class="bg-light-gray list-bar-horizontal"></div>
|
||||
<div class="name">
|
||||
{{session.ID}}
|
||||
<button {{ action "invalidateSession" session.ID }} {{ bind-attr class=":btn :btn-danger :pull-right :btn-list isLoading:btn-warning" }}>Invalidate</button>
|
||||
</div>
|
||||
<ul class="list-inline sub">
|
||||
{{#each check in session.Checks}}
|
||||
<li class="bold">{{check}}</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
{{/each}}
|
||||
|
||||
{{else}}
|
||||
<p class="light small">No sessions</p>
|
||||
{{/if}}
|
||||
</script>
|
||||
|
||||
<script type="text/x-handlebars" id="index">
|
||||
|
|
|
@ -161,11 +161,12 @@ App.KvShowController.reopen({
|
|||
this.set('isLoading', true);
|
||||
|
||||
var controller = this;
|
||||
var dc = controller.get('dc').get('datacenter');
|
||||
var grandParent = controller.get('grandParentKey');
|
||||
|
||||
// Delete the folder
|
||||
Ember.$.ajax({
|
||||
url: ("/v1/kv/" + controller.get('parentKey') + '?recurse'),
|
||||
url: ("/v1/kv/" + controller.get('parentKey') + '?recurse&dc=' + dc),
|
||||
type: 'DELETE'
|
||||
}).then(function(response) {
|
||||
controller.transitionToNearestParent(grandParent);
|
||||
|
@ -277,6 +278,35 @@ ItemBaseController = Ember.ArrayController.extend({
|
|||
}
|
||||
});
|
||||
|
||||
App.NodesShowController = Ember.ObjectController.extend({
|
||||
needs: ["dc"],
|
||||
dc: Ember.computed.alias("controllers.dc"),
|
||||
|
||||
actions: {
|
||||
invalidateSession: function(sessionId) {
|
||||
this.set('isLoading', true);
|
||||
var controller = this;
|
||||
var node = controller.get('model');
|
||||
var dc = controller.get('dc').get('datacenter');
|
||||
|
||||
if (window.confirm("Are you sure you want to invalidate this session?")) {
|
||||
// Delete the session
|
||||
Ember.$.ajax({
|
||||
url: ("/v1/session/destroy/" + sessionId + '?dc=' + dc),
|
||||
type: 'PUT'
|
||||
}).then(function(response) {
|
||||
return Ember.$.getJSON('/v1/session/node/' + node.Node + '?dc=' + dc).then(function(data) {
|
||||
controller.set('sessions', data)
|
||||
});
|
||||
}).fail(function(response) {
|
||||
// Render the error message on the form if the request failed
|
||||
controller.set('errorMessage', 'Received error while processing: ' + response.statusText)
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
App.NodesController = ItemBaseController.extend({
|
||||
items: Ember.computed.alias("nodes"),
|
||||
});
|
||||
|
|
|
@ -176,6 +176,15 @@ App.Key = Ember.Object.extend(Ember.Validations.Mixin, {
|
|||
return (this.get('Key').slice(-1) === '/')
|
||||
}.property('Key'),
|
||||
|
||||
// Boolean if the key is locked or now
|
||||
isLocked: function() {
|
||||
if (!this.get('Session')) {
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}.property('Session'),
|
||||
|
||||
// Determines what route to link to. If it's a folder,
|
||||
// it will link to kv.show. Otherwise, kv.edit
|
||||
linkToRoute: function() {
|
||||
|
|
|
@ -161,6 +161,7 @@ App.KvEditRoute = App.BaseRoute.extend({
|
|||
|
||||
// Return a promise hash to get the data for both columns
|
||||
return Ember.RSVP.hash({
|
||||
dc: dc,
|
||||
key: Ember.$.getJSON('/v1/kv/' + key + '?dc=' + dc).then(function(data) {
|
||||
// Convert the returned data to a Key
|
||||
return App.Key.create().setProperties(data[0]);
|
||||
|
@ -175,6 +176,18 @@ App.KvEditRoute = App.BaseRoute.extend({
|
|||
});
|
||||
},
|
||||
|
||||
// Load the session on the key, if there is one
|
||||
afterModel: function(models) {
|
||||
if (models.key.get('isLocked')) {
|
||||
return Ember.$.getJSON('/v1/session/info/' + models.key.Session + '?dc=' + models.dc).then(function(data) {
|
||||
models.session = data[0]
|
||||
return models
|
||||
});
|
||||
} else {
|
||||
return models
|
||||
}
|
||||
},
|
||||
|
||||
setupController: function(controller, models) {
|
||||
var key = models.key;
|
||||
var parentKeys = this.getParentAndGrandparent(key.get('Key'));
|
||||
|
@ -186,6 +199,7 @@ App.KvEditRoute = App.BaseRoute.extend({
|
|||
controller.set('isRoot', parentKeys.isRoot);
|
||||
controller.set('siblings', models.keys);
|
||||
controller.set('rootKey', this.rootKey);
|
||||
controller.set('session', models.session);
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -227,6 +241,7 @@ App.NodesShowRoute = App.BaseRoute.extend({
|
|||
var dc = this.modelFor('dc').dc
|
||||
// Return a promise hash of the node and nodes
|
||||
return Ember.RSVP.hash({
|
||||
dc: dc,
|
||||
node: Ember.$.getJSON('/v1/internal/ui/node/' + params.name + '?dc=' + dc).then(function(data) {
|
||||
return App.Node.create(data)
|
||||
}),
|
||||
|
@ -236,8 +251,17 @@ App.NodesShowRoute = App.BaseRoute.extend({
|
|||
});
|
||||
},
|
||||
|
||||
// Load the sessions for the node
|
||||
afterModel: function(models) {
|
||||
return Ember.$.getJSON('/v1/session/node/' + models.node.Node + '?dc=' + models.dc).then(function(data) {
|
||||
models.sessions = data
|
||||
return models
|
||||
});
|
||||
},
|
||||
|
||||
setupController: function(controller, models) {
|
||||
controller.set('content', models.node);
|
||||
controller.set('sessions', models.sessions);
|
||||
//
|
||||
// Since we have 2 column layout, we need to also display the
|
||||
// list of nodes on the left. Hence setting the attribute
|
||||
|
|
0
ui/javascripts/app/untitled
Normal file
0
ui/javascripts/app/untitled
Normal file
|
@ -81,4 +81,11 @@
|
|||
padding: 8px;
|
||||
}
|
||||
|
||||
&.btn-list {
|
||||
font-size: 10px;
|
||||
padding: 3px 5px 3px 5px;
|
||||
margin-right: 5px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -45,17 +45,22 @@
|
|||
background-color: lighten($gray-background, 8%);
|
||||
}
|
||||
|
||||
&.list-condensed-link {
|
||||
&.list-condensed-link, &.list-condensed {
|
||||
border-color: $gray-background;
|
||||
margin-bottom: 4px;
|
||||
margin-top: 4px;
|
||||
|
||||
height: 40px;
|
||||
|
||||
&.double-line {
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
font-weight: 700;
|
||||
|
||||
.name {
|
||||
font-size: 15px;
|
||||
padding-top: 7px;
|
||||
padding-top: 6px;
|
||||
|
||||
small {
|
||||
padding-right: 8px;
|
||||
|
@ -64,6 +69,16 @@
|
|||
color: $gray-light;
|
||||
}
|
||||
}
|
||||
|
||||
ul.sub {
|
||||
li {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
color: $gray-light;
|
||||
}
|
||||
}
|
||||
|
||||
.list-bar-horizontal {
|
||||
|
|
|
@ -10,6 +10,32 @@
|
|||
border-color: $gray-background;
|
||||
}
|
||||
|
||||
h4.panel-title {
|
||||
padding: 4px 10px 4px 10px;
|
||||
font-size: 20px;
|
||||
color: $gray-light;
|
||||
color: $gray-darker;
|
||||
border-radius: 3px;
|
||||
opacity: 0.8;
|
||||
|
||||
small {
|
||||
font-size: 14px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
margin-left: 5px;
|
||||
padding-top: 2px;
|
||||
}
|
||||
|
||||
.panel-note {
|
||||
margin-top: 5px;
|
||||
float: right;
|
||||
font-weight: 600;
|
||||
color: $gray-light;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
h3.panel-title {
|
||||
padding: 4px 0px 4px 0px;
|
||||
font-size: 20px;
|
||||
|
|
|
@ -107,6 +107,7 @@ a {
|
|||
.ember-list-view {
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.ember-list-item-view {
|
||||
|
@ -117,4 +118,5 @@ a {
|
|||
.scrollable {
|
||||
overflow: auto;
|
||||
height: 800px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue