2016-03-04 Simple File Load using VanillaJS

Gridmapper allows users to save and load maps. As Gridmapper is a Javascript app, it runs in a sandbox and has no access to your filesystem. The maps are therefore saved in a dedicated Gridmapper Wiki. When loading a map, I need a user interface allowing people to click a link (a modal “open file” dialog would be the traditional way to solve this). Since I wanted a solution using VanillaJS, I simply show a div full of links. There’s no close button (it just fades after a while if you don’t click anything), there’s no scroll bar. And as the list of maps grew, I realized that I was running out of space. So now it adds more columns if possible. But still, this won’t scale.

Then again, perhaps I’d better use the wiki to navigate: Clicking load opens the wiki, and on the wiki there’s a special kind of link that opens Gridmapper with a particular map?

Well, I still have a two or three columns to fill, so there’s no rush.

For the moment, I implemented an intermediary step: When the app loads, it looks at its own SVG code and initializes the data structures accordingly (in case the file was loaded from the file system), looks at the URL and loads a map if so instructed (this is the new part), or simply interprets the keys it sees (this is what “Prepare Link” would generate).

Let’s try the new thing: load The Sewer Prison.

Now that we have a way to load maps via the URL, Gridmapper will add that URL to maps it saves to the Gridmapper wiki (using Oddmuse URL abbreviations, so-called interlinks). You can see the new link being added here, at the Demo Dungeon.



Please make sure you contribute only your own work, or work licensed under the GNU Free Documentation License. Note: in order to facilitate peer review and fight vandalism, we will store your IP number for a number of days. See Privacy Policy for more information. See Info for text formatting rules. You can edit the comment page if you need to fix typos. You can subscribe to new comments by email without leaving a comment.

To save this page you must answer this question:

Please say HELLO.