webgui/www/extras/yui-ext/docs/output/Toolbar.js.html
JT Smith cfd09a5cb6 upgraded to yui 0.12.0
upgraded to yui-ext 0.33 rc2
2006-11-28 02:23:34 +00:00

286 lines
No EOL
49 KiB
HTML

<html><head><title>Toolbar.js</title><link rel="stylesheet" type="text/css" href="../style.css" media="screen"/></head><body><div class="hl-main"><pre><span class="hl-comment">/**
* @class YAHOO.ext.Toolbar
* Basic Toolbar used by the Grid to create the paging toolbar. This class is reusable but functionality
* is limited. Look for more functionality in a future version.
*/
</span><span class="hl-identifier">YAHOO</span><span class="hl-default">.</span><span class="hl-identifier">ext</span><span class="hl-default">.</span><span class="hl-identifier">Toolbar</span><span class="hl-default"> = </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">container</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code"> = </span><span class="hl-identifier">getEl</span><span class="hl-brackets">(</span><span class="hl-identifier">container</span><span class="hl-code">, </span><span class="hl-reserved">true</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">div</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">div</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">div</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">ytoolbar</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">tb</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">table</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">tb</span><span class="hl-code">.</span><span class="hl-identifier">border</span><span class="hl-code"> = </span><span class="hl-number">0</span><span class="hl-code">;
</span><span class="hl-identifier">tb</span><span class="hl-code">.</span><span class="hl-identifier">cellPadding</span><span class="hl-code"> = </span><span class="hl-number">0</span><span class="hl-code">;
</span><span class="hl-identifier">tb</span><span class="hl-code">.</span><span class="hl-identifier">cellSpacing</span><span class="hl-code"> = </span><span class="hl-number">0</span><span class="hl-code">;
</span><span class="hl-identifier">div</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">tb</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">tbody</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">tbody</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">tb</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">tbody</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">tr</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">tr</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">tbody</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">tr</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">dom</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">div</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tr</span><span class="hl-code"> = </span><span class="hl-identifier">tr</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-default">;
</span><span class="hl-identifier">YAHOO</span><span class="hl-default">.</span><span class="hl-identifier">ext</span><span class="hl-default">.</span><span class="hl-identifier">Toolbar</span><span class="hl-default">.</span><span class="hl-identifier">prototype</span><span class="hl-default"> = </span><span class="hl-brackets">{
</span><span class="hl-comment">/**
* Adds element(s) to the toolbar - this function takes a variable number of
* arguments of mixed type and adds them to the toolbar...
*
* @param {Mixed} arg If arg is a ToolbarButton, it is added. If arg is a string, it is wrapped
* in a ytb-text element and added unless the text is &quot;separator&quot; in which case a separator
* is added. Otherwise, it is assumed the element is an HTMLElement and it is added directly.
*/
</span><span class="hl-identifier">add</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">for</span><span class="hl-brackets">(</span><span class="hl-reserved">var </span><span class="hl-identifier">i</span><span class="hl-code"> = </span><span class="hl-number">0</span><span class="hl-code">; </span><span class="hl-identifier">i</span><span class="hl-code"> &lt; </span><span class="hl-identifier">arguments</span><span class="hl-code">.</span><span class="hl-identifier">length</span><span class="hl-code">; </span><span class="hl-identifier">i</span><span class="hl-code">++</span><span class="hl-brackets">){
</span><span class="hl-reserved">var </span><span class="hl-identifier">el</span><span class="hl-code"> = </span><span class="hl-identifier">arguments</span><span class="hl-brackets">[</span><span class="hl-identifier">i</span><span class="hl-brackets">]</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">td</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">td</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tr</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">td</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-identifier">el </span><span class="hl-reserved">instanceof </span><span class="hl-identifier">YAHOO</span><span class="hl-code">.</span><span class="hl-identifier">ext</span><span class="hl-code">.</span><span class="hl-identifier">ToolbarButton</span><span class="hl-brackets">){
</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">init</span><span class="hl-brackets">(</span><span class="hl-identifier">td</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-reserved">else if</span><span class="hl-brackets">(</span><span class="hl-identifier">el </span><span class="hl-reserved">instanceof </span><span class="hl-builtin">Array</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">addButton</span><span class="hl-brackets">(</span><span class="hl-identifier">el</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-reserved">else if</span><span class="hl-brackets">(</span><span class="hl-reserved">typeof </span><span class="hl-identifier">el</span><span class="hl-code"> == </span><span class="hl-quotes">'</span><span class="hl-string">string</span><span class="hl-quotes">'</span><span class="hl-brackets">){
</span><span class="hl-reserved">var </span><span class="hl-identifier">span</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">span</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-identifier">el</span><span class="hl-code"> == </span><span class="hl-quotes">'</span><span class="hl-string">separator</span><span class="hl-quotes">'</span><span class="hl-brackets">){
</span><span class="hl-identifier">span</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">ytb-sep</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-reserved">else</span><span class="hl-brackets">{
</span><span class="hl-identifier">span</span><span class="hl-code">.</span><span class="hl-identifier">innerHTML</span><span class="hl-code"> = </span><span class="hl-identifier">el</span><span class="hl-code">;
</span><span class="hl-identifier">span</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">ytb-text</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-identifier">td</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">span</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-reserved">else if</span><span class="hl-brackets">(</span><span class="hl-reserved">typeof </span><span class="hl-identifier">el</span><span class="hl-code"> == </span><span class="hl-quotes">'</span><span class="hl-string">object</span><span class="hl-quotes">'</span><span class="hl-brackets">){ </span><span class="hl-comment">// must be element?
</span><span class="hl-identifier">td</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">el</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
}
}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Returns the element for this toolbar
* @return {YAHOO.ext.Element}
*/
</span><span class="hl-identifier">getEl</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">return this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Adds a separator
*/
</span><span class="hl-identifier">addSeparator</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">var </span><span class="hl-identifier">td</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">td</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tr</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">td</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">span</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">span</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">span</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">ytb-sep</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-identifier">td</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">span</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Add a button (or buttons), see {@link YAHOO.ext.ToolbarButton} for more info on the config
* @param {Object/Array} config A button config or array of configs
* @return {YAHOO.ext.ToolbarButton/Array}
*/
</span><span class="hl-identifier">addButton</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">config</span><span class="hl-brackets">){
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-identifier">config </span><span class="hl-reserved">instanceof </span><span class="hl-builtin">Array</span><span class="hl-brackets">){
</span><span class="hl-reserved">var </span><span class="hl-identifier">buttons</span><span class="hl-code"> = </span><span class="hl-brackets">[]</span><span class="hl-code">;
</span><span class="hl-reserved">for</span><span class="hl-brackets">(</span><span class="hl-reserved">var </span><span class="hl-identifier">i</span><span class="hl-code"> = </span><span class="hl-number">0</span><span class="hl-code">, </span><span class="hl-identifier">len</span><span class="hl-code"> = </span><span class="hl-identifier">config</span><span class="hl-code">.</span><span class="hl-identifier">length</span><span class="hl-code">; </span><span class="hl-identifier">i</span><span class="hl-code"> &lt; </span><span class="hl-identifier">len</span><span class="hl-code">; </span><span class="hl-identifier">i</span><span class="hl-code">++</span><span class="hl-brackets">) {
</span><span class="hl-identifier">buttons</span><span class="hl-code">.</span><span class="hl-identifier">push</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">addButton</span><span class="hl-brackets">(</span><span class="hl-identifier">config</span><span class="hl-brackets">[</span><span class="hl-identifier">i</span><span class="hl-brackets">]))</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-reserved">return </span><span class="hl-identifier">buttons</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-reserved">var </span><span class="hl-identifier">b</span><span class="hl-code"> = </span><span class="hl-identifier">config</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-code">!</span><span class="hl-brackets">(</span><span class="hl-identifier">config </span><span class="hl-reserved">instanceof </span><span class="hl-identifier">YAHOO</span><span class="hl-code">.</span><span class="hl-identifier">ext</span><span class="hl-code">.</span><span class="hl-identifier">ToolbarButton</span><span class="hl-brackets">)){
</span><span class="hl-identifier">b</span><span class="hl-code"> = </span><span class="hl-reserved">new </span><span class="hl-identifier">YAHOO</span><span class="hl-code">.</span><span class="hl-identifier">ext</span><span class="hl-code">.</span><span class="hl-identifier">ToolbarButton</span><span class="hl-brackets">(</span><span class="hl-identifier">config</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">add</span><span class="hl-brackets">(</span><span class="hl-identifier">b</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">return </span><span class="hl-identifier">b</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Adds text to the toolbar
* @param {String} text The text to add
* @return {HTMLElement} The span element created which you can use to update the text.
*/
</span><span class="hl-identifier">addText</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">text</span><span class="hl-brackets">){
</span><span class="hl-reserved">var </span><span class="hl-identifier">td</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">td</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tr</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">td</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">span</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">span</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">span</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">ytb-text</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-identifier">span</span><span class="hl-code">.</span><span class="hl-identifier">innerHTML</span><span class="hl-code"> = </span><span class="hl-identifier">text</span><span class="hl-code">;
</span><span class="hl-identifier">td</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">span</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">return </span><span class="hl-identifier">span</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Inserts a button (or buttons) at the specified index
* @param {Number} index The index where the buttons are to be inserted
* @param {Object/Array} config A button config or array of configs
* @return {YAHOO.ext.ToolbarButton/Array}
*/
</span><span class="hl-identifier">insertButton</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">index</span><span class="hl-code">, </span><span class="hl-identifier">config</span><span class="hl-brackets">){
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-identifier">config </span><span class="hl-reserved">instanceof </span><span class="hl-builtin">Array</span><span class="hl-brackets">){
</span><span class="hl-reserved">var </span><span class="hl-identifier">buttons</span><span class="hl-code"> = </span><span class="hl-brackets">[]</span><span class="hl-code">;
</span><span class="hl-reserved">for</span><span class="hl-brackets">(</span><span class="hl-reserved">var </span><span class="hl-identifier">i</span><span class="hl-code"> = </span><span class="hl-number">0</span><span class="hl-code">, </span><span class="hl-identifier">len</span><span class="hl-code"> = </span><span class="hl-identifier">config</span><span class="hl-code">.</span><span class="hl-identifier">length</span><span class="hl-code">; </span><span class="hl-identifier">i</span><span class="hl-code"> &lt; </span><span class="hl-identifier">len</span><span class="hl-code">; </span><span class="hl-identifier">i</span><span class="hl-code">++</span><span class="hl-brackets">) {
</span><span class="hl-identifier">buttons</span><span class="hl-code">.</span><span class="hl-identifier">push</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">insertButton</span><span class="hl-brackets">(</span><span class="hl-identifier">index</span><span class="hl-code"> + </span><span class="hl-identifier">i</span><span class="hl-code">, </span><span class="hl-identifier">config</span><span class="hl-brackets">[</span><span class="hl-identifier">i</span><span class="hl-brackets">]))</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-reserved">return </span><span class="hl-identifier">buttons</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-reserved">var </span><span class="hl-identifier">b</span><span class="hl-code"> = </span><span class="hl-reserved">new </span><span class="hl-identifier">YAHOO</span><span class="hl-code">.</span><span class="hl-identifier">ext</span><span class="hl-code">.</span><span class="hl-identifier">ToolbarButton</span><span class="hl-brackets">(</span><span class="hl-identifier">config</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">td</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">td</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">nextSibling</span><span class="hl-code"> = </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tr</span><span class="hl-code">.</span><span class="hl-identifier">childNodes</span><span class="hl-brackets">[</span><span class="hl-identifier">index</span><span class="hl-brackets">]</span><span class="hl-code">;
</span><span class="hl-reserved">if </span><span class="hl-brackets">(</span><span class="hl-identifier">nextSibling</span><span class="hl-brackets">)
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tr</span><span class="hl-code">.</span><span class="hl-identifier">insertBefore</span><span class="hl-brackets">(</span><span class="hl-identifier">td</span><span class="hl-code">, </span><span class="hl-identifier">nextSibling</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">else
this</span><span class="hl-code">.</span><span class="hl-identifier">tr</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">td</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">b</span><span class="hl-code">.</span><span class="hl-identifier">init</span><span class="hl-brackets">(</span><span class="hl-identifier">td</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">return </span><span class="hl-identifier">b</span><span class="hl-code">;
</span><span class="hl-brackets">}
}</span><span class="hl-default">;
</span><span class="hl-comment">/**
* @class YAHOO.ext.ToolbarButton
* A toolbar button. The config has the following options:
* &lt;ul&gt;
* &lt;li&gt;className - The CSS class for the button. Use this to attach a background image for an icon.&lt;/li&gt;
* &lt;li&gt;text - The button's text&lt;/li&gt;
* &lt;li&gt;tooltip - The buttons tooltip text&lt;/li&gt;
* &lt;li&gt;click - function to call when the button is clicked&lt;/li&gt;
* &lt;li&gt;mouseover - function to call when the mouse moves over the button&lt;/li&gt;
* &lt;li&gt;mouseout - function to call when the mouse moves off the button&lt;/li&gt;
* &lt;li&gt;scope - The scope of the above event handlers&lt;/li&gt;
* &lt;li&gt;&lt;/li&gt;
* &lt;li&gt;&lt;/li&gt;
*/
</span><span class="hl-identifier">YAHOO</span><span class="hl-default">.</span><span class="hl-identifier">ext</span><span class="hl-default">.</span><span class="hl-identifier">ToolbarButton</span><span class="hl-default"> = </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">config</span><span class="hl-brackets">){
</span><span class="hl-identifier">YAHOO</span><span class="hl-code">.</span><span class="hl-identifier">ext</span><span class="hl-code">.</span><span class="hl-identifier">util</span><span class="hl-code">.</span><span class="hl-identifier">Config</span><span class="hl-code">.</span><span class="hl-identifier">apply</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">, </span><span class="hl-identifier">config</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-default">;
</span><span class="hl-identifier">YAHOO</span><span class="hl-default">.</span><span class="hl-identifier">ext</span><span class="hl-default">.</span><span class="hl-identifier">ToolbarButton</span><span class="hl-default">.</span><span class="hl-identifier">prototype</span><span class="hl-default"> = </span><span class="hl-brackets">{
</span><span class="hl-comment">/** @private */
</span><span class="hl-identifier">init</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">appendTo</span><span class="hl-brackets">){
</span><span class="hl-reserved">var </span><span class="hl-identifier">element</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">span</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">element</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">ytb-button</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-identifier">element</span><span class="hl-code">.</span><span class="hl-identifier">unselectable</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">on</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">id</span><span class="hl-brackets">){
</span><span class="hl-identifier">element</span><span class="hl-code">.</span><span class="hl-identifier">id</span><span class="hl-code"> = </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">id</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-code"> = </span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-code"> === </span><span class="hl-reserved">true</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">var </span><span class="hl-identifier">inner</span><span class="hl-code"> = </span><span class="hl-builtin">document</span><span class="hl-code">.</span><span class="hl-identifier">createElement</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">span</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">inner</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">ytb-button-inner </span><span class="hl-quotes">'</span><span class="hl-code"> + </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">className</span><span class="hl-code">;
</span><span class="hl-identifier">inner</span><span class="hl-code">.</span><span class="hl-identifier">unselectable</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">on</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tooltip</span><span class="hl-brackets">){
</span><span class="hl-identifier">element</span><span class="hl-code">.</span><span class="hl-identifier">setAttribute</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">title</span><span class="hl-quotes">'</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">tooltip</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">style</span><span class="hl-brackets">){
</span><span class="hl-identifier">YAHOO</span><span class="hl-code">.</span><span class="hl-identifier">ext</span><span class="hl-code">.</span><span class="hl-identifier">DomHelper</span><span class="hl-code">.</span><span class="hl-identifier">applyStyles</span><span class="hl-brackets">(</span><span class="hl-identifier">inner</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">style</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
</span><span class="hl-identifier">element</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">inner</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">appendTo</span><span class="hl-code">.</span><span class="hl-identifier">appendChild</span><span class="hl-brackets">(</span><span class="hl-identifier">element</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code"> = </span><span class="hl-identifier">getEl</span><span class="hl-brackets">(</span><span class="hl-identifier">element</span><span class="hl-code">, </span><span class="hl-reserved">true</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-identifier">inner</span><span class="hl-code">.</span><span class="hl-identifier">innerHTML</span><span class="hl-code"> = </span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">text</span><span class="hl-code"> ? </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">text</span><span class="hl-code"> : </span><span class="hl-quotes">'</span><span class="hl-string">&amp;#160;</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">inner</span><span class="hl-code"> = </span><span class="hl-identifier">inner</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">mon</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">click</span><span class="hl-quotes">'</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-builtin">onClick</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">, </span><span class="hl-reserved">true</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">mon</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">mouseover</span><span class="hl-quotes">'</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-builtin">onMouseOver</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">, </span><span class="hl-reserved">true</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">mon</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">mouseout</span><span class="hl-quotes">'</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-builtin">onMouseOut</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-code">, </span><span class="hl-reserved">true</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Sets this buttons click handler
* @param {Function} click The function to call when the button is clicked
* @param {Object} scope (optional) Scope for the function passed above
*/
</span><span class="hl-identifier">setHandler</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">click</span><span class="hl-code">, </span><span class="hl-identifier">scope</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">click</span><span class="hl-code"> = </span><span class="hl-identifier">click</span><span class="hl-code">;
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">scope</span><span class="hl-code"> = </span><span class="hl-identifier">scope</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Set this buttons text
* @param {String} text
*/
</span><span class="hl-identifier">setText</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">text</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">inner</span><span class="hl-code">.</span><span class="hl-identifier">innerHTML</span><span class="hl-code"> = </span><span class="hl-identifier">text</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Set this buttons tooltip text
* @param {String} text
*/
</span><span class="hl-identifier">setTooltip</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">text</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">dom</span><span class="hl-code">.</span><span class="hl-identifier">title</span><span class="hl-code"> = </span><span class="hl-identifier">text</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Show this button
*/
</span><span class="hl-identifier">show</span><span class="hl-code">: </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">dom</span><span class="hl-code">.</span><span class="hl-identifier">parentNode</span><span class="hl-code">.</span><span class="hl-identifier">style</span><span class="hl-code">.</span><span class="hl-identifier">display</span><span class="hl-code"> = </span><span class="hl-quotes">''</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Hide this button
*/
</span><span class="hl-identifier">hide</span><span class="hl-code">: </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">dom</span><span class="hl-code">.</span><span class="hl-identifier">parentNode</span><span class="hl-code">.</span><span class="hl-identifier">style</span><span class="hl-code">.</span><span class="hl-identifier">display</span><span class="hl-code"> = </span><span class="hl-quotes">'</span><span class="hl-string">none</span><span class="hl-quotes">'</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Disable this button
*/
</span><span class="hl-identifier">disable</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-code"> = </span><span class="hl-reserved">true</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">addClass</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">ytb-button-disabled</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Enable this button
*/
</span><span class="hl-identifier">enable</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-code"> = </span><span class="hl-reserved">false</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">removeClass</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">ytb-button-disabled</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
}</span><span class="hl-code">,
</span><span class="hl-comment">/**
* Returns true if this button is disabled.
* @return {Boolean}
*/
</span><span class="hl-identifier">isDisabled</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">return this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-code"> === </span><span class="hl-reserved">true</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-code">,
</span><span class="hl-identifier">setDisabled</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(</span><span class="hl-identifier">disabled</span><span class="hl-brackets">){
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-identifier">disabled</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disable</span><span class="hl-brackets">()</span><span class="hl-code">;
</span><span class="hl-brackets">}</span><span class="hl-reserved">else</span><span class="hl-brackets">{
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">enable</span><span class="hl-brackets">()</span><span class="hl-code">;
</span><span class="hl-brackets">}
}</span><span class="hl-code">,
</span><span class="hl-comment">/** @private */
</span><span class="hl-builtin">onClick</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-code">!</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-code"> &amp;&amp; </span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">click</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">click</span><span class="hl-code">.</span><span class="hl-identifier">call</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">scope</span><span class="hl-code"> || </span><span class="hl-builtin">window</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
}</span><span class="hl-code">,
</span><span class="hl-comment">/** @private */
</span><span class="hl-builtin">onMouseOver</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-code">!</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">addClass</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">ytb-button-over</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">mouseover</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">mouseover</span><span class="hl-code">.</span><span class="hl-identifier">call</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">scope</span><span class="hl-code"> || </span><span class="hl-builtin">window</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
}
}</span><span class="hl-code">,
</span><span class="hl-comment">/** @private */
</span><span class="hl-builtin">onMouseOut</span><span class="hl-code"> : </span><span class="hl-reserved">function</span><span class="hl-brackets">(){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">el</span><span class="hl-code">.</span><span class="hl-identifier">removeClass</span><span class="hl-brackets">(</span><span class="hl-quotes">'</span><span class="hl-string">ytb-button-over</span><span class="hl-quotes">'</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-code">!</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">disabled</span><span class="hl-brackets">){
</span><span class="hl-reserved">if</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">mouseout</span><span class="hl-brackets">){
</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">mouseout</span><span class="hl-code">.</span><span class="hl-identifier">call</span><span class="hl-brackets">(</span><span class="hl-reserved">this</span><span class="hl-code">.</span><span class="hl-identifier">scope</span><span class="hl-code"> || </span><span class="hl-builtin">window</span><span class="hl-code">, </span><span class="hl-reserved">this</span><span class="hl-brackets">)</span><span class="hl-code">;
</span><span class="hl-brackets">}
}
}
}</span><span class="hl-default">;</span></pre></div><hr>Copyright &copy; 2006 Jack Slocum. All rights reserved.</body></html>