[richfaces-svn-commits] JBoss Rich Faces SVN: r16646 - in branches/community/3.3.X/ui/fileUpload/src/main: java/org/richfaces/renderkit and 3 other directories.

Author: amarkhel Date: 2010-03-22 07:47:46 -0400 (Mon, 22 Mar 2010) New Revision: 16646 Modified: branches/community/3.3.X/ui/fileUpload/src/main/config/component/fileUpload.xml branches/community/3.3.X/ui/fileUpload/src/main/java/org/richfaces/renderkit/FileUploadRendererBase.java branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/css/fileUpload.xcss branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js branches/community/3.3.X/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx Log: RF-8440 Part1. Add new classes for fileUpload component Modified: branches/community/3.3.X/ui/fileUpload/src/main/config/component/fileUpload.xml =================================================================== --- branches/community/3.3.X/ui/fileUpload/src/main/config/component/fileUpload.xml 2010-03-22 11:44:47 UTC (rev 16645) +++ branches/community/3.3.X/ui/fileUpload/src/main/config/component/fileUpload.xml 2010-03-22 11:47:46 UTC (rev 16646) @@ -116,21 +116,25 @@ <name>uploadButtonClass</name> <classname>java.lang.String</classname> <description>Assigns one or more space-separated CSS class names to the component &apos;Upload&apos; button</description> + <defaultvalue>"rich-fileupload-bold-label"</defaultvalue> </property> <property> <name>uploadButtonClassDisabled</name> <classname>java.lang.String</classname> <description>Assigns one or more space-separated CSS class names to the component &apos;Upload&apos; button disabled</description> + <defaultvalue>"rich-fileupload-bold-label"</defaultvalue> </property> <property> <name>stopButtonClass</name> <classname>java.lang.String</classname> <description>Assigns one or more space-separated CSS class names to the component &apos;Cancel&apos; button</description> + <defaultvalue>"rich-fileupload-bold-label"</defaultvalue> </property> <property> <name>stopButtonClassDisabled</name> <classname>java.lang.String</classname> <description>Assigns one or more space-separated CSS class names to the component &apos;Cancel&apos; button disabled</description> + <defaultvalue>"rich-fileupload-bold-label"</defaultvalue> </property> <property> <name>cleanButtonClass</name> @@ -173,6 +177,41 @@ <description>Assigns one or more space-separated CSS class names to the disabled controls of the file entries</description> </property> <property> + <name>doneLabelClass</name> + <classname>java.lang.String</classname> + <description>Assigns one or more space-separated CSS class names to the component &apos;Done&apos; label</description> + </property> + <property> + <name>sizeErrorLabelClass</name> + <classname>java.lang.String</classname> + <description>Assigns one or more space-separated CSS class names to the component &apos;Size error&apos; label</description> + </property> + <property> + <name>transferErrorLabelClass</name> + <classname>java.lang.String</classname> + <description>Assigns one or more space-separated CSS class names to the component &apos;Transfer error&apos; label</description> + </property> + <property> + <name>progressLabelClass</name> + <classname>java.lang.String</classname> + <description>Assigns one or more space-separated CSS class names to the component &apos;Progress&apos; label</description> + </property> + <property> + <name>entryCancelLabelClass</name> + <classname>java.lang.String</classname> + <description>Assigns one or more space-separated CSS class names to the component &apos;Cancel entry&apos; label in fileUpload list</description> + </property> + <property> + <name>entryStopLabelClass</name> + <classname>java.lang.String</classname> + <description>Assigns one or more space-separated CSS class names to the component &apos;Stop entry&apos; label in fileUpload list</description> + </property> + <property> + <name>entryClearLabelClass</name> + <classname>java.lang.String</classname> + <description>Assigns one or more space-separated CSS class names to the component &apos;Clear entry&apos; label in fileUpload list</description> + </property> + <property> <name>fileUploadListener</name> <classname>javax.faces.el.MethodBinding</classname> <description> Modified: branches/community/3.3.X/ui/fileUpload/src/main/java/org/richfaces/renderkit/FileUploadRendererBase.java =================================================================== --- branches/community/3.3.X/ui/fileUpload/src/main/java/org/richfaces/renderkit/FileUploadRendererBase.java 2010-03-22 11:44:47 UTC (rev 16645) +++ branches/community/3.3.X/ui/fileUpload/src/main/java/org/richfaces/renderkit/FileUploadRendererBase.java 2010-03-22 11:47:46 UTC (rev 16646) @@ -92,9 +92,9 @@ "size_error", "transfer_error","progress" }; /** Default labels values */ - private static final String[] defaultLables = { "Add...", "<b>Upload</b>", - "<b>Stop</b>", "Clear All", "Cancel", "Clear", "Stop", - "<b>Done</b>", "File size restricted", "Transfer error occurred","uploading"}; + private static final String[] defaultLables = { "Add...", "Upload", + "Stop", "Clear All", "Cancel", "Clear", "Stop", + "Done", "File size restricted", "Transfer error occurred","uploading"}; /** Set of attributes that can define label's value */ private static final String[] labelAttribues = { "addControlLabel", Modified: branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/css/fileUpload.xcss =================================================================== --- branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/css/fileUpload.xcss 2010-03-22 11:44:47 UTC (rev 16645) +++ branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/css/fileUpload.xcss 2010-03-22 11:47:46 UTC (rev 16646) @@ -11,6 +11,7 @@ .rich-fileupload-name{ width : 100%; height : 58px; padding : 2px 10px 2px 10px;} .rich-fileupload-del{ width : 90px; text-align : center; padding-top : 3px; padding-bottom : 3px;} .rich-fileupload-scroll{ width : 10px; text-align : center;} +.rich-fileupload-bold-label{font-weight: bold;} input[type="file"][class~="rich-fileupload-hidden"]::-webkit-rich-fileupload-button { font-size: 10em; Modified: branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js =================================================================== --- branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js 2010-03-22 11:44:47 UTC (rev 16645) +++ branches/community/3.3.X/ui/fileUpload/src/main/resources/org/richfaces/renderkit/html/js/FileUpload.js 2010-03-22 11:47:46 UTC (rev 16646) @@ -13,6 +13,14 @@ FileUploadEntry.UPLOAD_SIZE_ERROR = "size_error"; FileUploadEntry.UPLOAD_FORBIDDEN = "forbidden"; +FileUploadEntry.UPLOAD_IN_PROGRESS_CLASS = ""; +FileUploadEntry.UPLOAD_SUCCESS_CLASS = "rich-fileupload-bold-label"; +FileUploadEntry.UPLOAD_TRANSFER_ERROR_CLASS = ""; +FileUploadEntry.UPLOAD_SIZE_ERROR_CLASS = ""; +FileUploadEntry.ENTRY_CANCEL_LABEL_CLASS=""; +FileUploadEntry.ENTRY_CLEAR_LABEL_CLASS=""; +FileUploadEntry.ENTRY_STOP_LABEL_CLASS=""; + FileUploadEntry.LABELS = {}; FileUploadEntry.LABELS[FileUploadEntry.INITIALIZED] = ''; FileUploadEntry.LABELS[FileUploadEntry.READY] = ''; @@ -26,7 +34,7 @@ { 'style':'', 'onclick': function (context) { return 'var entry = FileUploadEntry.getComponent(this); entry.uploadObject.clear(entry); return false;';}, - 'className':function (context) { return 'rich-fileupload-anc ' + Richfaces.evalMacro("className", context); }, + 'className':function (context) { return 'rich-fileupload-anc ' + Richfaces.evalMacro("labelClassName", context) + Richfaces.evalMacro("className", context); }, 'href':'#' }, [ @@ -40,7 +48,7 @@ { 'style':'', 'onclick': function (context) { return 'FileUploadEntry.getComponent(this).uploadObject.stop(); return false;';}, - 'className':function (context) { return 'rich-fileupload-anc ' + Richfaces.evalMacro("className", context); }, + 'className':function (context) { return 'rich-fileupload-anc ' + Richfaces.evalMacro("labelClassName", context) + Richfaces.evalMacro("className", context); }, 'href':'#' }, [ @@ -54,7 +62,7 @@ { 'style':'', 'onclick': function (context) { return 'var entry = FileUploadEntry.getComponent(this); entry.uploadObject.clear(entry, true); return false;';}, - 'className':function (context) { return 'rich-fileupload-anc ' + Richfaces.evalMacro("className", context); }, + 'className':function (context) { return 'rich-fileupload-anc ' + Richfaces.evalMacro("labelClassName", context) + Richfaces.evalMacro("className", context); }, 'href':'#' }, [ @@ -173,6 +181,8 @@ var p = this.uploadObject.progressBar.getValue(); if (p) { var content = this.uploadObject.labelMarkup.invoke('getContent', this.uploadObject.progressData.getContext(p)).join(''); + var className = this.getClassByState(FileUploadEntry.UPLOAD_IN_PROGRESS); + Element.addClassName(this.statusLabel, className); this.statusLabel.innerHTML = content; } @@ -208,15 +218,17 @@ Element.clearChildren(this.statusLabel); Element.clearChildren(this.controlArea); - + + var className = this.getClassByState(newState); + Element.addClassName(this.statusLabel, className); Element.insert(this.statusLabel, FileUploadEntry.LABELS[newState]); if (newState == FileUploadEntry.UPLOAD_IN_PROGRESS) { - Element.update(this.controlArea, FileUploadEntry.stopControlTemplate.invoke('getContent',{'controlLink': FileUploadEntry.LABELS['entry_stop'],'className': this.uploadObject.classes.FILE_ENTRY_CONTROL.ENABLED}).join('')); + Element.update(this.controlArea, FileUploadEntry.stopControlTemplate.invoke('getContent',{'controlLink': FileUploadEntry.LABELS['entry_stop'],'labelClassName' : FileUploadEntry.ENTRY_STOP_LABEL_CLASS, 'className': this.uploadObject.classes.FILE_ENTRY_CONTROL.ENABLED}).join('')); } else if (newState == FileUploadEntry.UPLOAD_SUCCESS) { - Element.update(this.controlArea, FileUploadEntry.clearControlTemplate.invoke('getContent',{'controlLink': FileUploadEntry.LABELS['entry_clear'],'className': this.uploadObject.classes.FILE_ENTRY_CONTROL.ENABLED}).join('')); + Element.update(this.controlArea, FileUploadEntry.clearControlTemplate.invoke('getContent',{'controlLink': FileUploadEntry.LABELS['entry_clear'],'labelClassName' : FileUploadEntry.ENTRY_CLEAR_LABEL_CLASS,'className': this.uploadObject.classes.FILE_ENTRY_CONTROL.ENABLED}).join('')); } else { - Element.update(this.controlArea, FileUploadEntry.cancelControlTemplate.invoke('getContent',{'controlLink': FileUploadEntry.LABELS['entry_cancel'],'className': this.uploadObject.classes.FILE_ENTRY_CONTROL.ENABLED}).join('')); + Element.update(this.controlArea, FileUploadEntry.cancelControlTemplate.invoke('getContent',{'controlLink': FileUploadEntry.LABELS['entry_cancel'],'labelClassName' : FileUploadEntry.ENTRY_CANCEL_LABEL_CLASS,'className': this.uploadObject.classes.FILE_ENTRY_CONTROL.ENABLED}).join('')); } if (newState == FileUploadEntry.UPLOAD_SUCCESS) { @@ -224,6 +236,18 @@ } this.uploadObject.notifyStateChange(this, oldState); + }, + + getClassByState: function(state){ + if (state == FileUploadEntry.UPLOAD_SUCCESS) { + return FileUploadEntry.UPLOAD_SUCCESS_CLASS; + }else if(state == FileUploadEntry.UPLOAD_IN_PROGRESS){ + return FileUploadEntry.UPLOAD_IN_PROGRESS_CLASS; + }else if(state == FileUploadEntry.UPLOAD_TRANSFER_ERROR){ + return FileUploadEntry.UPLOAD_TRANSFER_ERROR_CLASS; + }else if(state == FileUploadEntry.UPLOAD_SIZE_ERROR){ + return FileUploadEntry.UPLOAD_SIZE_ERROR_CLASS; + }else return ''; } }); @@ -460,8 +484,8 @@ DISABLED : 'rich-fileupload-button-content rich-fileupload-font rich-fileupload-ico rich-fileupload-ico-start-dis ' }, STOP : { - ENABLED : 'rich-fileupload-button rich-fileupload-font ', - DISABLED : 'rich-fileupload-button-dis rich-fileupload-font ' + ENABLED : 'rich-fileupload-button rich-fileupload-font', + DISABLED : 'rich-fileupload-button-dis rich-fileupload-font' }, STOP_CONTENT : { ENABLED : 'rich-fileupload-button-content rich-file-upload-font rich-fileupload-ico rich-fileupload-ico-stop ', @@ -486,6 +510,27 @@ UPLOAD_LIST : { ENABLED : '', DISABLED : '' + }, + SIZE_ERROR_LABEL : { + ENABLED : '' + }, + TRANSFER_ERROR_LABEL : { + ENABLED : '' + }, + DONE_LABEL : { + ENABLED : 'rich-fileupload-bold-label' + }, + PROGRESS_LABEL : { + ENABLED : '' + }, + ENTRY_CANCEL_LABEL : { + ENABLED : '' + }, + ENTRY_STOP_LABEL : { + ENABLED : '' + }, + ENTRY_CLEAR_LABEL : { + ENABLED : '' } }; this.events = {}; @@ -493,7 +538,23 @@ var classes = options.classes; for (var obj in classes) { - var value = classes[obj]; + var value = obj; + if (value == "DONE_LABEL"){ + FileUploadEntry.UPLOAD_SUCCESS_CLASS = classes.DONE_LABEL.ENABLED; + }else if(value == "SIZE_ERROR_LABEL"){ + FileUploadEntry.UPLOAD_SIZE_ERROR_CLASS = classes.SIZE_ERROR_LABEL.ENABLED; + }else if(value == "TRANSFER_ERROR_LABEL"){ + FileUploadEntry.UPLOAD_TRANSFER_ERROR_CLASS = classes.TRANSFER_ERROR_LABEL.ENABLED; + }else if(value == "PROGRESS_LABEL"){ + FileUploadEntry.UPLOAD_IN_PROGRESS_CLASS = classes.PROGRESS_LABEL.ENABLED; + }else if(value == "ENTRY_CANCEL_LABEL"){ + FileUploadEntry.ENTRY_CANCEL_LABEL_CLASS = classes.ENTRY_CANCEL_LABEL.ENABLED; + }else if(value == "ENTRY_STOP_LABEL"){ + FileUploadEntry.ENTRY_STOP_LABEL_CLASS = classes.ENTRY_STOP_LABEL.ENABLED; + }else if(value == "ENTRY_CLEAR_LABEL"){ + FileUploadEntry.ENTRY_CLEAR_LABEL_CLASS = classes.ENTRY_CLEAR_LABEL.ENABLED; + } + value = classes[obj]; for (var property in value) { this.classes[obj][property] += value[property]; if (this.classes[obj + "_CONTENT"]) { Modified: branches/community/3.3.X/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx =================================================================== --- branches/community/3.3.X/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx 2010-03-22 11:44:47 UTC (rev 16645) +++ branches/community/3.3.X/ui/fileUpload/src/main/templates/org/richfaces/fileUpload.jspx 2010-03-22 11:47:46 UTC (rev 16646) @@ -159,8 +159,29 @@ <c:scriptOption name="ENABLED" value="#{component.attributes['uploadListClass']}" /> <c:scriptOption name="DISABLED" value="#{component.attributes['uploadListClassDisabled']}" /> </c:scriptObject> + <c:scriptObject var="DONE_LABEL"> + <c:scriptOption name="ENABLED" value="#{component.attributes['doneLabelClass']}" /> + </c:scriptObject> + <c:scriptObject var="SIZE_ERROR_LABEL"> + <c:scriptOption name="ENABLED" value="#{component.attributes['sizeErrorLabelClass']}" /> + </c:scriptObject> + <c:scriptObject var="TRANSFER_ERROR_LABEL"> + <c:scriptOption name="ENABLED" value="#{component.attributes['transferErrorLabelClass']}" /> + </c:scriptObject> + <c:scriptObject var="PROGRESS_LABEL"> + <c:scriptOption name="ENABLED" value="#{component.attributes['progressLabelClass']}" /> + </c:scriptObject> + <c:scriptObject var="ENTRY_CANCEL_LABEL"> + <c:scriptOption name="ENABLED" value="#{component.attributes['entryCancelLabelClass']}" /> + </c:scriptObject> + <c:scriptObject var="ENTRY_STOP_LABEL"> + <c:scriptOption name="ENABLED" value="#{component.attributes['entryStopLabelClass']}" /> + </c:scriptObject> + <c:scriptObject var="ENTRY_CLEAR_LABEL"> + <c:scriptOption name="ENABLED" value="#{component.attributes['entryClearLabelClass']}" /> + </c:scriptObject> <c:scriptObject var="classes"> - <c:scriptOption variables="ADD, UPDATE, STOP, CLEAN, FILE_ENTRY, FILE_ENTRY_CONTROL, UPLOAD_LIST" /> + <c:scriptOption variables="ADD, UPDATE, STOP, CLEAN, FILE_ENTRY, FILE_ENTRY_CONTROL, UPLOAD_LIST, DONE_LABEL, SIZE_ERROR_LABEL, TRANSFER_ERROR_LABEL, PROGRESS_LABEL, ENTRY_CANCEL_LABEL, ENTRY_STOP_LABEL, ENTRY_CLEAR_LABEL" /> </c:scriptObject> <c:scriptObject var="events"> <c:scriptOption attributes="onupload, onuploadcomplete, onuploadcanceled, onerror, ontyperejected, onsizerejected, onclear, onadd, onfileuploadcomplete" wrapper="eventHandler"/>