Prototype window - Revision history

Bahati at 09:59, 11 March 2011

2011-03-11T09:59:56Z

← Older revision		Revision as of 09:59, 11 March 2011
Line 1:		Line 1:
	{{howto\|Easy\|[[Jeroen]] ~~<jeroenvs@ibuildings.nl>~~}}		{{howto\|Easy\|[[Jeroen]]}}
	Prototype Windows can be used to create nice JavaScript Windows and Dialogs for ATK. The library even provides fancy visual effects such as fading in and out.		Prototype Windows can be used to create nice JavaScript Windows and Dialogs for ATK. The library even provides fancy visual effects such as fading in and out.

Leon: Despam

2007-07-16T06:57:48Z

Despam

@@ Line 6: / Line 6: @@
 = Register javascripts and styles =
 <syntaxhighlight lang="php">
-  $page =</syntaxhighlight>
+  $page = &atkinstance("atk.ui.atkpage");

OsiDn9 at 14:45, 14 July 2007

2007-07-14T14:45:49Z

@@ Line 6: / Line 6: @@
 = Register javascripts and styles =
 <syntaxhighlight lang="php">
-  $page = &atkinstance("atk.ui.atkpage");
+  $page =</syntaxhighlight>

Jeroenvs: added php tags

2007-02-01T13:39:44Z

added php tags

← Older revision		Revision as of 13:39, 1 February 2007
Line 5:		Line 5:

	= Register javascripts and styles =		= Register javascripts and styles =
			<syntaxhighlight lang="php">
	$page = &atkinstance("atk.ui.atkpage");		$page = &atkinstance("atk.ui.atkpage");
	$page->register_script(atkconfig("atkroot")."atk/javascript/prototype/prototype.js");		$page->register_script(atkconfig("atkroot")."atk/javascript/prototype/prototype.js");
Line 18:		Line 19:
	// choose a style from the themes/ directory		// choose a style from the themes/ directory
	$page->register_style(atkconfig("atkroot")."atk/javascript/window/themes/alphacube.css");		$page->register_style(atkconfig("atkroot")."atk/javascript/window/themes/alphacube.css");
			</syntaxhighlight>

	= Create the javascript for your dialog =		= Create the javascript for your dialog =

Jeroenvs at 13:36, 1 February 2007

2007-02-01T13:36:20Z

New page

{{howto|Easy|[[Jeroen]] <jeroenvs@ibuildings.nl>}}
Prototype Windows can be used to create nice JavaScript Windows and Dialogs for ATK. The library even provides fancy visual effects such as fading in and out.

These windows can be easily used in ATK:

= Register javascripts and styles =
$page = &atkinstance("atk.ui.atkpage");
$page->register_script(atkconfig("atkroot")."atk/javascript/prototype/prototype.js");
$page->register_script(atkconfig("atkroot")."atk/javascript/window/window.js");
$page->register_script(atkconfig("atkroot")."atk/javascript/window/js/application.js");

// include the following line, if you like fancy effects
$page->register_script(atkconfig("atkroot")."atk/javascript/scriptaculous/effects.js");

// register default-style
$page->register_style(".".atkconfig("atkroot")."atk/javascript/window/themes/default.css");

// choose a style from the themes/ directory
$page->register_style(atkconfig("atkroot")."atk/javascript/window/themes/alphacube.css");

= Create the javascript for your dialog =
<javascript>
function showDialog()
{
Dialog.confirm("Prototype Window dialog test.",
{
windowParameters: {className: 'alphacube'}, okLabel: 'Ok', cancelLabel:'Close', ok:function(win) {return true;}
});
}
</javascript>

You can find a lot of other examples on the [http://prototype-window.xilinus.com/samples.html Prototype Window homepage].

= Make a button to open the dialog=
<input type="button" value="Open Dialog" onclick="showDialog()">

= Complete code =
The complete code for this ATK-application:
<syntaxhighlight lang="php">
<?php
$config_atkroot = "./";
include_once($config_atkroot."atk.inc");

/**
* REGISTER JAVASCRIPT & CSS
*/
$page = &atkinstance("atk.ui.atkpage");
$page->register_script(atkconfig("atkroot")."atk/javascript/prototype/prototype.js");
$page->register_script(atkconfig("atkroot")."atk/javascript/window/window.js");
$page->register_script(atkconfig("atkroot")."atk/javascript/window/js/application.js");
$page->register_script(atkconfig("atkroot")."atk/javascript/scriptaculous/effects.js");

// registreer de default-style
$page->register_style(atkconfig("atkroot")."atk/javascript/window/themes/default.css");
$page->register_style(atkconfig("atkroot")."atk/javascript/window/themes/alphacube.css");

/**
* JAVASCRIPT FOR DIALOG
*/
$window_code = "function showDialog()
{
Dialog.confirm('Prototype Window dialog test.',
{
windowParameters: {className: 'alphacube'}, okLabel: 'Ok', cancelLabel:'Close', ok:function(win) {return true;}
});
}";

$page->register_scriptcode($window_code);

/**
* BUTTON
*/
$page->addContent('<input type="button" value="Open Dialog" onclick="showDialog()">');

/**
* FLUSH OUTPUT
*/
$output = &atkOutput::getInstance();
$output->output($page->render(text('Prototype Window'), true));
$output->outputFlush();
?>
</syntaxhighlight>