Javascript Image Scroller - load optimisation and extend base functionality

Scope: (5 day turn around) We currently have created an example output of what we require ([login to view URL] ) using the tutorial link given below and adapting to suit. We have found that load times are excessive and as such would like to improve the current code and extend to include some new features. Note this will be utilised in mobile devices as well as PCs. Currently the code loads approx. 600x 1243 x 666 resolution jpegs sequentially and one at a time (no parallel loading) for the entire scene before anything appears on screen. Our thoughts are to load an initial lower resolution set that is scaled to 100% (1/2 or ¼ of the size, eg 360 x 189 px ) then depending on where the user is, load in the higher resolution jpegs displaying as soon as they're downloaded either side of the current viewing position, allowing the user to see high resolution and react to user input swiping quickly, but not having to download all the large resolution data at once. Some other ideas are to use image sprites to reduce the number of concurrent requests. Note there may be more efficient ways to do this we’d like to make the experience as seamless as possible. Utilising an efficient algorithm to load the images. We are happy to take advice on what would be the best approach. Additional Features to be added: - add option to remove looping of image sequence - fullscreen (hotkey or additional button) - optional overlays (logo(png) + Title(text)) Current example files: [login to view URL] Tutorial that code is based on: [login to view URL] The job will be awarded to applicants that describe their intended approach and confirm ability to commence immediately and work to the timeframe of delivery within 5 days.