refactored javascript and template files into components
Justin Richer
parent
137e5e5ca1
commit
991f37a1e6
|
|
@ -5,9 +5,9 @@
|
||||||
================================================== -->
|
================================================== -->
|
||||||
<!-- Placed at the end of the document so the pages load faster -->
|
<!-- Placed at the end of the document so the pages load faster -->
|
||||||
<script type="text/javascript" src="resources/bootstrap2/js/bootstrap.js"></script>
|
<script type="text/javascript" src="resources/bootstrap2/js/bootstrap.js"></script>
|
||||||
<script type="text/javascript" src="resources/js/underscore.js"></script>
|
<script type="text/javascript" src="resources/js/lib/underscore.js"></script>
|
||||||
<script type="text/javascript" src="resources/js/backbone.js"></script>
|
<script type="text/javascript" src="resources/js/lib/backbone.js"></script>
|
||||||
<script type="text/javascript" src="resources/js/purl.js"></script>
|
<script type="text/javascript" src="resources/js/lib/purl.js"></script>
|
||||||
<c:if test="${js != null && js != ''}">
|
<c:if test="${js != null && js != ''}">
|
||||||
<script type="text/javascript" src="${js}"></script>
|
<script type="text/javascript" src="${js}"></script>
|
||||||
</c:if>
|
</c:if>
|
||||||
|
|
|
||||||
|
|
@ -52,7 +52,7 @@
|
||||||
<link rel="apple-touch-icon-precomposed" href="../bootstrap2/ico/apple-touch-icon-57-precomposed.png">
|
<link rel="apple-touch-icon-precomposed" href="../bootstrap2/ico/apple-touch-icon-57-precomposed.png">
|
||||||
|
|
||||||
<!-- Load jQuery up here so that we can use in-page functions -->
|
<!-- Load jQuery up here so that we can use in-page functions -->
|
||||||
<script type="text/javascript" src="resources/js/jquery.js"></script>
|
<script type="text/javascript" src="resources/js/lib/jquery.js"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,451 @@
|
||||||
|
var ClientModel = Backbone.Model.extend({
|
||||||
|
|
||||||
|
idAttribute: "id",
|
||||||
|
|
||||||
|
initialize: function () {
|
||||||
|
|
||||||
|
// bind validation errors to dom elements
|
||||||
|
// this will display form elements in red if they are not valid
|
||||||
|
this.bind('error', function(model, errs) {
|
||||||
|
_.map(errs, function (val, elID) {
|
||||||
|
$('#' + elID).addClass('error');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
// We can pass it default values.
|
||||||
|
defaults:{
|
||||||
|
id:null,
|
||||||
|
idTokenValiditySeconds: 600,
|
||||||
|
clientName:"",
|
||||||
|
clientSecret:"",
|
||||||
|
registeredRedirectUri:[],
|
||||||
|
authorizedGrantTypes:["authorization_code"],
|
||||||
|
scope:[],
|
||||||
|
authorities:[],
|
||||||
|
clientDescription:"",
|
||||||
|
logoUrl:"",
|
||||||
|
clientId:"",
|
||||||
|
allowRefresh:false,
|
||||||
|
accessTokenValiditySeconds: 3600,
|
||||||
|
refreshTokenValiditySeconds: 604800,
|
||||||
|
displayClientSecret: false,
|
||||||
|
generateClientSecret: false,
|
||||||
|
requireClientSecret: true,
|
||||||
|
allowIntrospection: false
|
||||||
|
},
|
||||||
|
|
||||||
|
urlRoot:"api/clients"
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var ClientCollection = Backbone.Collection.extend({
|
||||||
|
|
||||||
|
initialize: function() {
|
||||||
|
//this.fetch();
|
||||||
|
},
|
||||||
|
|
||||||
|
model:ClientModel,
|
||||||
|
url:"api/clients",
|
||||||
|
|
||||||
|
getByClientId: function(clientId) {
|
||||||
|
var clients = this.where({clientId: clientId});
|
||||||
|
if (clients.length == 1) {
|
||||||
|
return clients[0];
|
||||||
|
} else {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var ClientView = Backbone.View.extend({
|
||||||
|
|
||||||
|
tagName: 'tr',
|
||||||
|
|
||||||
|
initialize:function () {
|
||||||
|
|
||||||
|
if (!this.template) {
|
||||||
|
this.template = _.template($('#tmpl-client').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!this.scopeTemplate) {
|
||||||
|
this.scopeTemplate = _.template($('#tmpl-scope-list').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
this.model.bind('change', this.render, this);
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function (eventName) {
|
||||||
|
this.$el.html(this.template(this.model.toJSON()));
|
||||||
|
|
||||||
|
$('.scope-list', this.el).html(this.scopeTemplate({scopes: this.model.get('scope'), systemScopes: app.systemScopeList}));
|
||||||
|
|
||||||
|
this.$('.dynamically-registered').tooltip({title: 'This client was dynamically registered'});
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
events:{
|
||||||
|
"click .btn-edit":"editClient",
|
||||||
|
"click .btn-delete":"deleteClient",
|
||||||
|
"click .btn-whitelist":"whiteListClient"
|
||||||
|
},
|
||||||
|
|
||||||
|
editClient:function () {
|
||||||
|
app.navigate('admin/client/' + this.model.id, {trigger: true});
|
||||||
|
},
|
||||||
|
|
||||||
|
whiteListClient:function() {
|
||||||
|
var whiteList = app.whiteListList.getByClientId(this.model.get('clientId'));
|
||||||
|
if (whiteList == null) {
|
||||||
|
// create a new one
|
||||||
|
app.navigate('admin/whitelist/new/' + this.model.id, {trigger: true});
|
||||||
|
} else {
|
||||||
|
// edit the existing one
|
||||||
|
app.navigate('admin/whitelist/' + whiteList.id, {trigger: true});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
deleteClient:function () {
|
||||||
|
|
||||||
|
if (confirm("Are you sure sure you would like to delete this client?")) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.model.destroy({
|
||||||
|
success:function () {
|
||||||
|
self.$el.fadeTo("fast", 0.00, function () { //fade
|
||||||
|
$(this).slideUp("fast", function () { //slide up
|
||||||
|
$(this).remove(); //then remove from the DOM
|
||||||
|
app.clientListView.togglePlaceholder();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
app.clientListView.delegateEvents();
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
close:function () {
|
||||||
|
$(this.el).unbind();
|
||||||
|
$(this.el).empty();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var ClientListView = Backbone.View.extend({
|
||||||
|
|
||||||
|
tagName: 'span',
|
||||||
|
|
||||||
|
initialize:function () {
|
||||||
|
//this.model.bind("reset", this.render, this);
|
||||||
|
},
|
||||||
|
|
||||||
|
events:{
|
||||||
|
"click .new-client":"newClient",
|
||||||
|
"click .refresh-table":"refreshTable"
|
||||||
|
},
|
||||||
|
|
||||||
|
newClient:function () {
|
||||||
|
this.remove();
|
||||||
|
app.navigate('admin/client/new', {trigger: true});
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function (eventName) {
|
||||||
|
|
||||||
|
// append and render table structure
|
||||||
|
$(this.el).html($('#tmpl-client-table').html());
|
||||||
|
|
||||||
|
_.each(this.model.models, function (client) {
|
||||||
|
$("#client-table",this.el).append(new ClientView({model:client}).render().el);
|
||||||
|
}, this);
|
||||||
|
|
||||||
|
this.togglePlaceholder();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
togglePlaceholder:function() {
|
||||||
|
if (this.model.length > 0) {
|
||||||
|
$('#client-table', this.el).show();
|
||||||
|
$('#client-table-empty', this.el).hide();
|
||||||
|
} else {
|
||||||
|
$('#client-table', this.el).hide();
|
||||||
|
$('#client-table-empty', this.el).show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
refreshTable:function() {
|
||||||
|
var _self = this;
|
||||||
|
this.model.fetch({
|
||||||
|
success: function() {
|
||||||
|
_self.render();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var ClientFormView = Backbone.View.extend({
|
||||||
|
|
||||||
|
tagName:"span",
|
||||||
|
|
||||||
|
initialize:function () {
|
||||||
|
|
||||||
|
if (!this.template) {
|
||||||
|
this.template = _.template($('#tmpl-client-form').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
this.registeredRedirectUriCollection = new Backbone.Collection();
|
||||||
|
this.scopeCollection = new Backbone.Collection();
|
||||||
|
},
|
||||||
|
|
||||||
|
events:{
|
||||||
|
"click .btn-save":"saveClient",
|
||||||
|
"click #allowRefresh" : "toggleRefreshTokenTimeout",
|
||||||
|
"click #disableAccessTokenTimeout" : function(){ $("#access-token-timeout-seconds", this.$el).prop('disabled',!$("#access-token-timeout-seconds", this.$el).prop('disabled')); },
|
||||||
|
"click #disableIDTokenTimeout" : function(){ $("#id-token-timeout-seconds", this.$el).prop('disabled',!$("#id-token-timeout-seconds", this.$el).prop('disabled')); },
|
||||||
|
"click #disableRefreshTokenTimeout" : function(){ $("#refresh-token-timeout-seconds", this.$el).prop('disabled',!$("#refresh-token-timeout-seconds", this.$el).prop('disabled')); },
|
||||||
|
"click .btn-cancel": function() { window.history.back(); return false; },
|
||||||
|
"change #requireClientSecret":"toggleRequireClientSecret",
|
||||||
|
"change #displayClientSecret":"toggleDisplayClientSecret",
|
||||||
|
"change #generateClientSecret":"toggleGenerateClientSecret",
|
||||||
|
"change #logoUrl input":"previewLogo"
|
||||||
|
},
|
||||||
|
|
||||||
|
toggleRefreshTokenTimeout:function () {
|
||||||
|
$("#refreshTokenValiditySeconds", this.$el).toggle();
|
||||||
|
},
|
||||||
|
|
||||||
|
previewLogo:function(event) {
|
||||||
|
if ($('#logoUrl input', this.el).val()) {
|
||||||
|
$('#logoPreview', this.el).empty();
|
||||||
|
$('#logoPreview', this.el).attr('src', $('#logoUrl input').val());
|
||||||
|
} else {
|
||||||
|
$('#logoBlock', this.el).hide();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set up the form based on the current state of the requireClientSecret checkbox parameter
|
||||||
|
* @param event
|
||||||
|
*/
|
||||||
|
toggleRequireClientSecret:function(event) {
|
||||||
|
|
||||||
|
if ($('#requireClientSecret input', this.el).is(':checked')) {
|
||||||
|
// client secret is required, show all the bits
|
||||||
|
$('#clientSecretPanel', this.el).show();
|
||||||
|
// this function sets up the display portions
|
||||||
|
this.toggleGenerateClientSecret();
|
||||||
|
} else {
|
||||||
|
// no client secret, hide all the bits
|
||||||
|
$('#clientSecretPanel', this.el).hide();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set up the form based on the "Generate" checkbox
|
||||||
|
* @param event
|
||||||
|
*/
|
||||||
|
toggleGenerateClientSecret:function(event) {
|
||||||
|
|
||||||
|
if ($('#generateClientSecret input', this.el).is(':checked')) {
|
||||||
|
// show the "generated" block, hide the "display" checkbox
|
||||||
|
$('#displayClientSecret', this.el).hide();
|
||||||
|
$('#clientSecret', this.el).hide();
|
||||||
|
$('#clientSecretGenerated', this.el).show();
|
||||||
|
$('#clientSecretHidden', this.el).hide();
|
||||||
|
} else {
|
||||||
|
// show the display checkbox, fall back to the "display" logic
|
||||||
|
$('#displayClientSecret', this.el).show();
|
||||||
|
this.toggleDisplayClientSecret(event);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Handle whether or not to display the client secret
|
||||||
|
* @param event
|
||||||
|
*/
|
||||||
|
toggleDisplayClientSecret:function(event) {
|
||||||
|
|
||||||
|
if ($('#displayClientSecret input').is(':checked')) {
|
||||||
|
// want to display it
|
||||||
|
$('#clientSecret', this.el).show();
|
||||||
|
$('#clientSecretHidden', this.el).hide();
|
||||||
|
$('#clientSecretGenerated', this.el).hide();
|
||||||
|
} else {
|
||||||
|
// want to hide it
|
||||||
|
$('#clientSecret', this.el).hide();
|
||||||
|
$('#clientSecretHidden', this.el).show();
|
||||||
|
$('#clientSecretGenerated', this.el).hide();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
getFormTokenValue:function(value) {
|
||||||
|
if (value == "") return null;
|
||||||
|
else return value;
|
||||||
|
},
|
||||||
|
|
||||||
|
// maps from a form-friendly name to the real grant parameter name
|
||||||
|
authorizedGrantMap:{
|
||||||
|
"authorization_code": "authorization_code",
|
||||||
|
"password": "password",
|
||||||
|
"implicit": "implicit",
|
||||||
|
"client_credentials": "client_credentials",
|
||||||
|
"redelegate": "urn:ietf:params:oauth:grant_type:redelegate",
|
||||||
|
"refresh_token": "refresh_token"
|
||||||
|
},
|
||||||
|
|
||||||
|
saveClient:function (event) {
|
||||||
|
|
||||||
|
$('.control-group').removeClass('error');
|
||||||
|
|
||||||
|
// build the scope object
|
||||||
|
var scopes = this.scopeCollection.pluck("item");
|
||||||
|
|
||||||
|
// build the grant type object
|
||||||
|
var authorizedGrantTypes = [];
|
||||||
|
$.each(this.authorizedGrantMap, function(index,type) {
|
||||||
|
if ($('#authorizedGrantTypes-' + index).is(':checked')) {
|
||||||
|
authorizedGrantTypes.push(type);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var requireClientSecret = $('#requireClientSecret input').is(':checked');
|
||||||
|
var generateClientSecret = $('#generateClientSecret input').is(':checked');
|
||||||
|
var clientSecret = null;
|
||||||
|
|
||||||
|
if (requireClientSecret && !generateClientSecret) {
|
||||||
|
// if it's required but we're not generating it, send the value
|
||||||
|
clientSecret = $('#clientSecret input').val();
|
||||||
|
}
|
||||||
|
|
||||||
|
var accessTokenValiditySeconds = null;
|
||||||
|
if (!$('disableAccessTokenTimeout').is(':checked')) {
|
||||||
|
accessTokenValiditySeconds = this.getFormTokenValue($('#accessTokenValiditySeconds input[type=text]').val());
|
||||||
|
}
|
||||||
|
|
||||||
|
var idTokenValiditySeconds = null;
|
||||||
|
if (!$('disableIDTokenTimeout').is(':checked')) {
|
||||||
|
idTokenValiditySeconds = this.getFormTokenValue($('#idTokenValiditySeconds input[type=text]').val());
|
||||||
|
}
|
||||||
|
|
||||||
|
var refreshTokenValiditySeconds = null;
|
||||||
|
if ($('#allowRefresh').is(':checked')) {
|
||||||
|
|
||||||
|
if ($.inArray('refresh_token', authorizedGrantTypes) == -1) {
|
||||||
|
authorizedGrantTypes.push('refresh_token');
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($.inArray('offline_access', scopes) == -1) {
|
||||||
|
scopes.push("offline_access");
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!$('disableRefreshTokenTimeout').is(':checked')) {
|
||||||
|
refreshTokenValiditySeconds = this.getFormTokenValue($('#refreshTokenValiditySeconds input[type=text]').val());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var valid = this.model.set({
|
||||||
|
clientName:$('#clientName input').val(),
|
||||||
|
clientId:$('#clientId input').val(),
|
||||||
|
clientSecret: clientSecret,
|
||||||
|
generateClientSecret:generateClientSecret,
|
||||||
|
registeredRedirectUri: this.registeredRedirectUriCollection.pluck("item"),
|
||||||
|
clientDescription:$('#clientDescription textarea').val(),
|
||||||
|
logoUrl:$('#logoUrl input').val(),
|
||||||
|
authorizedGrantTypes: authorizedGrantTypes,
|
||||||
|
accessTokenValiditySeconds: accessTokenValiditySeconds,
|
||||||
|
refreshTokenValiditySeconds: refreshTokenValiditySeconds,
|
||||||
|
idTokenValiditySeconds: idTokenValiditySeconds,
|
||||||
|
allowRefresh: $('#allowRefresh').is(':checked'),
|
||||||
|
allowIntrospection: $('#allowIntrospection input').is(':checked'),
|
||||||
|
scope: scopes
|
||||||
|
});
|
||||||
|
|
||||||
|
// post-validate
|
||||||
|
// TODO: move these into the validation function somehow?
|
||||||
|
if (this.model.get("allowRefresh") == false) {
|
||||||
|
this.model.set("refreshTokenValiditySeconds",null);
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($('#disableIDTokenTimeout').is(':checked')) {
|
||||||
|
this.model.set("idTokenValiditySeconds",null);
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($('#disableAccessTokenTimeout').is(':checked')) {
|
||||||
|
this.model.set("accessTokenValiditySeconds",null);
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($('#disableRefreshTokenTimeout').is(':checked')) {
|
||||||
|
this.model.set("refreshTokenValiditySeconds",null);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (valid) {
|
||||||
|
|
||||||
|
var _self = this;
|
||||||
|
this.model.save({}, {
|
||||||
|
success:function () {
|
||||||
|
app.clientList.add(_self.model);
|
||||||
|
app.navigate('admin/clients', {trigger:true});
|
||||||
|
},
|
||||||
|
error:function (model,resp) {
|
||||||
|
console.error("Oops! The object didn't save correctly.",resp);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function (eventName) {
|
||||||
|
|
||||||
|
$(this.el).html(this.template(this.model.toJSON()));
|
||||||
|
|
||||||
|
|
||||||
|
var _self = this;
|
||||||
|
|
||||||
|
// build and bind registered redirect URI collection and view
|
||||||
|
_.each(this.model.get("registeredRedirectUri"), function (registeredRedirectUri) {
|
||||||
|
_self.registeredRedirectUriCollection.add(new URIModel({item:registeredRedirectUri}));
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#registeredRedirectUri .controls",this.el).html(new ListWidgetView({type:'uri', placeholder: 'http://',
|
||||||
|
collection: this.registeredRedirectUriCollection}).render().el);
|
||||||
|
|
||||||
|
_self = this;
|
||||||
|
// build and bind scopes
|
||||||
|
_.each(this.model.get("scope"), function (scope) {
|
||||||
|
_self.scopeCollection.add(new Backbone.Model({item:scope}));
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#scope .controls",this.el).html(new ListWidgetView({placeholder: 'new scope here'
|
||||||
|
, autocomplete: _.uniq(_.flatten(app.systemScopeList.pluck("value"))) // TODO: load from default scopes
|
||||||
|
, collection: this.scopeCollection}).render().el);
|
||||||
|
|
||||||
|
if (!this.model.get("allowRefresh")) {
|
||||||
|
$("#refreshTokenValiditySeconds", this.$el).hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.model.get("accessTokenValiditySeconds") == null) {
|
||||||
|
$("#access-token-timeout-seconds", this.$el).prop('disabled',true);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.model.get("refreshTokenValiditySeconds") == null) {
|
||||||
|
$("#refresh-token-timeout-seconds", this.$el).prop('disabled',true);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.model.get("idTokenValiditySeconds") == null) {
|
||||||
|
$("#id-token-timeout-seconds", this.$el).prop('disabled',true);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.toggleRequireClientSecret();
|
||||||
|
this.previewLogo();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,146 @@
|
||||||
|
var ApprovedSiteModel = Backbone.Model.extend({
|
||||||
|
idAttribute: 'id',
|
||||||
|
|
||||||
|
initialize: function() { },
|
||||||
|
|
||||||
|
urlRoot: 'api/approved'
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var ApprovedSiteCollection = Backbone.Collection.extend({
|
||||||
|
initialize: function() { },
|
||||||
|
|
||||||
|
model: ApprovedSiteModel,
|
||||||
|
url: 'api/approved'
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
var ApprovedSiteListView = Backbone.View.extend({
|
||||||
|
tagName: 'span',
|
||||||
|
|
||||||
|
initialize:function() { },
|
||||||
|
|
||||||
|
events: {
|
||||||
|
"click .refresh-table":"refreshTable"
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function (eventName) {
|
||||||
|
$(this.el).html($('#tmpl-grant-table').html());
|
||||||
|
|
||||||
|
_.each(this.model.models, function(approvedSite) {
|
||||||
|
// look up client
|
||||||
|
var client = app.clientList.getByClientId(approvedSite.get('clientId'));
|
||||||
|
|
||||||
|
if (client != null) {
|
||||||
|
|
||||||
|
if (approvedSite.get('whitelistedSite') != null) {
|
||||||
|
$('#grant-whitelist-table', this.el).append(new ApprovedSiteView({model: approvedSite, client: client}).render().el);
|
||||||
|
} else {
|
||||||
|
$('#grant-table', this.el).append(new ApprovedSiteView({model: approvedSite, client: client}).render().el);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}, this);
|
||||||
|
|
||||||
|
this.togglePlaceholder();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
togglePlaceholder:function() {
|
||||||
|
// count the whitelisted and non-whitelisted entries
|
||||||
|
var wl = 0;
|
||||||
|
var gr = 0;
|
||||||
|
for (var i = 0; i < this.model.length; i++) {
|
||||||
|
if (this.model.at(i).get('whitelistedSite') != null) {
|
||||||
|
wl += 1;
|
||||||
|
} else {
|
||||||
|
gr += 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (wl > 0) {
|
||||||
|
$('#grant-whitelist-table', this.el).show();
|
||||||
|
$('#grant-whitelist-table-empty', this.el).hide();
|
||||||
|
} else {
|
||||||
|
$('#grant-whitelist-table', this.el).hide();
|
||||||
|
$('#grant-whitelist-table-empty', this.el).show();
|
||||||
|
}
|
||||||
|
if (gr > 0) {
|
||||||
|
$('#grant-table', this.el).show();
|
||||||
|
$('#grant-table-empty', this.el).hide();
|
||||||
|
} else {
|
||||||
|
$('#grant-table', this.el).hide();
|
||||||
|
$('#grant-table-empty', this.el).show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
refreshTable:function() {
|
||||||
|
var _self = this;
|
||||||
|
this.model.fetch({
|
||||||
|
success: function() {
|
||||||
|
_self.render();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var ApprovedSiteView = Backbone.View.extend({
|
||||||
|
tagName: 'tr',
|
||||||
|
|
||||||
|
initialize: function() {
|
||||||
|
if (!this.template) {
|
||||||
|
this.template = _.template($('#tmpl-grant').html());
|
||||||
|
}
|
||||||
|
if (!this.scopeTemplate) {
|
||||||
|
this.scopeTemplate = _.template($('#tmpl-scope-list').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
render: function() {
|
||||||
|
var json = {grant: this.model.toJSON(), client: this.options.client.toJSON()};
|
||||||
|
|
||||||
|
this.$el.html(this.template(json));
|
||||||
|
|
||||||
|
$('.scope-list', this.el).html(this.scopeTemplate({scopes: this.options.client.get('scope'), systemScopes: app.systemScopeList}));
|
||||||
|
|
||||||
|
this.$('.dynamically-registered').tooltip({title: 'This client was dynamically registered'});
|
||||||
|
this.$('.whitelisted-site').tooltip({title: 'This site was whitelisted by an adminstrator'});
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
events: {
|
||||||
|
'click .btn-delete': 'deleteApprovedSite'
|
||||||
|
},
|
||||||
|
|
||||||
|
deleteApprovedSite:function() {
|
||||||
|
if (confirm("Are you sure you want to revoke access to this site?")) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.model.destroy({
|
||||||
|
success:function () {
|
||||||
|
self.$el.fadeTo("fast", 0.00, function () { //fade
|
||||||
|
$(this).slideUp("fast", function () { //slide up
|
||||||
|
$(this).remove(); //then remove from the DOM
|
||||||
|
app.approvedSiteListView.togglePlaceholder();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
app.approvedSiteListView.delegateEvents();
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
close:function() {
|
||||||
|
$(this.el).unbind();
|
||||||
|
$(this.el).empty();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
@ -0,0 +1,259 @@
|
||||||
|
var SystemScopeModel = Backbone.Model.extend({
|
||||||
|
idAttribute: 'id',
|
||||||
|
|
||||||
|
defaults:{
|
||||||
|
id:null,
|
||||||
|
description:null,
|
||||||
|
icon:null,
|
||||||
|
value:null,
|
||||||
|
defaultScope:false,
|
||||||
|
allowDynReg:false
|
||||||
|
},
|
||||||
|
|
||||||
|
urlRoot: 'api/scopes'
|
||||||
|
});
|
||||||
|
|
||||||
|
var SystemScopeCollection = Backbone.Collection.extend({
|
||||||
|
idAttribute: 'id',
|
||||||
|
|
||||||
|
model: SystemScopeModel,
|
||||||
|
|
||||||
|
url: 'api/scopes',
|
||||||
|
|
||||||
|
defaultScopes: function() {
|
||||||
|
filtered = this.filter(function(scope) {
|
||||||
|
return scope.get("defaultScope") === true;
|
||||||
|
});
|
||||||
|
return new SystemScopeCollection(filtered);
|
||||||
|
},
|
||||||
|
|
||||||
|
getByValue: function(value) {
|
||||||
|
var scopes = this.where({value: value});
|
||||||
|
if (scopes.length == 1) {
|
||||||
|
return scopes[0];
|
||||||
|
} else {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var SystemScopeView = Backbone.View.extend({
|
||||||
|
|
||||||
|
tagName: 'tr',
|
||||||
|
|
||||||
|
initialize:function () {
|
||||||
|
|
||||||
|
if (!this.template) {
|
||||||
|
this.template = _.template($('#tmpl-system-scope').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
this.model.bind('change', this.render, this);
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
events: {
|
||||||
|
'click .btn-edit':'editScope',
|
||||||
|
'click .btn-delete':'deleteScope'
|
||||||
|
},
|
||||||
|
|
||||||
|
editScope:function() {
|
||||||
|
app.navigate('admin/scope/' + this.model.id, {trigger: true});
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function (eventName) {
|
||||||
|
this.$el.html(this.template(this.model.toJSON()));
|
||||||
|
|
||||||
|
this.$('.dynamically-registered').tooltip({title: 'This client was dynamically registered'});
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
deleteScope:function () {
|
||||||
|
|
||||||
|
if (confirm("Are you sure sure you would like to delete this scope? Clients that have this scope will still be able to ask for it.")) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.model.destroy({
|
||||||
|
success:function () {
|
||||||
|
self.$el.fadeTo("fast", 0.00, function () { //fade
|
||||||
|
$(this).slideUp("fast", function () { //slide up
|
||||||
|
$(this).remove(); //then remove from the DOM
|
||||||
|
app.systemScopeListView.togglePlaceholder();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
app.systemScopeListView.delegateEvents();
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
close:function () {
|
||||||
|
$(this.el).unbind();
|
||||||
|
$(this.el).empty();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var SystemScopeListView = Backbone.View.extend({
|
||||||
|
tagName: 'span',
|
||||||
|
|
||||||
|
events:{
|
||||||
|
"click .new-scope":"newScope",
|
||||||
|
"click .refresh-table":"refreshTable"
|
||||||
|
},
|
||||||
|
|
||||||
|
newScope:function() {
|
||||||
|
this.remove();
|
||||||
|
app.navigate('admin/scope/new', {trigger: true});
|
||||||
|
},
|
||||||
|
|
||||||
|
refreshTable:function() {
|
||||||
|
var _self = this;
|
||||||
|
this.model.fetch({
|
||||||
|
success: function() {
|
||||||
|
_self.render();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
togglePlaceholder:function() {
|
||||||
|
if (this.model.length > 0) {
|
||||||
|
$('#scope-table', this.el).show();
|
||||||
|
$('#scope-table-empty', this.el).hide();
|
||||||
|
} else {
|
||||||
|
$('#scope-table', this.el).hide();
|
||||||
|
$('#scope-table-empty', this.el).show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
render: function (eventName) {
|
||||||
|
|
||||||
|
// append and render the table structure
|
||||||
|
$(this.el).html($('#tmpl-system-scope-table').html());
|
||||||
|
|
||||||
|
_.each(this.model.models, function (scope) {
|
||||||
|
$("#scope-table", this.el).append(new SystemScopeView({model: scope}).render().el);
|
||||||
|
}, this);
|
||||||
|
|
||||||
|
this.togglePlaceholder();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var SystemScopeFormView = Backbone.View.extend({
|
||||||
|
tagName: 'span',
|
||||||
|
|
||||||
|
initialize:function() {
|
||||||
|
if (!this.template) {
|
||||||
|
this.template = _.template($('#tmpl-system-scope-form').html());
|
||||||
|
}
|
||||||
|
if (!this.iconTemplate) {
|
||||||
|
this.iconTemplate = _.template($('#tmpl-system-scope-icon').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
// initialize our icon set into slices for the selector
|
||||||
|
if (!this.bootstrapIcons) {
|
||||||
|
this.bootstrapIcons = [];
|
||||||
|
|
||||||
|
var iconList = ['glass', 'music', 'search', 'envelope', 'heart', 'star',
|
||||||
|
'star-empty', 'user', 'film', 'th-large', 'th', 'th-list', 'ok',
|
||||||
|
'remove', 'zoom-in', 'zoom-out', 'off', 'signal', 'cog', 'trash',
|
||||||
|
'home', 'file', 'time', 'road', 'download-alt', 'download',
|
||||||
|
'upload', 'inbox', 'play-circle', 'repeat', 'refresh', 'list-alt',
|
||||||
|
'lock', 'flag', 'headphones', 'volume-off', 'volume-down',
|
||||||
|
'volume-up', 'qrcode', 'barcode', 'tag', 'tags', 'book',
|
||||||
|
'bookmark', 'print', 'camera', 'font', 'bold', 'italic',
|
||||||
|
'text-height', 'text-width', 'align-left', 'align-center',
|
||||||
|
'align-right', 'align-justify', 'list', 'indent-left',
|
||||||
|
'indent-right', 'facetime-video', 'picture', 'pencil',
|
||||||
|
'map-marker', 'tint', 'share', 'move', 'fast-backward', 'backward',
|
||||||
|
'pause', 'stop', 'forward', 'step-forward', 'eject',
|
||||||
|
'chevron-right', 'plus-sign', 'minus-sign', 'remove-sign',
|
||||||
|
'ok-sign', 'question-sign', 'info-sign', 'screenshot',
|
||||||
|
'remove-circle', 'ok-circle', 'ban-circle', 'arrow-left',
|
||||||
|
'arrow-right', 'arrow-down', 'share-alt', 'resize-full',
|
||||||
|
'resize-small', 'plus', 'asterisk', 'exclamation-sign', 'gift',
|
||||||
|
'leaf', 'fire', 'eye-close', 'plane', 'random', 'magnet',
|
||||||
|
'chevron-up', 'chevron-down', 'retweet', 'shopping-cart',
|
||||||
|
'folder-close', 'folder-open', 'resize-vertical',
|
||||||
|
'resize-horizontal', 'hdd', 'bell', 'thumbs-up', 'hand-right',
|
||||||
|
'hand-left', 'hand-down', 'circle-arrow-left', 'circle-arrow-up',
|
||||||
|
'circle-arrow-down', 'globe', 'tasks', 'briefcase' ];
|
||||||
|
|
||||||
|
var size = 3;
|
||||||
|
while (iconList.length > 0) {
|
||||||
|
this.bootstrapIcons.push(iconList.splice(0, size));
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
events:{
|
||||||
|
'click .btn-save':'saveScope',
|
||||||
|
'click .btn-cancel': function() {app.navigate('admin/scope', {trigger: true}); },
|
||||||
|
'click .btn-icon':'selectIcon'
|
||||||
|
},
|
||||||
|
|
||||||
|
saveScope:function(event) {
|
||||||
|
|
||||||
|
var value = $('#value input').val();
|
||||||
|
|
||||||
|
if (value == null || value.trim() == "") {
|
||||||
|
// error: can't have a blank scope
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
var valid = this.model.set({
|
||||||
|
value:value,
|
||||||
|
description:$('#description textarea').val(),
|
||||||
|
icon:$('#iconDisplay input').val(),
|
||||||
|
defaultScope:$('#defaultScope input').is(':checked'),
|
||||||
|
allowDynReg:$('#allowDynReg input').is(':checked')
|
||||||
|
});
|
||||||
|
|
||||||
|
if (valid) {
|
||||||
|
var _self = this;
|
||||||
|
this.model.save({}, {
|
||||||
|
success:function() {
|
||||||
|
app.systemScopeList.add(_self.model);
|
||||||
|
app.navigate('admin/scope', {trigger: true});
|
||||||
|
},
|
||||||
|
error:function(model,resp) {
|
||||||
|
console.error("The scope didn't save correctly.", resp);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
selectIcon:function(event) {
|
||||||
|
|
||||||
|
var icon = event.target.value;
|
||||||
|
|
||||||
|
$('#iconDisplay input').val(icon);
|
||||||
|
$('#iconDisplay span').html(icon);
|
||||||
|
$('#iconDisplay i').removeClass();
|
||||||
|
$('#iconDisplay i').addClass('icon-' + icon);
|
||||||
|
|
||||||
|
$('#iconSelector').modal('hide');
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
render: function(eventName) {
|
||||||
|
this.$el.html(this.template(this.model.toJSON()));
|
||||||
|
|
||||||
|
_.each(this.bootstrapIcons, function (items) {
|
||||||
|
$(".modal-body", this.el).append(this.iconTemplate({items:items}));
|
||||||
|
}, this);
|
||||||
|
|
||||||
|
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
@ -0,0 +1,223 @@
|
||||||
|
var WhiteListModel = Backbone.Model.extend({
|
||||||
|
|
||||||
|
idAttribute: "id",
|
||||||
|
|
||||||
|
initialize: function () { },
|
||||||
|
|
||||||
|
urlRoot: "api/whitelist"
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var WhiteListCollection = Backbone.Collection.extend({
|
||||||
|
initialize: function() {
|
||||||
|
//this.fetch();
|
||||||
|
},
|
||||||
|
|
||||||
|
getByClientId: function(clientId) {
|
||||||
|
var clients = this.where({clientId: clientId});
|
||||||
|
if (clients.length == 1) {
|
||||||
|
return clients[0];
|
||||||
|
} else {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
model: WhiteListModel,
|
||||||
|
url: "api/whitelist"
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var WhiteListListView = Backbone.View.extend({
|
||||||
|
tagName: 'span',
|
||||||
|
|
||||||
|
initialize:function () {
|
||||||
|
//this.model.bind("reset", this.render, this);
|
||||||
|
},
|
||||||
|
|
||||||
|
events:{
|
||||||
|
"click .refresh-table":"refreshTable"
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function (eventName) {
|
||||||
|
$(this.el).html($('#tmpl-whitelist-table').html());
|
||||||
|
|
||||||
|
_.each(this.model.models, function (whiteList) {
|
||||||
|
|
||||||
|
// look up client
|
||||||
|
var client = app.clientList.getByClientId(whiteList.get('clientId'));
|
||||||
|
|
||||||
|
// if there's no client ID, this is an error!
|
||||||
|
if (client != null) {
|
||||||
|
$('#whitelist-table', this.el).append(new WhiteListView({model: whiteList, client: client}).render().el);
|
||||||
|
}
|
||||||
|
|
||||||
|
}, this);
|
||||||
|
|
||||||
|
this.togglePlaceholder();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
togglePlaceholder:function() {
|
||||||
|
if (this.model.length > 0) {
|
||||||
|
$('#whitelist-table', this.el).show();
|
||||||
|
$('#whitelist-table-empty', this.el).hide();
|
||||||
|
} else {
|
||||||
|
$('#whitelist-table', this.el).hide();
|
||||||
|
$('#whitelist-table-empty', this.el).show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
refreshTable:function() {
|
||||||
|
var _self = this;
|
||||||
|
this.model.fetch({
|
||||||
|
success: function() {
|
||||||
|
_self.render();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var WhiteListView = Backbone.View.extend({
|
||||||
|
tagName: 'tr',
|
||||||
|
|
||||||
|
initialize:function() {
|
||||||
|
if (!this.template) {
|
||||||
|
this.template = _.template($('#tmpl-whitelist').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!this.scopeTemplate) {
|
||||||
|
this.scopeTemplate = _.template($('#tmpl-scope-list').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
this.model.bind('change', this.render, this);
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function(eventName) {
|
||||||
|
|
||||||
|
var json = {whiteList: this.model.toJSON(), client: this.options.client.toJSON()};
|
||||||
|
|
||||||
|
this.$el.html(this.template(json));
|
||||||
|
|
||||||
|
$('.scope-list', this.el).html(this.scopeTemplate({scopes: this.model.get('allowedScopes'), systemScopes: app.systemScopeList}));
|
||||||
|
|
||||||
|
this.$('.dynamically-registered').tooltip({title: 'This client was dynamically registered'});
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
events:{
|
||||||
|
'click .btn-edit': 'editWhitelist',
|
||||||
|
'click .btn-delete': 'deleteWhitelist'
|
||||||
|
},
|
||||||
|
|
||||||
|
editWhitelist:function() {
|
||||||
|
app.navigate('admin/whitelist/' + this.model.id, {trigger: true});
|
||||||
|
},
|
||||||
|
|
||||||
|
deleteWhitelist:function() {
|
||||||
|
|
||||||
|
if (confirm("Are you sure you want to delete this whitelist entry?")) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.model.destroy({
|
||||||
|
success:function () {
|
||||||
|
self.$el.fadeTo("fast", 0.00, function () { //fade
|
||||||
|
$(this).slideUp("fast", function () { //slide up
|
||||||
|
$(this).remove(); //then remove from the DOM
|
||||||
|
// check the placeholder in case it's empty now
|
||||||
|
app.whiteListListView.togglePlaceholder();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
app.whiteListListView.delegateEvents();
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
close:function() {
|
||||||
|
$(this.el).unbind();
|
||||||
|
$(this.el).empty();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var WhiteListFormView = Backbone.View.extend({
|
||||||
|
tagName: 'span',
|
||||||
|
|
||||||
|
initialize:function () {
|
||||||
|
if (!this.template) {
|
||||||
|
this.template = _.template($('#tmpl-whitelist-form').html());
|
||||||
|
}
|
||||||
|
|
||||||
|
this.scopeCollection = new Backbone.Collection();
|
||||||
|
},
|
||||||
|
|
||||||
|
events:{
|
||||||
|
'click .btn-save':'saveWhiteList',
|
||||||
|
'click .btn-cancel':'cancelWhiteList',
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
saveWhiteList:function (event) {
|
||||||
|
$('.control-group').removeClass('error');
|
||||||
|
|
||||||
|
// process allowed scopes
|
||||||
|
var allowedScopes = this.scopeCollection.pluck("item");
|
||||||
|
|
||||||
|
if (this.model.get('id') == null) {
|
||||||
|
this.model.set({clientId:$('#clientId input').val()});
|
||||||
|
}
|
||||||
|
|
||||||
|
var valid = this.model.set({
|
||||||
|
allowedScopes: allowedScopes
|
||||||
|
});
|
||||||
|
|
||||||
|
if (valid) {
|
||||||
|
var _self = this;
|
||||||
|
this.model.save({}, {
|
||||||
|
success:function () {
|
||||||
|
app.whiteListList.add(_self.model);
|
||||||
|
app.navigate('admin/whitelists', {trigger:true});
|
||||||
|
},
|
||||||
|
error:function (model,resp) {
|
||||||
|
console.error("Oops! The object didn't save correctly.",resp);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
cancelWhiteList:function(event) {
|
||||||
|
app.navigate('admin/whitelists', {trigger:true});
|
||||||
|
},
|
||||||
|
|
||||||
|
render:function (eventName) {
|
||||||
|
|
||||||
|
var json = {whiteList: this.model.toJSON(), client: this.options.client.toJSON()};
|
||||||
|
|
||||||
|
this.$el.html(this.template(json));
|
||||||
|
|
||||||
|
|
||||||
|
var _self = this;
|
||||||
|
// build and bind scopes
|
||||||
|
_.each(this.model.get("allowedScopes"), function (scope) {
|
||||||
|
_self.scopeCollection.add(new Backbone.Model({item:scope}));
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#scope .controls",this.el).html(new ListWidgetView({
|
||||||
|
placeholder: 'new scope here',
|
||||||
|
autocomplete: this.options.client.scope,
|
||||||
|
collection: this.scopeCollection}).render().el);
|
||||||
|
|
||||||
|
|
||||||
|
return this;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
|
@ -1,314 +1,3 @@
|
||||||
<!-- client -->
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-client">
|
|
||||||
<td>
|
|
||||||
<% if (dynamicallyRegistered) { %>
|
|
||||||
<span class="dynamically-registered"><i class="icon-globe"></i></span>
|
|
||||||
<% } %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%=clientId%>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%=clientName%>
|
|
||||||
<% if (clientDescription) { %>
|
|
||||||
<blockquote><small><%=clientDescription%></small></blockquote>
|
|
||||||
<% } %>
|
|
||||||
<div class="scope-list"></div>
|
|
||||||
<!--expandable future information-->
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<button class="btn btn-edit"><i class="icon-edit"></i> Edit</button>
|
|
||||||
<button class="btn btn-warning btn-whitelist">Whitelist</button>
|
|
||||||
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash icon-white"></i> Delete</button>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-client-table">
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
|
||||||
<button class="btn btn-small btn-primary new-client"><i class="icon-plus icon-white"></i> New Client</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="client-table-empty" class="alert alert-info">
|
|
||||||
There are no registered clients on this server.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table id="client-table" class="table table-hover table-striped">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th></th>
|
|
||||||
<th>ID</th>
|
|
||||||
<th>Name</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> Refresh</button>
|
|
||||||
<button class="btn btn-small btn-primary new-client"><i class="icon-plus icon-white"></i> New Client</button>
|
|
||||||
</div>
|
|
||||||
</script>
|
|
||||||
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-client-form">
|
|
||||||
|
|
||||||
<h1><%=(id == null ? 'New' : 'Edit')%> Client</h1>
|
|
||||||
|
|
||||||
|
|
||||||
<form class="form-horizontal tabbable">
|
|
||||||
<fieldset>
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
|
||||||
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="nav nav-tabs">
|
|
||||||
<li class="active"><a data-target="#client-main-tab" data-toggle="tab" href="#">Main</a></li>
|
|
||||||
<li><a data-target="#client-access-tab" data-toggle="tab" href="#">Access</a></li>
|
|
||||||
<li><a data-target="#client-secret-tab" data-toggle="tab" href="#">Credentials</a></li>
|
|
||||||
<li><a data-target="#client-token-tab" data-toggle="tab" href="#">Tokens</a></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div class="tab-content">
|
|
||||||
<div class="tab-pane active" id="client-main-tab">
|
|
||||||
|
|
||||||
<div class="control-group" id="clientName">
|
|
||||||
<label class="control-label">Client name</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input value="<%=clientName%>" maxlength="100" type="text" class="" placeholder="Type something">
|
|
||||||
<p class="help-block">Human-readable application name</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="clientId">
|
|
||||||
<label class="control-label">Client ID</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input value="<%=clientId%>" maxlength="100" type="text" class="" placeholder="Type something">
|
|
||||||
<p class="help-block">Unique identifier. If you leave this blank it will be automatically generated.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="registeredRedirectUri">
|
|
||||||
<label class="control-label">Redirect URI(s)</label>
|
|
||||||
<div class="controls">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="clientDescription">
|
|
||||||
<label class="control-label">Description</label>
|
|
||||||
<div class="controls">
|
|
||||||
<textarea class="input-xlarge" placeholder="Type a description" maxlength="200"
|
|
||||||
rows="3"><%=clientDescription%></textarea>
|
|
||||||
<p class="help-block">Human-readable text description</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="logoUrl">
|
|
||||||
<label class="control-label">Logo URL</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input placeholder="http://" value="<%=logoUrl%>" maxlength="100" type="text" class=""/>
|
|
||||||
<p class="help-block">URL to use for a logo image</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="logoBlock">
|
|
||||||
<label class="control-label">Logo Preview</label>
|
|
||||||
<div class="controls">
|
|
||||||
<img src="http://placehold.it/275x200&text=Enter a logo URL" alt="logo" id="logoPreview" width="275px" class="thumbnail" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="tab-pane" id="client-access-tab">
|
|
||||||
|
|
||||||
<div class="control-group" id="scope">
|
|
||||||
<label class="control-label">Scope</label>
|
|
||||||
<div class="controls">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="authorizedGrantTypes">
|
|
||||||
<label class="control-label">Authorized Grant Types</label>
|
|
||||||
|
|
||||||
<div class="controls">
|
|
||||||
|
|
||||||
<label class="checkbox">
|
|
||||||
<input id="authorizedGrantTypes-authorization_code" type="checkbox"
|
|
||||||
<%=($.inArray("authorization_code", authorizedGrantTypes) > -1 ? 'checked' : '')%>>
|
|
||||||
authorization code
|
|
||||||
</label>
|
|
||||||
<label class="checkbox">
|
|
||||||
<input id="authorizedGrantTypes-client_credentials" type="checkbox"
|
|
||||||
<%=($.inArray("client_credentials", authorizedGrantTypes) > -1 ? 'checked' : '')%>> client
|
|
||||||
credentials
|
|
||||||
</label>
|
|
||||||
<label class="checkbox">
|
|
||||||
<input id="authorizedGrantTypes-password" type="checkbox" <%=($.inArray("password",
|
|
||||||
authorizedGrantTypes) > -1 ? 'checked' : '')%>> password
|
|
||||||
</label>
|
|
||||||
<label class="checkbox">
|
|
||||||
<input id="authorizedGrantTypes-implicit" type="checkbox" <%=($.inArray("implicit",
|
|
||||||
authorizedGrantTypes) > -1 ? 'checked' : '')%>> implicit
|
|
||||||
</label>
|
|
||||||
<!--
|
|
||||||
<label class="checkbox">
|
|
||||||
<input id="authorizedGrantTypes-refresh_token" type="checkbox" <%=($.inArray("refresh_token",
|
|
||||||
authorizedGrantTypes) > -1 ? 'checked' : '')%>> refresh
|
|
||||||
</label>
|
|
||||||
-->
|
|
||||||
<label class="checkbox">
|
|
||||||
<input id="authorizedGrantTypes-redelegate" type="checkbox" <%=($.inArray("urn:ietf:params:oauth:grant_type:redelegate",
|
|
||||||
authorizedGrantTypes) > -1 ? 'checked' : '')%>> redelegate
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="allowIntrospection">
|
|
||||||
<label class="control-label">Introspection</label>
|
|
||||||
<div class="controls">
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" <%=(allowIntrospection == true ? 'checked' : '')%>> Allow calls to the Introspection Endpoint?
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="tab-pane" id="client-secret-tab">
|
|
||||||
|
|
||||||
<div class="control-group" id="requireClientSecret">
|
|
||||||
<label class="control-label">Client Secret</label>
|
|
||||||
<div class="controls">
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" <%=(requireClientSecret == true ? 'checked' : '')%>> Require client secret?
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="clientSecretPanel">
|
|
||||||
|
|
||||||
<div class="control-group" id="generateClientSecret">
|
|
||||||
<div class="controls">
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" <%=(generateClientSecret == true ? 'checked' : '')%>> Generate a new client secret?
|
|
||||||
</label>
|
|
||||||
<p class="help-block">New secret will be generated when you click 'Save'</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="displayClientSecret">
|
|
||||||
<div class="controls">
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" <%=(displayClientSecret == true ? 'checked' : '')%>> Display/edit client secret:
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group">
|
|
||||||
<div class="controls">
|
|
||||||
<div id="clientSecret">
|
|
||||||
<input value="<%=clientSecret%>" maxlength="100" type="text" placeholder="Type a secret">
|
|
||||||
</div>
|
|
||||||
<div id="clientSecretGenerated">
|
|
||||||
<span class="uneditable-input span3">Generate on Save</span>
|
|
||||||
</div>
|
|
||||||
<div id="clientSecretHidden">
|
|
||||||
<span class="uneditable-input span3">* * * * * * * * * * * *</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="tab-pane" id="client-token-tab">
|
|
||||||
<div class="control-group" id="accessTokenValiditySeconds">
|
|
||||||
<label class="control-label">Access Token Timeout</label>
|
|
||||||
<div class="controls">
|
|
||||||
<div>
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" id="disableAccessTokenTimeout" <%=(accessTokenValiditySeconds == null ? 'checked' : '')%>/> Access tokens do not time out
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-append">
|
|
||||||
<input type="text" class="" value="<%=(accessTokenValiditySeconds == null ? '' : accessTokenValiditySeconds)%>" id="access-token-timeout-seconds" size="16"><span class="add-on">seconds</span>
|
|
||||||
</div>
|
|
||||||
<p class="help-block">Enter this time in seconds.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="control-group" id="idTokenValiditySeconds">
|
|
||||||
<label class="control-label">ID Token Timeout</label>
|
|
||||||
<div class="controls">
|
|
||||||
<div>
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" id="disableIDTokenTimeout" <%=(idTokenValiditySeconds == null ? 'checked' : '')%>/> ID Tokens do not time out
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-append">
|
|
||||||
<input type="text" class="" value="<%=(idTokenValiditySeconds == null ? '' : idTokenValiditySeconds)%>" id="id-token-timeout-seconds" size="16"><span
|
|
||||||
class="add-on">seconds</span>
|
|
||||||
</div>
|
|
||||||
<p class="help-block">Enter this time in seconds.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group">
|
|
||||||
<label class="control-label">Refresh Tokens</label>
|
|
||||||
<div class="controls">
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" id="allowRefresh" <%=(allowRefresh == true ? 'checked' : '')%>> Refresh tokens are issued for this client
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="refreshTokenValiditySeconds">
|
|
||||||
<div class="controls">
|
|
||||||
<div>
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" id="disableRefreshTokenTimeout" <%=(refreshTokenValiditySeconds == null ? 'checked' : '')%>/> Refresh tokens do not time out
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-append">
|
|
||||||
<input type="text" class="" value="<%=(refreshTokenValiditySeconds == null ? '' : refreshTokenValiditySeconds)%>" id="refresh-token-timeout-seconds" size="16"><span class="add-on">seconds</span>
|
|
||||||
</div>
|
|
||||||
<p class="help-block">Enter this time in seconds.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="tab-pane" id="client-other-tab">
|
|
||||||
|
|
||||||
<div class="alert alert-block alert-info">
|
|
||||||
This page intentionally left blank.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
|
||||||
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</fieldset>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- breadcrumbs -->
|
<!-- breadcrumbs -->
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-breadcrumbs">
|
<script type="text/html" id="tmpl-breadcrumbs">
|
||||||
|
|
@ -338,199 +27,8 @@
|
||||||
</tbody>
|
</tbody>
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- whitelist -->
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-whitelist">
|
<!-- blacklist form -->
|
||||||
<td>
|
|
||||||
<% if (client.dynamicallyRegistered) { %>
|
|
||||||
<span class="dynamically-registered"><i class="icon-globe"></i></span>
|
|
||||||
<% } %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%=whiteList.clientId%>
|
|
||||||
<% if (client.clientDescription) { %>
|
|
||||||
<blockquote><small><%=client.clientDescription%></small></blockquote>
|
|
||||||
<% } %>
|
|
||||||
<div class="scope-list"></div>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%=client.clientName%>
|
|
||||||
<!--expandable future information-->
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<button class="btn btn-edit"><i class="icon-edit"></i> Edit</button>
|
|
||||||
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash icon-white"></i> Delete</button>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-whitelist-table">
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="whitelist-table-empty" class="alert alert-info">
|
|
||||||
There are no whitelisted sites. Use the <strong>whitelist</strong> button on the client management page to create one.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table id="whitelist-table" class="table table-hover table-striped">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th></th>
|
|
||||||
<th>ID</th>
|
|
||||||
<th>Name</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> Refresh</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-whitelist-form">
|
|
||||||
|
|
||||||
<h1><%=(whiteList.id == null ? 'New' : 'Edit')%> Whitelisted Site</h1>
|
|
||||||
|
|
||||||
|
|
||||||
<form class="form-horizontal">
|
|
||||||
<fieldset>
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
|
||||||
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="clientId">
|
|
||||||
<label class="control-label">Client</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input type="hidden" name="clientId" value="<%= client.clientId %>" />
|
|
||||||
<%= client.clientName != null ? client.clientName : client.clientId %>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="scope">
|
|
||||||
<label class="control-label">Allowed Scopes</label>
|
|
||||||
<div class="controls">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
|
||||||
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</fieldset>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- approved sites (grants) -->
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-grant-table">
|
|
||||||
|
|
||||||
<h2>Approved sites</h2>
|
|
||||||
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h3>Sites you have manually approved</h3>
|
|
||||||
|
|
||||||
<div id="grant-table-empty" class="alert alert-info">
|
|
||||||
You have not approved any sites.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table id="grant-table" class="table table-hover table-striped">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th></th>
|
|
||||||
<th>Application</th>
|
|
||||||
<th>Created</th>
|
|
||||||
<th>Last Accessed</th>
|
|
||||||
<th>Expires</th>
|
|
||||||
<th></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
<div class="well">
|
|
||||||
|
|
||||||
<h3>Sites that have been whitelisted by an administrator</h3>
|
|
||||||
<p>If you revoke them here, they will automatically be re-approved on your next visit.</p>
|
|
||||||
|
|
||||||
<div id="grant-whitelist-table-empty" class="alert alert-info">
|
|
||||||
You have not accessed any whitelisted sites.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table id="grant-whitelist-table" class="table table-hover table-striped">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th></th>
|
|
||||||
<th>Application</th>
|
|
||||||
<th>Created</th>
|
|
||||||
<th>Last Accessed</th>
|
|
||||||
<th>Expires</th>
|
|
||||||
<th></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-grant">
|
|
||||||
<td>
|
|
||||||
<% if (client.dynamicallyRegistered) { %>
|
|
||||||
<span class="dynamically-registered"><i class="icon-globe"></i></span>
|
|
||||||
<% } %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%= client.clientName != null ? client.clientName : client.clientId %>
|
|
||||||
<% if (client.clientDescription) { %>
|
|
||||||
<blockquote><small><%=client.clientDescription%></small></blockquote>
|
|
||||||
<% } %>
|
|
||||||
<div class="scope-list"></div>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
|
|
||||||
<!-- TODO: make these dates collapsable/expandable -->
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%= grant.creationDate %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%= grant.accessDate %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%= grant.timeoutDate %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash"></i> Revoke</button>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- blacklist -->
|
|
||||||
<script type="text/html" id="tmpl-blacklist-form">
|
<script type="text/html" id="tmpl-blacklist-form">
|
||||||
|
|
||||||
<form class="form-horizontal">
|
<form class="form-horizontal">
|
||||||
|
|
@ -554,178 +52,3 @@
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- system scope -->
|
|
||||||
<script type="text/html" id = "tmpl-system-scope-table">
|
|
||||||
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
|
||||||
<button class="btn btn-small btn-primary new-scope"><i class="icon-plus icon-white"></i> New Scope</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="scope-table-empty" class="alert alert-info">
|
|
||||||
There are no system scopes defined. Clients may still have custom scopes.
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<table id="scope-table" class="table table-hover table-striped">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th></th>
|
|
||||||
<th>Scope</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> Refresh</button>
|
|
||||||
<button class="btn btn-small btn-primary new-scope"><i class="icon-plus icon-white"></i> New Scope</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-system-scope">
|
|
||||||
<td>
|
|
||||||
<% if (icon) { %>
|
|
||||||
<i class="icon-<%= icon %>"></i>
|
|
||||||
<% } %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<%= value %>
|
|
||||||
<blockquote><small><%= description %></small></blockquote>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<button class="btn btn-edit"><i class="icon-edit"></i> Edit</button>
|
|
||||||
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash"></i> Delete</button>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-system-scope-form">
|
|
||||||
<h1><%= id == null ? 'New' : 'Edit'%> Scope</h1>
|
|
||||||
|
|
||||||
<form class="form-horizontal">
|
|
||||||
<fieldset>
|
|
||||||
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
|
||||||
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="value">
|
|
||||||
<label class="control-label">Scope value</label>
|
|
||||||
<div class="controls">
|
|
||||||
<input value="<%=value != null ? value : ''%>" type="text" class="" placeholder="scope">
|
|
||||||
<p class="help-block">Single string with no spaces</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="description">
|
|
||||||
<label class="control-label">Description</label>
|
|
||||||
<div class="controls">
|
|
||||||
<textarea class="input-xlarge" placeholder="Type a description" maxlength="200" rows="3"><%=description != null ? description : ''%></textarea>
|
|
||||||
<p class="help-block">Human-readable text description</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="icon">
|
|
||||||
<label class="control-label">Icon</label>
|
|
||||||
<div class="controls">
|
|
||||||
|
|
||||||
<span id="iconDisplay">
|
|
||||||
<i class="icon-<%=icon%>"></i> <span class="uneditable-input"><%=icon%></span>
|
|
||||||
|
|
||||||
<input type="hidden" value="<%=icon%>">
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<a href="#iconSelector" role="button" class="btn btn-info" data-toggle="modal"><i class="icon-white icon-picture"></i> Select an icon</a>
|
|
||||||
|
|
||||||
<div id="iconSelector" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="iconSelectorLabel" aria-hidden="true">
|
|
||||||
<div class="modal-header">
|
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
||||||
<h3 id="iconSelectorLabel">Select an Icon</h3>
|
|
||||||
</div>
|
|
||||||
<div class="modal-body">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="defaultScope">
|
|
||||||
<div class="controls">
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" <%=defaultScope ? 'checked' : '' %>> default scope
|
|
||||||
</label>
|
|
||||||
<p class="help-block">Newly-created clients get this scope by default?</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="control-group" id="allowDynReg">
|
|
||||||
<div class="controls">
|
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" <%=allowDynReg ? 'checked' : '' %>> allow dynamic registration
|
|
||||||
</label>
|
|
||||||
<p class="help-block">Allow dynamically registered clients to request this scope?</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="well well-small">
|
|
||||||
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
|
||||||
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</fieldset>
|
|
||||||
</form>
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-system-scope-icon">
|
|
||||||
|
|
||||||
<div class="row-fluid">
|
|
||||||
<div class="span4" style="margin-top: 5px; margin-bottom: 5px;">
|
|
||||||
<% if (items[0]) { %>
|
|
||||||
<button class="btn btn-block btn-icon" value="<%=items[0]%>"><i class="icon-<%=items[0]%>"></i> <%=items[0]%>
|
|
||||||
<% } %>
|
|
||||||
</div>
|
|
||||||
<div class="span4" style="margin-top: 5px; margin-bottom: 5px;">
|
|
||||||
<% if (items[1]) { %>
|
|
||||||
<button class="btn btn-block btn-icon" value="<%=items[1]%>"><i class="icon-<%=items[1]%>"></i> <%=items[1]%>
|
|
||||||
<% } %>
|
|
||||||
</div>
|
|
||||||
<div class="span4" style="margin-top: 5px; margin-bottom: 5px;">
|
|
||||||
<% if (items[2]) { %>
|
|
||||||
<button class="btn btn-block btn-icon" value="<%=items[2]%>"><i class="icon-<%=items[2]%>"></i> <%=items[2]%>
|
|
||||||
<% } %>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script type="text/html" id="tmpl-scope-list">
|
|
||||||
|
|
||||||
<%
|
|
||||||
_.each(scopes, function(s) {
|
|
||||||
%>
|
|
||||||
<span class="badge badge-info">
|
|
||||||
<%
|
|
||||||
var ss = systemScopes.getByValue(s);
|
|
||||||
if (ss && ss.get('icon')) {
|
|
||||||
%>
|
|
||||||
<i class="icon-<%=ss.get('icon')%> icon-white"></i>
|
|
||||||
<%
|
|
||||||
}
|
|
||||||
%>
|
|
||||||
<%=s%>
|
|
||||||
</span>
|
|
||||||
<%
|
|
||||||
});
|
|
||||||
%>
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
@ -0,0 +1,310 @@
|
||||||
|
<!-- client -->
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-client">
|
||||||
|
<td>
|
||||||
|
<% if (dynamicallyRegistered) { %>
|
||||||
|
<span class="dynamically-registered"><i class="icon-globe"></i></span>
|
||||||
|
<% } %>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%=clientId%>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%=clientName%>
|
||||||
|
<% if (clientDescription) { %>
|
||||||
|
<blockquote><small><%=clientDescription%></small></blockquote>
|
||||||
|
<% } %>
|
||||||
|
<div class="scope-list"></div>
|
||||||
|
<!--expandable future information-->
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<button class="btn btn-edit"><i class="icon-edit"></i> Edit</button>
|
||||||
|
<button class="btn btn-warning btn-whitelist">Whitelist</button>
|
||||||
|
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash icon-white"></i> Delete</button>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-client-table">
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
||||||
|
<button class="btn btn-small btn-primary new-client"><i class="icon-plus icon-white"></i> New Client</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="client-table-empty" class="alert alert-info">
|
||||||
|
There are no registered clients on this server.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="client-table" class="table table-hover table-striped">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th></th>
|
||||||
|
<th>ID</th>
|
||||||
|
<th>Name</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> Refresh</button>
|
||||||
|
<button class="btn btn-small btn-primary new-client"><i class="icon-plus icon-white"></i> New Client</button>
|
||||||
|
</div>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-client-form">
|
||||||
|
|
||||||
|
<h1><%=(id == null ? 'New' : 'Edit')%> Client</h1>
|
||||||
|
|
||||||
|
|
||||||
|
<form class="form-horizontal tabbable">
|
||||||
|
<fieldset>
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
||||||
|
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ul class="nav nav-tabs">
|
||||||
|
<li class="active"><a data-target="#client-main-tab" data-toggle="tab" href="#">Main</a></li>
|
||||||
|
<li><a data-target="#client-access-tab" data-toggle="tab" href="#">Access</a></li>
|
||||||
|
<li><a data-target="#client-secret-tab" data-toggle="tab" href="#">Credentials</a></li>
|
||||||
|
<li><a data-target="#client-token-tab" data-toggle="tab" href="#">Tokens</a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="tab-content">
|
||||||
|
<div class="tab-pane active" id="client-main-tab">
|
||||||
|
|
||||||
|
<div class="control-group" id="clientName">
|
||||||
|
<label class="control-label">Client name</label>
|
||||||
|
<div class="controls">
|
||||||
|
<input value="<%=clientName%>" maxlength="100" type="text" class="" placeholder="Type something">
|
||||||
|
<p class="help-block">Human-readable application name</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="clientId">
|
||||||
|
<label class="control-label">Client ID</label>
|
||||||
|
<div class="controls">
|
||||||
|
<input value="<%=clientId%>" maxlength="100" type="text" class="" placeholder="Type something">
|
||||||
|
<p class="help-block">Unique identifier. If you leave this blank it will be automatically generated.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="registeredRedirectUri">
|
||||||
|
<label class="control-label">Redirect URI(s)</label>
|
||||||
|
<div class="controls">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="clientDescription">
|
||||||
|
<label class="control-label">Description</label>
|
||||||
|
<div class="controls">
|
||||||
|
<textarea class="input-xlarge" placeholder="Type a description" maxlength="200"
|
||||||
|
rows="3"><%=clientDescription%></textarea>
|
||||||
|
<p class="help-block">Human-readable text description</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="logoUrl">
|
||||||
|
<label class="control-label">Logo URL</label>
|
||||||
|
<div class="controls">
|
||||||
|
<input placeholder="http://" value="<%=logoUrl%>" maxlength="100" type="text" class=""/>
|
||||||
|
<p class="help-block">URL to use for a logo image</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="logoBlock">
|
||||||
|
<label class="control-label">Logo Preview</label>
|
||||||
|
<div class="controls">
|
||||||
|
<img src="http://placehold.it/275x200&text=Enter a logo URL" alt="logo" id="logoPreview" width="275px" class="thumbnail" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="tab-pane" id="client-access-tab">
|
||||||
|
|
||||||
|
<div class="control-group" id="scope">
|
||||||
|
<label class="control-label">Scope</label>
|
||||||
|
<div class="controls">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="authorizedGrantTypes">
|
||||||
|
<label class="control-label">Authorized Grant Types</label>
|
||||||
|
|
||||||
|
<div class="controls">
|
||||||
|
|
||||||
|
<label class="checkbox">
|
||||||
|
<input id="authorizedGrantTypes-authorization_code" type="checkbox"
|
||||||
|
<%=($.inArray("authorization_code", authorizedGrantTypes) > -1 ? 'checked' : '')%>>
|
||||||
|
authorization code
|
||||||
|
</label>
|
||||||
|
<label class="checkbox">
|
||||||
|
<input id="authorizedGrantTypes-client_credentials" type="checkbox"
|
||||||
|
<%=($.inArray("client_credentials", authorizedGrantTypes) > -1 ? 'checked' : '')%>> client
|
||||||
|
credentials
|
||||||
|
</label>
|
||||||
|
<label class="checkbox">
|
||||||
|
<input id="authorizedGrantTypes-password" type="checkbox" <%=($.inArray("password",
|
||||||
|
authorizedGrantTypes) > -1 ? 'checked' : '')%>> password
|
||||||
|
</label>
|
||||||
|
<label class="checkbox">
|
||||||
|
<input id="authorizedGrantTypes-implicit" type="checkbox" <%=($.inArray("implicit",
|
||||||
|
authorizedGrantTypes) > -1 ? 'checked' : '')%>> implicit
|
||||||
|
</label>
|
||||||
|
<!--
|
||||||
|
<label class="checkbox">
|
||||||
|
<input id="authorizedGrantTypes-refresh_token" type="checkbox" <%=($.inArray("refresh_token",
|
||||||
|
authorizedGrantTypes) > -1 ? 'checked' : '')%>> refresh
|
||||||
|
</label>
|
||||||
|
-->
|
||||||
|
<label class="checkbox">
|
||||||
|
<input id="authorizedGrantTypes-redelegate" type="checkbox" <%=($.inArray("urn:ietf:params:oauth:grant_type:redelegate",
|
||||||
|
authorizedGrantTypes) > -1 ? 'checked' : '')%>> redelegate
|
||||||
|
</label>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="allowIntrospection">
|
||||||
|
<label class="control-label">Introspection</label>
|
||||||
|
<div class="controls">
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" <%=(allowIntrospection == true ? 'checked' : '')%>> Allow calls to the Introspection Endpoint?
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="tab-pane" id="client-secret-tab">
|
||||||
|
|
||||||
|
<div class="control-group" id="requireClientSecret">
|
||||||
|
<label class="control-label">Client Secret</label>
|
||||||
|
<div class="controls">
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" <%=(requireClientSecret == true ? 'checked' : '')%>> Require client secret?
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="clientSecretPanel">
|
||||||
|
|
||||||
|
<div class="control-group" id="generateClientSecret">
|
||||||
|
<div class="controls">
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" <%=(generateClientSecret == true ? 'checked' : '')%>> Generate a new client secret?
|
||||||
|
</label>
|
||||||
|
<p class="help-block">New secret will be generated when you click 'Save'</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="displayClientSecret">
|
||||||
|
<div class="controls">
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" <%=(displayClientSecret == true ? 'checked' : '')%>> Display/edit client secret:
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group">
|
||||||
|
<div class="controls">
|
||||||
|
<div id="clientSecret">
|
||||||
|
<input value="<%=clientSecret%>" maxlength="100" type="text" placeholder="Type a secret">
|
||||||
|
</div>
|
||||||
|
<div id="clientSecretGenerated">
|
||||||
|
<span class="uneditable-input span3">Generate on Save</span>
|
||||||
|
</div>
|
||||||
|
<div id="clientSecretHidden">
|
||||||
|
<span class="uneditable-input span3">* * * * * * * * * * * *</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="tab-pane" id="client-token-tab">
|
||||||
|
<div class="control-group" id="accessTokenValiditySeconds">
|
||||||
|
<label class="control-label">Access Token Timeout</label>
|
||||||
|
<div class="controls">
|
||||||
|
<div>
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" id="disableAccessTokenTimeout" <%=(accessTokenValiditySeconds == null ? 'checked' : '')%>/> Access tokens do not time out
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="input-append">
|
||||||
|
<input type="text" class="" value="<%=(accessTokenValiditySeconds == null ? '' : accessTokenValiditySeconds)%>" id="access-token-timeout-seconds" size="16"><span class="add-on">seconds</span>
|
||||||
|
</div>
|
||||||
|
<p class="help-block">Enter this time in seconds.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="control-group" id="idTokenValiditySeconds">
|
||||||
|
<label class="control-label">ID Token Timeout</label>
|
||||||
|
<div class="controls">
|
||||||
|
<div>
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" id="disableIDTokenTimeout" <%=(idTokenValiditySeconds == null ? 'checked' : '')%>/> ID Tokens do not time out
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="input-append">
|
||||||
|
<input type="text" class="" value="<%=(idTokenValiditySeconds == null ? '' : idTokenValiditySeconds)%>" id="id-token-timeout-seconds" size="16"><span
|
||||||
|
class="add-on">seconds</span>
|
||||||
|
</div>
|
||||||
|
<p class="help-block">Enter this time in seconds.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group">
|
||||||
|
<label class="control-label">Refresh Tokens</label>
|
||||||
|
<div class="controls">
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" id="allowRefresh" <%=(allowRefresh == true ? 'checked' : '')%>> Refresh tokens are issued for this client
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="refreshTokenValiditySeconds">
|
||||||
|
<div class="controls">
|
||||||
|
<div>
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" id="disableRefreshTokenTimeout" <%=(refreshTokenValiditySeconds == null ? 'checked' : '')%>/> Refresh tokens do not time out
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="input-append">
|
||||||
|
<input type="text" class="" value="<%=(refreshTokenValiditySeconds == null ? '' : refreshTokenValiditySeconds)%>" id="refresh-token-timeout-seconds" size="16"><span class="add-on">seconds</span>
|
||||||
|
</div>
|
||||||
|
<p class="help-block">Enter this time in seconds.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="tab-pane" id="client-other-tab">
|
||||||
|
|
||||||
|
<div class="alert alert-block alert-info">
|
||||||
|
This page intentionally left blank.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
||||||
|
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</fieldset>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,99 @@
|
||||||
|
<!-- approved sites (grants) -->
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-grant-table">
|
||||||
|
|
||||||
|
<h2>Approved sites</h2>
|
||||||
|
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>Sites you have manually approved</h3>
|
||||||
|
|
||||||
|
<div id="grant-table-empty" class="alert alert-info">
|
||||||
|
You have not approved any sites.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="grant-table" class="table table-hover table-striped">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th></th>
|
||||||
|
<th>Application</th>
|
||||||
|
<th>Created</th>
|
||||||
|
<th>Last Accessed</th>
|
||||||
|
<th>Expires</th>
|
||||||
|
<th></th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<div class="well">
|
||||||
|
|
||||||
|
<h3>Sites that have been whitelisted by an administrator</h3>
|
||||||
|
<p>If you revoke them here, they will automatically be re-approved on your next visit.</p>
|
||||||
|
|
||||||
|
<div id="grant-whitelist-table-empty" class="alert alert-info">
|
||||||
|
You have not accessed any whitelisted sites.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="grant-whitelist-table" class="table table-hover table-striped">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th></th>
|
||||||
|
<th>Application</th>
|
||||||
|
<th>Created</th>
|
||||||
|
<th>Last Accessed</th>
|
||||||
|
<th>Expires</th>
|
||||||
|
<th></th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-grant">
|
||||||
|
<td>
|
||||||
|
<% if (client.dynamicallyRegistered) { %>
|
||||||
|
<span class="dynamically-registered"><i class="icon-globe"></i></span>
|
||||||
|
<% } %>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%= client.clientName != null ? client.clientName : client.clientId %>
|
||||||
|
<% if (client.clientDescription) { %>
|
||||||
|
<blockquote><small><%=client.clientDescription%></small></blockquote>
|
||||||
|
<% } %>
|
||||||
|
<div class="scope-list"></div>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- TODO: make these dates collapsable/expandable -->
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%= grant.creationDate %>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%= grant.accessDate %>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%= grant.timeoutDate %>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash"></i> Revoke</button>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
@ -0,0 +1,175 @@
|
||||||
|
<!-- system scope -->
|
||||||
|
<script type="text/html" id = "tmpl-system-scope-table">
|
||||||
|
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
||||||
|
<button class="btn btn-small btn-primary new-scope"><i class="icon-plus icon-white"></i> New Scope</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="scope-table-empty" class="alert alert-info">
|
||||||
|
There are no system scopes defined. Clients may still have custom scopes.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="scope-table" class="table table-hover table-striped">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th></th>
|
||||||
|
<th>Scope</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> Refresh</button>
|
||||||
|
<button class="btn btn-small btn-primary new-scope"><i class="icon-plus icon-white"></i> New Scope</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-system-scope">
|
||||||
|
<td>
|
||||||
|
<% if (icon) { %>
|
||||||
|
<i class="icon-<%= icon %>"></i>
|
||||||
|
<% } %>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%= value %>
|
||||||
|
<blockquote><small><%= description %></small></blockquote>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<button class="btn btn-edit"><i class="icon-edit"></i> Edit</button>
|
||||||
|
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash"></i> Delete</button>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-system-scope-form">
|
||||||
|
<h1><%= id == null ? 'New' : 'Edit'%> Scope</h1>
|
||||||
|
|
||||||
|
<form class="form-horizontal">
|
||||||
|
<fieldset>
|
||||||
|
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
||||||
|
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="value">
|
||||||
|
<label class="control-label">Scope value</label>
|
||||||
|
<div class="controls">
|
||||||
|
<input value="<%=value != null ? value : ''%>" type="text" class="" placeholder="scope">
|
||||||
|
<p class="help-block">Single string with no spaces</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="description">
|
||||||
|
<label class="control-label">Description</label>
|
||||||
|
<div class="controls">
|
||||||
|
<textarea class="input-xlarge" placeholder="Type a description" maxlength="200" rows="3"><%=description != null ? description : ''%></textarea>
|
||||||
|
<p class="help-block">Human-readable text description</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="icon">
|
||||||
|
<label class="control-label">Icon</label>
|
||||||
|
<div class="controls">
|
||||||
|
|
||||||
|
<span id="iconDisplay">
|
||||||
|
<i class="icon-<%=icon%>"></i> <span class="uneditable-input"><%=icon%></span>
|
||||||
|
|
||||||
|
<input type="hidden" value="<%=icon%>">
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<a href="#iconSelector" role="button" class="btn btn-info" data-toggle="modal"><i class="icon-white icon-picture"></i> Select an icon</a>
|
||||||
|
|
||||||
|
<div id="iconSelector" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="iconSelectorLabel" aria-hidden="true">
|
||||||
|
<div class="modal-header">
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||||
|
<h3 id="iconSelectorLabel">Select an Icon</h3>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="defaultScope">
|
||||||
|
<div class="controls">
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" <%=defaultScope ? 'checked' : '' %>> default scope
|
||||||
|
</label>
|
||||||
|
<p class="help-block">Newly-created clients get this scope by default?</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="allowDynReg">
|
||||||
|
<div class="controls">
|
||||||
|
<label class="checkbox">
|
||||||
|
<input type="checkbox" <%=allowDynReg ? 'checked' : '' %>> allow dynamic registration
|
||||||
|
</label>
|
||||||
|
<p class="help-block">Allow dynamically registered clients to request this scope?</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
||||||
|
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</fieldset>
|
||||||
|
</form>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-system-scope-icon">
|
||||||
|
|
||||||
|
<div class="row-fluid">
|
||||||
|
<div class="span4" style="margin-top: 5px; margin-bottom: 5px;">
|
||||||
|
<% if (items[0]) { %>
|
||||||
|
<button class="btn btn-block btn-icon" value="<%=items[0]%>"><i class="icon-<%=items[0]%>"></i> <%=items[0]%>
|
||||||
|
<% } %>
|
||||||
|
</div>
|
||||||
|
<div class="span4" style="margin-top: 5px; margin-bottom: 5px;">
|
||||||
|
<% if (items[1]) { %>
|
||||||
|
<button class="btn btn-block btn-icon" value="<%=items[1]%>"><i class="icon-<%=items[1]%>"></i> <%=items[1]%>
|
||||||
|
<% } %>
|
||||||
|
</div>
|
||||||
|
<div class="span4" style="margin-top: 5px; margin-bottom: 5px;">
|
||||||
|
<% if (items[2]) { %>
|
||||||
|
<button class="btn btn-block btn-icon" value="<%=items[2]%>"><i class="icon-<%=items[2]%>"></i> <%=items[2]%>
|
||||||
|
<% } %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-scope-list">
|
||||||
|
|
||||||
|
<%
|
||||||
|
_.each(scopes, function(s) {
|
||||||
|
%>
|
||||||
|
<span class="badge badge-info">
|
||||||
|
<%
|
||||||
|
var ss = systemScopes.getByValue(s);
|
||||||
|
if (ss && ss.get('icon')) {
|
||||||
|
%>
|
||||||
|
<i class="icon-<%=ss.get('icon')%> icon-white"></i>
|
||||||
|
<%
|
||||||
|
}
|
||||||
|
%>
|
||||||
|
<%=s%>
|
||||||
|
</span>
|
||||||
|
<%
|
||||||
|
});
|
||||||
|
%>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,92 @@
|
||||||
|
<!-- whitelist -->
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-whitelist">
|
||||||
|
<td>
|
||||||
|
<% if (client.dynamicallyRegistered) { %>
|
||||||
|
<span class="dynamically-registered"><i class="icon-globe"></i></span>
|
||||||
|
<% } %>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%=whiteList.clientId%>
|
||||||
|
<% if (client.clientDescription) { %>
|
||||||
|
<blockquote><small><%=client.clientDescription%></small></blockquote>
|
||||||
|
<% } %>
|
||||||
|
<div class="scope-list"></div>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<%=client.clientName%>
|
||||||
|
<!--expandable future information-->
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<button class="btn btn-edit"><i class="icon-edit"></i> Edit</button>
|
||||||
|
<button class="btn btn-danger btn-delete pull-right"><i class="icon-trash icon-white"></i> Delete</button>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-whitelist-table">
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small refresh-table"><i class="icon-refresh"></i> Refresh</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="whitelist-table-empty" class="alert alert-info">
|
||||||
|
There are no whitelisted sites. Use the <strong>whitelist</strong> button on the client management page to create one.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="whitelist-table" class="table table-hover table-striped">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th></th>
|
||||||
|
<th>ID</th>
|
||||||
|
<th>Name</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> Refresh</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" id="tmpl-whitelist-form">
|
||||||
|
|
||||||
|
<h1><%=(whiteList.id == null ? 'New' : 'Edit')%> Whitelisted Site</h1>
|
||||||
|
|
||||||
|
|
||||||
|
<form class="form-horizontal">
|
||||||
|
<fieldset>
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
||||||
|
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="clientId">
|
||||||
|
<label class="control-label">Client</label>
|
||||||
|
<div class="controls">
|
||||||
|
<input type="hidden" name="clientId" value="<%= client.clientId %>" />
|
||||||
|
<%= client.clientName != null ? client.clientName : client.clientId %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="control-group" id="scope">
|
||||||
|
<label class="control-label">Allowed Scopes</label>
|
||||||
|
<div class="controls">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="well well-small">
|
||||||
|
<button class="btn btn-small btn-save btn-success"><i class="icon-ok-circle icon-white"></i> Save</button>
|
||||||
|
<button class="btn btn-small btn-cancel"><i class="icon-ban-circle"></i> Cancel</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</fieldset>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</script>
|
||||||
Loading…
Reference in New Issue