The prototypes here were used in getting the feedback during the first part of GSOC project. They are all obsolete now, and only kept for as a reference for future students .
<hx:inputFileUpload>
Extends: t:inputFileUpload (I don't think a dependency to Tomahawk is good. So, need to rewrite that stuff or copy them, preferably with maven-dependency-plugin)
Attributes:
Name |
Required? |
Values |
Description |
|---|---|---|---|
multiple |
optional |
true or false(default). |
File upload input type supports 'multiple' attribute. With HTML5, browsers can upload multiple files at once. Default to false. |
required |
optional |
true or false(default). |
Same with <t:inputFileUpload> 'required' except, 'required' attribute of HTML 'input' element is also used this time. |
styleClassOnDrag |
optional |
EL and literal |
This attribute will allow us to change the style of the component on a drag into the component. With no automatic mechanism, one can do this by listening dragenter events, and changing the style; and removing that style on dragleave respectively. Instead, we will this attribute, so the renderer can render Javascript and other stuff automatically for changing the style on drag. |
Notes:
- I wanted to use HTML5 Drag and Drop here, but not sure what else to include in the component. Selection of the files on DnD to input is done by browser. Nothing to do at the component.
- Async file upload: Not sure about this feature is possible with HTML5 standards. So, better implementing this later.
References:
- http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#the-input-element
- http://www.whatwg.org/specs/web-apps/current-work/multipage/number-state.html#file-upload-state
- http://myfaces.apache.org/tomahawk-project/tomahawk12/tagdoc/t_inputFileUpload.html
- http://www.whatwg.org/specs/web-apps/current-work/multipage/dnd.html#dnd
- http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#input-type-attr-summary
- https://developer.mozilla.org/En/DragDrop/DataTransfer
- https://developer.mozilla.org/En/DragDrop/Recommended_Drag_Types
- https://developer.mozilla.org/En/DragDrop/Drag_Operations
- https://developer.mozilla.org/En/DragDrop/Drag_and_Drop
Usage of prototypes:
usage with multiple and styleClassOnDrag
<hx:inputFileUpload value="#{someBean.uploadedFiles}" multiple="true" styleClassOnDrag="someClass" />
expected HTML5 code
<input type="file" multiple="true" ondragenter="addClass(this,'someClass');" ondragleave="removeClass(this,'someClass')" />
usage multiple=false
<hx:inputFileUpload value="#{someBean.uploadedFile}" multiple="false"/>
expected HTML5 code
<input type="file" multiple="false"/>
Overview
Content Tools
Apps