(First: I apologize if there is an obvious answer, I'm new to hacking Twine)
Hi. As background, I'm planning on using Twine for a two-week high-school class I'm helping teach and my kids school. I'm still a bit of a twine novice, so I'm attempting to learn twine, learn the style (I'm planning on SugarCube 2.6), collect resources for the kids to learn this, and create some samples. (I have lots of technical experience, just not with these tools)
What I want to do is do some outdoor, location-based stories by leveraging the location api's in mobile Safari on an iPad. My thought about the right way to do this is to create a new SugarCube macro (like some of the examples such as the Shake ones) that accesses the location, and create a few variants (e.g., tell me if the location is within X meters of this long, lat). These are things I know how to do (dealing with location in javascript, etc).
BUT, given this, I was wondering what the best way might be to deal with updating the page when the player moves around. I was thinking of polling the location in Javascript, using a timer or requestAnimationFrame, etc. If the result of a location macro changes, it would seem the best thing to do would be to "re-evaluate" the whole page so that if an author creates a passage with a lot of dependencies on the location, things will work as expected. If I was just changing CSS or the DOM, I realize I can just make the change. I don't understand enough of the internals of twinejs to know if I need to do something else to cause twine to re-evaluate everything or if there's an obvious macro or function to call.
Thanks!
Comments
I believe the best person to talk to would be @TheMadExile, the developer of the SugarCube story format.
You are not the first person to ask about using the Loaction API, the two related threads are geolocation as trigger and relative geotriggers.
Thanks @greyelf. I'll look at those posts, and see if @TheMadExile replies.
As an alternative. You could have a macro which would wrap your bits of location markup and update them when an event was triggered. As to the event, you'd trigger it each time new location data becomes available. That would allow you to only update the parts of the page which required it.
For example. The following code sets the $location story variable and comes with three macros:
<<glstop>> - Stops the geolocation watch.
<<glupdate>>…<</glupdate>> - Renders its contents within a wrapper element. Whenever a geolocation update occurs, it rerenders its contents and updates the wrapper.
Usage (simple example)
Put the following in your StoryInit special passage: Then any code which depends on the geolocation data would be wrapped in the <<glupdate>> macro. For example: (just to show all of the $location properties)
I'm attaching the current draft of the code I'm using. I started with yours but added a few things:
- reporting in meters as well as LLA. I've used different geospatial conversation in the past, but since these stories are local, I think UTM (https://en.wikipedia.org/wiki/Universal_Transverse_Mercator_coordinate_system) is a reasonable one since it's easy to convert to/from. I based the conversion on https://github.com/urbanetic/utm-converter
- added a function to let you define some points by name so we don't need to keep redoing the computations
- added a function to compute the distance to a point from wherever you are (since this is a common case)
It's a start. I have some other things I want to add, but I thought I'd share back where your help led me.