0 votes
by (160 points)
edited by

Currently, I am using the following code that allows me to export a save game to disk with a string of text that looks like an ordinary link.

<<link "Save Game">>
    <<script>>
    	Save.export()
    <</script>>
<</link>>

However, I can't seem to find a way to achieve the same thing for loading a game from disk; the closest I seem to be able to accomplish makes a rather large and garish button appear. Is there any way to make a 'load from disk' thing that... well, looks like a link (so it could blend in seemlessly with other text choices/links and look far less jarring when reading)?

I'm using Twine 2 and Sugarcube 2.21. Many thanks in advance!

2 Answers

+2 votes
by (64.2k points)
selected by
 
Best answer

Is there a reason you're avoiding simply opening the Saves dialog?

Regardless.  If you want an anchor to open the file dialog, then you'll have to create a hidden <input type="file"> element which is triggered by the anchor, because you must use that element and it's what creates the "garish button".

I'd probably suggest something like the following: (only tested in Twine 2)

<<if Has.fileAPI>>
	<<link "Save To Disk">>
		<<script>>Save.export();<</script>>
	<</link>>
	<<link "Load From Disk">>
		<<script>>
		$(document.createElement('input'))
			.css({
				display    : 'block',
				visibility : 'hidden',
				position   : 'fixed',
				left       : '-9999px',
				top        : '-9999px',
				width      : '1px',
				height     : '1px'
			})
			.attr({
				type          : 'file',
				id            : 'saves-import-file',
				tabindex      : -1,
				'aria-hidden' : true
			})
			.on('change', Save.import)
			.trigger('click');
		<</script>>
	<</link>>
<<else>>
	No disk saves.  :(
<</if>>

NOTE: You really should be checking the value of Has.fileAPI as shown above, because if that's false, then the APIs to support disk saves are unavailable.

by (160 points)
I was avoiding the saves dialog as I was trying to keep a very 'classic text-game' feel and the Saves dialog/interface seemed a bit more visual novel to me.

Thank you for the code! It works an absolute dream! Many kudos! <3
0 votes
by (153k points)

The Disk section of the Save API where you found the Save.export() function includes a related Save.import() function which you can use to import your exported file, the related documentation explains the functions's requirements and demostrates how to use it.

by (160 points)

I have read through the Save.import() function several times and experimented with it, but I have no idea of how to actually implement it in the way you suggest; the closest I can manage is using a variation of

<input type="file">

but all I seem to be able to achieve with that is creating the garish button described in my original post.

Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.
...