Modal.js 4.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. define([ "require", "backbone", "hbs!tmpl/common/Modal" ], function(require, Backbone, template) {
  2. var Modal = Backbone.View.extend({
  3. className: "modal",
  4. events: {
  5. "click .close": function(event) {
  6. event.preventDefault(), this.trigger("closeModal"), this.options.content && this.options.content.trigger && this.options.content.trigger("closeModal", this, event);
  7. },
  8. "click .cancel": function(event) {
  9. event.preventDefault(), this.trigger("closeModal"), this.options.content && this.options.content.trigger && this.options.content.trigger("closeModal", this, event);
  10. },
  11. "click .ok": function(event) {
  12. event.preventDefault(), this.trigger("ok"), this.options.content && this.options.content.trigger && this.options.content.trigger("ok", this, event),
  13. this.options.okCloses && this.close();
  14. }
  15. },
  16. initialize: function(options) {
  17. this.options = _.extend({
  18. title: null,
  19. okText: "确认",
  20. focusOk: !0,
  21. okCloses: !0,
  22. cancelText: "取消",
  23. allowCancel: !1,
  24. allowBackdrop: !0,
  25. showFooter: !0,
  26. escape: !0,
  27. animate: !0,
  28. contentWithFooter: !1,
  29. template: template,
  30. width: null,
  31. buttons: null
  32. }, options);
  33. },
  34. render: function() {
  35. var $el = this.$el, options = this.options, content = options.content;
  36. return $el.html(options.template(options)), content && content.$el ? (content.render(),
  37. options.contentWithFooter ? $el.find(".modal-content").append(content.$el) : $el.find(".modal-body").html(content.$el)) : options.htmlContent && $el.find(".modal-body").append(options.htmlContent),
  38. options.animate && $el.addClass("fade"), this.isRendered = !0, this;
  39. },
  40. onClose: function() {
  41. alert("close");
  42. },
  43. open: function(cb) {
  44. this.isRendered || this.render(), $(".tooltip").tooltip("hide");
  45. var self = this, $el = this.$el;
  46. $el.modal(_.extend({
  47. keyboard: this.options.allowCancel,
  48. backdrop: !this.options.allowBackdrop || "static"
  49. }, this.options.modalOptions)), $el.one("shown", function() {
  50. self.options.focusOk && $el.find(".btn.ok").focus(), self.options.content && self.options.content.trigger && self.options.content.trigger("shown", self),
  51. self.trigger("shown");
  52. });
  53. var numModals = Modal.count, $backdrop = $(".modal-backdrop:eq(" + numModals + ")"), backdropIndex = parseInt($backdrop.css("z-index"), 10), elIndex = parseInt($backdrop.css("z-index"), 10);
  54. return $backdrop.css("z-index", backdropIndex + numModals), this.$el.css("z-index", elIndex + numModals),
  55. this.options.allowCancel && ($backdrop.one("click", function() {
  56. self.options.content && self.options.content.trigger && self.options.content.trigger("closeModal", self),
  57. self.trigger("closeModal");
  58. }), $(document).one("keyup.dismiss.modal", function(e) {
  59. 27 == e.which && self.trigger("closeModal"), self.options.content && self.options.content.trigger && 27 == e.which && self.options.content.trigger("shown", self);
  60. })), this.on("cancel", function() {
  61. self.close();
  62. }), Modal.count++, cb && self.on("ok", cb), $el.one("shown.bs.modal", function() {
  63. self.trigger("shownModal");
  64. }), $el.find(".header-button").on("click", "button", function() {
  65. var headerButtons = self.options.headerButtons, clickedButtonIndex = $(this).data("index"), clickedButtonObj = headerButtons && headerButtons[clickedButtonIndex];
  66. clickedButtonObj && clickedButtonObj.onClick && clickedButtonObj.onClick.apply(this, arguments);
  67. }), this;
  68. },
  69. close: function() {
  70. var self = this, $el = this.$el;
  71. return this._preventClose ? void (this._preventClose = !1) : ($(".tooltip").tooltip("hide"),
  72. $el.one("hidden.bs.modal", function onHidden(e) {
  73. return e.target !== e.currentTarget ? $el.one("hidden.bs.modal", onHidden) : (self.remove(),
  74. self.options.content && self.options.content.trigger && self.options.content.trigger("hidden.bs.modal", self),
  75. void self.trigger("hidden.bs.modal"));
  76. }), $el.modal("hide"), void Modal.count--);
  77. },
  78. preventClose: function() {
  79. this._preventClose = !0;
  80. }
  81. }, {
  82. count: 0
  83. });
  84. return Modal;
  85. });