Roo/bootstrap/Modal.js
[roojs1] / Roo / bootstrap / Modal.js
index ab945dd..aa5f622 100644 (file)
  * @cfg {Boolean} animate default true
  * @cfg {Boolean} allow_close default true
  * @cfg {Boolean} fitwindow default false
+ * @cfg {Number} width fixed width - usefull for chrome extension only really.
+ * @cfg {Number} height fixed height - usefull for chrome extension only really.
  * @cfg {String} size (sm|lg) default empty
  * @cfg {Number} max_width set the max width of modal
+ * @cfg {Boolean} editable_title can the title be edited
+
  *
  *
  * @constructor
@@ -42,13 +46,15 @@ Roo.bootstrap.Modal = function(config){
          * @param {Roo.EventObject} e
          */
         "resize" : true,
-         /**
-         * @event close
-         * Fire when the top 'x' close button is pressed.
+        /**
+         * @event titlechanged
+         * Fire when the editable title has been changed
          * @param {Roo.bootstrap.Modal} this
          * @param {Roo.EventObject} e
+         * @param {Roo.EventObject} value
          */
-        "close" : true
+        "titlechanged" : true,
+        
     });
     this.buttons = this.buttons || [];
 
@@ -173,8 +179,9 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
 
     getAutoCreate : function()
     {
+        // we will default to modal-body-overflow - might need to remove or make optional later.
         var bdy = {
-                cls : 'modal-body',
+                cls : 'modal-body enable-modal-body-overflow ', 
                 html : this.html || ''
         };
 
@@ -187,7 +194,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
         if(this.specificTitle){
             title = this.title;
 
-        };
+        }
 
         var header = [];
         if (this.allow_close && Roo.bootstrap.version == 3) {
@@ -279,17 +286,13 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
     initEvents : function()
     {
         if (this.allow_close) {
-            this.closeEl.on('click', this.onClosePress, this);
+            this.closeEl.on('click', this.hide, this);
         }
         Roo.EventManager.onWindowResize(this.resize, this, true);
 
 
     },
-    
-    onClosePress : function()
-    {
-        
-    },
+  
 
     resize : function()
     {
@@ -300,8 +303,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
         
         if (this.fitwindow) {
             
-            var view_height = Roo.lib.Dom.getViewportHeight(true);
-            
+           
             this.setSize(
                 this.width || Roo.lib.Dom.getViewportWidth(true) - 30,
                 this.height || Roo.lib.Dom.getViewportHeight(true) // catering margin-top 30 margin-bottom 30
@@ -365,7 +367,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
         Roo.get(document.body).addClass('modal-open');
  
         if(this.animate){  // element has 'fade'  - so stuff happens after .3s ?- not sure why the delay?
-            var _this = this;
+            
             (function(){
                 this.el.addClass('show');
                 this.el.addClass('in');
@@ -472,7 +474,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
     {
         this.dialogEl.setWidth(w);
         
-        var diff = this.headerEl.getHeight() + this.footerEl.getHeight() + 30; // dialog margin-bottom: 30  
+        var diff = this.headerEl.getHeight() + this.footerEl.getHeight() + 60; // dialog margin-bottom: 30  
 
         this.bodyEl.setHeight(h - diff);
         
@@ -521,7 +523,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
             !child_nodes ||
             child_nodes.length == 0
         ) {
-            return;
+            return 0;
         }
         
         var child_height = 0;
@@ -642,3 +644,4 @@ Roo.apply(Roo.bootstrap.Modal,  {
         
         zIndex : 10001
 });
+