HTML/JavaScript Angle Measurement Tool / Protractor

I'm operating a HTML/JavaScript software that is used to run exams. The users (candidates) will use the software to answer exam questions on-screen. Now we need these candidates to be able measure angles interactively. For example a exam could show a image of a triangle and ask the user to measure the angle between two of its lines. The solution I'm looking for needs to work in this way: * When activated, it will display a "handle" (for example a small circle) with two lines connected to it in a 90° angle. The handle can be dragged around to move the tool around, so the lines will move with it and stay connected in the selected angle * The end of each of the two lines will also have a handle which can be used to adjust the angle or scale the lines. * The selected angle needs to be displayed (in degrees) whenever changed Technical Requirements: * Needs to work with HTML/Javascript * It must be possible to add this as a transparent overlay over a webpage (regardless of the content of that page) * Can be implemented in SVG or HTML Canvas * Allowed libraries are JQuery 1.10.2 or KineticJS, if you require any other libraries, PLEASE ASK ME FIRST. We require full sourcecode of the solution. Also, the sourcecode needs to be nicely formatted and well commented.