Custom image slide show with javascript

Its important to understand the needs of this project. I have tried to give a clear and easy understanding of the needed "product" inside this codepen demo: [login to view URL] Its a single image, that offers a guided tour. I need someone to create the javascript functions for a working navigation, which should include the following: // [ ] On click of one arrow the previous or next red icon the image position should scroll to the next icon, so that the icon is centered // [ ] Also the bottom bar #dots should indicate which icon is active. All previous icons should be set to .active, all others to .inactive // [ ] .on('click') of one of the .dots in the #dots bar the image should although change its position as described before // [  ] the current .icon should get the class .current You can use whatever language you do prefer, javascript or jQuery to achieve this. Although its possible to make small DOM adjustments if necessary. Feel free to ask any questions.