1 <html><head><title>../roojs1/Roo/bootstrap/NavProgressBar.js</title><link rel="stylesheet" type="text/css" href="../../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
9 * @class Roo.bootstrap.NavProgressBar
10 * @extends Roo.bootstrap.Component
11 * Bootstrap NavProgressBar class
14 * Create a new nav progress bar
15 * @param {Object} config The config object
18 </span><span class="jsdoc-var">Roo.bootstrap.NavProgressBar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
19 </span><span class="jsdoc-var">Roo.bootstrap.NavProgressBar.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
21 </span><span class="jsdoc-var">this.bullets </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.bullets </span><span class="jsdoc-syntax">|| [];
23 </span><span class="jsdoc-comment">// Roo.bootstrap.NavProgressBar.register(this);
24 </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
25 </span><span class="jsdoc-comment">/**
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
32 </span><span class="jsdoc-string">'changed'</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
33 </span><span class="jsdoc-syntax">});
37 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.NavProgressBar</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">, {
39 </span><span class="jsdoc-var">bullets </span><span class="jsdoc-syntax">: [],
40 </span><span class="jsdoc-var">barItems </span><span class="jsdoc-syntax">: [],
43 </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
45 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({}, </span><span class="jsdoc-var">Roo.bootstrap.NavProgressBar.superclass.getAutoCreate.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">));
47 </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
48 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ul'</span><span class="jsdoc-syntax">,
49 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-navigation-bar'
50 </span><span class="jsdoc-syntax">}
52 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
56 </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">)
58 </span><span class="jsdoc-var">Roo.bootstrap.NavProgressBar.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
60 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bullets.length</span><span class="jsdoc-syntax">){
61 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bullets</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">){
62 </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">);
63 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
68 </span><span class="jsdoc-var">addItem </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">)
70 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.NavProgressItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">);
72 </span><span class="jsdoc-var">item.parentId </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.id</span><span class="jsdoc-syntax">;
73 </span><span class="jsdoc-var">item.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
75 </span><span class="jsdoc-var">this.barItems.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
77 </span><span class="jsdoc-var">this.formatBullets</span><span class="jsdoc-syntax">();
79 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
82 </span><span class="jsdoc-var">getActive </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
84 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">active </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
86 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.barItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">){
88 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">v.isActive</span><span class="jsdoc-syntax">()) {
89 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
92 </span><span class="jsdoc-var">active </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
93 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
97 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">active</span><span class="jsdoc-syntax">;
100 </span><span class="jsdoc-var">setActiveItem </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">)
102 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">prev </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
104 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.barItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">){
105 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.rid </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">item.rid</span><span class="jsdoc-syntax">) {
106 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">;
109 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.isActive</span><span class="jsdoc-syntax">()) {
110 </span><span class="jsdoc-var">v.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
111 </span><span class="jsdoc-var">prev </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
115 </span><span class="jsdoc-var">item.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
117 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'changed'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">prev</span><span class="jsdoc-syntax">);
120 </span><span class="jsdoc-var">getBarItem</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rid</span><span class="jsdoc-syntax">)
122 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ret </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
124 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.barItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">) {
125 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.rid </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">rid</span><span class="jsdoc-syntax">) {
126 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
129 </span><span class="jsdoc-var">ret </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">;
130 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
133 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">ret</span><span class="jsdoc-syntax">;
136 </span><span class="jsdoc-var">indexOfItem </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">)
138 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">index </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
140 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.barItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">){
142 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.rid </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">item.rid</span><span class="jsdoc-syntax">) {
143 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
146 </span><span class="jsdoc-var">index </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">;
147 </span><span class="jsdoc-keyword">return false
148 </span><span class="jsdoc-syntax">});
150 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">;
153 </span><span class="jsdoc-var">setActiveNext </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
155 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.indexOfItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getActive</span><span class="jsdoc-syntax">());
157 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">> </span><span class="jsdoc-var">this.barItems.length</span><span class="jsdoc-syntax">) {
158 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
161 </span><span class="jsdoc-var">this.setActiveItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.barItems</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">+1]);
164 </span><span class="jsdoc-var">setActivePrev </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
166 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.indexOfItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getActive</span><span class="jsdoc-syntax">());
168 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">< 1) {
169 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
172 </span><span class="jsdoc-var">this.setActiveItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.barItems</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">-1]);
175 </span><span class="jsdoc-var">formatBullets </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
177 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.barItems.length</span><span class="jsdoc-syntax">){
178 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
181 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= 100 / </span><span class="jsdoc-var">this.barItems.length</span><span class="jsdoc-syntax">;
183 </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.barItems</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">){
184 </span><span class="jsdoc-var">i.el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'width'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'%'</span><span class="jsdoc-syntax">);
185 }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
189 </span></code></body></html>