http://medicos.santacasasjc.com.br:63037/portal_medico/assets/js/ace/elements.colorpicker.js

1/**
2 <b>Custom color picker element</b>. Converts html select elements to a dropdown color picker.
3*/
4(function($ , undefined) {
5	var Ace_Colorpicker = function(element, _options) {
6
7		var attrib_values = ace.helper.getAttrSettings(element, $.fn.ace_colorpicker.defaults);
8		var options = $.extend({}, $.fn.ace_colorpicker.defaults, _options, attrib_values);
9
10
11		var $element = $(element);
12		var color_list = '';
13		var color_selected = '';
14		var selection = null;
15		var color_array = [];
16		
17		$element.addClass('hide').find('option').each(function() {
18			var $class = 'colorpick-btn';
19			var color = this.value.replace(/[^\w\s,#\(\)\.]/g, '');
20			if(this.value != color) this.value = color;
21			if(this.selected) {
22				$class += ' selected';
23				color_selected = color;
24			}
25			color_array.push(color)
26			color_list += '<li><a class="'+$class+'" href="#" style="background-color:'+color+';" data-color="'+color+'"></a></li>';
27		}).
28		end()
29		.on('change.color', function(){
30			$element.next().find('.btn-colorpicker').css('background-color', this.value);
31		})
32		.after('<div class="dropdown dropdown-colorpicker">\
33		<a data-toggle="dropdown" class="dropdown-toggle" '+(options.auto_pos ? 'data-position="auto"' : '')+' href="#"><span class="btn-colorpicker" style="background-color:'+color_selected+'"></span></a><ul class="dropdown-menu'+(options.caret? ' dropdown-caret' : '')+(options.pull_right ? ' dropdown-menu-right' : '')+'">'+color_list+'</ul></div>')
34
35		
36		var dropdown = $element.next().find('.dropdown-menu')
37		dropdown.on(ace.click_event, function(e) {
38			var a = $(e.target);
39			if(!a.is('.colorpick-btn')) return false;
40
41			if(selection) selection.removeClass('selected');
42			selection = a;
43			selection.addClass('selected');
44			var color = selection.data('color');
45
46			$element.val(color).trigger('change');
47
48			e.preventDefault();
49			return true;//to hide dropdown
50		})
51		selection = $element.next().find('a.selected');
52
53		this.pick = function(index, insert) {
54			if(typeof index === 'number') {
55				if(index >= color_array.length) return;
56				element.selectedIndex = index;
57				dropdown.find('a:eq('+index+')').trigger(ace.click_event);
58			}
59			else if(typeof index === 'string') {
60				var color = index.replace(/[^\w\s,#\(\)\.]/g, '');
61				index = color_array.indexOf(color);
62				//add this color if it doesn't exist
63				if(index == -1 && insert === true) {
64					color_array.push(color);
65					
66					$('<option />')
67					.appendTo($element)
68					.val(color);
69					
70					$('<li><a class="colorpick-btn" href="#"></a></li>')
71					.appendTo(dropdown)
72					.find('a')
73					.css('background-color', color)
74					.data('color', color);
75					
76					index = color_array.length - 1;
77				}
78				if(index == -1) return;
79				dropdown.find('a:eq('+index+')').trigger(ace.click_event);
80			}
81		}
82
83		this.destroy = function() {
84			$element.removeClass('hide').off('change.color')
85			.next().remove();
86			color_array = [];
87		}
88	}
89
90
91	$.fn.ace_colorpicker = function(option, value) {
92		var retval;
93
94		var $set = this.each(function () {
95			var $this = $(this);
96			var data = $this.data('ace_colorpicker');
97			var options = typeof option === 'object' && option;
98
99			if (!data) $this.data('ace_colorpicker', (data = new Ace_Colorpicker(this, options)));
100			if (typeof option === 'string') retval = data[option](value);
101		});
102
103		return (retval === undefined) ? $set : retval;
104	}
105	
106	$.fn.ace_colorpicker.defaults = {
107		'pull_right' : false,
108		'caret': true,
109		'auto_pos': true
110	}
111	
112})(window.jQuery);