Is there a way for a button in flash to trigger an action in Storyline. Specifically, I'd like a button in a Flash file to go to a specific slide within Storyline. Thanks in advance
You can use ExternalInterface within Flash to change the value of a variable within Storyline. You can then create a trigger that will look for the change in value, then have that change go to the slide you want.
I create a Flash file with a button, and add an Event Listener to capture the button's CLICK events. The function tied to the button click event increments a "count" variable by 1 every time it gets clicked. I then use the ExternalInterface class to send this value out to a Javascript function. I export this file as a SWF.
Here is the button CLICK event code:
function doMouseClick(e:MouseEvent):void { count++; ExternalInterface.call("changeSLVar", String(count)); }
I then creat a Storyline file, and import the SWF file into it. Within the Storyline file, I creat a "count" variable that will eventually get the value sent by the SWF button. I save this file and publish it.
In the published folder I open up the story_content/user.js file and put in this SWF-receiving Javascript function:
function changeSLVar(aValue) { var player = GetPlayer(); player.SetVar("count",aValue); }
This function gets the "count" value (by way of the "aValue" parameter), accesses the Player, and sets the Storyline variable to the new value.
One thing to keep in mind if you are planning to use something like this to facilitate Flash-To-Storyline communication: every time the Storyline file gets published, the story_content/user.js file gets overwritten, because it is derived file. So you will have to replace the Javascript edit to the story_content/user.js file every time you publish.
Also, I used a String to send this parameter value over to Storyline from Flash. I think you could probably send over an integer or a Boolean for that matter. I kind of depends how Javascript treats the paramter. Since Javascript is loosely typed, I just stuck with Strings for this demostration.
Thanks Mark for sharing this here - I know folks are always looking for examples and ideas in dealing with Javascript code as it's not something we can provide support for.
This is exactly what I needed, thanks so much! I need certain text to appear as you step through the animation using the Flash button (an image actually) at each click. I can't put text in the Flash animation as we have to translate the course to 12 languages!
Mark, I really appreciate your post. To make this loop as intended I had to add a reset to the counter for the last frame of the swf. Beyond that each frame also had a unique image I used as a button rather than just one button.
function toRestart(e:MouseEvent):void { count++; ExternalInterface.call("changeSLVar", String(count)); this.gotoAndStop(2); if (count > 7) { ExternalInterface.call("refresh");//to refresh the counter count = 0;//to set the counter value trace("Now the count is " + count); } else { trace("The Count is " + count) return; } }
I left the counter visible in the published file here as a demo in case it is of interest to others.
8 Replies
You can use ExternalInterface within Flash to change the value of a variable within Storyline. You can then create a trigger that will look for the change in value, then have that change go to the slide you want.
I just did a proof of concept for this idea.
I create a Flash file with a button, and add an Event Listener to capture the button's CLICK events. The function tied to the button click event increments a "count" variable by 1 every time it gets clicked. I then use the ExternalInterface class to send this value out to a Javascript function. I export this file as a SWF.
Here is the button CLICK event code:
function doMouseClick(e:MouseEvent):void {
count++;
ExternalInterface.call("changeSLVar", String(count));
}
I then creat a Storyline file, and import the SWF file into it. Within the Storyline file, I creat a "count" variable that will eventually get the value sent by the SWF button. I save this file and publish it.
In the published folder I open up the story_content/user.js file and put in this SWF-receiving Javascript function:
function changeSLVar(aValue) {
var player = GetPlayer();
player.SetVar("count",aValue);
}
This function gets the "count" value (by way of the "aValue" parameter), accesses the Player, and sets the Storyline variable to the new value.
One thing to keep in mind if you are planning to use something like this to facilitate Flash-To-Storyline communication: every time the Storyline file gets published, the story_content/user.js file gets overwritten, because it is derived file. So you will have to replace the Javascript edit to the story_content/user.js file every time you publish.
Also, I used a String to send this parameter value over to Storyline from Flash. I think you could probably send over an integer or a Boolean for that matter. I kind of depends how Javascript treats the paramter. Since Javascript is loosely typed, I just stuck with Strings for this demostration.
Thanks Mark for sharing this here - I know folks are always looking for examples and ideas in dealing with Javascript code as it's not something we can provide support for.
Ashley, thanks. I neglected to send the Flash.fla file for this demo - here it is.
That's how out of touch I am with Javascript coding and programming specifics in Flash, I didn't even notice it was missing. :-)
Thanks for popping back in to share!
This is exactly what I needed, thanks so much! I need certain text to appear as you step through the animation using the Flash button (an image actually) at each click. I can't put text in the Flash animation as we have to translate the course to 12 languages!
Glad this thread helped you out Rick!
Mark, I really appreciate your post. To make this loop as intended I had to add a reset to the counter for the last frame of the swf. Beyond that each frame also had a unique image I used as a button rather than just one button.
function toRestart(e:MouseEvent):void {
count++;
ExternalInterface.call("changeSLVar", String(count));
this.gotoAndStop(2);
if (count > 7) {
ExternalInterface.call("refresh");//to refresh the counter
count = 0;//to set the counter value
trace("Now the count is " + count);
} else {
trace("The Count is " + count)
return;
}
}
I left the counter visible in the published file here as a demo in case it is of interest to others.