Overview   Objects  Tree  Index  Help 
Klipfolio Dashboard 5 API
 PREV OBJECT  NEXT OBJECT FRAMES    NO FRAMES    
SUMMARY: PROPERTY | FUNCTION DETAIL: PROPERTY | FUNCTION

Object Actions.Window

Object
   |
   +--Klip
         |
         +--Actions.Window

The Actions.Window object provides an API to enable Klip authors to create a window display based on a user's interaction with the Klip.

The windows are organized into a collection of Stack objects, with each stack containing one or more Page objects.

Actions.Window can be accessed as an array of stacks, indexed either by integer (e.g. Actions.Window[0]) or by stack name (e.g. Actions.Window["Login"]).

Note that the actions windows are not modal, and therefore they do not block Klipfolio Dashboard.

For your convenience, Actions.Window provides you with 3 standard buttons:

Example:

When loading the following Klip, an Action Window will open, where the user can enter the server address. When the correct server address (in this case, 'klipfolio') is entered and the user clicks the Next button, the user will be prompted to enter a user name and password. 
<?xml version="1.0" encoding="UTF-8" ?>
<klip>
   <identity>
      <title>
         API - Actions.Window
      </title>
   </identity>

   <locations>
      <icon>
         http://www.klipfolio.com/static/klips/klipfolio/sample_icon.png
      </icon>
      <banner>
         http://www.klipfolio.com/static/klips/klipfolio/sample_banner.png   
      </banner>
   </locations>

   <klipscript>
      <![CDATA[

function onLoad()
 {
	// Add a Button
         Actions.Button.show("Log in");
         Actions.Button.onClick = showLogin;

 	// Add a Stack named "Login"
 	var stack = Actions.Window.addStack("Login");
 	// Set the title for the window's title bar
 	stack.title = "Log in to the server";
 	
 	// Add a Page named "Server" to "Login" Stack
 	var page = stack.addPage("Server");
 	// Add text to the Page
 	page.addText("Enter the server address (use 'klipfolio' for this example)");
 	// Add a textfield called 'gServerField'
 	gServerField = page.addTextField();
 	// No back button
 	page.back = ""; 
 	// Assign a handler function to Next button
 	page.onNext = checkServer;
 	
 	// Add another Page named "UserName" to "Login" Stack
 	page = stack.addPage("Username");
 	page.addText("Enter your user name and password");
 	gUserField = page.addTextField();
 	gPassField = page.addTextField();
 	// Display "Server" in Back button
 	page.back = "Server";
 	// Display "Log In" in Next button
 	page.next = "Log In";
 	page.onNext = verifyUser;
 	
 }

function showLogin() 
  {
	// Open window with 'Login' stack on Server page
	Actions.Window.show("Login", "Server");
  }
 function onRefresh()
 {
 	// ...
 	// Show the login stack on the server page
 	Actions.Window.show("Login", "Server"); 
 	// ...
 	return true;
 }
 
 function checkServer(page)
 {
 	var server = gServerField.value;
 	// Check to see if 'klipfolio' was entered as server name
 	if(server == "klipfolio")
 	{
 		return true; // Proceed to the login page
 	}
 	else
 	{
 		page.setError("Invalid server URL, please try again");
 		return false; // Don't proceed to the next page
 	}
 }
 
 function verifyUser(page)
 {
 	page.setError("Invalid user name or password, please try again");
 }
      ]]> 
   </klipscript>
</klip>
Note the use of Back, Next and Done buttons on each page.

Nested Object Summary
<static class> Actions.Window.Back
<static class> Actions.Window.Done
<static class> Actions.Window.Next
   
Function Summary
 function addStack( <String> stack_name )
           Creates a Stack named stack_name and adds it to the collection of stacks.
 function hide()
           Hides the currently displayed Stack.
 function onBack( <String> current_page)
           A Global Handler Function for the Back button.
 function onDone( <String> current_page)
           A Global Handler Function for the Done button.
 function onNext( <String> current_page)
           A Global Handler Function for the Next button in the actions window.
 function removeStack( <String> stack_name )
           Removes the specified Stack from the collection of stacks.
 function show( <String> stack_name[, <String> page_name] )
           Displays a Page in the specified Stack.

Function Detail

addStack

function addStack( <String> stack_name )

hide

function hide()

onBack

function onBack( <String> current_page)

onDone

function onDone( <String> current_page)

onNext

function onNext( <String> current_page)

removeStack

function removeStack( <String> stack_name )

show

function show( <String> stack_name[, <String> page_name] )
Overview   Object  Tree  Index  Help 
Klipfolio Dashboard 5 API
 PREV OBJECT  NEXT OBJECT FRAMES    NO FRAMES    
SUMMARY: PROPERTY | FUNCTION DETAIL: PROPERTY | FUNCTION
© 2009 Klipfolio Inc. All Rights Reserved.