_dialog.js in trestle-0.8.7

- old
+ new

@@ -1,7 +1,13 @@
-Trestle.Dialog = function() {
+Trestle.Dialog = function(options) {
+  options = options || {};
+
   this.el = Trestle.Dialog.getElement();
+
+  if (options.modalClass) {
+    this.el.find('.modal-dialog').addClass(options.modalClass);
+  }
 };
 
 Trestle.Dialog.TEMPLATE =
   '<div id="dialog" class="modal fade" tabindex="-1">' +
     '<div class="modal-dialog">' +
@@ -29,10 +35,19 @@
   }
 
   return el;
 };
 
+Trestle.Dialog.showError = function(title, errorText) {
+  var dialog = new Trestle.Dialog({ modalClass: 'modal-lg' });
+
+  dialog.showError(title, $('<pre>').addClass('exception').text(errorText));
+  dialog.show();
+
+  return dialog;
+};
+
 Trestle.Dialog.prototype.load = function(url) {
   var dialog = this;
 
   dialog.show();
   dialog.setLoading(true);
@@ -48,11 +63,16 @@
     },
     success: function(content) {
       dialog.setContent(content);
     },
     error: function(xhr, status, error) {
-      dialog.showError(error);
+      var errorMessage = Trestle.i18n['trestle.dialog.error'] || 'The request could not be completed.';
+
+      var title = error || errorMessage;
+      var content = $('<p>').text(errorMessage);
+
+      dialog.showError(title, content);
     }
   });
 };
 
 Trestle.Dialog.prototype.setLoading = function(loading) {
@@ -66,24 +86,22 @@
 Trestle.Dialog.prototype.setContent = function(content) {
   this.el.find('.modal-content').html(content);
   $(Trestle).trigger('init', this.el);
 };
 
-Trestle.Dialog.prototype.showError = function(error) {
+Trestle.Dialog.prototype.showError = function(title, content) {
   this.el.addClass('error');
 
   var container = this.el.find('.modal-content').empty();
 
-  var errorMessage = Trestle.i18n['trestle.dialog.error'] || 'The request could not be completed.';
-
   $('<div class="modal-header">')
     .append('<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>')
-    .append('<h4 class="modal-title"></h4>').find('h4').text(error || errorMessage).end()
+    .append('<h4 class="modal-title"></h4>').find('h4').text(title).end()
     .appendTo(container);
 
   $('<div class="modal-body">')
-    .append('<p>').find('p').text(errorMessage).end()
+    .append(content)
     .appendTo(container);
 
   $('<div class="modal-footer">')
     .append('<button type="button" class="btn btn-default" data-dismiss="modal" aria-label="OK">').find('button').text(Trestle.i18n['admin.buttons.ok'] || 'OK').end()
     .appendTo(container);
@@ -100,8 +118,11 @@
 $(document).on('click', '[data-behavior="dialog"]', function(e) {
   e.preventDefault();
 
   var url = $(this).data('url') || $(this).attr('href');
 
-  var dialog = new Trestle.Dialog();
+  var dialog = new Trestle.Dialog({
+    modalClass: $(this).data('dialog-class')
+  });
+
   dialog.load(url);
 });