roojs-core.js

[roojs1] / Roo / Toolbar.js

diff --git a/Roo/Toolbar.js b/Roo/Toolbar.js
index 457dbf4..cee6171 100644 (file)
--- a/Roo/Toolbar.js
+++ b/Roo/Toolbar.js
@@ -11,6 +11,7 @@
 
 /**
  * @class Roo.Toolbar
+ * @children   Roo.Toolbar.Item Roo.Toolbar.Button Roo.Toolbar.SplitButton Roo.form.Field 
  * Basic Toolbar class.
  * @constructor
  * Creates a new Toolbar
@@ -18,9 +19,6 @@
  */ 
 Roo.Toolbar = function(container, buttons, config)
 {
-    Roo.log(container);
-    Roo.log(buttons);
-    Roo.log(config);
     /// old consturctor format still supported..
     if(container instanceof Array){ // omit the container for later rendering
         buttons = container;
@@ -55,7 +53,7 @@ Roo.Toolbar.prototype = {
      * @cfg {Array} items
      * array of button configs or elements to add (will be converted to a MixedCollection)
      */
-    
+    items: false,
     /**
      * @cfg {String/HTMLElement/Element} container
      * The id or element that will contain the toolbar
@@ -359,12 +357,28 @@ Roo.Toolbar.prototype = {
  * @param {HTMLElement} el 
  */
 Roo.Toolbar.Item = function(el){
+    var cfg = {};
+    if (typeof (el.xtype) != 'undefined') {
+        cfg = el;
+        el = cfg.el;
+    }
+    
     this.el = Roo.getDom(el);
     this.id = Roo.id(this.el);
     this.hidden = false;
+    
+    this.addEvents({
+         /**
+            * @event render
+            * Fires when the button is rendered
+            * @param {Button} this
+            */
+        'render': true
+    });
+    Roo.Toolbar.Item.superclass.constructor.call(this,cfg);
 };
-
-Roo.Toolbar.Item.prototype = {
+Roo.extend(Roo.Toolbar.Item, Roo.util.Observable, {
+//Roo.Toolbar.Item.prototype = {
     
     /**
      * Get this item's HTML Element
@@ -376,8 +390,11 @@ Roo.Toolbar.Item.prototype = {
 
     // private
     render : function(td){
-        this.td = td;
+        
+         this.td = td;
         td.appendChild(this.el);
+        
+        this.fireEvent('render', this);
     },
     
     /**
@@ -439,7 +456,7 @@ Roo.Toolbar.Item.prototype = {
         this.disabled = false;
         this.el.disabled = false;
     }
-};
+});
 
 
 /**
@@ -449,10 +466,15 @@ Roo.Toolbar.Item.prototype = {
  * @constructor
  * Creates a new Separator
  */
-Roo.Toolbar.Separator = function(){
+Roo.Toolbar.Separator = function(cfg){
+    
     var s = document.createElement("span");
     s.className = "ytb-sep";
-    Roo.Toolbar.Separator.superclass.constructor.call(this, s);
+    if (cfg) {
+        cfg.el = s;
+    }
+    
+    Roo.Toolbar.Separator.superclass.constructor.call(this, cfg || s);
 };
 Roo.extend(Roo.Toolbar.Separator, Roo.Toolbar.Item, {
     enable:Roo.emptyFn,
@@ -467,10 +489,13 @@ Roo.extend(Roo.Toolbar.Separator, Roo.Toolbar.Item, {
  * @constructor
  * Creates a new Spacer
  */
-Roo.Toolbar.Spacer = function(){
+Roo.Toolbar.Spacer = function(cfg){
     var s = document.createElement("div");
     s.className = "ytb-spacer";
-    Roo.Toolbar.Spacer.superclass.constructor.call(this, s);
+    if (cfg) {
+        cfg.el = s;
+    }
+    Roo.Toolbar.Spacer.superclass.constructor.call(this, cfg || s);
 };
 Roo.extend(Roo.Toolbar.Spacer, Roo.Toolbar.Item, {
     enable:Roo.emptyFn,
@@ -499,21 +524,46 @@ Roo.Toolbar.Fill = Roo.extend(Roo.Toolbar.Spacer, {
  * A simple class that renders text directly into a toolbar.
  * @constructor
  * Creates a new TextItem
- * @param {String} text
+ * @cfg {string} text 
  */
-Roo.Toolbar.TextItem = function(text){
-    if (typeof(text) == 'object') {
-        text = text.text;
+Roo.Toolbar.TextItem = function(cfg){
+    var  text = cfg || "";
+    if (typeof(cfg) == 'object') {
+        text = cfg.text || "";
+    }  else {
+        cfg = null;
     }
     var s = document.createElement("span");
     s.className = "ytb-text";
     s.innerHTML = text;
-    Roo.Toolbar.TextItem.superclass.constructor.call(this, s);
+    if (cfg) {
+        cfg.el  = s;
+    }
+    
+    Roo.Toolbar.TextItem.superclass.constructor.call(this, cfg ||  s);
 };
 Roo.extend(Roo.Toolbar.TextItem, Roo.Toolbar.Item, {
+    
+     
     enable:Roo.emptyFn,
     disable:Roo.emptyFn,
-    focus:Roo.emptyFn
+    focus:Roo.emptyFn,
+     /**
+     * Shows this button
+     */
+    show: function(){
+        this.hidden = false;
+        this.el.style.display = "";
+    },
+    
+    /**
+     * Hides this button
+     */
+    hide: function(){
+        this.hidden = true;
+        this.el.style.display = "none";
+    }
+    
 });
 
 /**
@@ -527,7 +577,10 @@ Roo.extend(Roo.Toolbar.TextItem, Roo.Toolbar.Item, {
 Roo.Toolbar.Button = function(config){
     Roo.Toolbar.Button.superclass.constructor.call(this, null, config);
 };
-Roo.extend(Roo.Toolbar.Button, Roo.Button, {
+Roo.extend(Roo.Toolbar.Button, Roo.Button,
+{
+    
+    
     render : function(td){
         this.td = td;
         Roo.Toolbar.Button.superclass.render.call(this, td);