Javascript canvas image flood fill

Your task is simple: write javascript functions for the following task: - on a html webpage, load PNG image in html canvas. Every image will be a "form" (example input image is attached as [login to view URL]) - display the canvas to the user - detect mouse movements over the canvas - implement FILL function (as like fill in photoshop) and fill the region under mouse cursor, every time it moves (see attachment [login to view URL] to see the expected result). Once the mouse cursor leaves the area, revert back to original and fill new area where the mouse is. Note that white color may not be strictly #ffffff, so you need to implement a threshold (fuzz), and consider as white all pixels above, say #e6e6e6. - on complete (after the fill is done), call custom js function with arguments: top,left,width,height (those are the minimum top/left coordinages of the filled region bounding box, and width/height of the bounding box, all in pixels). This js function will just [login to view URL]() the arguments for now. This algorithm will help you filling the region: [login to view URL] use flood fill with 4 directions. If you complete this task properly and on time, there will be more work for more money waiting for you. Thank you