Search and Top Navigation
Ticket #2982: colorpicker.diff
File colorpicker.diff, 7.7 KB (added by Cloudream, June 09, 2008 06:16PM UTC)
Index: colorpicker.html
===================================================================
--- colorpicker.html (revision 253)
+++ colorpicker.html (working copy)
@@ -1,28 +1,28 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Color picker</title>
- <script type="text/javascript" src="../../jquery/src/core.js"></script>
- <script type="text/javascript" src="../../jquery/src/selector.js"></script>
- <script type="text/javascript" src="../../jquery/src/event.js"></script>
- <script type="text/javascript" src="../../jquery/src/ajax.js"></script>
- <script type="text/javascript" src="../../jquery/src/fx.js"></script>
- <script type="text/javascript" src="../../jquery/src/offset.js"></script>
-
- <script type="text/javascript" src="../ui.base.js"></script>
- <script type="text/javascript" src="../ui.slider.js"></script>
+
+ <script type="text/javascript" src="../../../trunk/jquery-1.2.6.js"></script>
+
+ <script type="text/javascript" src="../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../../trunk/ui/ui.slider.js"></script>
+
<script type="text/javascript" src="ui.colorpicker.js"></script>
- <script src="pngFix/jquery.pngFix.js" type="text/javascript" charset="utf-8"></script>
+
+ <script type="text/javascript" src="pngFix/jquery.pngFix.js"></script>
+
<link type="text/css" rel="stylesheet" href="ui.colorpicker.css"></link>
- <script type="text/javascript" charset="utf-8">
+ <script type="text/javascript">
$(document).ready(function() {
- $("<div>").appendTo("body").colorpicker();
+ $("<div/>").appendTo("body").colorpicker();
$(document).pngFix();
});
</script>
+
</head>
<body>
<!-- No markup! -->
Index: ui.colorpicker.js
===================================================================
--- ui.colorpicker.js (revision 253)
+++ ui.colorpicker.js (working copy)
@@ -1,24 +1,27 @@
-;(function($) {
+;(function($) {
- $.fn.extend({
- colorpicker: function(options) {
- var args = Array.prototype.slice.call(arguments, 1);
- return this.each(function() {
- if (typeof options == "string") {
- var inst = $.data(this, "colorpicker");
- if(inst) inst[options].apply(inst, args);
- } else if(!$.data(this, "colorpicker"))
- new $.ui.colorpicker(this, options);
- });
- }
- });
-
- $.ui.colorpicker = function(element, options) {
+$.widget("ui.colorpicker", {
+ plugins: {},
+ ui: function(e) {
+ return {
+ options: this.options,
+ element: this.element,
+ rgb: this.currentColor,
+ hex: (this.toHex(this.currentColor.r) + this.toHex(this.currentColor.g) + this.toHex(this.currentColor.b)).toUpperCase()
+ };
+ },
+ propagate: function(n,e) {
+ $.ui.plugin.call(this, n, [e, this.ui()]);
+ return this.element.triggerHandler(n == "pick" ? n : "pick"+n, [e, this.ui()], this.options[n]);
+ },
+
+ init: function() {
+
//Initialize needed constants
var self = this;
- this.element = $(element);
- var o = this.options = $.extend({}, options);
+ var element = this.element;
+ var o = this.options = $.extend({}, self.options);
$.data(element, "colorpicker", this);
this.element.addClass("ui-colorpicker")
@@ -85,63 +88,48 @@
});
- };
+ },
+
+ destroy: function() {
+ if(!$.data(this.element[0], 'colorpicker')) return;
+ this.element
+ .removeClass("ui-colorpicker ui-colorpicker-disabled")
+ .removeData("colorpicker")
+ .unbind(".colorpicker");
+ },
+ enable: function() {
+ this.element.removeClass("ui-colorpicker-disabled");
+ this.options.disabled = false;
+ },
+ disable: function() {
+ this.element.addClass("ui-colorpicker-disabled");
+ this.options.disabled = true;
+ },
+ setVertColor: function(indic){
+ var n=256/6, j=256/n, C=indic, c=C%n;
+ this.baseColor = {
+ r : parseInt(C<n?255:C<n*2?255-c*j:C<n*4?0:C<n*5?c*j:255),
+ g : parseInt(C<n*2?0:C<n*3?c*j:C<n*5?255:255-c*j),
+ b : parseInt(C<n?c*j:C<n*3?255:C<n*4?255-c*j:0)
+ };
+
+ $("div.ui-colorpicker-color", this.element).css('backgroundColor', 'rgb(' + this.baseColor.r + ',' + this.baseColor.g + ',' + this.baseColor.b + ')');
+ },
+ setGradientColor: function(){
+ var r = Math.round((1-(1-(this.baseColor.r/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
+ var g = Math.round((1-(1-(this.baseColor.g/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
+ var b = Math.round((1-(1-(this.baseColor.b/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
+ this.colorfieldCurrent.css('backgroundColor','rgb(' + r + ',' + g + ',' + b + ')');
+ $('input.ui-colorpicker-rgbR', this.element)[0].value = r;
+ $('input.ui-colorpicker-rgbG', this.element)[0].value = g;
+ $('input.ui-colorpicker-rgbB', this.element)[0].value = b;
+ $('input.ui-colorpicker-hex', this.element)[0].value = (this.toHex(r) + this.toHex(g) + this.toHex(b)).toUpperCase();
+ this.currentColor = {r:r,g:g,b:b};
+ },
+ toHex: function(color){
+ color=parseInt(color).toString(16);
+ return color.length<2?"0"+color:color;
+ }
+});
- $.extend($.ui.colorpicker.prototype, {
- plugins: {},
- ui: function(e) {
- return {
- instance: this,
- options: this.options,
- element: this.element,
- rgb: this.currentColor,
- hex: (this.toHex(this.currentColor.r) + this.toHex(this.currentColor.g) + this.toHex(this.currentColor.b)).toUpperCase()
- };
- },
- propagate: function(n,e) {
- $.ui.plugin.call(this, n, [e, this.ui()]);
- return this.element.triggerHandler(n == "pick" ? n : "pick"+n, [e, this.ui()], this.options[n]);
- },
- destroy: function() {
- if(!$.data(this.element[0], 'colorpicker')) return;
- this.element
- .removeClass("ui-colorpicker ui-colorpicker-disabled")
- .removeData("colorpicker")
- .unbind(".colorpicker");
- },
- enable: function() {
- this.element.removeClass("ui-colorpicker-disabled");
- this.options.disabled = false;
- },
- disable: function() {
- this.element.addClass("ui-colorpicker-disabled");
- this.options.disabled = true;
- },
- setVertColor: function(indic){
- var n=256/6, j=256/n, C=indic, c=C%n;
- this.baseColor = {
- r : parseInt(C<n?255:C<n*2?255-c*j:C<n*4?0:C<n*5?c*j:255),
- g : parseInt(C<n*2?0:C<n*3?c*j:C<n*5?255:255-c*j),
- b : parseInt(C<n?c*j:C<n*3?255:C<n*4?255-c*j:0)
- };
-
- $("div.ui-colorpicker-color", this.element).css('backgroundColor', 'rgb(' + this.baseColor.r + ',' + this.baseColor.g + ',' + this.baseColor.b + ')');
- },
- setGradientColor: function(){
- var r = Math.round((1-(1-(this.baseColor.r/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
- var g = Math.round((1-(1-(this.baseColor.g/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
- var b = Math.round((1-(1-(this.baseColor.b/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
- this.colorfieldCurrent.css('backgroundColor','rgb(' + r + ',' + g + ',' + b + ')');
- $('input.ui-colorpicker-rgbR', this.element)[0].value = r;
- $('input.ui-colorpicker-rgbG', this.element)[0].value = g;
- $('input.ui-colorpicker-rgbB', this.element)[0].value = b;
- $('input.ui-colorpicker-hex', this.element)[0].value = (this.toHex(r) + this.toHex(g) + this.toHex(b)).toUpperCase();
- this.currentColor = {r:r,g:g,b:b};
- },
- toHex: function(color){
- color=parseInt(color).toString(16);
- return color.length<2?"0"+color:color;
- }
- });
-
})(jQuery);
\ No newline at end of file
Download in other formats:
Original Format
File colorpicker.diff, 7.7 KB (added by Cloudream, June 09, 2008 06:16PM UTC)
Index: colorpicker.html
===================================================================
--- colorpicker.html (revision 253)
+++ colorpicker.html (working copy)
@@ -1,28 +1,28 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Color picker</title>
- <script type="text/javascript" src="../../jquery/src/core.js"></script>
- <script type="text/javascript" src="../../jquery/src/selector.js"></script>
- <script type="text/javascript" src="../../jquery/src/event.js"></script>
- <script type="text/javascript" src="../../jquery/src/ajax.js"></script>
- <script type="text/javascript" src="../../jquery/src/fx.js"></script>
- <script type="text/javascript" src="../../jquery/src/offset.js"></script>
-
- <script type="text/javascript" src="../ui.base.js"></script>
- <script type="text/javascript" src="../ui.slider.js"></script>
+
+ <script type="text/javascript" src="../../../trunk/jquery-1.2.6.js"></script>
+
+ <script type="text/javascript" src="../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../../trunk/ui/ui.slider.js"></script>
+
<script type="text/javascript" src="ui.colorpicker.js"></script>
- <script src="pngFix/jquery.pngFix.js" type="text/javascript" charset="utf-8"></script>
+
+ <script type="text/javascript" src="pngFix/jquery.pngFix.js"></script>
+
<link type="text/css" rel="stylesheet" href="ui.colorpicker.css"></link>
- <script type="text/javascript" charset="utf-8">
+ <script type="text/javascript">
$(document).ready(function() {
- $("<div>").appendTo("body").colorpicker();
+ $("<div/>").appendTo("body").colorpicker();
$(document).pngFix();
});
</script>
+
</head>
<body>
<!-- No markup! -->
Index: ui.colorpicker.js
===================================================================
--- ui.colorpicker.js (revision 253)
+++ ui.colorpicker.js (working copy)
@@ -1,24 +1,27 @@
-;(function($) {
+;(function($) {
- $.fn.extend({
- colorpicker: function(options) {
- var args = Array.prototype.slice.call(arguments, 1);
- return this.each(function() {
- if (typeof options == "string") {
- var inst = $.data(this, "colorpicker");
- if(inst) inst[options].apply(inst, args);
- } else if(!$.data(this, "colorpicker"))
- new $.ui.colorpicker(this, options);
- });
- }
- });
-
- $.ui.colorpicker = function(element, options) {
+$.widget("ui.colorpicker", {
+ plugins: {},
+ ui: function(e) {
+ return {
+ options: this.options,
+ element: this.element,
+ rgb: this.currentColor,
+ hex: (this.toHex(this.currentColor.r) + this.toHex(this.currentColor.g) + this.toHex(this.currentColor.b)).toUpperCase()
+ };
+ },
+ propagate: function(n,e) {
+ $.ui.plugin.call(this, n, [e, this.ui()]);
+ return this.element.triggerHandler(n == "pick" ? n : "pick"+n, [e, this.ui()], this.options[n]);
+ },
+
+ init: function() {
+
//Initialize needed constants
var self = this;
- this.element = $(element);
- var o = this.options = $.extend({}, options);
+ var element = this.element;
+ var o = this.options = $.extend({}, self.options);
$.data(element, "colorpicker", this);
this.element.addClass("ui-colorpicker")
@@ -85,63 +88,48 @@
});
- };
+ },
+
+ destroy: function() {
+ if(!$.data(this.element[0], 'colorpicker')) return;
+ this.element
+ .removeClass("ui-colorpicker ui-colorpicker-disabled")
+ .removeData("colorpicker")
+ .unbind(".colorpicker");
+ },
+ enable: function() {
+ this.element.removeClass("ui-colorpicker-disabled");
+ this.options.disabled = false;
+ },
+ disable: function() {
+ this.element.addClass("ui-colorpicker-disabled");
+ this.options.disabled = true;
+ },
+ setVertColor: function(indic){
+ var n=256/6, j=256/n, C=indic, c=C%n;
+ this.baseColor = {
+ r : parseInt(C<n?255:C<n*2?255-c*j:C<n*4?0:C<n*5?c*j:255),
+ g : parseInt(C<n*2?0:C<n*3?c*j:C<n*5?255:255-c*j),
+ b : parseInt(C<n?c*j:C<n*3?255:C<n*4?255-c*j:0)
+ };
+
+ $("div.ui-colorpicker-color", this.element).css('backgroundColor', 'rgb(' + this.baseColor.r + ',' + this.baseColor.g + ',' + this.baseColor.b + ')');
+ },
+ setGradientColor: function(){
+ var r = Math.round((1-(1-(this.baseColor.r/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
+ var g = Math.round((1-(1-(this.baseColor.g/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
+ var b = Math.round((1-(1-(this.baseColor.b/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
+ this.colorfieldCurrent.css('backgroundColor','rgb(' + r + ',' + g + ',' + b + ')');
+ $('input.ui-colorpicker-rgbR', this.element)[0].value = r;
+ $('input.ui-colorpicker-rgbG', this.element)[0].value = g;
+ $('input.ui-colorpicker-rgbB', this.element)[0].value = b;
+ $('input.ui-colorpicker-hex', this.element)[0].value = (this.toHex(r) + this.toHex(g) + this.toHex(b)).toUpperCase();
+ this.currentColor = {r:r,g:g,b:b};
+ },
+ toHex: function(color){
+ color=parseInt(color).toString(16);
+ return color.length<2?"0"+color:color;
+ }
+});
- $.extend($.ui.colorpicker.prototype, {
- plugins: {},
- ui: function(e) {
- return {
- instance: this,
- options: this.options,
- element: this.element,
- rgb: this.currentColor,
- hex: (this.toHex(this.currentColor.r) + this.toHex(this.currentColor.g) + this.toHex(this.currentColor.b)).toUpperCase()
- };
- },
- propagate: function(n,e) {
- $.ui.plugin.call(this, n, [e, this.ui()]);
- return this.element.triggerHandler(n == "pick" ? n : "pick"+n, [e, this.ui()], this.options[n]);
- },
- destroy: function() {
- if(!$.data(this.element[0], 'colorpicker')) return;
- this.element
- .removeClass("ui-colorpicker ui-colorpicker-disabled")
- .removeData("colorpicker")
- .unbind(".colorpicker");
- },
- enable: function() {
- this.element.removeClass("ui-colorpicker-disabled");
- this.options.disabled = false;
- },
- disable: function() {
- this.element.addClass("ui-colorpicker-disabled");
- this.options.disabled = true;
- },
- setVertColor: function(indic){
- var n=256/6, j=256/n, C=indic, c=C%n;
- this.baseColor = {
- r : parseInt(C<n?255:C<n*2?255-c*j:C<n*4?0:C<n*5?c*j:255),
- g : parseInt(C<n*2?0:C<n*3?c*j:C<n*5?255:255-c*j),
- b : parseInt(C<n?c*j:C<n*3?255:C<n*4?255-c*j:0)
- };
-
- $("div.ui-colorpicker-color", this.element).css('backgroundColor', 'rgb(' + this.baseColor.r + ',' + this.baseColor.g + ',' + this.baseColor.b + ')');
- },
- setGradientColor: function(){
- var r = Math.round((1-(1-(this.baseColor.r/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
- var g = Math.round((1-(1-(this.baseColor.g/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
- var b = Math.round((1-(1-(this.baseColor.b/255))*(this.lastValues[0]/255))*(255-this.lastValues[1]));
- this.colorfieldCurrent.css('backgroundColor','rgb(' + r + ',' + g + ',' + b + ')');
- $('input.ui-colorpicker-rgbR', this.element)[0].value = r;
- $('input.ui-colorpicker-rgbG', this.element)[0].value = g;
- $('input.ui-colorpicker-rgbB', this.element)[0].value = b;
- $('input.ui-colorpicker-hex', this.element)[0].value = (this.toHex(r) + this.toHex(g) + this.toHex(b)).toUpperCase();
- this.currentColor = {r:r,g:g,b:b};
- },
- toHex: function(color){
- color=parseInt(color).toString(16);
- return color.length<2?"0"+color:color;
- }
- });
-
})(jQuery);
\ No newline at end of file