I need a Chrome extension that will overlay a menu bar at the top of the browser [content] window. Items in the menu are associated with images. When clicked, the images are overlayed in the browser window. Those images need to be draggable and resizable (resizing will need to constrain proportions).
We can provide a live example after the NDA is completed.
The button for the extension will start and stop the overlay. When started, the overlay should not be tab-specific, and should overlay in all tabs or new windows (even full screen or presentation mode).
- I would like the menu to fade in or slide down when activated and the opposite when deactivated.
- I would like the menu to fade it's opacity after a certain amount of time.
- I would like the opacity & timer count to be able to be set in the options menu but have them default to 50% opacity & 10 seconds.
- Opacity should be 100% if the menu is being hovered over. On mouse out, the timer to fade should start again.
- When the buttons associated with the images are pressed, the images will be overlayed and the button should appear to stay depressed. If the image is overlayed, and the button is pressed; the image is removed, and the button should appear to be in the up position.
- When the image(s) is overlayed, hovering over the image should change the cursor to indicate movability and the border should appear with squares in the corners to indicate resizability.
- dragging from the 'corner squares' should resize the image, with constrained proportions.
- I would like the images to maintain their x/y coordinates when the extension is deactivated, so the next time the extension is used, the images show up in the last place they were put. (perhaps make this an check button option in the settings)
All code should be written to be easily maintainable by any other developer. Please look at this for reference:
This is a project that I know I will continue to add things to in the future. So keep in mind, If I am happy with the work and price, I will most likely come back to you for all future additions. Keeping your code clean and easily understandable will help you with any future updates.
I can provide you with the images needed. I need you to tell me what specifications you will require in order to maintain image quality when resized.