Source: temp/jsdocinputdirs/cercalia.control.customswitcher.js

/**
 * @classdesc
 *
 * Let you create a selector menu with a list of options, and assign a click event to each option<br/>
 * The options to be included by parameter are <br/>
 * Example:<br/>
 *
 *		var option1 = {name:'opcio_1',className:'class1',clickFunction:function(){alert('1');}};
 * 		var option2 = {name:'opcio_2',className:'class2',clickFunction:function(){alert('2');}};
 *  	var customSwitcherControl = new cercalia.Control.CustomSwitcherControl({
 *  		name : 'Switcher1',
 *  		name : 'Custom selector menu',
 *  		menuOptions : [option1,option2]
 *  	});
 *
 * @constructor
 * @param {cercaliax.Control.CustomSwitcherControlOptions} option
 * @extends {ol.control.Control}
 */
cercalia.Control.CustomSwitcherControl = function(option) {


	/**
	 * @private
	 * @type {string}
	 */
	this.name_ = option.name ? option.name : cercalia.MapControls.CustomSwitcherControl;

	/**
	 * @private
	 * @type {string}
	 */
	this.label_ = option.label ? option.label :  'CustomSwitcher';

	/**
	 * Class name
	 * @private
	 * @type {string}
	 */
	this.CLASS_NAME_ = "cercalia.Control.CustomSwitcherControl";

	/**
	 * @private
	 * @type {String}
	 */
	this.topBarId_ = null;

	/**
	 * Button
	 * @private
	 * @type {Object}
	 */
	this.element_ = null;

	/**
	 * Button
	 * @private
	 * @type {Object}
	 */
	this.elementList_ = null;

	/**
	 * @private
	 * @type {Array.<string>}
	 */
	this.menuOptions_ = option.menuOptions ? option.menuOptions : [];

	this.initialize_();
};
ol.inherits(cercalia.Control.CustomSwitcherControl, ol.control.Control);


/**
 * Initializes the element
 * @private
 */
cercalia.Control.CustomSwitcherControl.prototype.initialize_ = function() {
	this.element_ = document.createElement('button');
	this.element_.className = 'customswitcher ';
	this.element_.innerHTML = this.label_;

	cercalia.jQuery(this.element_)
		.button({
			icons: {
				primary: "cercalia-big-icon-map	cercalia-big-icon",
				secondary: "ui-icon-triangle-1-s"
			}
		});

	cercalia.jQuery(this.element_)
		.removeClass("ui-button-text-icons")
		.addClass("ui-button-text-icon-secondary cercalia-tool-button");
};



/**
 * Create the button in the tools topbar
 * @private
 * @param {string} idTopBar Div element ID where the control will be embedded
 */
cercalia.Control.CustomSwitcherControl.prototype.setTopBar = function (idTopBar) {

	this.topBarId_ = idTopBar;

	var self = this;
	this.element_.addEventListener('click', function (event) {
		if(cercalia.jQuery(self.element_).hasClass("cercalia-tool-button-open")) {
			cercalia.jQuery(self.element_).click().removeClass("cercalia-tool-button-open").button("refresh");
			cercalia.jQuery('.cercalia-tool-button-open').click().removeClass("cercalia-tool-button-open").button("refresh");
		} else {
			cercalia.jQuery('.cercalia-tool-button-open').click().removeClass("cercalia-tool-button-open").button("refresh");
			cercalia.jQuery(self.element_).addClass("cercalia-tool-button-open");
		}

		//Obrim o tanquem segons com es trobi
		cercalia.jQuery(self.elementList_).is(":visible") ? self.closeList_() : self.openList_();
	});

	var target = document.getElementById(idTopBar);

	ol.control.Control.call(this, {
		    element: self.element_,
		    target: target
	});

	this.createMenuList_(target, idTopBar);
};


/**
 * @private
 */
cercalia.Control.CustomSwitcherControl.prototype.openList_ = function() {
	//Siempre que abramos ajustamos la posición del list respecto el botón
	//cercalia.jQuery(this.elementList_).css('left', cercalia.jQuery(this.element_).position().left);

	if (document.getElementById(this.topBarId_)) {
		var width = cercalia.jQuery(this.element_).width();
		var rightPosition = cercalia.jQuery(this.element_).parent().width() - cercalia.jQuery(this.element_).position().left - width + 8;
		cercalia.jQuery(this.elementList_).css('right', rightPosition);
	} else {
		cercalia.jQuery(this.elementList_).css({
			top: 52,
			right: 20
		});
	}

	//Comprovem si té parent.. Sinó l'afegim
	if (!cercalia.jQuery(this.elementList_)[0].parentNode) {
		var viewport = this.map_.getViewport();
		viewport.appendChild(this.elementList_);
	}

	cercalia.jQuery(this.elementList_).fadeIn();
	cercalia.jQuery(this.element_).find('.ui-button-icon-secondary')
			.addClass('ui-icon-triangle-1-n')
			.removeClass('ui-icon-triangle-1-s');
};

