PageRenderTime 50ms CodeModel.GetById 23ms RepoModel.GetById 0ms app.codeStats 0ms

/openid-connect-server-webapp/src/main/webapp/resources/js/whitelist.js

https://gitlab.com/jslee1/OpenID-Connect-Java-Spring-Server
JavaScript | 421 lines | 291 code | 96 blank | 34 comment | 23 complexity | d7ad7819d00acababea696f1c4436874 MD5 | raw file
  1. /*******************************************************************************
  2. * Copyright 2016 The MITRE Corporation
  3. * and the MIT Internet Trust Consortium
  4. *
  5. * Licensed under the Apache License, Version 2.0 (the "License");
  6. * you may not use this file except in compliance with the License.
  7. * You may obtain a copy of the License at
  8. *
  9. * http://www.apache.org/licenses/LICENSE-2.0
  10. *
  11. * Unless required by applicable law or agreed to in writing, software
  12. * distributed under the License is distributed on an "AS IS" BASIS,
  13. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14. * See the License for the specific language governing permissions and
  15. * limitations under the License.
  16. *******************************************************************************/
  17. var WhiteListModel = Backbone.Model.extend({
  18. idAttribute: "id",
  19. initialize: function () { },
  20. urlRoot: "api/whitelist"
  21. });
  22. var WhiteListCollection = Backbone.Collection.extend({
  23. initialize: function() {
  24. //this.fetch();
  25. },
  26. getByClientId: function(clientId) {
  27. var clients = this.where({clientId: clientId});
  28. if (clients.length == 1) {
  29. return clients[0];
  30. } else {
  31. return null;
  32. }
  33. },
  34. model: WhiteListModel,
  35. url: "api/whitelist"
  36. });
  37. var WhiteListListView = Backbone.View.extend({
  38. tagName: 'span',
  39. initialize:function (options) {
  40. this.options = options;
  41. },
  42. load:function(callback) {
  43. if (this.model.isFetched &&
  44. this.options.clientList.isFetched &&
  45. this.options.systemScopeList.isFetched) {
  46. callback();
  47. return;
  48. }
  49. $('#loadingbox').sheet('show');
  50. $('#loading').html(
  51. '<span class="label" id="loading-whitelist">' + $.t('whitelist.whitelist') + '</span> ' +
  52. '<span class="label" id="loading-clients">' + $.t('common.clients') + '</span> ' +
  53. '<span class="label" id="loading-scopes">' + $.t('common.scopes') + '</span> '
  54. );
  55. $.when(this.model.fetchIfNeeded({success:function(e) {$('#loading-whitelist').addClass('label-success');}}),
  56. this.options.clientList.fetchIfNeeded({success:function(e) {$('#loading-clients').addClass('label-success');}}),
  57. this.options.systemScopeList.fetchIfNeeded({success:function(e) {$('#loading-scopes').addClass('label-success');}}))
  58. .done(function() {
  59. $('#loadingbox').sheet('hide');
  60. callback();
  61. });
  62. },
  63. events:{
  64. "click .refresh-table":"refreshTable"
  65. },
  66. render:function (eventName) {
  67. $(this.el).html($('#tmpl-whitelist-table').html());
  68. var _self = this;
  69. _.each(this.model.models, function (whiteList) {
  70. // look up client
  71. var client = _self.options.clientList.getByClientId(whiteList.get('clientId'));
  72. // if there's no client ID, this is an error!
  73. if (client != null) {
  74. var view = new WhiteListView({model: whiteList, client: client, systemScopeList: _self.options.systemScopeList});
  75. view.parentView = _self;
  76. $('#whitelist-table', _self.el).append(view.render().el);
  77. }
  78. }, this);
  79. this.togglePlaceholder();
  80. $(this.el).i18n();
  81. return this;
  82. },
  83. togglePlaceholder:function() {
  84. if (this.model.length > 0) {
  85. $('#whitelist-table', this.el).show();
  86. $('#whitelist-table-empty', this.el).hide();
  87. } else {
  88. $('#whitelist-table', this.el).hide();
  89. $('#whitelist-table-empty', this.el).show();
  90. }
  91. },
  92. refreshTable:function(e) {
  93. e.preventDefault();
  94. var _self = this;
  95. $('#loadingbox').sheet('show');
  96. $('#loading').html(
  97. '<span class="label" id="loading-whitelist">' + $.t('whitelist.whitelist') + '</span> ' +
  98. '<span class="label" id="loading-clients">' + $.t('common.clients') + '</span> ' +
  99. '<span class="label" id="loading-scopes">' + $.t('common.scopes') + '</span> '
  100. );
  101. $.when(this.model.fetch({success:function(e) {$('#loading-whitelist').addClass('label-success');}}),
  102. this.options.clientList.fetch({success:function(e) {$('#loading-clients').addClass('label-success');}}),
  103. this.options.systemScopeList.fetch({success:function(e) {$('#loading-scopes').addClass('label-success');}}))
  104. .done(function() {
  105. $('#loadingbox').sheet('hide');
  106. _self.render();
  107. });
  108. }
  109. });
  110. var WhiteListView = Backbone.View.extend({
  111. tagName: 'tr',
  112. initialize:function(options) {
  113. this.options = options;
  114. if (!this.template) {
  115. this.template = _.template($('#tmpl-whitelist').html());
  116. }
  117. if (!this.scopeTemplate) {
  118. this.scopeTemplate = _.template($('#tmpl-scope-list').html());
  119. }
  120. if (!this.moreInfoTemplate) {
  121. this.moreInfoTemplate = _.template($('#tmpl-client-more-info-block').html());
  122. }
  123. this.model.bind('change', this.render, this);
  124. },
  125. render:function(eventName) {
  126. var json = {whiteList: this.model.toJSON(), client: this.options.client.toJSON()};
  127. this.$el.html(this.template(json));
  128. $('.scope-list', this.el).html(this.scopeTemplate({scopes: this.model.get('allowedScopes'), systemScopes: this.options.systemScopeList}));
  129. $('.client-more-info-block', this.el).html(this.moreInfoTemplate({client: this.options.client.toJSON()}));
  130. this.$('.dynamically-registered').tooltip({title: $.t('common.dynamically-registered')});
  131. $(this.el).i18n();
  132. return this;
  133. },
  134. events:{
  135. 'click .btn-edit': 'editWhitelist',
  136. 'click .btn-delete': 'deleteWhitelist',
  137. 'click .toggleMoreInformation': 'toggleMoreInformation'
  138. },
  139. editWhitelist:function(e) {
  140. e.preventDefault();
  141. app.navigate('admin/whitelist/' + this.model.get('id'), {trigger: true});
  142. },
  143. deleteWhitelist:function(e) {
  144. e.preventDefault();
  145. if (confirm($.t('whitelist.confirm'))) {
  146. var _self = this;
  147. this.model.destroy({
  148. dataType: false, processData: false,
  149. success:function () {
  150. _self.$el.fadeTo("fast", 0.00, function () { //fade
  151. $(this).slideUp("fast", function () { //slide up
  152. $(this).remove(); //then remove from the DOM
  153. // check the placeholder in case it's empty now
  154. _self.parentView.togglePlaceholder();
  155. });
  156. });
  157. },
  158. error:function (error, response) {
  159. console.log("An error occurred when deleting a whitelist entry");
  160. //Pull out the response text.
  161. var responseJson = JSON.parse(response.responseText);
  162. //Display an alert with an error message
  163. $('#modalAlert div.modal-header').html(responseJson.error);
  164. $('#modalAlert div.modal-body').html(responseJson.error_description);
  165. $("#modalAlert").modal({ // wire up the actual modal functionality and show the dialog
  166. "backdrop" : "static",
  167. "keyboard" : true,
  168. "show" : true // ensure the modal is shown immediately
  169. });
  170. }
  171. });
  172. _self.parentView.delegateEvents();
  173. }
  174. return false;
  175. },
  176. toggleMoreInformation:function(e) {
  177. e.preventDefault();
  178. if ($('.moreInformation', this.el).is(':visible')) {
  179. // hide it
  180. $('.moreInformation', this.el).hide('fast');
  181. $('.toggleMoreInformation i', this.el).attr('class', 'icon-chevron-right');
  182. $('.moreInformationContainer', this.el).removeClass('alert').removeClass('alert-info').addClass('muted');
  183. } else {
  184. // show it
  185. $('.moreInformation', this.el).show('fast');
  186. $('.toggleMoreInformation i', this.el).attr('class', 'icon-chevron-down');
  187. $('.moreInformationContainer', this.el).addClass('alert').addClass('alert-info').removeClass('muted');
  188. }
  189. },
  190. close:function() {
  191. $(this.el).unbind();
  192. $(this.el).empty();
  193. }
  194. });
  195. var WhiteListFormView = Backbone.View.extend({
  196. tagName: 'span',
  197. initialize:function (options) {
  198. this.options = options;
  199. if (!this.template) {
  200. this.template = _.template($('#tmpl-whitelist-form').html());
  201. }
  202. this.scopeCollection = new Backbone.Collection();
  203. this.listWidgetViews = [];
  204. },
  205. load:function(callback) {
  206. if (this.options.client) {
  207. // we know what client we're dealing with already
  208. if (this.model.isFetched &&
  209. this.options.client.isFetched) {
  210. callback();
  211. return;
  212. }
  213. $('#loadingbox').sheet('show');
  214. $('#loading').html(
  215. '<span class="label" id="loading-whitelist">' + $.t('whitelist.whitelist') + '</span> ' +
  216. '<span class="label" id="loading-clients">' + $.t('common.clients') + '</span> ' +
  217. '<span class="label" id="loading-scopes">' + $.t('common.scopes') + '</span> '
  218. );
  219. $.when(this.model.fetchIfNeeded({success:function(e) {$('#loading-whitelist').addClass('label-success');}}),
  220. this.options.client.fetchIfNeeded({success:function(e) {$('#loading-clients').addClass('label-success');}}),
  221. this.options.systemScopeList.fetchIfNeeded({success:function(e) {$('#loading-scopes').addClass('label-success');}}))
  222. .done(function() {
  223. $('#loadingbox').sheet('hide');
  224. callback();
  225. });
  226. } else {
  227. // we need to get the client information from the list
  228. if (this.model.isFetched &&
  229. this.options.clientList.isFetched &&
  230. this.options.systemScopeList.isFetched) {
  231. var client = this.options.clientList.getByClientId(this.model.get('clientId'));
  232. this.options.client = client;
  233. callback();
  234. return;
  235. }
  236. $('#loadingbox').sheet('show');
  237. $('#loading').html(
  238. '<span class="label" id="loading-whitelist">' + $.t('whitelist.whitelist') + '</span> ' +
  239. '<span class="label" id="loading-clients">' + $.t('common.clients') + '</span> ' +
  240. '<span class="label" id="loading-scopes">' + $.t('common.scopes') + '</span> '
  241. );
  242. var _self = this;
  243. $.when(this.model.fetchIfNeeded({success:function(e) {$('#loading-whitelist').addClass('label-success');}}),
  244. this.options.clientList.fetchIfNeeded({success:function(e) {$('#loading-clients').addClass('label-success');}}),
  245. this.options.systemScopeList.fetchIfNeeded({success:function(e) {$('#loading-scopes').addClass('label-success');}}))
  246. .done(function() {
  247. var client = _self.options.clientList.getByClientId(_self.model.get('clientId'));
  248. _self.options.client = client;
  249. $('#loadingbox').sheet('hide');
  250. callback();
  251. });
  252. }
  253. },
  254. events:{
  255. 'click .btn-save':'saveWhiteList',
  256. 'click .btn-cancel':'cancelWhiteList',
  257. },
  258. saveWhiteList:function (e) {
  259. e.preventDefault();
  260. $('.control-group').removeClass('error');
  261. // sync any leftover collection items
  262. _.each(this.listWidgetViews, function(v) {
  263. v.addItem($.Event('click'));
  264. });
  265. // process allowed scopes
  266. var allowedScopes = this.scopeCollection.pluck("item");
  267. this.model.set({clientId: this.options.client.get('clientId')}, {silent: true});
  268. var valid = this.model.set({
  269. allowedScopes: allowedScopes
  270. });
  271. if (valid) {
  272. var _self = this;
  273. this.model.save({}, {
  274. success:function () {
  275. app.whiteListList.add(_self.model);
  276. app.navigate('admin/whitelists', {trigger:true});
  277. },
  278. error:function (error, response) {
  279. console.log("An error occurred when deleting from a list widget");
  280. //Pull out the response text.
  281. var responseJson = JSON.parse(response.responseText);
  282. //Display an alert with an error message
  283. $('#modalAlert div.modal-header').html(responseJson.error);
  284. $('#modalAlert div.modal-body').html(responseJson.error_description);
  285. $("#modalAlert").modal({ // wire up the actual modal functionality and show the dialog
  286. "backdrop" : "static",
  287. "keyboard" : true,
  288. "show" : true // ensure the modal is shown immediately
  289. });
  290. }
  291. });
  292. }
  293. return false;
  294. },
  295. cancelWhiteList:function(e) {
  296. e.preventDefault();
  297. // TODO: figure out where we came from and go back there instead
  298. if (this.model.get('id') == null) {
  299. // if it's a new whitelist entry, go back to the client listing page
  300. app.navigate('admin/clients', {trigger:true});
  301. } else {
  302. // if we're editing a whitelist, go back to the whitelists page
  303. app.navigate('admin/whitelists', {trigger:true});
  304. }
  305. },
  306. render:function (eventName) {
  307. var json = {whiteList: this.model.toJSON(), client: this.options.client.toJSON()};
  308. this.$el.html(this.template(json));
  309. this.listWidgetViews = [];
  310. var _self = this;
  311. // build and bind scopes
  312. _.each(this.model.get("allowedScopes"), function (scope) {
  313. _self.scopeCollection.add(new Backbone.Model({item:scope}));
  314. });
  315. var scopeView = new ListWidgetView({
  316. placeholder: $.t('whitelist.whitelist-form.scope-placeholder'),
  317. autocomplete: this.options.client.get("scope"),
  318. helpBlockText: $.t('whitelist.whitelist-form.scope-help'),
  319. collection: this.scopeCollection});
  320. $("#scope .controls",this.el).html(scopeView.render().el);
  321. this.listWidgetViews.push(scopeView);
  322. $(this.el).i18n();
  323. return this;
  324. }
  325. });