HTML5 Drag and Drop Interface Form Designer

We require an interface using HTML to allow users to build their own custom forms. SEE SCREENSHOT The screen will consist of a list down the left of available components (these are all inside DIV containers). A component consists of a label and one or more input controls. The user should be able to drag a component from the available items on the left to the preview area on the right. The preview area on the right has two columns to choose from. A component can be dragged more than once over to the right. When a component has been placed in the preview area, the user can double click on the component and choose to set the text for the label, add values etc.. There should be no limit to what type of blocks we put on the left that the user can use... they should just be treated as one item ie a div containing different elements. When the user has completed designing their form the submit button will transfer form variables containing the text,positions and values for the components. You do not need to do anything with these variables. The completed deliverable will therefore consist of one HTML5 page. No 3rd party addons are to be used.