/**
 * @private
 */
cercalia.Control.CustomSwitcherControl.prototype.closeList_ = function() {
	cercalia.jQuery(this.elementList_).fadeOut();
	cercalia.jQuery(this.element_).find('.ui-button-icon-secondary')
			.addClass('ui-icon-triangle-1-s')
			.removeClass('ui-icon-triangle-1-n');
};



/**
 * @private
 * @param {object} target
 * @param {string} idTopBar
 */
cercalia.Control.CustomSwitcherControl.prototype.createMenuList_ = function(target, idTopBar){

	var switcherList = document.createElement('div');
	switcherList.className = 'customswitcherList ' + this.name_;

	var ulSwitcherList = document.createElement('ul');
	ulSwitcherList.className = 'ui-corner-all ui-widget ui-state-default';

	switcherList.appendChild(ulSwitcherList);
	this.elementList_ = switcherList;
	if (target) {
		target.appendChild(switcherList);
		this.initOptions_();
	} else {
		setTimeout(function(){
			var viewport = this.map_.getViewport();
			var controlDiv = viewport.getElementsByClassName('ol-overlaycontainer-stopevent')[0];
			controlDiv.appendChild(this.element);
			this.element.style.position = 'absolute';
			this.element.style.top = '10px';
			this.element.style.right = '10px';
			this.initOptions_();
		}.bind(this), 500);
	}

};

/**
 * Create options list
 * @private
 */
cercalia.Control.CustomSwitcherControl.prototype.initOptions_ = function(){
	for(var i = 0; i < this.menuOptions_.length; i++){
		this.assignMenuOptionAction_(this.menuOptions_[i], i);
	}
};

/**
 * @private
 * @param {object} option
 * @param {number} numOption
 */
cercalia.Control.CustomSwitcherControl.prototype.assignMenuOptionAction_ = function(option, numOption){

	var ulElem = cercalia.jQuery(this.elementList_).find('ul');
	cercalia.jQuery('<li />')
		.addClass(numOption == 0 ? "ui-corner-top ui-no-corner-bottom" : (numOption == this.menuOptions_.length-1 ? "ui-corner-bottom ui-no-corner-top" : "ui-no-corner-all") )
		.addClass("cercalia-box-sizing" + (option.className?" "+option.className : "") )
		.addClass('prova')
		.text(option.name)
		.click(function(e){
			option.clickFunction(this,e);
		})
		.appendTo(ulElem)
	.button();
};

/**
 * @param {Object} option Option to add
 * @param {number|undefined} position Position on list
 */
cercalia.Control.CustomSwitcherControl.prototype.addOption = function(option, position){

	if(position == undefined || position == null){
		this.menuOptions_.push(option);
	}else{
		this.menuOptions_ = cercalia.Util.addObjectInArray(this.menuOptions_, option, position );
	}
	cercalia.jQuery(this.elementList_).find('ul').empty();
	this.initOptions_();
};

/**
 * Returns index of option.
 * @param {Object} option Option to check the index
 */
cercalia.Control.CustomSwitcherControl.prototype.indexOf = function(option){
	if(this.menuOptions_ && option){
		return this.menuOptions_.indexOf(option);
	} else {
		return -1;
	}
};

/**
 * Remove option by option
 * @param {Object} options Option to remove
 */
cercalia.Control.CustomSwitcherControl.prototype.removeOption = function(option){
	if(option){
		if(this.menuOptions_.indexOf(option) >= 0){
			this.removeOptionByIndex(this.menuOptions_.indexOf(option));
		}
	}
};


/**
 * Remove all options with the same name
 * @param {string} name Name of option
 */
cercalia.Control.CustomSwitcherControl.prototype.removeOptionByName = function(name){
	if(name){
		var listToRemove = [ ];
		for (index in this.menuOptions_){
			if(this.menuOptions_[index].name == name){
				listToRemove.push(index);
			}
		}

		for (index in listToRemove){
			this.removeOptionByIndex(listToRemove[index]);
		}
	}
};


/**
 * Remove option with index
 * @param {number} index of option
 */
cercalia.Control.CustomSwitcherControl.prototype.removeOptionByIndex = function(index){
	if(index !== undefined && index != null){
		this.menuOptions_.splice(index, 1);
	}
	cercalia.jQuery(this.elementList_).find('ul').empty();
	this.initOptions_();
};



/**
 * Returns the HTML element for every created menu.
 * @return {HTMLElement}
 */
cercalia.Control.CustomSwitcherControl.prototype.getElementList = function() {
	return this.elementList_;
};


/**
 * @return {string} Returns the label name assigned to the control
 */
cercalia.Control.CustomSwitcherControl.prototype.getLabel = function() {
	return this.label_;
};