rewrote blacklist UI, fixed delete functions on rest of UI, closes #905

pull/924/head
Justin Richer 2015-10-02 18:37:57 -04:00
parent 43e9fbc29c
commit 3c222b0d79
13 changed files with 285 additions and 141 deletions

View File

@ -30,6 +30,7 @@
<script type="text/javascript" src="resources/js/dynreg.js"></script>
<script type="text/javascript" src="resources/js/rsreg.js"></script>
<script type="text/javascript" src="resources/js/token.js"></script>
<script type="text/javascript" src="resources/js/blacklist.js"></script>
<script type="text/javascript" src="resources/js/admin.js"></script>
</c:if>
<script type="text/javascript" src="resources/js/lib/retina.js"></script>

View File

@ -92,7 +92,8 @@ var ListWidgetChildView = Backbone.View.extend({
e.stopImmediatePropagation();
//this.$el.tooltip('delete');
this.model.destroy({
this.model.destroy({
dataType: false, processData: false,
error:function (error, response) {
console.log("An error occurred when deleting from a list widget");
@ -164,8 +165,6 @@ var ListWidgetView = Backbone.View.extend({
tagName: "div",
childView:ListWidgetChildView,
events:{
"click .btn-add-list-item":"addItem",
"keypress":function (e) {
@ -225,7 +224,7 @@ var ListWidgetView = Backbone.View.extend({
this.$el.html(this.template({placeholder:this.options.placeholder,
helpBlockText:this.options.helpBlockText}));
_self = this;
var _self = this;
if (_.size(this.collection.models) == 0 && _.size(this.options.autocomplete) == 0) {
$("tbody", _self.el).html($('#tmpl-list-widget-child-empty').html());
@ -255,7 +254,7 @@ var ListWidgetView = Backbone.View.extend({
checked = false;
}
var el = new this.childView({model:model, toggle: true, checked: checked, collection: _self.collection}).render().el;
var el = new ListWidgetChildView({model:model, toggle: true, checked: checked, collection: _self.collection}).render().el;
$("tbody", _self.el).append(el);
}, this);
@ -264,8 +263,7 @@ var ListWidgetView = Backbone.View.extend({
// now render everything not in the autocomplete list
_.each(values.models, function (model) {
var el = new this.childView({model:model, collection: _self.collection}).render().el;
var el = new ListWidgetChildView({model:model, collection: _self.collection}).render().el;
$("tbody", _self.el).append(el);
}, this);
}
@ -276,18 +274,6 @@ var ListWidgetView = Backbone.View.extend({
});
var BlackListModel = Backbone.Model.extend({
idAttribute: 'id',
urlRoot: 'api/blacklist'
});
var BlackListCollection = Backbone.Collection.extend({
initialize: function() { },
url: "api/blacklist"
});
var BreadCrumbView = Backbone.View.extend({
tagName: 'ul',
@ -328,125 +314,6 @@ var BreadCrumbView = Backbone.View.extend({
});
var BlackListListView = Backbone.View.extend({
tagName: 'span',
initialize:function(options) {
this.options = options;
if (!this.template) {
this.template = _.template($('#tmpl-blacklist-form').html());
}
},
load:function(callback) {
if (this.model.isFetched) {
callback();
return;
}
$('#loadingbox').sheet('show');
$('#loading').html(
'<span class="label" id="loading-blacklist">' + $.t('admin.blacklist') + '</span> '
);
$.when(this.model.fetchIfNeeded()).done(function() {
$('#loading-blacklist').addClass('label-success');
$('#loadingbox').sheet('hide');
callback();
});
},
events: {
"click .refresh-table":"refreshTable"
},
refreshTable:function(e) {
e.preventDefault();
var _self = this;
$('#loadingbox').sheet('show');
$('#loading').html(
'<span class="label" id="loading-blacklist">' + $.t('admin.blacklist') + '</span> '
);
$.when(this.model.fetch()).done(function() {
$('#loadingbox').sheet('hide');
_self.render();
});
},
render:function (eventName) {
$(this.el).html(this.template(this.model.toJSON()));
$('#blacklist .controls', this.el).html(new BlackListWidgetView({
type: 'uri',
placeholder: 'http://',
collection: this.model
}).render().el);
$(this.el).i18n();
return this;
}
});
var BlackListWidgetView = ListWidgetView.extend({
childView: ListWidgetChildView.extend({
render:function(options) {
this.options = options;
var uri = this.model.get('uri');
this.$el.html(this.template({item: uri}));
if (uri.length > 30) {
this.$el.tooltip({title:uri});
}
return this;
}
}),
addItem:function(e) {
e.preventDefault();
var input_value = $("input", this.el).val().trim();
if (input_value === "") {
return;
}
// TODO: URI/pattern validation, check against existing clients
var item = new BlackListModel({
uri: input_value
});
var _self = this; // closures...
item.save({}, {
success:function() {
_self.collection.add(item);
},
error:function(error, response) {
//Pull out the response text.
var responseJson = JSON.parse(response.responseText);
//Display an alert with an error message
$('#modalAlert div.modal-header').html(responseJson.error);
$('#modalAlert div.modal-body').html(responseJson.error_description);
$("#modalAlert").modal({ // wire up the actual modal functionality and show the dialog
"backdrop" : "static",
"keyboard" : true,
"show" : true // ensure the modal is shown immediately
});
}
});
}
});
// Stats table
var StatsModel = Backbone.Model.extend({
@ -856,7 +723,7 @@ var AppRouter = Backbone.Router.extend({
this.updateSidebar('admin/blacklist');
var view = new BlackListListView({model:this.blackListList});
var view = new BlackListListView({collection: this.blackListList});
view.load(
function(collection, response, options) {
@ -1129,7 +996,8 @@ $(function () {
$.get('resources/template/whitelist.html', _load),
$.get('resources/template/dynreg.html', _load),
$.get('resources/template/rsreg.html', _load),
$.get('resources/template/token.html', _load)
$.get('resources/template/token.html', _load),
$.get('resources/template/blacklist.html', _load)
).done(function() {
$.ajaxSetup({cache:false});
app = new AppRouter();

View File

@ -0,0 +1,195 @@
var BlackListModel = Backbone.Model.extend({
idAttribute: 'id',
urlRoot: 'api/blacklist'
});
var BlackListCollection = Backbone.Collection.extend({
initialize: function() { },
url: "api/blacklist"
});
var BlackListListView = Backbone.View.extend({
tagName: 'span',
initialize:function(options) {
this.options = options;
},
load:function(callback) {
if (this.collection.isFetched) {
callback();
return;
}
$('#loadingbox').sheet('show');
$('#loading').html(
'<span class="label" id="loading-blacklist">' + $.t('admin.blacklist') + '</span> '
);
$.when(this.collection.fetchIfNeeded({success:function(e) {$('#loading-blacklist').addClass('label-success');}}))
.done(function() {
$('#loadingbox').sheet('hide');
callback();
});
},
events: {
"click .refresh-table":"refreshTable",
"click .btn-add":"addItem",
"submit #add-blacklist form":"addItem"
},
refreshTable:function(e) {
e.preventDefault();
var _self = this;
$('#loadingbox').sheet('show');
$('#loading').html(
'<span class="label" id="loading-blacklist">' + $.t('admin.blacklist') + '</span> '
);
$.when(this.collection.fetch()).done(function() {
$('#loadingbox').sheet('hide');
_self.render();
});
},
togglePlaceholder:function() {
if (this.collection.length > 0) {
$('#blacklist-table', this.el).show();
$('#blacklist-table-empty', this.el).hide();
} else {
$('#blacklist-table', this.el).hide();
$('#blacklist-table-empty', this.el).show();
}
},
render:function (eventName) {
$(this.el).html($('#tmpl-blacklist-table').html());
var _self = this;
_.each(this.collection.models, function(blacklist) {
var view = new BlackListWidgetView({model: blacklist});
view.parentView = _self;
$("#blacklist-table", _self.el).append(view.render().el);
}, this);
this.togglePlaceholder();
$(this.el).i18n();
return this;
},
addItem:function(e) {
e.preventDefault();
var input_value = $("#blacklist-uri", this.el).val().trim();
if (input_value === "") {
return;
}
// TODO: URI/pattern validation, check against existing clients
var item = new BlackListModel({
uri: input_value
});
var _self = this; // closures...
item.save({}, {
success:function() {
_self.collection.add(item);
_self.render();
},
error:function(error, response) {
//Pull out the response text.
var responseJson = JSON.parse(response.responseText);
//Display an alert with an error message
$('#modalAlert div.modal-header').html(responseJson.error);
$('#modalAlert div.modal-body').html(responseJson.error_description);
$("#modalAlert").modal({ // wire up the actual modal functionality and show the dialog
"backdrop" : "static",
"keyboard" : true,
"show" : true // ensure the modal is shown immediately
});
}
});
}
});
var BlackListWidgetView = Backbone.View.extend({
tagName: 'tr',
initialize:function(options) {
this.options = options;
if (!this.template) {
this.template = _.template($('#tmpl-blacklist-item').html());
}
},
render:function() {
this.$el.html(this.template(this.model.toJSON()));
return this;
},
events:{
'click .btn-delete':'deleteBlacklist'
},
deleteBlacklist:function (e) {
e.preventDefault();
if (confirm($.t("blacklist.confirm"))) {
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade
$(this).slideUp("fast", function () { //slide up
$(this).remove(); //then remove from the DOM
_self.parentView.togglePlaceholder();
});
});
},
error:function (model, response) {
//Pull out the response text.
var responseJson = {error: 'Error', error_description: 'Error.'};
if (response) {
responseJson = JSON.parse(response.responseText);
}
//Display an alert with an error message
$('#modalAlert div.modal-header').html(responseJson.error);
$('#modalAlert div.modal-body').html(responseJson.error_description);
$("#modalAlert").modal({ // wire up the actual modal functionality and show the dialog
"backdrop" : "static",
"keyboard" : true,
"show" : true // ensure the modal is shown immediately
});
}
});
_self.parentView.delegateEvents();
}
return false;
}
});

View File

@ -363,6 +363,7 @@ var ClientView = Backbone.View.extend({
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade
$(this).slideUp("fast", function () { //slide up

View File

@ -232,6 +232,7 @@ var DynRegEditView = Backbone.View.extend({
var self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
self.remove();
app.navigate('dev/dynreg', {trigger: true});

View File

@ -218,6 +218,7 @@ var ApprovedSiteView = Backbone.View.extend({
var self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
self.$el.fadeTo("fast", 0.00, function () { //fade
$(this).slideUp("fast", function () { //slide up

View File

@ -197,6 +197,7 @@ var ResRegEditView = Backbone.View.extend({
var self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
self.remove();
app.navigate('dev/resource', {trigger: true});

View File

@ -113,6 +113,7 @@ var SystemScopeView = Backbone.View.extend({
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade

View File

@ -106,6 +106,7 @@ var AccessTokenView = Backbone.View.extend({
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade
@ -257,6 +258,7 @@ var RefreshTokenView = Backbone.View.extend({
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade

View File

@ -186,6 +186,7 @@ var WhiteListView = Backbone.View.extend({
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade
$(this).slideUp("fast", function () { //slide up

View File

@ -0,0 +1,69 @@
<!--
Copyright 2015 The MITRE Corporation
and the MIT Kerberos and Internet Trust Consortium
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<!-- blacklist -->
<script type="text/html" id="tmpl-blacklist-table">
<div class="well well-small">
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> <span data-i18n="common.refresh">Refresh</span></button> &nbsp;
</div>
<div class="alert alert-danger" data-i18n="blacklist.text">
Blacklisted URIs cannot be used as redirect URIs by any registered clients, whether in the admin interface or in dynamic registration.
</div>
<div id="add-blacklist">
<form class="form-horizontal">
<fieldset>
<input type="text" id="blacklist-uri" placeholder="blacklist uri" data-i18n="[placeholder]blacklist.blacklist-uri-placeholder" />
<button class="btn btn-success btn-add"><i class="icon-plus icon-white"></i> <span data-i18n="blacklist.add">Add URI to blacklist</span></button>
</fieldset>
</form>
</div>
<div id="blacklist-table-empty" class="alert alert-info" data-i18n="blacklist.empty">
There are no blacklisted URIs on this server.
</div>
<table id="blacklist-table" class="table table-hover table-striped">
<thead>
<tr>
<th data-i18n="blacklist.uri">URI</th>
<th></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div class="well well-small">
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> <span data-i18n="common.refresh">Refresh</span></button> &nbsp;
</div>
</script>
<script type="text/html" id="tmpl-blacklist-item">
<td>
<span class="label label-important"><%- uri %></span>
</td>
<td>
<div class="btn-group pull-right">
<button class="btn btn-danger btn-delete"><i class="icon-trash icon-white"></i> <span data-i18n="common.delete">Delete</span></button>
</div>
</td>
</script>

View File

@ -92,7 +92,8 @@ var ListWidgetChildView = Backbone.View.extend({
e.stopImmediatePropagation();
//this.$el.tooltip('delete');
this.model.destroy({
this.model.destroy({
dataType: false, processData: false,
error:function (error, response) {
console.log("An error occurred when deleting from a list widget");

View File

@ -187,6 +187,7 @@ var ResourceSetView = Backbone.View.extend({
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade
$(this).slideUp("fast", function () { //slide up
@ -349,6 +350,7 @@ var PolicyView = Backbone.View.extend({
if (confirm($.t('policy.policy-table.confirm'))) {
var _self = this;
this.model.destroy({
dataType: false, processData: false,
success:function () {
_self.$el.fadeTo("fast", 0.00, function () { //fade
$(this).slideUp("fast", function () { //slide up