git.roojs.org Git - roojs1/blob - Roo/bootstrap/NavProgressBar.js

   1 /*
   2  * - LGPL
   3  *
   4  * nav progress bar
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.NavProgressBar
  10  * @extends Roo.bootstrap.Component
  11  * Bootstrap NavProgressBar class
  12  *
  13  * @constructor
  14  * Create a new nav progress bar
  15  * @param {Object} config The config object
  16  */
  17
  18 Roo.bootstrap.NavProgressBar = function(config){
  19     Roo.bootstrap.NavProgressBar.superclass.constructor.call(this, config);
  20
  21     this.bullets = this.bullets || [];
  22
  23 //    Roo.bootstrap.NavProgressBar.register(this);
  24      this.addEvents({
  25         /**
  26              * @event changed
  27              * Fires when the active item changes
  28              * @param {Roo.bootstrap.NavProgressBar} this
  29              * @param {Roo.bootstrap.NavProgressItem} selected The item selected
  30              * @param {Roo.bootstrap.NavProgressItem} prev The previously selected item
  31          */
  32         'changed': true
  33      });
  34
  35 };
  36
  37 Roo.extend(Roo.bootstrap.NavProgressBar, Roo.bootstrap.Component,  {
  38
  39     bullets : [],
  40     barItems : [],
  41
  42
  43     getAutoCreate : function()
  44     {
  45         var cfg = Roo.apply({}, Roo.bootstrap.NavProgressBar.superclass.getAutoCreate.call(this));
  46
  47         cfg = {
  48             tag : 'ul',
  49             cls: 'roo-navigation-bar'
  50         }
  51
  52         return cfg;
  53
  54     },
  55
  56     onRender : function(ct, position)
  57     {
  58         Roo.bootstrap.NavProgressBar.superclass.onRender.call(this, ct, position);
  59
  60         if(this.bullets.length){
  61             Roo.each(this.bullets, function(b){
  62                this.addItem(b);
  63             }, this);
  64         }
  65
  66     },
  67
  68     addItem : function(cfg)
  69     {
  70         var item = new Roo.bootstrap.NavProgressItem(cfg);
  71
  72         item.parentId = this.id;
  73         item.onRender(this.el, null);
  74
  75         this.barItems.push(item);
  76
  77         this.formatBullets();
  78
  79         return item;
  80     },
  81
  82     getActive : function()
  83     {
  84         var active = false;
  85
  86         Roo.each(this.barItems, function(v){
  87
  88             if (!v.isActive()) {
  89                 return;
  90             }
  91
  92             active = v;
  93             return false;
  94
  95         });
  96
  97         return active;
  98     },
  99
 100     setActiveItem : function(item)
 101     {
 102         var prev = false;
 103
 104         Roo.each(this.barItems, function(v){
 105             if (v.rid == item.rid) {
 106                 return ;
 107             }
 108
 109             if (v.isActive()) {
 110                 v.setActive(false);
 111                 prev = v;
 112             }
 113         });
 114
 115         item.setActive(true);
 116
 117         this.fireEvent('changed', this, item, prev);
 118     },
 119
 120     getBarItem: function(rid)
 121     {
 122         var ret = false;
 123
 124         Roo.each(this.barItems, function(e) {
 125             if (e.rid != rid) {
 126                 return;
 127             }
 128
 129             ret =  e;
 130             return false;
 131         });
 132
 133         return ret;
 134     },
 135
 136     indexOfItem : function(item)
 137     {
 138         var index = false;
 139
 140         Roo.each(this.barItems, function(v, i){
 141
 142             if (v.rid != item.rid) {
 143                 return;
 144             }
 145
 146             index = i;
 147             return false
 148         });
 149
 150         return index;
 151     },
 152
 153     setActiveNext : function()
 154     {
 155         var i = this.indexOfItem(this.getActive());
 156
 157         if (i > this.items.length) {
 158             return;
 159         }
 160
 161         this.setActiveItem(this.items[i+1]);
 162     },
 163
 164     setActivePrev : function()
 165     {
 166         var i = this.indexOfItem(this.getActive());
 167
 168         if (i  < 1) {
 169             return;
 170         }
 171
 172         this.setActiveItem(this.items[i-1]);
 173     },
 174
 175     formatBullets : function()
 176     {
 177         if(!this.barItems.length){
 178             return;
 179         }
 180
 181         var width = 100 / this.barItems.length;
 182
 183         Roo.each(this.barItems, function(i){
 184             i.el.setStyle('width', width + '%');
 185         }, this);
 186     }
 187
 188
 189
 190 //    indexOfNav : function(item)
 191 //    {
 192 //        var index = false;
 193 //
 194 //        Roo.each(this.items, function(v,i){
 195 //
 196 //            if (v != item) {
 197 //                return;
 198 //            }
 199 //
 200 //            index = i;
 201 //            return false
 202 //        });
 203 //
 204 //        return index;
 205 //    },
 206 //
 207     /**
 208     * adds a Navigation item
 209     * @param {Roo.bootstrap.NavProgressItem} the NavProgressItem to add
 210     */
 211
 212 //
 213 //    /**
 214 //    * register a Navigation item
 215 //    * @param {Roo.bootstrap.NavItem} the navitem to add
 216 //    */
 217 //    register : function(item)
 218 //    {
 219 //        this.items.push(item);
 220 //        item.navId = this.navId;
 221 //
 222 //    },
 223 //
 224 //    /**
 225 //    * clear all the Navigation item
 226 //    */
 227 //
 228 //    clearAll : function()
 229 //    {
 230 //        this.items = [];
 231 //        this.el.dom.innerHTML = '';
 232 //    },
 233 //
 234 //    getNavItem: function(tabId)
 235 //    {
 236 //        var ret = false;
 237 //        Roo.each(this.items, function(e) {
 238 //            if (e.tabId == tabId) {
 239 //               ret =  e;
 240 //               return false;
 241 //            }
 242 //            return true;
 243 //
 244 //        });
 245 //        return ret;
 246 //    },
 247 //
 248 //    setActiveNext : function()
 249 //    {
 250 //        var i = this.indexOfNav(this.getActive());
 251 //
 252 //        if (i > this.items.length) {
 253 //            return;
 254 //        }
 255 //
 256 //        this.setActiveItem(this.items[i+1]);
 257 //    },
 258 //
 259 //    setActivePrev : function()
 260 //    {
 261 //        var i = this.indexOfNav(this.getActive());
 262 //
 263 //        if (i  < 1) {
 264 //            return;
 265 //        }
 266 //
 267 //        this.setActiveItem(this.items[i-1]);
 268 //    },
 269 //
 270 //    clearWasActive : function(except) {
 271 //        Roo.each(this.items, function(e) {
 272 //            if (e.tabId != except.tabId && e.was_active) {
 273 //               e.was_active = false;
 274 //               return false;
 275 //            }
 276 //            return true;
 277 //
 278 //        });
 279 //    },
 280 //
 281 //    getWasActive : function ()
 282 //    {
 283 //        var r = false;
 284 //        Roo.each(this.items, function(e) {
 285 //            if (e.was_active) {
 286 //               r = e;
 287 //               return false;
 288 //            }
 289 //            return true;
 290 //
 291 //        });
 292 //        return r;
 293 //    }
 294
 295
 296 });
 297
 298 //
 299 //Roo.apply(Roo.bootstrap.NavProgressBar, {
 300 //
 301 //    groups: {},
 302 //     /**
 303 //    * register a Navigation Group
 304 //    * @param {Roo.bootstrap.NavGroup} the navgroup to add
 305 //    */
 306 //    register : function(bar)
 307 //    {
 308 //        this.groups[bar.navId] = bar;
 309 //
 310 //    },
 311 //    /**
 312 //    * fetch a Navigation Bar based on the navigation ID
 313 //    * @param {string} the nav bar to add
 314 //    * @returns {Roo.bootstrap.NavProgressBar} the nav bar
 315 //    */
 316 //    get: function(navId)
 317 //    {
 318 //        if (typeof(this.groups[navId]) == 'undefined') {
 319 //            return false;
 320 //        }
 321 //
 322 //        return this.groups[navId] ;
 323 //    }
 324 //
 325 //});
 326
 327