Hi, I am building an app for personal use. Its main factionality is:
1) Get data from a spreadsheet with movies and store them in an array.
2) Loop through the array and create html elements.
3) User can select with mouse or keyboard arrows any movies by its cover and get its info/metadata.
extra 2.5) Load only the first 15 elements and go to step 3. If the user scroll to the end of the page, load 15 more elements and go to step 3 again.
Well I have 1 ,2,3 [(jsFiddle)](http://jsfiddle.net/cparliaros/cZV9Q/1/ “”) working together just fine. Also I have 1,2,2.5 [(jsFiddle)](http://jsfiddle.net/cparliaros/8V4ux/ “”) working together just fine. The problem is to make them work together, always something will break.
Please help as it drives me crazy. Also
I am trying to make the code as efficient as possible, so if you find anything that can be done in a simpler way, please let me know.
You can use any part of my code you may find useful.
Now I have to put the last pieces in the puzzle. Get the info from the selected movie from tmdb API, which I have that already. I want also to create some options, filtering (year range slider, initial letter, quality, format) and for first time I want to create a live search. I have not idea how to do the last part, if you have any links from similar jobs….
actually the new was the fix to my problem but I learn a lot more from your code. Also you did what I had in my plans to do later, but eralier is always better :), to put in functions things like select(), unselect(), hideInfo() etc.
I added back already the document click listener, I had to fix first something on the css, where the #main-container and #movies-container, were not updating their height as you scroll down. Now they do and when you click in any of these two elements it uses the unselect() function. Also I added back the fade-in using css when you scroll down and new covers are loading which I found it on Apple’s Trailers app and I like it. Thanks for the esc, I am thing to add more keyboard fuctionalities like pressing any key from alphabet and select the first movies starting from this letter. So far everything works without any problem and the overall loading time have been decreased below 4 seconds – when it was loading all the movies the loading time was 7+ seconds.