Use addTab() and removeTab() to add/remove Tab objects, then use the Tab objects to add custom user interface to the Klips Customize window using JavaScript.
Example
The following function creates a new tab called 'Sample UI', then adds some components to the tab.
<klip>
<identity>
<title>
API: Setup
</title>
</identity>
<locations>
<contentsource>
http://support.klipfolio.com/files/demo/demo.xml
</contentsource>
<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>
<style>
alert {
type: item;
}
sender {
itemcol: 2;
noterow: 1;
label: 'Sender';
emphasis: strong;
}
summary {
itemcol: 3;
noterow: 4;
wrap: false;
notelabel: false;
}
date {
itemcol: 4;
noterow: 2;
label: 'Date';
}
category {
noterow: 3;
label: 'Category';
}
level {
itemcol: 1;
noterow: 5;
notelabel: false;
type: image;
}
url {
type: link;
}
id {
key: override;
}
</style>
<klipscript>
<![CDATA[
function onLoad() {
var tab = Setup.addTab ("Sample UI");
tab.addText ("Convert:");
textField = tab.addTextField( "1" );
comboBox = tab.addComboBox();
comboBox.addItem( "Canadian Dollar (CAD)" );
comboBox.addItem( "Euro (EUR)" );
comboBox.addItem( "U.S. Dollar (USD)" );
tab.addText( "To the following currencies:" );
listControl = tab.addListControl (true);
listControl.addItem( "Canadian Dollar (CAD)" );
listControl.addItem( "Euro (EUR)" );
listControl.addItem( "U.S. Dollar (USD)" );
checkBox = tab.addCheckbox( "Display full currency names in the Klip" )
}
function onRefresh()
{
return Engines.Data.process( Prefs.contentsource );
}
]]>
</klipscript>
</klip>
| Properties Summary | |
integer |
length
The number of Tab objects contained in the |
| Function Summary | |
Tab
|
addTab( <String> name )
Inserts a Tab object with the specified name and at Setup[0], which corresponds to the left-most tab in the Klip's Customize window. |
function
|
close()
Closes the Klip's Customize window. |
Tab
|
insertTab( <integer> index, <String> name )
Inserts a Tab object with the specified name and at Setup[index]. |
function
|
onClose()
A handler function called by Klipfolio Dashboard when the Klip's Customize window is closed. |
function
|
onOpen()
A handler function called by Klipfolio Dashboard when the Klip's Customize window is opened by the user. |
function
|
open( [ <integer> index | <String> name ] )
Opens Klip's Customize window at the specified Tab. |
boolean
|
removeTab( <String> name | <Tab> tab | <integer> index )
Removes the specified Tab object from the Setup array.. |
boolean
|
renameTab( <String> name | <Tab> tab | <integer> index, <String> new_name )
Renames the specified Tab object in the Setup array.. |
| Properties Detail |
length
integer length
-
The number of Tab objects contained in the
| Function Detail |
addTab
Tab addTab( <String> name )
- Inserts a Tab object with the specified name and at Setup[0], which corresponds
to the left-most tab in the Klip's Customize window.
-
Parameters:
name - the name of new tab
-
Returns:
-
the new Tab object
close
function close()
- Closes the Klip's Customize window.
insertTab
Tab insertTab( <integer> index, <String> name )
- Inserts a Tab object with the specified name and at Setup[index].
-
Parameters:
index - to insert the new Tab
name - of new Tab
-
Returns:
-
the new Tab object or false if failed to insert
onClose
function onClose()
- A handler function called by Klipfolio Dashboard when the Klip's Customize window is closed.
Note: Klipfolio Dashboard calls this event handler only on user actions. Opening the Klip's Customize window by calling Setup.close() does not trigger this event handler.
Example:
The following Klip sets up two handler functions to receive notification
when the user opens and closes the Klip's Customize window.
<klip>
<identity>
<title>
API: TextArea.onChange
</title>
</identity>
<locations>
<contentsource>
http://support.klipfolio.com/files/demo/demo.xml
</contentsource>
<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>
<style>
alert {
type: item;
}
sender {
itemcol: 2;
noterow: 1;
label: 'Sender';
emphasis: strong;
}
summary {
itemcol: 3;
noterow: 4;
wrap: false;
notelabel: false;
}
date {
itemcol: 4;
noterow: 2;
label: 'Date';
}
category {
noterow: 3;
label: 'Category';
}
level {
itemcol: 1;
noterow: 5;
notelabel: false;
type: image;
}
url {
type: link;
}
id {
key: override;
}
</style>
<klipscript>
<![CDATA[
var textarea;
function onLoad() {
// Create a new tab
var tab = Setup.addTab( "New Tab" );
// Add a textfield to the tab
textarea = tab.addTextArea();
// Add a handler
textarea.onChange = textarea_onChange;
}
function textarea_onChange( text ) {
this.value = text.toUpperCase ();
trace( "New value: " + this.value + "\r\n" );
// Note: Could use 'this.value' instead of 'text'
}
function onRefresh()
{
return Engines.Data.process( Prefs.contentsource );
}
]]>
</klipscript>
</klip>
You opened the Klip setup dialog... ...You closed the Klip setup dialog
onOpen
function onOpen()
- A handler function called by Klipfolio Dashboard when the Klip's Customize window is opened by the user.
See onClose() for an example.
open
function open( [ <integer> index | <String> name ] )
- Opens Klip's Customize window at the specified Tab.
If no Tab object is specified, opens the Klip's Customize window to the first tab.
-
Parameters:
index - index of tab to display when Customize Klip window appears
name - name of tab to display when Customize Klip window appears
removeTab
boolean removeTab( <String> name | <Tab> tab | <integer> index )
- Removes the specified Tab object from the Setup array..
-
Parameters:
name - the name of the tab to remove
tab - the Tab object to remove
index - index of the tab to remove
-
Returns:
-
true if Klipfolio Dashboard found and deleted the specified Tab object; otherwise, returns false
renameTab
boolean renameTab( <String> name | <Tab> tab | <integer> index, <String> new_name )
- Renames the specified Tab object in the Setup array..
-
Parameters:
name - the name of the Tab to rename
tab - the Tab object to rename
index - index of the Tab to rename
new_name - the new name to replace old name
-
Returns:
-
true if Klipfolio Dashboard found and renamed the specified Tab object; otherwise, returns false
|
Klipfolio Dashboard 5 API | ||||||||
| PREV OBJECT NEXT OBJECT | FRAMES NO FRAMES | ||||||||
| SUMMARY: PROPERTY | FUNCTION | DETAIL: PROPERTY | FUNCTION | ||||||||
© 2009 Klipfolio Inc. All Rights Reserved.