// 颜色选择器

// 定义AMD模块

var colorPicker = {};

$(document).on('click', '.color_pick', function() {
 	var hidden_id = $(this).data('hidden');

 	// 当前点击元素
 	var _this = $(this);

 	// 颜色选择器容器
 	var container = '';

 	var colorPickClass = 'colorPicker';

 	// 颜色数组
 	var colorTop    = ['ffffff','000000','eeece1','1f497d','4f81bd','c0504d','9bbb59','8064a2','4bacc6','f79646'];

 	var colorMiddle = ['f2f2f2','7f7f7f','ddd9c3','c6d9f0','dbe5f1','f2dcdb','ebf1dd','e5e0ec','dbeef3','fdeada',
 	'd8d8d8','595959','c4bd97','8db3e2','b8cce4','e5b9b7','d7e3bc','ccc1d9','b7dde8','fbd5b5','bfbfbf','3f3f3f',
 	'938953','548dd4','95b3d7','d99694','c3d69b','b2a2c7','92cddc','fac08f','a5a5a5','262626','494429','17365d',
 	'366092','953734','76923c','5f497a','31859b','e36c09','7f7f7f','0c0c0c','1d1b10','0f243e','244061','632423',
 	'4f6128','3f3151','205867','974806'];

 	var colorBottom = ['c00000','ff0000','ffc000','ffff00','92d050','00b050','00b0f0','0070c0','002060','7030a0'];

 	var prefix = '<strong style="background-color:#';
 	var suffix = ';"><span></span></strong>';

 	var htmlPanel = [
 						'<div class="wind_color_general"><div class="color_general">',
 	 					colorwrap(colorTop, prefix, suffix),
 	 					'</div><div class="color_list">',
 	 					colorwrap(colorMiddle, prefix, suffix),
 	 					'</div><div class="color_standard">',
 	 					colorwrap(colorBottom, prefix, suffix),
 	 					'</div><div class="set_general"><a class="J_default_color no_color" href="javascript:;">恢复默认</a></div></div>'
 	 				].join('');

	 var offset = _this.offset();
	 console.log(offset);
 	var left   = offset.left;
 	var top    = offset.top + _this.outerHeight();

 	colorPicker.hidden    = $('#'+hidden_id);
 	colorPicker.obj       = _this;

 	if ($('.'+colorPickClass).length) {
 		container =  $('.'+colorPickClass);
 		colorPicker.container = container;
 	} else {
 		container = $('<div class="'+colorPickClass+'" data-hidden="' + hidden_id + '">').html(htmlPanel).appendTo('body');
 		colorPicker.container = container;

 		colorEvent();
 	}

	//如果是跟随某元素显示，那么计算元素的位置，并不能超过显示窗口的区域
 	container.css({ position:'absolute', zIndex:99999, left:left + 'px', top:top + 'px','background':'#fff', 'border': '1px solid #bfbfbf' });
	container.show();

});

function colorEvent()
{
	colorPicker.container.on('click', '.wind_color_general strong', function(e) {
		var color = uniform($(this).css('backgroundColor'));
		callback(colorPicker.hidden, color);
	});

	//色块鼠标指示
	colorPicker.container.find('.wind_color_general').on('mouseenter','strong',function(e) {
		$(this).addClass('selector');
	}).on('mouseleave', 'strong', function() {
		$(this).removeClass('selector');
	});

	colorPicker.container.find('.J_default_color').on('click',function(e) {
	    e.preventDefault();
	    $.isFunction(callback) && callback(colorPicker.hidden, '');
	});

	function callback(element, color)
	{	
		element.val(color);
		colorPicker.obj.find('em').css('background',color);
		colorPicker.container.hide();
		
		if (callback_func = colorPicker.obj.data('callback')) {
			window[callback_func](color,colorPicker.obj); //执行回调
		}
	}

	//转换为HEX码
	function uniform(color) 
	{
	    if (String(color).slice(0, 3) == 'rgb') {
	        var ar = color.slice(4, -1).split(','),
	            r = parseInt(ar[0]),
	            g = parseInt(ar[1]),
	            b = parseInt(ar[2]);
	        return ['#', r < 16 ? '0' : '', r.toString(16), g < 16 ? '0' : '', g.toString(16), b < 16 ? '0' : '', b.toString(16)].join('');
	    }
	    return color;
	} 

	//点击其它地方隐藏选色器
	$(document.body).on('mousedown',function(e) {
		if( !$.contains(colorPicker.container[0], e.target) ) {
			colorPicker.container.hide();
		}
	});

}

// 组装颜色HTML;
function colorwrap(data, prefix, suffix)
{
	var result = [];

	for (var i=0; i<data.length; i++) {
		result.push(prefix + data[i] + suffix);
	}

	return result.join('');
}

