There's probably 1,000 different ways to do this, but this might be a decent start:
https://jimbarry.github.io/mapbook
If you'd rather build the mapbook and map numbers pulldowns on the fly (perhaps the content changes a lot?), I'd recommend converting to CSV or JSON first to make the data easier to use in a web app rather than trying to work with it in Excel format directly. If the content in the sheet doesn't change much, might be easier to hardcode it all in the web app as shown in the sample above.
Hello Jim,
So what you had showed me is very functional, and essentially all that is needed. It could look, a bit better, but nothing crazy. The only thing that would need to be a little different might be the option to type in the Book number and then a Page number, as there are 999 pages in each book.
So, I guess my question is what do you have there, how do I replicate what you made? Of course with my excel (which I will convert to a CSV)?
The content in the sheet will change from time to time, so it would be helpful to have a loading function so to speak. That can consume a new CSV.
Thank you,
Jason
Oh yeah, the sample page is raw, totally unstyled, as you saw. Wanted to keep it as simple as I could and leave the styling up to you. 🙂
As for the map number 001-999, sounds like you want a text box instead of a pull-down. I adjusted the code. Check the page source behind the app sample I linked above: https://jimbarry.github.io/mapbook
The changes are on Lines 32-42:
<div>
<label for="mapnumb">Enter a map number:</label>
<input type="text" id="mapnumb" value="001">(ie. 001-999)</input> <!-- new -->
<!--
<select id="mapnumb">
<option value="001">001</option>
<option value="002">002</option>
<option value="003">003</option>
</select>
-->
</div>
Ok so, how to deal with the contents of the Excel spreadsheet that may change from time to time, and which holds the full list of information about map book numbers, map page numbers, and PDF URLs. So, since this is a web page, that information is going to need to be http accessible, or readable by a web browser somehow.
If the number of map books is always going to be 1-N and the number of map pages is always going to be 1-999, and the URL paths to the PDFs are always going to follow some type of consistent naming pattern, like in my sample app above: "https://<domain>/<folder>/<map-book-number>/<map-number>.pdf", then you don't really need to load the xlsx/csv. If the mapbook and map number the user enters is valid, at that moment, then it'll return the PDF.
But... if the URL paths to the PDFs don't follow that kind of pattern, then I'm assuming in your xlsx, there's a mapbook column, a map number column, and a column that holds the URL where that map page is. In which case converting the xlsx into a csv could be a way to go. Here is a sample that shows one way to read the csv. Then, instead of drawing the csv to the page (like that sample does), you could read it all into a two-dimensional array, then when the user chooses a map book and map number, you do a lookup in that array, pull the correct URL out of the array, and open the PDF in the window.
Tons of different ways to do this. That's just one.