/branches/jsdoc_tk_gui/setup/workingDirectory/Webeo/gui/style/CSSLoader.js

  1ek.require("gui.tools.Dom");
  2ek.require("gui.layout.ToolBar");//To call only if necessary
  3ek.register("gui.style.CSSLoader");
  4
  5/**
  6 * @fileoverview
  7 * The CSSLoader class allow you to change the css source file dynamically
  8 *@author Sebastien Bordes => Sebastien dot Bordes at webeo dot fr
  9 *@version 0.9
 10 */
 11  
 12/**
 13 * Construct a CSSLoader object
 14 * @class
 15 * This class is used to manage easily Cascading Style Sheets
 16 * @constructor
 17 * @param container : The container which will hold the buttons/links/ComboBox
 18 * @param cssId : The id of the link element node
 19 * @param defaultCSS : The default selected CSS
 20 * @return a new CSSLoader Object
 21 */
 22function CSSLoader (container, cssId, defaultCSS){
 23	
 24	this.container = (typeof container == "object")? container : Dom.getElement(container);
 25	this.cssId = (cssId) ? cssId : "default";
 26	this.defaultCSS = (defaultCSS) ? defaultCSS : "index";
 27	this.sheets = new Array();
 28} 
 29
 30/**
 31 * Add a CSS to the list.
 32 * @param text : Name of the styleSheet , could be displayed
 33 * @param src : url of the style sheet, must be unique
 34 */
 35CSSLoader.prototype.addCSS = function (text, src){
 36	this.sheets[src] = text;
 37}
 38
 39/** 
 40 * Remove a CSS 
 41 * @param src :  url of the style sheet
 42 */
 43CSSLoader.prototype.removeCSS = function (src){
 44	this.sheets[src] = undefined;
 45}
 46
 47/**
 48 * Create and draw some buttons to allow to change the current CSS
 49 * @param loadFirst : boolean =>  if true the first CSS will be loaded
 50 */
 51CSSLoader.prototype.drawButtons = function (loadFirst){
 52	tb = new ToolBar(this.container.id, 200, null, "simpleBar");
 53
 54	for(var src in this.sheets){
 55		bt = new TextButton(src, this.sheets[src], null, true, null, null, this.chooseByLink);
 56		bt.getDom().cssL = this;		
 57		tb.addButton(bt);
 58	}
 59	if(loadFirst)
 60		ek.requireCSS(this.cssId, this.defaultCSS, true);	
 61}
 62
 63/**
 64 * Create and draw some links to allow to change the current CSS
 65 * @param loadFirst : boolean =>  if true the first CSS will be loaded
 66 */
 67CSSLoader.prototype.drawLinks = function (loadFirst){
 68	
 69	for(var src in this.sheets){
 70		var br = Dom.createHTMLBRElement();
 71		var a = Dom.createHTMLAnchorElement(this.sheets[src], null, null, null, this.sheets[src]);
 72		//Attach model
 73		a.cssL = this;
 74		//Attahc onclick action method
 75		a.onclick = this.chooseByLink;
 76		this.container.appendChild(a);
 77		this.container.appendChild(br);
 78	}
 79	if(loadFirst)
 80		ek.requireCSS(this.cssId, this.defaultCSS, true);	
 81}
 82
 83/**
 84 * Create and draw a combo bow to allow to change the current CSS
 85 * @param loadFirst : boolean =>  if true the first CSS will be loaded
 86 */
 87CSSLoader.prototype.drawCombo = function (loadFirst){
 88	
 89	var select = Dom.createHTMLSelectElement();
 90	//Attach model
 91	select.cssL = this;
 92	//Attach onchange action method
 93	select.onchange = this.chooseByCombo;
 94	this.container.appendChild(select);	
 95	
 96	for(var src in this.sheets){
 97
 98		var o = Dom.createHTMLOptionElement(this.sheets[src], src);
 99		select.appendChild(o);	
100	}
101	if(loadFirst)
102		ek.requireCSS(this.cssId, this.defaultCSS, true);
103}
104
105/** 
106 * Called when a link was clicked to change the current CSS.
107 * @param e the click event
108 * @private
109 */
110CSSLoader.prototype.chooseByLink = function (e){
111	ek.requireCSS(this.cssL.cssId, this.id, true);
112}
113
114/**
115 * Called when the selection of the combo box has changed to change the current CSS.
116 * @param e the change event
117 * @private
118 */
119CSSLoader.prototype.chooseByCombo = function (e){
120	ek.requireCSS(this.cssL.cssId, this.options[this.selectedIndex].value, true);
121}