mirror of
https://git.friendi.ca/friendica/friendica-addons.git
synced 2025-07-10 02:18:48 +00:00
Initial Release of the calendar plugin
This commit is contained in:
parent
45cc9885fc
commit
7115197a33
561 changed files with 189494 additions and 0 deletions
90
dav/colorpicker/README.md
Normal file
90
dav/colorpicker/README.md
Normal file
|
@ -0,0 +1,90 @@
|
|||
## Really Simple Color Picker
|
||||
|
||||
This is a very minimal, yet robust Color Picker based on jQuery.
|
||||
|
||||
For more details check the introductory blog post - http://laktek.com/2008/10/27/really-simple-color-picker-in-jquery/
|
||||
|
||||
### Usage
|
||||
|
||||
You can either clone [this repo](https://github.com/laktek/really-simple-color-picker) or download the latest build as a zip from here - http://github.com/laktek/really-simple-color-picker/zipball/master
|
||||
|
||||
Color Picker requires jQuery 1.2.6 or higher. Make sure to load it before Color Picker (there's no other dependencies!).
|
||||
For default styles of the color picker load the CSS file that comes with the plugin.
|
||||
|
||||
```html
|
||||
<script language="javascript" type="text/javascript" src=jquery.min.js"></script>
|
||||
<script language="javascript" type="text/javascript" src="jquery.colorPicker.min.js"/></script>
|
||||
|
||||
<link rel="stylesheet" href="colorPicker.css" type="text/css" />
|
||||
```
|
||||
|
||||
Add a text field to take the color input.
|
||||
|
||||
```html
|
||||
<div><label for="color1">Color 1</label> <input id="color1" type="text" name="color1" value="#333399" /></div>
|
||||
```
|
||||
|
||||
Then call 'colorPicker' method on the text field when document loads.
|
||||
|
||||
```html
|
||||
<script language="javascript">
|
||||
jQuery(document).ready(function($) {
|
||||
$('#color1').colorPicker();
|
||||
}
|
||||
</script>
|
||||
```
|
||||
|
||||
### Options
|
||||
|
||||
There are several options you can set at the time of binding.
|
||||
|
||||
**Selected color**
|
||||
|
||||
Color Picker will use the value of the input field, which the picker is attached to as the selected color. If not, it will use the color passed with `pickerDefault` property.
|
||||
|
||||
```javascript
|
||||
$('#color1').colorPicker({pickerDefault: "ffffff"});
|
||||
```
|
||||
|
||||
**Color Palette**
|
||||
|
||||
Overrides the default color palette by passing an array of color values.
|
||||
|
||||
```javascript
|
||||
$('#color1').colorPicker({colors: ["333333", "111111"]});
|
||||
```
|
||||
|
||||
**Transparency**
|
||||
|
||||
Enable transparency value as an option.
|
||||
|
||||
```javascript
|
||||
$('#color1').colorPicker({transparency: true});
|
||||
```
|
||||
|
||||
If you want to set an option gloablly (to apply for all color pickers), use:
|
||||
|
||||
```javascript
|
||||
$.fn.colorPicker.defaults.colors = ['151337', '111111']
|
||||
```
|
||||
### Demo
|
||||
|
||||
Demo can be found at http://laktek.github.com/really-simple-color-picker/demo.html
|
||||
|
||||
### Real-world Examples
|
||||
|
||||
* [CurdBee](http://demo.curdbee.com/settings/branding)
|
||||
* [Readability](https://www.readability.com/publishers/tools)
|
||||
|
||||
Let us know how you are using Really Simple Color Picker...
|
||||
|
||||
### Contributors
|
||||
|
||||
* Lakshan Perera - http://laktek.com
|
||||
* Daniel Lacy - http://daniellacy.com
|
||||
|
||||
### Issues & Suggestions
|
||||
|
||||
Please report any bugs or feature requests here:
|
||||
https://github.com/laktek/really-simple-color-picker/issues
|
||||
|
BIN
dav/colorpicker/arrow.gif
Normal file
BIN
dav/colorpicker/arrow.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 111 B |
BIN
dav/colorpicker/arrow.png
Normal file
BIN
dav/colorpicker/arrow.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 27 KiB |
30
dav/colorpicker/colorPicker.css
Normal file
30
dav/colorpicker/colorPicker.css
Normal file
|
@ -0,0 +1,30 @@
|
|||
div.colorPicker-picker {
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
padding: 0 !important;
|
||||
border: 1px solid #ccc;
|
||||
background: url(arrow.gif) no-repeat top right;
|
||||
cursor: pointer;
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
div.colorPicker-palette {
|
||||
width: 110px;
|
||||
position: absolute;
|
||||
border: 1px solid #598FEF;
|
||||
background-color: #EFEFEF;
|
||||
padding: 2px;
|
||||
}
|
||||
div.colorPicker_hexWrap {width: 100%; float:left }
|
||||
div.colorPicker_hexWrap label {font-size: 95%; color: #2F2F2F; margin: 5px 2px; width: 25%}
|
||||
div.colorPicker_hexWrap input {margin: 5px 2px; padding: 0; font-size: 95%; border: 1px solid #000; width: 65%; }
|
||||
|
||||
div.colorPicker-swatch {
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border: 1px solid #000;
|
||||
margin: 2px;
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
line-height: 12px;
|
||||
}
|
93
dav/colorpicker/demo.html
Normal file
93
dav/colorpicker/demo.html
Normal file
|
@ -0,0 +1,93 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
||||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
||||
|
||||
<head>
|
||||
<title>Really Simple Color Picker</title>
|
||||
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
||||
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
|
||||
<script language="javascript" type="text/javascript" src="jquery.colorPicker.min.js"/></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
//Run the code when document ready
|
||||
$(function() {
|
||||
//use this method to add new colors to pallete
|
||||
//$.fn.colorPicker.addColors(['000', '000', 'fff', 'fff']);
|
||||
|
||||
$('#color1').colorPicker();
|
||||
|
||||
$('#color2').colorPicker();
|
||||
|
||||
$('#color3').colorPicker({pickerDefault: "ffffff", colors: ["ffffff", "000000", "111FFF", "C0C0C0", "FFF000"], transparency: true});
|
||||
|
||||
//fires an event when the color is changed
|
||||
//$('#color1').change(function(){
|
||||
//alert("color changed");
|
||||
//});
|
||||
|
||||
$("#button1").click(function(){
|
||||
$("#color1").val("#ffffff");
|
||||
$("#color1").change();
|
||||
});
|
||||
|
||||
$("#button2").click(function(){
|
||||
$("#color2").val("#000000");
|
||||
$("#color2").change();
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<style type="text/css">
|
||||
/* styles adopted from Nidahas - Forms markup and CSS (http://nidahas.com/2006/12/06/forms-markup-and-css-revisited/) */
|
||||
/* General styles */
|
||||
body { margin: 0; padding: 0; font: 80%/1.5 Arial,Helvetica,sans-serif; color: #111; background-color: #FFF; }
|
||||
h2 { margin: 0px; padding: 10px; font-family: Georgia, "Times New Roman", Times, serif; font-size: 200%; font-weight: normal; color: #FFF; background-color: #CCC; border-bottom: #BBB 2px solid; }
|
||||
p#copyright { margin: 20px 10px; font-size: 90%; color: #999; }
|
||||
|
||||
/* Form styles */
|
||||
div.form-container { margin: 10px; padding: 5px; background-color: #FFF; }
|
||||
|
||||
p.legend { margin-bottom: 1em; }
|
||||
p.legend em { color: #C00; font-style: normal; }
|
||||
|
||||
div.form-container div.controlset {display: block; float:left; width: 100%; padding: 0.25em 0;}
|
||||
|
||||
div.form-container div.controlset label,
|
||||
div.form-container div.controlset input,
|
||||
div.form-container div.controlset div { display: inline; float: left; }
|
||||
|
||||
div.form-container div.controlset label { width: 100px;}
|
||||
</style>
|
||||
<link rel="stylesheet" href="colorPicker.css" type="text/css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="wrapper">
|
||||
|
||||
<h2>Really Simple Color Picker (jQuery)</h2>
|
||||
|
||||
<p>More information about this can be found in <a href="http://www.laktek.com/2008/10/27/really-simple-color-picker-in-jquery/" title="Really Simple Color Picker in jQuery">this blog article</a>.</p>
|
||||
<div class="form-container">
|
||||
<form action="#" method="post">
|
||||
<fieldset>
|
||||
<div class="controlset"><label for="color1">Color 1</label> <input id="color1" type="text" name="color1" value="#333399" /></div>
|
||||
<div class="controlset"><label for="color2">Color 2</label> <input id="color2" type="text" name="color2" value="#FF0000" /></div>
|
||||
<div class="controlset"><label for="color3">Color 3 (customized with options)</label> <input id="color3" type="text" name="color3" value="#99cc00" /></div>
|
||||
|
||||
</fieldset>
|
||||
|
||||
<div class="buttonrow">
|
||||
<div><button type="button" id="button1">Set Color 1 to #FFF</button></div>
|
||||
<div><button type="button" id="button2">Set Color 2 to #000</button></div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
307
dav/colorpicker/jquery.colorPicker.js
Normal file
307
dav/colorpicker/jquery.colorPicker.js
Normal file
|
@ -0,0 +1,307 @@
|
|||
/**
|
||||
* Really Simple Color Picker in jQuery
|
||||
*
|
||||
* Licensed under the MIT (MIT-LICENSE.txt) licenses.
|
||||
*
|
||||
* Copyright (c) 2008 Lakshan Perera (www.laktek.com)
|
||||
* Daniel Lacy (daniellacy.com)
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to
|
||||
* deal in the Software without restriction, including without limitation the
|
||||
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
||||
* sell copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
||||
* IN THE SOFTWARE.
|
||||
*/
|
||||
|
||||
(function ($) {
|
||||
/**
|
||||
* Create a couple private variables.
|
||||
**/
|
||||
var selectorOwner,
|
||||
activePalette,
|
||||
cItterate = 0,
|
||||
templates = {
|
||||
control : $('<div class="colorPicker-picker"> </div>'),
|
||||
palette : $('<div id="colorPicker_palette" class="colorPicker-palette" />'),
|
||||
swatch : $('<div class="colorPicker-swatch"> </div>'),
|
||||
hexLabel: $('<label for="colorPicker_hex">Hex</label>'),
|
||||
hexField: $('<input type="text" id="colorPicker_hex" />')
|
||||
},
|
||||
transparent = "transparent",
|
||||
lastColor;
|
||||
|
||||
/**
|
||||
* Create our colorPicker function
|
||||
**/
|
||||
$.fn.colorPicker = function (options) {
|
||||
return this.each(function () {
|
||||
// Setup time. Clone new elements from our templates, set some IDs, make shortcuts, jazzercise.
|
||||
var element = $(this),
|
||||
opts = $.extend({}, $.fn.colorPicker.defaults, options),
|
||||
defaultColor = $.fn.colorPicker.toHex(
|
||||
(element.val().length > 0) ? element.val() : opts.pickerDefault
|
||||
),
|
||||
newControl = templates.control.clone(),
|
||||
newPalette = templates.palette.clone().attr('id', 'colorPicker_palette-' + cItterate),
|
||||
newHexLabel = templates.hexLabel.clone(),
|
||||
newHexField = templates.hexField.clone(),
|
||||
paletteId = newPalette[0].id,
|
||||
swatch;
|
||||
|
||||
/**
|
||||
* Build a color palette.
|
||||
**/
|
||||
$.each(opts.colors, function (i) {
|
||||
swatch = templates.swatch.clone();
|
||||
|
||||
if (opts.colors[i] === transparent) {
|
||||
swatch.addClass(transparent).text('X');
|
||||
|
||||
$.fn.colorPicker.bindPalette(newHexField, swatch, transparent);
|
||||
|
||||
} else {
|
||||
swatch.css("background-color", "#" + this);
|
||||
|
||||
$.fn.colorPicker.bindPalette(newHexField, swatch);
|
||||
|
||||
}
|
||||
|
||||
swatch.appendTo(newPalette);
|
||||
});
|
||||
|
||||
newHexLabel.attr('for', 'colorPicker_hex-' + cItterate);
|
||||
|
||||
newHexField.attr({
|
||||
'id' : 'colorPicker_hex-' + cItterate,
|
||||
'value' : defaultColor
|
||||
});
|
||||
|
||||
newHexField.bind("keydown", function (event) {
|
||||
if (event.keyCode === 13) {
|
||||
$.fn.colorPicker.changeColor($.fn.colorPicker.toHex($(this).val()));
|
||||
}
|
||||
if (event.keyCode === 27) {
|
||||
$.fn.colorPicker.hidePalette(paletteId);
|
||||
}
|
||||
});
|
||||
|
||||
$('<div class="colorPicker_hexWrap" />').append(newHexLabel).appendTo(newPalette);
|
||||
|
||||
newPalette.find('.colorPicker_hexWrap').append(newHexField);
|
||||
|
||||
$("body").append(newPalette);
|
||||
|
||||
newPalette.hide();
|
||||
|
||||
|
||||
/**
|
||||
* Build replacement interface for original color input.
|
||||
**/
|
||||
newControl.css("background-color", defaultColor);
|
||||
|
||||
newControl.bind("click", function () {
|
||||
$.fn.colorPicker.togglePalette($('#' + paletteId), $(this));
|
||||
});
|
||||
|
||||
element.after(newControl);
|
||||
|
||||
element.bind("change", function () {
|
||||
element.next(".colorPicker-picker").css(
|
||||
"background-color", $.fn.colorPicker.toHex($(this).val())
|
||||
);
|
||||
});
|
||||
|
||||
// Hide the original input.
|
||||
element.val(defaultColor).hide();
|
||||
|
||||
cItterate++;
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Extend colorPicker with... all our functionality.
|
||||
**/
|
||||
$.extend(true, $.fn.colorPicker, {
|
||||
/**
|
||||
* Return a Hex color, convert an RGB value and return Hex, or return false.
|
||||
*
|
||||
* Inspired by http://code.google.com/p/jquery-color-utils
|
||||
**/
|
||||
toHex : function (color) {
|
||||
// If we have a standard or shorthand Hex color, return that value.
|
||||
if (color.match(/[0-9A-F]{6}|[0-9A-F]{3}$/i)) {
|
||||
return (color.charAt(0) === "#") ? color : ("#" + color);
|
||||
|
||||
// Alternatively, check for RGB color, then convert and return it as Hex.
|
||||
} else if (color.match(/^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/)) {
|
||||
var c = ([parseInt(RegExp.$1, 10), parseInt(RegExp.$2, 10), parseInt(RegExp.$3, 10)]),
|
||||
pad = function (str) {
|
||||
if (str.length < 2) {
|
||||
for (var i = 0, len = 2 - str.length; i < len; i++) {
|
||||
str = '0' + str;
|
||||
}
|
||||
}
|
||||
|
||||
return str;
|
||||
};
|
||||
|
||||
if (c.length === 3) {
|
||||
var r = pad(c[0].toString(16)),
|
||||
g = pad(c[1].toString(16)),
|
||||
b = pad(c[2].toString(16));
|
||||
|
||||
return '#' + r + g + b;
|
||||
}
|
||||
|
||||
// Otherwise we wont do anything.
|
||||
} else {
|
||||
return false;
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Check whether user clicked on the selector or owner.
|
||||
**/
|
||||
checkMouse : function (event, paletteId) {
|
||||
var selector = activePalette,
|
||||
selectorParent = $(event.target).parents("#" + selector.attr('id')).length;
|
||||
|
||||
if (event.target === $(selector)[0] || event.target === selectorOwner || selectorParent > 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
$.fn.colorPicker.hidePalette();
|
||||
},
|
||||
|
||||
/**
|
||||
* Hide the color palette modal.
|
||||
**/
|
||||
hidePalette : function (paletteId) {
|
||||
$(document).unbind("mousedown", $.fn.colorPicker.checkMouse);
|
||||
|
||||
$('.colorPicker-palette').hide();
|
||||
},
|
||||
|
||||
/**
|
||||
* Show the color palette modal.
|
||||
**/
|
||||
showPalette : function (palette) {
|
||||
var hexColor = selectorOwner.prev("input").val();
|
||||
|
||||
palette.css({
|
||||
top: selectorOwner.offset().top + (selectorOwner.outerHeight()),
|
||||
left: selectorOwner.offset().left
|
||||
});
|
||||
|
||||
$("#color_value").val(hexColor);
|
||||
|
||||
palette.show();
|
||||
|
||||
$(document).bind("mousedown", $.fn.colorPicker.checkMouse);
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle visibility of the colorPicker palette.
|
||||
**/
|
||||
togglePalette : function (palette, origin) {
|
||||
// selectorOwner is the clicked .colorPicker-picker.
|
||||
if (origin) {
|
||||
selectorOwner = origin;
|
||||
}
|
||||
|
||||
activePalette = palette;
|
||||
|
||||
if (activePalette.is(':visible')) {
|
||||
$.fn.colorPicker.hidePalette();
|
||||
|
||||
} else {
|
||||
$.fn.colorPicker.showPalette(palette);
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Update the input with a newly selected color.
|
||||
**/
|
||||
changeColor : function (value) {
|
||||
selectorOwner.css("background-color", value);
|
||||
|
||||
selectorOwner.prev("input").val(value).change();
|
||||
|
||||
$.fn.colorPicker.hidePalette();
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind events to the color palette swatches.
|
||||
*/
|
||||
bindPalette : function (paletteInput, element, color) {
|
||||
color = color ? color : $.fn.colorPicker.toHex(element.css("background-color"));
|
||||
|
||||
element.bind({
|
||||
click : function (ev) {
|
||||
lastColor = color;
|
||||
|
||||
$.fn.colorPicker.changeColor(color);
|
||||
},
|
||||
mouseover : function (ev) {
|
||||
lastColor = paletteInput.val();
|
||||
|
||||
$(this).css("border-color", "#598FEF");
|
||||
|
||||
paletteInput.val(color);
|
||||
},
|
||||
mouseout : function (ev) {
|
||||
$(this).css("border-color", "#000");
|
||||
|
||||
paletteInput.val(selectorOwner.css("background-color"));
|
||||
|
||||
paletteInput.val(lastColor);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Default colorPicker options.
|
||||
*
|
||||
* These are publibly available for global modification using a setting such as:
|
||||
*
|
||||
* $.fn.colorPicker.defaults.colors = ['151337', '111111']
|
||||
*
|
||||
* They can also be applied on a per-bound element basis like so:
|
||||
*
|
||||
* $('#element1').colorPicker({pickerDefault: 'efefef', transparency: true});
|
||||
* $('#element2').colorPicker({pickerDefault: '333333', colors: ['333333', '111111']});
|
||||
*
|
||||
**/
|
||||
$.fn.colorPicker.defaults = {
|
||||
// colorPicker default selected color.
|
||||
pickerDefault : "FFFFFF",
|
||||
|
||||
// Default color set.
|
||||
colors : [
|
||||
'000000', '993300', '333300', '000080', '333399', '333333', '800000', 'FF6600',
|
||||
'808000', '008000', '008080', '0000FF', '666699', '808080', 'FF0000', 'FF9900',
|
||||
'99CC00', '339966', '33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00',
|
||||
'FFFF00', '00FF00', '00FFFF', '00CCFF', '993366', 'C0C0C0', 'FF99CC', 'FFCC99',
|
||||
'FFFF99', 'CCFFFF', '99CCFF', 'FFFFFF'
|
||||
],
|
||||
|
||||
// If we want to simply add more colors to the default set, use addColors.
|
||||
addColors : []
|
||||
};
|
||||
|
||||
})(jQuery);
|
26
dav/colorpicker/jquery.colorPicker.min.js
vendored
Normal file
26
dav/colorpicker/jquery.colorPicker.min.js
vendored
Normal file
|
@ -0,0 +1,26 @@
|
|||
/**
|
||||
* Really Simple Color Picker in jQuery
|
||||
*
|
||||
* Licensed under the MIT (MIT-LICENSE.txt) licenses.
|
||||
*
|
||||
* Copyright (c) 2008 Lakshan Perera (www.laktek.com)
|
||||
* Daniel Lacy (daniellacy.com)
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
* of this software and associated documentation files (the "Software"), to
|
||||
* deal in the Software without restriction, including without limitation the
|
||||
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
||||
* sell copies of the Software, and to permit persons to whom the Software is
|
||||
* furnished to do so, subject to the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be included in
|
||||
* all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
||||
* IN THE SOFTWARE.
|
||||
*/(function(a){var b,c,d=0,e={control:a('<div class="colorPicker-picker"> </div>'),palette:a('<div id="colorPicker_palette" class="colorPicker-palette" />'),swatch:a('<div class="colorPicker-swatch"> </div>'),hexLabel:a('<label for="colorPicker_hex">Hex</label>'),hexField:a('<input type="text" id="colorPicker_hex" />')},f="transparent",g;a.fn.colorPicker=function(b){return this.each(function(){var c=a(this),g=a.extend({},a.fn.colorPicker.defaults,b),h=a.fn.colorPicker.toHex(c.val().length>0?c.val():g.pickerDefault),i=e.control.clone(),j=e.palette.clone().attr("id","colorPicker_palette-"+d),k=e.hexLabel.clone(),l=e.hexField.clone(),m=j[0].id,n;a.each(g.colors,function(b){n=e.swatch.clone(),g.colors[b]===f?(n.addClass(f).text("X"),a.fn.colorPicker.bindPalette(l,n,f)):(n.css("background-color","#"+this),a.fn.colorPicker.bindPalette(l,n)),n.appendTo(j)}),k.attr("for","colorPicker_hex-"+d),l.attr({id:"colorPicker_hex-"+d,value:h}),l.bind("keydown",function(b){b.keyCode===13&&a.fn.colorPicker.changeColor(a.fn.colorPicker.toHex(a(this).val())),b.keyCode===27&&a.fn.colorPicker.hidePalette(m)}),a('<div class="colorPicker_hexWrap" />').append(k).appendTo(j),j.find(".colorPicker_hexWrap").append(l),a("body").append(j),j.hide(),i.css("background-color",h),i.bind("click",function(){a.fn.colorPicker.togglePalette(a("#"+m),a(this))}),c.after(i),c.bind("change",function(){c.next(".colorPicker-picker").css("background-color",a.fn.colorPicker.toHex(a(this).val()))}),c.val(h).hide(),d++})},a.extend(!0,a.fn.colorPicker,{toHex:function(a){if(a.match(/[0-9A-F]{6}|[0-9A-F]{3}$/i))return a.charAt(0)==="#"?a:"#"+a;if(!a.match(/^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/))return!1;var b=[parseInt(RegExp.$1,10),parseInt(RegExp.$2,10),parseInt(RegExp.$3,10)],c=function(a){if(a.length<2)for(var b=0,c=2-a.length;b<c;b++)a="0"+a;return a};if(b.length===3){var d=c(b[0].toString(16)),e=c(b[1].toString(16)),f=c(b[2].toString(16));return"#"+d+e+f}},checkMouse:function(d,e){var f=c,g=a(d.target).parents("#"+f.attr("id")).length;d.target===a(f)[0]||d.target===b||g>0||a.fn.colorPicker.hidePalette()},hidePalette:function(b){a(document).unbind("mousedown",a.fn.colorPicker.checkMouse),a(".colorPicker-palette").hide()},showPalette:function(c){var d=b.prev("input").val();c.css({top:b.offset().top+b.outerHeight(),left:b.offset().left}),a("#color_value").val(d),c.show(),a(document).bind("mousedown",a.fn.colorPicker.checkMouse)},togglePalette:function(d,e){e&&(b=e),c=d,c.is(":visible")?a.fn.colorPicker.hidePalette():a.fn.colorPicker.showPalette(d)},changeColor:function(c){b.css("background-color",c),b.prev("input").val(c).change(),a.fn.colorPicker.hidePalette()},bindPalette:function(c,d,e){e=e?e:a.fn.colorPicker.toHex(d.css("background-color")),d.bind({click:function(b){g=e,a.fn.colorPicker.changeColor(e)},mouseover:function(b){g=c.val(),a(this).css("border-color","#598FEF"),c.val(e)},mouseout:function(d){a(this).css("border-color","#000"),c.val(b.css("background-color")),c.val(g)}})}}),a.fn.colorPicker.defaults={pickerDefault:"FFFFFF",colors:["000000","993300","333300","000080","333399","333333","800000","FF6600","808000","008000","008080","0000FF","666699","808080","FF0000","FF9900","99CC00","339966","33CCCC","3366FF","800080","999999","FF00FF","FFCC00","FFFF00","00FF00","00FFFF","00CCFF","993366","C0C0C0","FF99CC","FFCC99","FFFF99","CCFFFF","99CCFF","FFFFFF"],addColors:[]}})(jQuery)
|
BIN
dav/colorpicker/screenshot.png
Normal file
BIN
dav/colorpicker/screenshot.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2 KiB |
Loading…
Add table
Add a link
Reference in a new issue