Skip to main content

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