I have seen older posts on this, but I was hoping for an update on the possibility to reset the application to the initial layout when the attract screen loads.

My application is using photoAlbumViewers, Video, SlideshowsViewers, Background, & Attract CMLs. I'd like to be able to reset all of these after ____ minutes of inactivity.

If the initial states you wish to restore are all defined through CML, then they are stored internally on the state dictionary and can be set by calling loadState(0) on the element. If you are using an attract screen and want to leverage the timing of the Attract element, you can add a state listener that listens for the attract state.

 var attract:Attract = document.getElementById("attract");
 attract.addEventListener(StateEvent.CHANGE, function(event:State):void{
      if(event.property == "attractState" && event.value == true){
           object.loadState(0);
       }
 });

If you are not using an attract element. Then you will need to create your own event tracking through touch and timer events.

Thanks! I will check into that. Seems like a perfect solution for me.

Sorry, I know this is a dumb question. In the line object.loadstate(0);... does object need to be the ID of one of my elements? Or does it need to be the element type name (ie AlbumViewer).

I originally tried just using the object.loadstate(0) code, but get the error message "access of undefined property". I then thought that this probably needed to be an element name in my code. So I did the following:

//code is placed within function cmlInit(event:Event):void
var attract:Attract = document.getElementById("attract");

var slideshowviewer:SlideshowViewer = document.getElementById("quizApplication");

attract.addEventListener(StateEvent.CHANGE, function(event:State):void{
	if(event.property == "attractState" && event.value == true){
		slideshowviewer.loadState(0);
	}
});

However, this never loads and causes the application to become unresponsive.

The object needs to be a reference to the touch object you are trying to restore the initial state on. I would verify slideshowviewer is not null and more importantly the state attributes you want to reset are exclusively defined in the CML declaration. If they are not defined in the CML declaration, they will not be tracked. If this is not possible through CML, you will need to track them on your own somehow. Such implementation is up to you but you will need to store attribute names with intended value. So if you want the object to restore it's y-coordinate to 0 on reset, you need to find a way to make this assignment on the attract state.

           object.y = 0;

You can either maintain a gobal Dictionary that stores all reset values of each object you wish to reset or you can create custom extensions for each of these objects and store those mappings locally. The state dictionary does exactly this but, by default, will only register attribute defined in the CML. So I would either define the desired initial state in the CML or dynamically push desired values into the state dictionary.

I highly recommend evaluating the CML source code to get a better understanding of the composition of each of your elements and see what your options are. The Slideshow element has a snapTo function that allows you to specify a child index to show. So slideShow.snapTo(0) would reset to the first slide.

Hey Shaun,

All of my elements are loaded via the CML. I position the elements via X, Y, rotation, & scale elements within the parent touch container tag. I assume this is what you mean by initial states being defined via CML.

I took your advice and looked through the CML source code to better understand the elements and options. I also tried implementing the original code you provided on the CML attractkit under the CMLExamplesAir.

Implementing the loadstate code throws this error "TypeError: Error #1034: Type Coercion failed: cannot convert com.gestureworks.cml.events::StateEvent@3f54b69 to com.gestureworks.cml.elements.State."

Here is the Attract.cml code from the CMLExamplesAir.

<?xml version="1.0" encoding="UTF-8"?>
<cml rootDirectory="assets/" css="styles.css" tuio="false" simulator="false">

<!-- The Attract tag allows you to make a customizable attract screen. -->
<Attract timeout="15" tweenFades="true" tweenTime="0.5" id="attract">

    <Container width="700" height="520">
	<Graphic shape="rectangle" color="0x335588" fill="color" width="700" height="520"/>
	<Text x="150" y="110" width="400" height="100" fontSize="30" color="0xC4B453" font="OpenSansBold" text="SAMPLE ATTRACT SCREEN"/>
	<Text x="175" y="175" height="100" autoSize="left" fontSize="18" color="0xC4B453" font="OpenSansRegular" text="Touch to make this screen disappear."/>
   </Container>
</Attract>


<!-- Touch Containers are basic display containers. -->
<TouchContainer id="touch-image" x="600" y="200">
<Image id="img1" mouseChildren="false" src="images/foot.png" rotation="-20" width="400" height="348" visible="true"/>
<GestureList>
    <Gesture ref="n-drag" gestureOn="true"/>
    <Gesture ref="n-scale" gestureOn="true"/>
    <Gesture ref="n-rotate" gestureOn="true"/>
 </GestureList>
</TouchContainer>

</cml>

Here is the ActionScript file with your code to reset the loadstate.

package cml.elements
{
import com.gestureworks.cml.core.CMLParser;
import com.gestureworks.cml.elements.TouchContainer;
import com.gestureworks.core.GestureWorks;
import flash.events.Event;

import com.gestureworks.cml.events.StateEvent;
import com.gestureworks.cml.elements.State;
import com.gestureworks.cml.utils.document;
import com.gestureworks.cml.elements.Attract;

[SWF(width="1280",height="720",backgroundColor="0x000000",frameRate="30")]

/**
 * This example demonstrates the use of the CML AttractKit tag.
 */
public class AttractEx extends GestureWorks
{
	public function AttractEx():void
	{
		super();
		gml = "gml/gestures.gml"
		cml = "elements/Attract.cml";
		CMLParser.addEventListener(CMLParser.COMPLETE, cmlInit);
	}

	private function cmlInit(event:Event):void
	{
		trace("cmlInit()");
		CMLParser.removeEventListener(CMLParser.COMPLETE, cmlInit);



		var attract:Attract = document.getElementById("attract");
		 attract.addEventListener(StateEvent.CHANGE, function(event:State):void {

			 var touchImage:TouchContainer = document.getElementById("touch-image");

			  if(event.property == "attractState" && event.value == true){
				   touchImage.loadState(0);
				}
		});


	}
}
}

Thanks for your help. If I can get it working on this simple example, I think I can get it working on my application. I think I am just missing something or not understanding where I am going wrong.

Take a look at this example and corresponding CML.

Thanks for linking to this. I was able to figure out what I needed based off this example and the example code you posted.

This topic is now closed. New replies are no longer allowed.

This topic is now archived. It is frozen and cannot be changed in any way.