I'd like to have a website tool to build Flow charts like Microsoft Visio. The attached image is what I was thinking of how the user would connect the objects. The filled in gray circle is where the user would click and drag which will be a dashed line while they are holding the mouse down. This line will follow the mouse cursor and when they let go of the mouse button on one of the non filled circle, a lined arrow will then connect the 2 objects. The user should be able to select a lined arrow and delete it. All text on the workflow will be editable and the user should be able to add text to the page.
The attached PDF is additional items I'd like the user to be able to add to the flow chart like people icons, server icons, etc.
I don't want Flash or Silverlight. My preferred tools are HTML5 and jQuery. If you have a recommendation for something else, let me know
User will need to be able to edit the document at anytime and render the document to a PDF document.