You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@tapestry.apache.org by jk...@apache.org on 2007/05/13 04:22:52 UTC

svn commit: r537539 - in /tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget: Editor2.js HslColorPicker.js templates/HslColorPicker.svg templates/images/hue.png

Author: jkuhnert
Date: Sat May 12 19:22:51 2007
New Revision: 537539

URL: http://svn.apache.org/viewvc?view=rev&rev=537539
Log:
Probably fixes TAPESTRY-1459.

Added:
    tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js   (with props)
    tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/HslColorPicker.svg   (with props)
    tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/images/hue.png   (with props)
Modified:
    tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/Editor2.js

Modified: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/Editor2.js
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/Editor2.js?view=diff&rev=537539&r1=537538&r2=537539
==============================================================================
--- tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/Editor2.js (original)
+++ tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/Editor2.js Sat May 12 19:22:51 2007
@@ -9,7 +9,7 @@
 var curtInst = this.getCurrentInstance();if((curtInst && curtInst.queryCommandAvailable(name)) ||
 (!curtInst && dojo.widget.Editor2.prototype.queryCommandAvailable(name))){oCommand = new dojo.widget.Editor2BrowserCommand(editor, name);}else{dojo.debug("dojo.widget.Editor2Manager.getCommand: Unknown command "+name);return;}}
 return oCommand;},destroy: function(){this._currentInstance = null;dojo.widget.HandlerManager.prototype.destroy.call(this);}});dojo.addOnUnload(dojo.widget.Editor2Manager, "destroy");dojo.lang.declare("dojo.widget.Editor2Command",null,function(editor,name){this._editor = editor;this._updateTime = 0;this._name = name;},{_text: 'Unknown',execute: function(para){dojo.unimplemented("dojo.widget.Editor2Command.execute");},getText: function(){return this._text;},getState: function(){return dojo.widget.Editor2Manager.commandState.Enabled;},destroy: function(){}}
-);dojo.widget.Editor2BrowserCommandNames={'bold': 'Bold','copy': 'Copy','cut': 'Cut','Delete': 'Delete','indent': 'Indent','inserthorizontalrule': 'Horizental Rule','insertorderedlist': 'Numbered List','insertunorderedlist': 'Bullet List','italic': 'Italic','justifycenter': 'Align Center','justifyfull': 'Justify','justifyleft': 'Align Left','justifyright': 'Align Right','outdent': 'Outdent','paste': 'Paste','redo': 'Redo','removeformat': 'Remove Format','selectall': 'Select All','strikethrough': 'Strikethrough','subscript': 'Subscript','superscript': 'Superscript','underline': 'Underline','undo': 'Undo','unlink': 'Remove Link','createlink': 'Create Link','insertimage': 'Insert Image','htmltoggle': 'HTML Source','forecolor': 'Foreground Color','hilitecolor': 'Background Color','plainformatblock': 'Paragraph Style','formatblock': 'Paragraph Style','fontsize': 'Font Size','fontname': 'Font Name'//,}
+);dojo.widget.Editor2BrowserCommandNames={'bold': 'Bold','copy': 'Copy','cut': 'Cut','Delete': 'Delete','indent': 'Indent','inserthorizontalrule': 'Horizental Rule','insertorderedlist': 'Numbered List','insertunorderedlist': 'Bullet List','italic': 'Italic','justifycenter': 'Align Center','justifyfull': 'Justify','justifyleft': 'Align Left','justifyright': 'Align Right','outdent': 'Outdent','paste': 'Paste','redo': 'Redo','removeformat': 'Remove Format','selectall': 'Select All','strikethrough': 'Strikethrough','subscript': 'Subscript','superscript': 'Superscript','underline': 'Underline','undo': 'Undo','unlink': 'Remove Link','createlink': 'Create Link','insertimage': 'Insert Image','htmltoggle': 'HTML Source','forecolor': 'Foreground Color','hilitecolor': 'Background Color','plainformatblock': 'Paragraph Style','formatblock': 'Paragraph Style','fontsize': 'Font Size','fontname': 'Font Name'};
 dojo.lang.declare("dojo.widget.Editor2BrowserCommand", dojo.widget.Editor2Command,function(editor,name){var text = dojo.widget.Editor2BrowserCommandNames[name.toLowerCase()];if(text){this._text = text;}},{execute: function(para){this._editor.execCommand(this._name, para);},getState: function(){if(this._editor._lastStateTimestamp > this._updateTime || this._state == undefined){this._updateTime = this._editor._lastStateTimestamp;try{if(this._editor.queryCommandEnabled(this._name)){if(this._editor.queryCommandState(this._name)){this._state = dojo.widget.Editor2Manager.commandState.Latched;}else{this._state = dojo.widget.Editor2Manager.commandState.Enabled;}}else{this._state = dojo.widget.Editor2Manager.commandState.Disabled;}}catch (e) {this._state = dojo.widget.Editor2Manager.commandState.Enabled;}}
 return this._state;},getValue: function(){try{return this._editor.queryCommandValue(this._name);}catch(e){}}}
 );dojo.lang.declare("dojo.widget.Editor2FormatBlockCommand", dojo.widget.Editor2BrowserCommand, {}

Added: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js?view=auto&rev=537539
==============================================================================
--- tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js (added)
+++ tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js Sat May 12 19:22:51 2007
@@ -0,0 +1,7 @@
+
+dojo.provide("dojo.widget.svg.HslColorPicker");dojo.require("dojo.widget.*");dojo.require("dojo.widget.HtmlWidget");dojo.require("dojo.widget.HslColorPicker");dojo.require("dojo.math");dojo.require("dojo.svg");dojo.require("dojo.gfx.color");dojo.require("dojo.gfx.color.hsl");dojo.require("dojo.experimental");dojo.experimental("dojo.widget.svg.HslColorPicker");dojo.widget.defineWidget(
+"dojo.widget.svg.HslColorPicker",dojo.widget.HtmlWidget,function(){dojo.debug("warning: the HslColorPicker is not a finished widget, and is not yet ready for general use");this.filterObject = {};},{hue: "0",saturation: "0",light: "0",storedColor: "#0054aa",templateString:"<svg xmlns=\"http://www.w3.org/2000/svg\"\n\txmlns:xlink=\"http://www.w3.org/1999/xlink\"\n\tversion=\"1.1\" baseProfile=\"full\" width=\"170\" height=\"131\" xmlns:html=\"http://www.w3.org/1999/xhtml\">\n\t<defs>\n\t<linearGradient id=\"colorGradient\" dojoAttachPoint=\"colorGradientNode\" x1=\"0\" x2=\"131\" y1=\"0\" y2=\"0\" gradientUnits=\"userSpaceOnUse\">\n\t\t<stop id=\"leftGradientColor\" dojoAttachPoint=\"leftGradientColorNode\" offset=\"0%\" stop-color=\"#828282\"/>\n\t\t<stop id=\"rightGradientColor\" dojoAttachPoint=\"rightGradientColorNode\" offset=\"100%\" stop-color=\"#053fff\"/>\n\t</linearGradient>\n\t<linearGradient id=\"verticalGradient\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"131\" gradientUnit
 s=\"userSpaceOnUse\">\n\t\t<stop offset=\"0%\" style=\"stop-color:#000000;\"/>\n\t\t<stop offset=\"50%\" style=\"stop-color:#000000;stop-opacity:0;\"/>\n\t\t<stop offset=\"50%\" style=\"stop-color:#ffffff;stop-opacity:0;\"/>\n\t\t<stop offset=\"100%\" style=\"stop-color:#ffffff;\"/>\n\t</linearGradient>\n\t<linearGradient id=\"sliderGradient\">\n\t\t<stop offset=\"0%\" style=\"stop-color:#000000;\"/>\n\t\t<stop offset=\"15%\" style=\"stop-color:#ffffff;\"/>\n\t\t<stop offset=\"30%\" style=\"stop-color:#000000;\"/>\n\t\t<stop offset=\"45%\" style=\"stop-color:#ffffff;\"/>\n\t\t<stop offset=\"60%\" style=\"stop-color:#000000;\"/>\n\t\t<stop offset=\"75%\" style=\"stop-color:#ffffff;\"/>\n\t\t<stop offset=\"90%\" style=\"stop-color:#000000;\"/>\n\t</linearGradient>\n</defs>\n\t<rect x=\"0\" y=\"0\" width=\"131px\" height=\"131px\" fill=\"url(#colorGradient)\"/>\n\t<rect x=\"0\" y=\"0\" width=\"131px\" height=\"131px\" style=\"fill:url(#verticalGradient);\"/>\n\t<rect id=\"satur
 ationLightSlider\" dojoAttachPoint=\"saturationLightSliderNode\" x=\"100\" y=\"100\" width=\"5px\" height=\"5px\" style=\"stroke:url(#sliderGradient);stroke-width:1px;fill-opacity:0;\"/>\n\t<image xlink:href=\"images/hue.png\" dojoAttachPoint=\"hueNode\" x=\"140px\" y=\"0px\" width=\"21px\" height=\"131px\" dojoAttachEvent=\"onclick: onHueClick;\"/>\n\t<rect dojoAttachPoint=\"hueSliderNode\" x=\"139px\" y=\"40px\" width=\"24px\" height=\"4px\" style=\"stroke-opacity:1;fill-opacity:0;stroke:black;\"/>\n</svg>\n",fillInTemplate: function() {this.height = "131px";this.svgDoc = this.hueNode.ownerDocument;this.leftGradientColorNode = this.hueNode.ownerDocument.getElementById("leftGradientColor");this.rightGradientColorNode = this.hueNode.ownerDocument.getElementById("rightGradientColor");this.hueNode.setAttributeNS(dojo.dom.xmlns.xlink, "href", dojo.uri.moduleUri("dojo.widget", "templates/images/hue.png"));var hsl = dojo.gfx.color.hex2hsl(this.storedColor);this.hue = hsl[0];this.
 saturation = hsl[1];this.light = hsl[2];this.setSaturationStopColors();},setSaturationStopColors: function() {this.leftGradientStopColor = dojo.gfx.color.rgb2hex(this.hsl2rgb(this.hue, 0, 50));this.rightGradientStopColor = dojo.gfx.color.rgb2hex(this.hsl2rgb(this.hue, 100, 50));this.leftGradientColorNode.setAttributeNS(null,'stop-color',this.leftGradientStopColor);this.rightGradientColorNode.setAttributeNS(null,'stop-color',this.rightGradientStopColor);},setHue: function(hue) {this.hue = hue;},setHueSlider: function() {this.hueSliderNode.setAttribute("y", parseInt((this.hue/360) * parseInt(this.height) - 2) + "px" );},setSaturationLight: function(saturation, light) {this.saturation = saturation;this.light = light;},setSaturationLightSlider: function() {},onHueClick: function(evt) {var yPosition = parseInt(evt.clientY) - parseInt(evt.target.getAttribute("y"));this.setHue( 360 - parseInt(yPosition*(360/parseInt(this.height))) );this.setSaturationStopColors();this.setStoredColo
 r(dojo.gfx.color.hsl2hex(this.hue, this.saturation, this.light));},onHueDrag: function(evt) {},onSaturationLightClick: function(evt) {var xPosition = parseInt(evt.clientX) - parseInt(evt.target.getAttribute("y"));var yPosition = parseInt(evt.clientY) - parseInt(evt.target.getAttribute("y"));var saturation = parseInt(parseInt(xPosition)*(101/106));var light = parseInt(parseInt(yPosition)*(101/106));this.setSaturationLight(saturation, light);this.setStoredColor(dojo.gfx.color.hsl2hex(this.hue, this.saturation, this.light));},onSaturationLightDrag: function(evt) {},getStoredColor: function() {return this.storedColor;},setStoredColor: function(rgbHexColor) {this.storedColor = rgbHexColor;dojo.event.topic.publish("/" + this.widgetId + "/setStoredColor", this.filterObject);},hsl2rgb: function(hue, saturation, light)
+{function rgb(q1,q2,hue) {if (hue>360) hue=hue-360;if (hue<0) hue=hue+360;if (hue<60) return (q1+(q2-q1)*hue/60);else if (hue<180) return(q2);else if (hue<240) return(q1+(q2-q1)*(240-hue)/60);else return(q1);}
+this.rgb = rgb
+if (saturation==0) {return [Math.round(light*255/100), Math.round(light*255/100), Math.round(light*255/100)];} else {light = light/100;saturation = saturation/100;if ((light)<0.5) {var temp2 = (light)*(1.0+saturation)} else {var temp2 = (light+saturation-(light*saturation))}
+var temp1 = 2.0*light - temp2;var rgbcolor = [];rgbcolor[0] = Math.round(rgb(temp1,temp2,parseInt(hue)+120)*255);rgbcolor[1] = Math.round(rgb(temp1,temp2,hue)*255);rgbcolor[2] = Math.round(rgb(temp1,temp2,parseInt(hue)-120)*255);return rgbcolor;}}});
\ No newline at end of file

Propchange: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js
------------------------------------------------------------------------------
    svn:eol-style = native

Propchange: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js
------------------------------------------------------------------------------
    svn:keywords = Date Revision

Propchange: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/HslColorPicker.js
------------------------------------------------------------------------------
    svn:mime-type = text/plain

Added: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/HslColorPicker.svg
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/HslColorPicker.svg?view=auto&rev=537539
==============================================================================
--- tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/HslColorPicker.svg (added)
+++ tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/HslColorPicker.svg Sat May 12 19:22:51 2007
@@ -0,0 +1,30 @@
+<svg xmlns="http://www.w3.org/2000/svg"
+	xmlns:xlink="http://www.w3.org/1999/xlink"
+	version="1.1" baseProfile="full" width="170" height="131" xmlns:html="http://www.w3.org/1999/xhtml">
+	<defs>
+	<linearGradient id="colorGradient" dojoAttachPoint="colorGradientNode" x1="0" x2="131" y1="0" y2="0" gradientUnits="userSpaceOnUse">
+		<stop id="leftGradientColor" dojoAttachPoint="leftGradientColorNode" offset="0%" stop-color="#828282"/>
+		<stop id="rightGradientColor" dojoAttachPoint="rightGradientColorNode" offset="100%" stop-color="#053fff"/>
+	</linearGradient>
+	<linearGradient id="verticalGradient" x1="0" x2="0" y1="0" y2="131" gradientUnits="userSpaceOnUse">
+		<stop offset="0%" style="stop-color:#000000;"/>
+		<stop offset="50%" style="stop-color:#000000;stop-opacity:0;"/>
+		<stop offset="50%" style="stop-color:#ffffff;stop-opacity:0;"/>
+		<stop offset="100%" style="stop-color:#ffffff;"/>
+	</linearGradient>
+	<linearGradient id="sliderGradient">
+		<stop offset="0%" style="stop-color:#000000;"/>
+		<stop offset="15%" style="stop-color:#ffffff;"/>
+		<stop offset="30%" style="stop-color:#000000;"/>
+		<stop offset="45%" style="stop-color:#ffffff;"/>
+		<stop offset="60%" style="stop-color:#000000;"/>
+		<stop offset="75%" style="stop-color:#ffffff;"/>
+		<stop offset="90%" style="stop-color:#000000;"/>
+	</linearGradient>
+</defs>
+	<rect x="0" y="0" width="131px" height="131px" fill="url(#colorGradient)"/>
+	<rect x="0" y="0" width="131px" height="131px" style="fill:url(#verticalGradient);"/>
+	<rect id="saturationLightSlider" dojoAttachPoint="saturationLightSliderNode" x="100" y="100" width="5px" height="5px" style="stroke:url(#sliderGradient);stroke-width:1px;fill-opacity:0;"/>
+	<image xlink:href="images/hue.png" dojoAttachPoint="hueNode" x="140px" y="0px" width="21px" height="131px" dojoAttachEvent="onclick: onHueClick;"/>
+	<rect dojoAttachPoint="hueSliderNode" x="139px" y="40px" width="24px" height="4px" style="stroke-opacity:1;fill-opacity:0;stroke:black;"/>
+</svg>

Propchange: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/HslColorPicker.svg
------------------------------------------------------------------------------
    svn:eol-style = native

Added: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/images/hue.png
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/images/hue.png?view=auto&rev=537539
==============================================================================
Binary file - no diff available.

Propchange: tapestry/tapestry4/trunk/tapestry-framework/src/js/dojo/src/widget/templates/images/hue.png
------------------------------------------------------------------------------
    svn:mime-type = image/png