Revision: 4662
http://sourceforge.net/p/vexi/code/4662
Author: mkpg2
Date: 2014-02-15 01:57:36 +0000 (Sat, 15 Feb 2014)
Log Message:
-----------
Colorpicker.
- refactor
- support text write
- put to value
Modified Paths:
--------------
branches/vexi3/org.vexi-vexi.widgets/src_main/org/vexi/tool/colorpicker.t
Modified:
branches/vexi3/org.vexi-vexi.widgets/src_main/org/vexi/tool/colorpicker.t
===================================================================
--- branches/vexi3/org.vexi-vexi.widgets/src_main/org/vexi/tool/colorpicker.t
2014-02-14 17:08:28 UTC (rev 4661)
+++ branches/vexi3/org.vexi-vexi.widgets/src_main/org/vexi/tool/colorpicker.t
2014-02-15 01:57:36 UTC (rev 4662)
@@ -1,7 +1,12 @@
<!-- Copyright 2009 - see COPYING for details [LGPL] -->
-<vexi xmlns:ui="vexi://ui" xmlns:meta="vexi://meta" xmlns="org.vexi.tool"
- xmlns:lay="vexi.layout" xmlns:util="vexi.util" xmlns:wi="vexi.widget">
+<vexi xmlns:ui="vexi://ui"
+ xmlns:meta="vexi://meta"
+ xmlns="org.vexi.tool"
+ xmlns:lay="vexi.layout"
+ xmlns:util="vexi.util"
+ xmlns:wi="vexi.widget"
+ xmlns:sync="vexi.util.sync">
<meta:doc>
<name>Colorpicker</name>
<desc>A 24-bit colorpicker</desc>
@@ -87,55 +92,9 @@
</ui:box>
</wi:bevel>
<ui:box />
-
- ////////
- // internal functions
- var hexdid = [ "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A",
"B", "C", "D", "E", "F" ];
- var toHexColor = function(red, green, blue) {
- // REMARK - should be, but is, necessary
- // why are we receiving negative values?
- if (0>red) red = 0;
- if (0>green) green = 0;
- if (0>blue) blue = 0;
-
- return "#" + hexdid[vexi.math.floor(red/16)] +
hexdid[vexi.math.floor(red%16)]
- + hexdid[vexi.math.floor(green/16)] +
hexdid[vexi.math.floor(green%16)]
- + hexdid[vexi.math.floor(blue/16)] +
hexdid[vexi.math.floor(blue%16)];
- }
-
////////
- // gradient bar
-
- var gradient_move = function(v) {
- var pos = $gradient.mouse.y;
- if (pos > $gradient.height) {pos = $gradient.height;}
- else if (0 > pos) {pos = 0;}
- thisbox.n = 1 - (pos/$gradient.height);
- return;
- }
-
- var eventObj;
-
- $gradient.Press1 ++= function(v) {
- gradient_move(v);
- eventObj = surface.event;
- eventObj.addMoveTrap(gradient_move);
- eventObj.Release1 ++= function(v) {
- eventObj._Release1 --= callee;
- eventObj.delMoveTrap(gradient_move);
- return;
- }
- return;
- }
-
- ////////
- // color model
-
- // functions defined later
- var hsn_to_rgb;
- var rgb_to_hsn;
-
+ // api
thisbox.h ++= function() { return $Hue.value; }
thisbox.h ++= function(v) { $Hue.value = v; cascade = v; }
thisbox.s ++= function() { return $Saturation.value; }
@@ -152,69 +111,46 @@
thisbox.color_left ++= function(v) { $colorleft.fill = v; cascade = v;
}
thisbox.color_right ++= function() { return $colorright.fill; }
thisbox.color_right ++= function(v) { $colorright.fill = v; cascade =
v; }
- thisbox.hex ++= function() { return $hexcode.text; }
-
- thisbox.hsnfunc1 = function(v) {
- if (v == trapee[trapname]) return;
- cascade = v;
- hsn_to_rgb();
- }
- $Hue.value ++= hsnfunc1;
- $Saturation.value ++= hsnfunc1;
+ // deliberately shadowing api on box, set internal values without
triggering traps
+ var r, g, b;
+ var h, s, n;
- $Intensity.value ++= function(v) {
- if (v == trapee[trapname]) return;
- // Move the marker on the intensity gradient.
- $gradient.marker.y = 0 - vexi.math.round(v * $gradient.height);
- cascade = v;
- hsn_to_rgb();
- }
-
- thisbox.rgbfunc1 = function(v) {
- if (v == trapee[trapname]) return;
- cascade = v;
- rgb_to_hsn();
- }
-
- $Red.value ++= rgbfunc1;
- $Green.value ++= rgbfunc1;
- $Blue.value ++= rgbfunc1;
+ ////////
+ // internal functions
+ const hexdid = [ "0", "1", "2", "3", "4", "5", "6", "7", "8", "9",
"A", "B", "C", "D", "E", "F" ];
+ const toHexColor = function(red, green, blue) {
+ // REMARK - should be, but is, necessary
+ // why are we receiving negative values?
+ if (0>red) red = 0;
+ if (0>green) green = 0;
+ if (0>blue) blue = 0;
- thisbox.color_move = function(v) {
- var cx = $colorpicker.mouse.x - $colorpicker.width / 2;
- var cy = -1 * ($colorpicker.mouse.y - $colorpicker.height / 2);
- h = (vexi.math.atan(cy / cx) / 2 + vexi.math.PI / 4) /
vexi.math.PI + (cx > 0 ? 0.5 : 0);
- s = vexi.math.min(1.0, vexi.math.sqrt(cy * cy + cx * cx) /
($colorpicker.width / 2));
- return;
+ return "#" + hexdid[vexi.math.floor(red/16)] +
hexdid[vexi.math.floor(red%16)]
+ + hexdid[vexi.math.floor(green/16)] +
hexdid[vexi.math.floor(green%16)]
+ + hexdid[vexi.math.floor(blue/16)] +
hexdid[vexi.math.floor(blue%16)];
}
- $colorpicker.Press1 ++= function(v) {
- color_move(v);
- eventObj = surface.event;
- eventObj.addMoveTrap(color_move);
- eventObj.Release1 ++= function(v) {
- eventObj._Release1 --= callee;
- eventObj.delMoveTrap(color_move);
- return;
- }
- return;
- }
- thisbox.threadsleeping = false;
- thisbox.changelockout = false;
+ var threadsleeping = false;
+ var lock_value = false;
+ var lock_text = false;
+
thisbox.update = function() {
+ var hexval = toHexColor(r,g,b);
+ // (not an input so no lock)
+ $targetcolor.fill = hexval;
+
+ $hexcode.text = hexval;
+
// REMARK - variable names possibly innaccurate but the math works
var distance_from_center = s * $colorpicker.width / 2;
- var angle_from_center = ($Hue.value + 0.25) * vexi.math.PI * 2;
+ var angle_from_center = (h + 0.25) * vexi.math.PI * 2;
$circle.x = distance_from_center *
vexi.math.cos(angle_from_center);
$circle.y = - (distance_from_center *
vexi.math.sin(angle_from_center));
+ $gradient.marker.y = 0 - vexi.math.round(n * $gradient.height);
- var hexval = toHexColor(r,g,b);
- $targetcolor.fill = hexval;
- $hexcode.text = hexval;
-
// make sure there's a thread running, watching to see if rgb
remain
// the same for more than one event cycle. If so, update the
gradient.
if (!threadsleeping) {
@@ -232,9 +168,9 @@
if (i_ == 0) i_ = 6; // Case 0 is the same as case
6.
if (i_%2 == 0) f_ = 1 - f_; // If i_ is even
- var p_ = vexi.math.round((1 - s) * 255);
- var q_ = vexi.math.round((1 - s * f_) * 255);
-
+ var p_ = vexi.math.min(255, vexi.math.round((1 - s) *
255));
+ var q_ = vexi.math.min(255, vexi.math.round((1 - s * f_) *
255));
+
switch(i_) {
case 1: $grad_back.fill = toHexColor(q_, 255, p_);
break;
case 2: $grad_back.fill = toHexColor(p_, 255, q_);
break;
@@ -247,86 +183,213 @@
threadsleeping = false;
}
}
+
+
+ $Red.value = r;
+ $Green.value = g;
+ $Blue.value = b;
+
+ $Hue.value = h;
+ $Saturation.value = s;
+ $Intensity.value = n;
+
+ $RedValue.text = r;
+ $GreenValue.text = g;
+ $BlueValue.text = b;
+
+ // REMARK - v>=0.001 check necessary to prevent really small
numbers (e.g. 4.513E4) appearing as >1
+ $HueValue.text = (""+(h>=0.001?h:0)).substring(0,5);
+ $SaturationValue.text = (""+s).substring(0,5);
+ $IntensityValue.text = (""+n).substring(0,5);
}
hsn_to_rgb = function() {
- if (changelockout) return;
- else changelockout = true;
-
- if (s == 0) {
- // this line doesn't work with traps set on the variables??
- // r = g = b = n * 255;
- var x = n * 255;
- b = x;
- r = x;
- g = x;
- } else {
- var i_ = vexi.math.floor(h*6);
- var f_ = h*6 - i_;
-
- if (i_%2 == 0) f_ = 1 - f_; // If i_ is even
-
- var v_ = vexi.math.round(n * 255);
- var p_ = vexi.math.round(n * (1 - s) * 255);
- var q_ = vexi.math.round(n * (1 - s * f_) * 255);
- if (i_ == 0) i_ = 6; // Case 0 is the same as case 6.
-
- switch (i_) {
- case 1: r = q_; g = v_; b = p_; break;
- case 2: r = p_; g = v_; b = q_; break;
- case 3: r = p_; g = q_; b = v_; break;
- case 4: r = q_; g = p_; b = v_; break;
- case 5: r = v_; g = p_; b = q_; break;
- case 6: r = v_; g = q_; b = p_; break;
- default: vexi.log.error("ERROR: i_="+i_+", which is
outside range 0-6.");
- }
+ if(lock_value) return;
+ lock_value = true;
+ try{
+ if (s == 0) {
+ // this line doesn't work with traps set on the
variables??
+ // r = g = b = n * 255;
+ var x = n * 255;
+ b = x;
+ r = x;
+ g = x;
+ } else {
+ var i_ = vexi.math.floor(h*6);
+ var f_ = h*6 - i_;
+
+ if (i_%2 == 0) f_ = 1 - f_; // If i_ is even
+
+ var v_ = vexi.math.round(n * 255);
+ var p_ = vexi.math.round(n * (1 - s) * 255);
+ var q_ = vexi.math.round(n * (1 - s * f_) * 255);
+ if (i_ == 0) i_ = 6; // Case 0 is the same as case 6.
+
+ switch (i_) {
+ case 1: r = q_; g = v_; b = p_; break;
+ case 2: r = p_; g = v_; b = q_; break;
+ case 3: r = p_; g = q_; b = v_; break;
+ case 4: r = q_; g = p_; b = v_; break;
+ case 5: r = v_; g = p_; b = q_; break;
+ case 6: r = v_; g = q_; b = p_; break;
+ default: vexi.log.error("ERROR: i_="+i_+", which is
outside range 0-6.");
+ }
+ }
+ update();
+ }finally{
+ lock_value = false;
}
-
- update();
- changelockout = false;
}
rgb_to_hsn = function() {
- if (changelockout) return;
- changelockout = true;
+ if(lock_value) return;
+ lock_value = true;
+ try{
+ // both v_ and x_ are in range 0-1.
+ var max = vexi.math.max(vexi.math.max(r, g), b);
+ var min = vexi.math.min(vexi.math.min(r, g), b);
+ var diff = (max - min)/255;
+ var v_ = max/255;
+ if (max == min) {
+ h = s = 0; n = v_;
+ } else {
+ // FIXME: have taken an algorithm designed to spit out h
+ // in range 0-6 and added /6 on the end; remodel
algorithm.
+ var f_ = ( (r == min) ? g - b : ((g == min) ? b - r : r
- g) )/255; // f now in range 0-1.
+ var i_ = (r == min) ? 3 : ((g == min) ? 5 : 1);
+
+ h = (i_ - f_ / diff) / 6;
+ s = (max - min) / max;
+ n = v_;
+ }
+ update();
+ }finally{
+ lock_value = false;
+ }
+ }
- // both v_ and x_ are in range 0-1.
- var max = vexi.math.max(vexi.math.max(r, g), b);
- var min = vexi.math.min(vexi.math.min(r, g), b);
- var diff = (max - min)/255;
- var v_ = max/255;
+
+ // HSN value updates
+ const hsnTrap = function(v){
+ cascade = v;
+ if(lock_value) return;
- if (max == min) {
- h = s = 0; n = v_;
- } else {
- // FIXME: have taken an algorithm designed to spit out h
- // in range 0-6 and added /6 on the end; remodel algorithm.
- var f_ = ( (r == min) ? g - b : ((g == min) ? b - r : r - g)
)/255; // f now in range 0-1.
- var i_ = (r == min) ? 3 : ((g == min) ? 5 : 1);
+ h = $Hue.value;
+ s = $Saturation.value;
+ n = $Intensity.value;
+ hsn_to_rgb();
+ };
+
+ const rgbTrap = function(v){
+ cascade = v;
+ if(lock_value) return;
- h = (i_ - f_ / diff) / 6;
- s = (max - min) / max;
- n = v_;
+ // WORKAROUND slider bug, reading less than 0 even when
+ // never set as such ...
+ r = vexi.math.max(0,$Red.value);
+ g = vexi.math.max(0,$Green.value);
+ b = vexi.math.max(0,$Blue.value);
+ rgb_to_hsn();
+ };
+
+ $Hue.value ++= hsnTrap;
+ $Saturation.value ++= hsnTrap;
+ $Intensity.value ++= hsnTrap;
+
+ // RGB value updates
+ $Red.value ++= rgbTrap;
+ $Green.value ++= rgbTrap;
+ $Blue.value ++= rgbTrap;
+
+
+ $hexcode.text ++= function(v){
+ if(lock_text) return;
+ lock_text = true;
+ try{
+
+ cascade = v;
+ if(lock_value) return;
+ if(v==null){
+ v = "#000000";
+ }
+ if(v.length and v.charAt(0)!='#'){
+ v = "#"+v;
+ }
+ while(7>v.length){
+ v = v + "0";
+ }
+
+ var rgb = vexi.string.parseInt(v.substring(1), 16);
+ r = (rgb>>16)%256;
+ g = (rgb>>8)%256;
+ b = rgb%256;
+ rgb_to_hsn();
+ }finally{
+ lock_text = false;
+ }
+ };
+
+
+
+
+ ////////
+ // gradient bar
+ var eventObj;
+ const gradient_move = function(v) {
+ var pos = $gradient.mouse.y;
+ if (pos > $gradient.height) {pos = $gradient.height;}
+ else if (0 > pos) {pos = 0;}
+ n = 1 - (pos/$gradient.height);
+ hsn_to_rgb();
+ return;
+ }
+
+
+ $gradient.Press1 ++= function(v) {
+ gradient_move(v);
+ eventObj = surface.event;
+ eventObj.addMoveTrap(gradient_move);
+ eventObj.Release1 ++= function(v) {
+ eventObj._Release1 --= callee;
+ eventObj.delMoveTrap(gradient_move);
+ return;
}
+ return;
+ }
+
+ ////////
+ // colour circle
+ const color_move = function(v) {
+ var cx = $colorpicker.mouse.x - $colorpicker.width / 2;
+ var cy = -1 * ($colorpicker.mouse.y - $colorpicker.height / 2);
+ h = (vexi.math.atan(cy / cx) / 2 + vexi.math.PI / 4) /
vexi.math.PI + (cx > 0 ? 0.5 : 0);
+ s = vexi.math.min(1.0, vexi.math.sqrt(cy * cy + cx * cx) /
($colorpicker.width / 2));
+ hsn_to_rgb();
+ return;
+ }
- update();
- changelockout = false;
- }
+ $colorpicker.Press1 ++= function(v) {
+ color_move(v);
+ eventObj = surface.event;
+ eventObj.addMoveTrap(color_move);
+ eventObj.Release1 ++= function(v) {
+ eventObj._Release1 --= callee;
+ eventObj.delMoveTrap(color_move);
+ return;
+ }
+ return;
+ }
- // HSN value updates
- // REMARK - v>=0.001 check necessary to prevent really small numbers
(e.g. 4.513E4) appearing as >1
- $Hue.value ++= function(v) { $HueValue.text =
(""+(v>=0.001?v:0)).substring(0,5); cascade = v; update(); hsn_to_rgb(); }
- $Saturation.value ++= function(v) { $SaturationValue.text =
(""+v).substring(0,5); cascade = v; update(); hsn_to_rgb(); }
- $Intensity.value ++= function(v) { $IntensityValue.text =
(""+v).substring(0,5); cascade = v; update(); hsn_to_rgb(); }
+ $Blue.value ++= function(v){
+ cascade = v;
+ if(0>v) trace(new vexi.js.Exception(v));
+ };
- // RGB value updates
- $Red.value ++= function(v) { $RedValue.text = v; cascade = v;
update(); rgb_to_hsn(); }
- $Green.value ++= function(v) { $GreenValue.text = v; cascade = v;
update(); rgb_to_hsn(); }
- $Blue.value ++= function(v) { $BlueValue.text = v; cascade = v;
update(); rgb_to_hsn(); }
+ // external value
+ sync..sync(thisbox, $hexcode, "value", "text");
// initialize values
- h=0; s=0; n=0; r=0; g=0; b=0;
- hsn_to_rgb();
+ value = null;
</ui:box>
</vexi>
This was sent by the SourceForge.net collaborative development platform, the
world's largest Open Source development site.
------------------------------------------------------------------------------
Android apps run on BlackBerry 10
Introducing the new BlackBerry 10.2.1 Runtime for Android apps.
Now with support for Jelly Bean, Bluetooth, Mapview and more.
Get your Android app in front of a whole new audience. Start now.
http://pubads.g.doubleclick.net/gampad/clk?id=124407151&iu=/4140/ostg.clktrk
_______________________________________________
Vexi-svn mailing list
Vexi-svn@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/vexi-svn
