[richfaces-svn-commits] JBoss Rich Faces SVN: r13565 - in trunk/ui/colorPicker/src/main: resources/org/richfaces/renderkit/html/scripts and 1 other directories.

richfaces-svn-commits at lists.jboss.org richfaces-svn-commits at lists.jboss.org
Tue Apr 14 10:09:46 EDT 2009


Author: pyaschenko
Date: 2009-04-14 10:09:46 -0400 (Tue, 14 Apr 2009)
New Revision: 13565

Modified:
   trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/css/colorPicker.xcss
   trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/scripts/ui.colorpicker.js
   trunk/ui/colorPicker/src/main/templates/org/richfaces/htmlColorPicker.jspx
Log:
https://jira.jboss.org/jira/browse/RF-6752

Modified: trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/css/colorPicker.xcss
===================================================================
--- trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/css/colorPicker.xcss	2009-04-14 13:44:09 UTC (rev 13564)
+++ trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/css/colorPicker.xcss	2009-04-14 14:09:46 UTC (rev 13565)
@@ -4,14 +4,14 @@
    xmlns="http://www.w3.org/1999/xhtml" >
    <f:verbatim>
    <![CDATA[
-.rich-colorPicker-wrapper{
+.rich-color-picker-wrapper{
 	display:none;
 	overflow:hidden;
 	position:absolute;
 	width:350px;
 	z-index: 3;
 }
-.rich-colorPicker-ext{
+.rich-color-picker-ext{
 	border: 1px solid;
 	position: relative;
 	height: 170px;
@@ -19,10 +19,10 @@
 	margin: 0px;
 }
 
-.rich-colorPicker-rainbow div{
+.rich-color-picker-rainbow div{
 	background: transparent no-repeat scroll left top;
 }
-.rich-colorPicker-color {
+.rich-color-picker-color {
 	background:#FF0000 none repeat scroll 0 0;
 	cursor:crosshair;
 	left:7px;
@@ -34,7 +34,7 @@
 	border: 1px solid;
 }
 
-.rich-colorPicker-color div {
+.rich-color-picker-color div {
 	left:0;
 	position:absolute;
 	top:0;
@@ -42,7 +42,7 @@
 	width:150px;
 }
 
-.rich-colorPicker-color div div {
+.rich-color-picker-color div div {
 	left:0;
 	top:0;
 	position:absolute;
@@ -52,7 +52,7 @@
 	height:11px;
 }
 
-.rich-colorPicker-rainbow{
+.rich-color-picker-rainbow{
 	cursor:n-resize;
 	height:150px;
 	left:160px;
@@ -61,7 +61,7 @@
 	width:35px;
 	text-align: center;
 }
-.rich-colorPicker-rainbow div{
+.rich-color-picker-rainbow div{
 	height:9px;
 	left:1px;
 	margin:-4px 0 0;
@@ -70,7 +70,7 @@
 	width:35px;
 }
 
-.rich-colorPicker-new-color, .rich-colorPicker-current-color{
+.rich-color-picker-new-color, .rich-color-picker-current-color{
 	position:absolute;
 	top:7px;
 	width: 60px;
@@ -78,22 +78,22 @@
 	border: 1px solid;
 }
 
-.rich-colorPicker-current-color{
+.rich-color-picker-current-color{
 	right:7px;
 	top:7px;
 }
 
-.rich-colorPicker-new-color{
+.rich-color-picker-new-color{
     left:198px;
 }
-.rich-colorPicker-hex-wrapper {
+.rich-color-picker-hex-wrapper {
 	height:22px;
 	left:202px;
 	position:absolute;
 	top:119px;
 }
 
-.rich-colorPicker-rgb-wrapper{
+.rich-color-picker-rgb-wrapper{
 	left:184px;
 	position:absolute;
 	top:55px;
@@ -103,7 +103,7 @@
 	margin-bottom: 2px
 }
 
-.rich-colorPicker-hsb-wrapper{
+.rich-color-picker-hsb-wrapper{
 	right:7px;
 	position:absolute;
 	top:55px;
@@ -112,46 +112,46 @@
 	text-align: right;
 	margin-bottom: 2px
 }
-.rich-colorPicker-hsb-h, .rich-colorPicker-rgb-r{
+.rich-color-picker-hsb-h, .rich-color-picker-rgb-r{
 	top:45px;
 }
-.rich-colorPicker-hsb-s, .rich-colorPicker-rgb-g{
+.rich-color-picker-hsb-s, .rich-color-picker-rgb-g{
 	top:70px;
 }
-.rich-colorPicker-hsb-b, .rich-colorPicker-rgb-b{
+.rich-color-picker-hsb-b, .rich-color-picker-rgb-b{
 	top:95px;
 }
 
 
-.rich-colorPicker-rgb-wrapper  label {
+.rich-color-picker-rgb-wrapper  label {
 	padding-top: 2px;
 	font-size: 16px;
 }
 
-.rich-colorPicker-colors-input{
+.rich-color-picker-colors-input{
 	width: 35px;	
 	border: 1px solid;
 }
 
-.rich-colorPicker-hex-wrapper input{
+.rich-color-picker-hex-wrapper input{
 	width:60px;
 	font-size: 13px;
 }
 
-.rich-colorPicker-submit, .rich-colorPicker-cancel{
+.rich-color-picker-submit, .rich-color-picker-cancel{
 	position:absolute;
 	right:75px;
 	top:144px;
 }
-.rich-colorPicker-cancel{
+.rich-color-picker-cancel{
 	right:7px;
 }
-.rich-colorPicker-span input{
+.rich-color-picker-span input{
 	border: 1px solid;
 	width:130px;
 	vertical-align:middle;
 }
-.rich-colorPicker-icon {
+.rich-color-picker-icon {
 	display:inline;
 	cursor:pointer;
 	height:16px;
@@ -159,7 +159,7 @@
 	vertical-align:middle;	
 	border: 1px solid;
 }
-.rich-colorPicker-icon-disabled{
+.rich-color-picker-icon-disabled{
 	background-color: #cccccc;
 	height:16px;
 	width:16px;
@@ -167,12 +167,12 @@
    ]]>
     </f:verbatim>
    
-    <u:selector name=".rich-colorPicker-ext">
+    <u:selector name=".rich-color-picker-ext">
 		<u:style name="border-color" skin="panelBorderColor"/>
 		<u:style name="background-color" skin="generalBackgroundColor"/>
 		<u:style name="font-family" skin="generalFamilyFont"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-span input">
+	<u:selector name=".rich-color-picker-span input">
 		<u:style name="background-repeat" value="repeat-x" />
 		<u:style name="background-image">
 			<f:resource f:key="org.richfaces.renderkit.html.images.InputBackgroundImage" />
@@ -181,45 +181,45 @@
 		<u:style name="font-size" skin="generalSizeFont"/>
 		<u:style name="font-family" skin="generalFamilyFont"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-ext input">
+	<u:selector name=".rich-color-picker-ext input">
 		<u:style name="color" skin="controlTextColor"/>
 		<u:style name="background-color" skin="controlBackgroundColor"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-ext label">
+	<u:selector name=".rich-color-picker-ext label">
 		<u:style name="color" skin="generalSizeFont"/>
 		<u:style name="font-size" skin="generalSizeFont"/>
 		<u:style name="font-family" skin="generalFamilyFont"/>
 	</u:selector>
-    <u:selector name=".rich-colorPicker-icon">
+    <u:selector name=".rich-color-picker-icon">
 		<u:style name="border-color" skin="panelBorderColor"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-color">
+	<u:selector name=".rich-color-picker-color">
 		<u:style name="border-color" skin="panelBorderColor"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-new-color">
+	<u:selector name=".rich-color-picker-new-color">
 		<u:style name="border-color" skin="panelBorderColor"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-current-color">
+	<u:selector name=".rich-color-picker-current-color">
 		<u:style name="border-color" skin="panelBorderColor"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-cancel">
+	<u:selector name=".rich-color-picker-cancel">
 		<u:style name="font-size" skin="buttonFontSize"/>
 		<u:style name="font-family" skin="buttonFamilyFont"/>
 		<u:style name="color" skin="headerTextColor"/>
 		<u:style name="border-color" skin="headerBackgroundColor"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-submit">
+	<u:selector name=".rich-color-picker-submit">
 		<u:style name="font-size" skin="buttonFontSize"/>
 		<u:style name="font-family" skin="buttonFamilyFont"/>
 		<u:style name="color" skin="headerTextColor"/>
 		<u:style name="border-color" skin="headerBackgroundColor"/>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-color div">
+	<u:selector name=".rich-color-picker-color div">
 		<u:style name="background-image">
 			<f:resource f:key="/org/richfaces/renderkit/html/images/colorpicker_overlay.png" />
 		</u:style>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-colors-input">
+	<u:selector name=".rich-color-picker-colors-input">
 		<u:style name="font-size" skin="generalSizeFont"/>
 		<u:style name="font-family" skin="generalFamilyFont"/>
 		<u:style name="color" skin="generalTextColor"/>
@@ -227,17 +227,17 @@
 		<u:style name="background-color" skin="controlBackgroundColor"/>
 	</u:selector>
 	
-	<u:selector name=".rich-colorPicker-color div div">
+	<u:selector name=".rich-color-picker-color div div">
 		<u:style name="background-image">
 			<f:resource f:key="/org/richfaces/renderkit/html/images/colorpicker_select.gif" />
 		</u:style>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-rainbow div">
+	<u:selector name=".rich-color-picker-rainbow div">
 		<u:style name="background-image">
 			<f:resource f:key="/org/richfaces/renderkit/html/images/rangearrows.gif" />
 		</u:style>
 	</u:selector>
-	<u:selector name=".rich-colorPicker-submit, .rich-colorPicker-cancel">
+	<u:selector name=".rich-color-picker-submit, .rich-color-picker-cancel">
 		<u:style name="color" skin="headerTextColor" />
 		<u:style name="border-color" skin="panelBorderColor" />
 		<u:style name="font-size" skin="generalSizeFont" />

Modified: trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/scripts/ui.colorpicker.js
===================================================================
--- trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/scripts/ui.colorpicker.js	2009-04-14 13:44:09 UTC (rev 13564)
+++ trunk/ui/colorPicker/src/main/resources/org/richfaces/renderkit/html/scripts/ui.colorpicker.js	2009-04-14 14:09:46 UTC (rev 13565)
@@ -146,21 +146,21 @@
 
 
 
-		this.selector = this.picker.find('div.rich-colorPicker-color').bind('mousedown', function(e) { return self._downSelector.call(self, e); });
+		this.selector = this.picker.find('div.rich-color-picker-color').bind('mousedown', function(e) { return self._downSelector.call(self, e); });
 		this.selectorIndic = this.selector.find('div div');
-		this.hue = this.picker.find('div.rich-colorPicker-rainbow div');
-		this.picker.find('div.rich-colorPicker-rainbow').bind('mousedown', function(e) { return self._downHue.call(self, e); });
+		this.hue = this.picker.find('div.rich-color-picker-rainbow div');
+		this.picker.find('div.rich-color-picker-rainbow').bind('mousedown', function(e) { return self._downHue.call(self, e); });
 
-		this.newColor = this.picker.find('div.rich-colorPicker-new-color');
-		this.currentColor = this.picker.find('div.rich-colorPicker-current-color');
-		this.iconColor = $(o.clientId.toString()+' .rich-colorPicker-icon');
+		this.newColor = this.picker.find('div.rich-color-picker-new-color');
+		this.currentColor = this.picker.find('div.rich-color-picker-current-color');
+		this.iconColor = $(o.clientId.toString()+' .rich-color-picker-icon');
 		
-		this.picker.find('.rich-colorPicker-submit')
+		this.picker.find('.rich-color-picker-submit')
 			.bind('mouseenter', function(e) { return self._enterSubmit.call(self, e); })
 			.bind('mouseleave', function(e) { return self._leaveSubmit.call(self, e); })
 			.bind('click', function(e) { return self._clickSubmit.call(self, e); });
 
-		this.picker.find('.rich-colorPicker-cancel')
+		this.picker.find('.rich-color-picker-cancel')
 			.bind('mouseenter', function(e) { return self._enterCancel.call(self, e); })
 			.bind('mouseleave', function(e) { return self._leaveCancel.call(self, e); })
 			.bind('click', function(e) { return self._clickCancel.call(self, e); });
@@ -310,20 +310,20 @@
 		this._trigger('change', e, this._createEventArgument(col));
 	},
 	_blur: function(e) {
-		this.fields.parent().removeClass('rich-colorPicker-focus');
+		this.fields.parent().removeClass('rich-color-picker-focus');
 
 	},
 	_focus: function(e) {
 
 		this.charMin = e.target.parentNode.className.indexOf('-hex') > 0 ? 70 : 65;
-		this.fields.parent().removeClass('rich-colorPicker-focus');
-		$(e.target.parentNode).addClass('rich-colorPicker-focus');
+		this.fields.parent().removeClass('rich-color-picker-focus');
+		$(e.target.parentNode).addClass('rich-color-picker-focus');
 
 	},
 	_downHue: function(e) {
 
 		this.currentHue = {
-			y: this.picker.find('div.rich-colorPicker-rainbow').offset().top
+			y: this.picker.find('div.rich-color-picker-rainbow').offset().top
 		};
 
 		this._change.apply(this, [e, this
@@ -358,7 +358,7 @@
 
 		var self = this;
 		this.currentSelector = {
-			pos: this.picker.find('div.rich-colorPicker-color').offset()
+			pos: this.picker.find('div.rich-color-picker-color').offset()
 		};
 
 		this._change.apply(this, [e, this
@@ -395,16 +395,16 @@
 		return false;
 	},
 	_enterSubmit: function(e) {
-		this.picker.find('.rich-colorPicker-submit').addClass('rich-colorPicker-focus');
+		this.picker.find('.rich-color-picker-submit').addClass('rich-color-picker-focus');
 	},
 	_leaveSubmit: function(e) {
-		this.picker.find('.rich-colorPicker-submit').removeClass('rich-colorPicker-focus');
+		this.picker.find('.rich-color-picker-submit').removeClass('rich-color-picker-focus');
 	},
 	_enterCancel: function(e) {
-		this.picker.find('.rich-colorPicker-cancel').addClass('rich-colorPicker-focus');
+		this.picker.find('.rich-color-picker-cancel').addClass('rich-color-picker-focus');
 	},
 	_leaveCancel: function(e) {
-		this.picker.find('.rich-colorPicker-cancel').removeClass('rich-colorPicker-focus');
+		this.picker.find('.rich-color-picker-cancel').removeClass('rich-color-picker-focus');
 	},
 	_clickSubmit: function(e) {
 

Modified: trunk/ui/colorPicker/src/main/templates/org/richfaces/htmlColorPicker.jspx
===================================================================
--- trunk/ui/colorPicker/src/main/templates/org/richfaces/htmlColorPicker.jspx	2009-04-14 13:44:09 UTC (rev 13564)
+++ trunk/ui/colorPicker/src/main/templates/org/richfaces/htmlColorPicker.jspx	2009-04-14 14:09:46 UTC (rev 13565)
@@ -23,7 +23,7 @@
 	
 	<f:call name="addPopupToAjaxRendered" />
 	
-	<span id="#{clientId}" class="rich-colorPicker-span"	x:passThruWithExclusions="value,name,type,id,styleClass,class,style">
+	<span id="#{clientId}" class="rich-color-picker-span"	x:passThruWithExclusions="value,name,type,id,styleClass,class,style">
 		<input readonly="readonly" type="text" name="#{clientId}" value="#{value}"/>
 		<jsp:scriptlet><![CDATA[
             if(component.getFacet("icon")!=null && component.getFacet("icon").isRendered()) {
@@ -32,20 +32,20 @@
 		<jsp:scriptlet><![CDATA[
 			}else{
 		]]></jsp:scriptlet>
-                <img src="#{arrow}" class="rich-colorPicker-icon #{component.attributes['iconClass']}" style="#{component.attributes['iconStyle']}" vertical-align="middle"/>
+                <img src="#{arrow}" class="rich-color-picker-icon #{component.attributes['iconClass']}" style="#{component.attributes['iconStyle']}" vertical-align="middle"/>
         <jsp:scriptlet><![CDATA[
 			}
 		]]></jsp:scriptlet>
 	</span>
 	
-<div id="#{clientId}-colorPicker-popup" class="rich-colorPicker-wrapper">
-	<div class="rich-colorPicker-ext">
-		<div class="rich-colorPicker-color">
+<div id="#{clientId}-colorPicker-popup" class="rich-color-picker-wrapper">
+	<div class="rich-color-picker-ext">
+		<div class="rich-color-picker-color">
 			<div>
 				<div></div>
 			</div>
 		</div>
-		<div class="rich-colorPicker-rainbow">
+		<div class="rich-color-picker-rainbow">
 			<img src="#{rainbow}" alt="rainbow" />
 		<jsp:scriptlet>
 			<![CDATA[if(component.getFacet("arrows")!=null && component.getFacet("arrows").isRendered()) {]]>
@@ -65,43 +65,43 @@
 	
 
 		</div>
-		<div class="rich-colorPicker-new-color"></div>
-		<div class="rich-colorPicker-current-color"></div>
-		<div class="rich-colorPicker-hex-wrapper">
-			<label for="rich-colorPicker-hex-wrapper" title="hex">#:</label>
-			<input id="#{clientId}-colorPicker-hex" class="rich-colorPicker-colors-input" type="text" maxlength="6" size="6" />
+		<div class="rich-color-picker-new-color"></div>
+		<div class="rich-color-picker-current-color"></div>
+		<div class="rich-color-picker-hex-wrapper">
+			<label for="rich-color-picker-hex-wrapper" title="hex">#:</label>
+			<input id="#{clientId}-colorPicker-hex" class="rich-color-picker-colors-input" type="text" maxlength="6" size="6" />
 		</div>
-		<div class="rich-colorPicker-rgb-wrapper rich-colorPicker-rgb-r">
+		<div class="rich-color-picker-rgb-wrapper rich-color-picker-rgb-r">
 				<label for="rgb">R:</label>
-				<input id="#{clientId}-colorPicker-rgb-r" class="rich-colorPicker-colors-input" type="text" maxlength="3" size="2" />
+				<input id="#{clientId}-colorPicker-rgb-r" class="rich-color-picker-colors-input" type="text" maxlength="3" size="2" />
         </div>
-		<div class="rich-colorPicker-rgb-wrapper rich-colorPicker-rgb-g">
+		<div class="rich-color-picker-rgb-wrapper rich-color-picker-rgb-g">
 				<label for="rgb-g">G:</label>
-				<input id="#{clientId}-colorPicker-rgb-g" class="rich-colorPicker-colors-input" type="text" maxlength="3" size="2" />
+				<input id="#{clientId}-colorPicker-rgb-g" class="rich-color-picker-colors-input" type="text" maxlength="3" size="2" />
 		</div>
-		<div class="rich-colorPicker-rgb-wrapper rich-colorPicker-rgb-b">
+		<div class="rich-color-picker-rgb-wrapper rich-color-picker-rgb-b">
 				<label for="rgb-b">B:</label>
-				<input id="#{clientId}-colorPicker-rgb-b" class="rich-colorPicker-colors-input" type="text" maxlength="3" size="2" />
+				<input id="#{clientId}-colorPicker-rgb-b" class="rich-color-picker-colors-input" type="text" maxlength="3" size="2" />
 		</div>
-		<div class="rich-colorPicker-hsb-h rich-colorPicker-hsb-wrapper">
+		<div class="rich-color-picker-hsb-h rich-color-picker-hsb-wrapper">
 				<label for="hsb-h">H:</label>
-				<input id="#{clientId}-colorPicker-hsb-h" class="rich-colorPicker-colors-input" type="text" maxlength="3" size="2" />
+				<input id="#{clientId}-colorPicker-hsb-h" class="rich-color-picker-colors-input" type="text" maxlength="3" size="2" />
 		</div>
-		<div class="rich-colorPicker-hsb-s rich-colorPicker-hsb-wrapper">
+		<div class="rich-color-picker-hsb-s rich-color-picker-hsb-wrapper">
 				<label for="hsb-s">S:</label>
-				<input id="#{clientId}-colorPicker-hsb-s" class="rich-colorPicker-colors-input" type="text" maxlength="3" size="2" />
+				<input id="#{clientId}-colorPicker-hsb-s" class="rich-color-picker-colors-input" type="text" maxlength="3" size="2" />
 		</div>		
-		<div class="rich-colorPicker-hsb-b rich-colorPicker-hsb-wrapper">		
+		<div class="rich-color-picker-hsb-b rich-color-picker-hsb-wrapper">		
 				<label for="hsb-b">B:</label>
-				<input id="#{clientId}-colorPicker-hsb-b" class="rich-colorPicker-colors-input" type="text" maxlength="3" size="2" />
+				<input id="#{clientId}-colorPicker-hsb-b" class="rich-color-picker-colors-input" type="text" maxlength="3" size="2" />
 		</div>
-		<button type="button" class="rich-colorPicker-submit" name="submit">Apply</button>
-		<button type="button" class="rich-colorPicker-cancel" name="cancel">Cancel</button>
+		<button type="button" class="rich-color-picker-submit" name="submit">Apply</button>
+		<button type="button" class="rich-color-picker-cancel" name="cancel">Cancel</button>
 	</div>
 </div>
 	<div style="display: none;" id="#{clientId}-colorPicker-script">
 	<script type="text/javascript">
-		jQuery('div.rich-colorPicker-color').pngFix();
+		jQuery('div.rich-color-picker-color').pngFix();
 		<jsp:scriptlet><![CDATA[
 		Boolean flat = (Boolean) component.getAttributes().get("flat");
 		colorMode = (String) component.getAttributes().get("colorMode");




More information about the richfaces-svn-commits mailing list