diff options
6 files changed, 399 insertions, 0 deletions
diff --git a/demos/quickstart/protected/pages/JuiControls/Home.page b/demos/quickstart/protected/pages/JuiControls/Home.page index 68765faa..3dc81417 100644 --- a/demos/quickstart/protected/pages/JuiControls/Home.page +++ b/demos/quickstart/protected/pages/JuiControls/Home.page @@ -84,6 +84,10 @@ For informations of the specific options of each interaction, follow jQuery-UI I <a href="?page=JuiControls.Widgets#TJuiAutoComplete">TJuiProgressbar</a> provides a list of suggestions on the current partial word typed in the textbox </li> + <li> + <a href="?page=JuiControls.Widgets#TJuiDialog">TJuiDialog</a> + displays an movable dialog control + </li> </ul> </com:TContent> diff --git a/demos/quickstart/protected/pages/JuiControls/Samples/TJuiDialog/Home.page b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiDialog/Home.page new file mode 100644 index 00000000..6a9df446 --- /dev/null +++ b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiDialog/Home.page @@ -0,0 +1,67 @@ +<com:TContent ID="body"> +<h1>TJuiDialog Samples</h1> + + +<table class="sampletable"> + +<tr><td class="samplenote"> +Simple Dialog: +</td><td class="sampleaction"> +<com:TActiveButton + Text="Open Dialog" + OnClick="bt1Click"/> +<com:TJuiDialog + ID="dlg1" + Options.Title="Simple Dialog" + Options.AutoOpen="False" + > + This is a simple Dialog +</com:TJuiDialog> +</td></tr> + +<tr><td class="samplenote"> +Modal dialog: +</td><td class="sampleaction"> +<com:TActiveButton + Text="Open Dialog" + OnClick="bt2Click"/> +<com:TJuiDialog + ID="dlg2" + Options.Title="Modal dialog" + Options.AutoOpen="False" + Options.Modal="True" + > + This is a modal dialog + +</com:TJuiDialog> +</td></tr> + + +<tr><td class="samplenote"> +Dialog with buttons: +</td><td class="sampleaction"> +<com:TActiveButton + Text="Open Dialog" + OnClick="bt3Click"/> +<com:TJuiDialog + ID="dlg3" + Options.Title="Dialog with buttons" + Options.AutoOpen="False" + > + This is a dialog with buttons. + <com:TJuiDialogButton + Text="Ok" + OnClick="dlg3Ok" + /> + <com:TJuiDialogButton + Text="Cancel" + OnClick="dlg3Cancel" + /> + +</com:TJuiDialog> +<com:TActiveLabel ID="lbl3" /> +</td></tr> + +</table> + +</com:TContent> diff --git a/demos/quickstart/protected/pages/JuiControls/Samples/TJuiDialog/Home.php b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiDialog/Home.php new file mode 100644 index 00000000..f9d1e3a9 --- /dev/null +++ b/demos/quickstart/protected/pages/JuiControls/Samples/TJuiDialog/Home.php @@ -0,0 +1,33 @@ +<?php + +class Home extends TPage +{ + + public function bt1Click($sender, $param) + { + $this->dlg1->open(); + } + + public function bt2Click($sender, $param) + { + $this->dlg2->open(); + } + + public function bt3Click($sender, $param) + { + $this->dlg3->open(); + } + + public function dlg3Ok($sender, $param) + { + $this->lbl3->Text="Button Ok clicked"; + $this->dlg3->close(); + } + + public function dlg3Cancel($sender, $param) + { + $this->lbl3->Text="Button Cancel clicked"; + $this->dlg3->close(); + } + +}
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/JuiControls/Widgets.page b/demos/quickstart/protected/pages/JuiControls/Widgets.page index cedec675..4c74c491 100644 --- a/demos/quickstart/protected/pages/JuiControls/Widgets.page +++ b/demos/quickstart/protected/pages/JuiControls/Widgets.page @@ -48,4 +48,26 @@ When a suggestion is selected the <tt>OnSuggestionSelected</tt> event is raised, <com:RunBar PagePath="JuiControls.Samples.TJuiAutoComplete.Home" /> <br/> + +<a name="TJuiDialog" /> +<h2>TJuiDialog</h2> +<com:DocLink ClassPath="System.Web.UI.JuiControls.TJuiDialog" /> - <a href="http://api.jqueryui.com/dialog/">jQuery UI API</a> + +<p class="block-content"> +<tt>TJuiDialog</tt> is an extension to <a href="?page=ActiveControls.ActivePanel">TActivePanel</a> based on jQuery-UI's <a href="http://jqueryui.com/dialog/">dialog</a> widget. +</p> + +<p class="block-content"> +TJuiDialog is an extended TActivePanel that shows an dialog. The dialog may contain buttons that can fire callback events. +</p> + +<p class="block-content"> +The dialog may contain one or more <tt>TJuiDialogButton</tt> Controls. +The buttons may contain a callback that will be fired when they are clicked. +</p> + + +<com:RunBar PagePath="JuiControls.Samples.TJuiDialog.Home" /> +<br/> + </com:TContent> diff --git a/framework/Web/UI/JuiControls/TJuiDialog.php b/framework/Web/UI/JuiControls/TJuiDialog.php new file mode 100644 index 00000000..7168ab16 --- /dev/null +++ b/framework/Web/UI/JuiControls/TJuiDialog.php @@ -0,0 +1,238 @@ +<?php +/** + * TJuiDialog class file. + * + * @author David Otto <ottodavid[at]gmx[dot]net> + * @link http://www.pradosoft.com/ + * @copyright Copyright © 2013-2014 PradoSoft + * @license http://www.pradosoft.com/license/ + * @package System.Web.UI.JuiControls + */ + +Prado::using('System.Web.UI.JuiControls.TJuiControlAdapter'); +Prado::using('System.Web.UI.ActiveControls.TActivePanel'); + +/** + * TJuiDialog class. + * + * TJuiDialog is an extension to {@link TActivePanel} based on jQuery-UI's + * {@link http://jqueryui.com/dialog/ Dialog} widget. + * + * + * <code> + * <com:TJuiDialog + * ID="dlg1" + * > + * contents + * </com:TJuiDialog> + * </code> + * + * @author David Otto <ottodavid[at]gmx[dot]net> + * @package System.Web.UI.JuiControls + * @since 3.3 + */ +class TJuiDialog extends TActivePanel implements IJuiOptions, ICallbackEventHandler +{ + protected $_options; + + /** + * Creates a new callback control, sets the adapter to + * TActiveControlAdapter. If you override this class, be sure to set the + * adapter appropriately by, for example, by calling this constructor. + */ + public function __construct() + { + parent::__construct(); + $this->setAdapter(new TJuiControlAdapter($this)); + } + + /** + * Object containing defined javascript options + * @return TJuiControlOptions + */ + public function getOptions() + { + if($this->_options===null) + $this->_options=new TJuiControlOptions($this); + return $this->_options; + } + + /** + * Array containing valid javascript options + * @return array() + */ + public function getValidOptions() + { + return array('appendTo', 'autoOpen', 'buttons', 'closeOnEscape', 'closeText', 'dialogClass', 'draggable', 'height', 'hide', 'maxHeight', 'maxWidth', 'modal', 'position', 'resizeable', 'show', 'title', 'width'); + } + + /** + * Array containing valid javascript events + * @return array() + */ + public function getValidEvents() + { + return array('beforeClose', 'close', 'create', 'drag', 'dragStart', 'dragStop', 'focus', 'open', 'resize', 'resizeStart', 'resizeStop'); + } + + /** + * @return array list of callback options. + */ + protected function getPostBackOptions() + { + $options = $this->getOptions()->toArray(); + + foreach($this->getControls() as $control) + if($control instanceof TJuiDialogButton) + $options['buttons'][] = $control->getPostBackOptions(); + + return $options; + } + + /** + * Ensure that the ID attribute is rendered and registers the javascript code + * for initializing the active control. + */ + protected function addAttributesToRender($writer) + { + parent::addAttributesToRender($writer); + + $writer->addAttribute('id',$this->getClientID()); + $options=TJavascript::encode($this->getPostBackOptions()); + $cs=$this->getPage()->getClientScript(); + $code="jQuery('#".$this->getClientId()."').dialog(".$options.");"; + $cs->registerEndScript(sprintf('%08X', crc32($code)), $code); + } + + /** + * Raises callback event. This method is required by the {@link ICallbackEventHandler} + * interface. + * @param TCallbackEventParameter the parameter associated with the callback event + */ + public function raiseCallbackEvent($param) + { + $this->getOptions()->raiseCallbackEvent($param); + } + + /** + * Raises the OnCreate event + * @param object $params event parameters + */ + public function onOpen ($params) + { + $this->raiseEvent('OnOpen', $this, $params); + } + + /** + * Open this dialog + */ + public function open() + { + $this->triggerClientMethod('open'); + } + + /** + * Close this dialog + */ + public function close() + { + $this->triggerClientMethod('close'); + } + + private function triggerClientMethod($method) + { + $cs = $this->getPage()->getClientScript(); + $code = "jQuery('#".$this->getClientId()."').dialog('".$method."');"; + $cs->registerEndScript(sprintf('%08X', crc32($code)), $code); + } +} + +/** + * TJuiDialogButton class + * + * This button must be child of a TJuiDialog. It can be used to bind an callback + * to the buttons of the dialog. + * + * <code> + * <com:TJuiDialog> * > + * Text + * <com:TJuiDialogButton Text="Ok" OnClick="Ok" /> + * + * </com:TJuiDialog> + * </code> + * + * @author David Otto <ottodavid[at]gmx[dot]net> + * @package System.Web.UI.JuiControls + * @since 3.3 + */ +class TJuiDialogButton extends TControl implements ICallbackEventHandler, IActiveControl +{ + + /** + * Creates a new callback control, sets the adapter to + * TActiveControlAdapter. If you override this class, be sure to set the + * adapter appropriately by, for example, by calling this constructor. + */ + public function __construct() + { + parent::__construct(); + $this->setAdapter(new TActiveControlAdapter($this)); + } + + /** + * @return TBaseActiveCallbackControl standard callback control options. + */ + public function getActiveControl() + { + return $this->getAdapter()->getBaseActiveControl(); + } + + /** + * Array containing defined javascript options + * @return array + */ + public function getPostBackOptions() + { + return array( + 'text' => $this->getText(), + 'click' => new TJavaScriptLiteral("function(){new Prado.Callback('".$this->getUniqueID()."', 'onClick');}" + )) ; + } + + /** + * @return string caption of the button + */ + public function getText() + { + return $this->getViewState('Text',''); + } + + /** + * @param string caption of the button + */ + public function setText($value) + { + $this->setViewState('Text',$value,''); + } + + /** + * Raises the OnClick event + * @param object $params event parameters + */ + public function onClick ($params) + { + $this->raiseEvent('OnClick', $this, $params); + } + + /** + * Raises callback event. + * raises the appropriate event(s) (e.g. OnClick) + * @param TCallbackEventParameter the parameter associated with the callback event + */ + public function raiseCallbackEvent($param) + { + if($param->CallbackParameter === 'onClick') + $this->onClick($param); + } + +}
\ No newline at end of file diff --git a/tests/FunctionalTests/quickstart/JuiControls/JuiDialogTestCase.php b/tests/FunctionalTests/quickstart/JuiControls/JuiDialogTestCase.php new file mode 100755 index 00000000..576582e6 --- /dev/null +++ b/tests/FunctionalTests/quickstart/JuiControls/JuiDialogTestCase.php @@ -0,0 +1,35 @@ +<?php + + +/** + * Testcase for TJuiDialog + */ +class JuiDialogTestCase extends PradoGenericSelenium2Test +{ + function test () + { + $this->url("../../demos/quickstart/index.php?page=JuiControls.Samples.TJuiDialog.Home&notheme=true&lang=en"); + + $this->assertEquals("PRADO QuickStart Sample", $this->title()); + + $this->assertContains('TJuiDialog Samples', $this->source()); + + $base = 'ctl0_body_'; + + + $this->byId("${base}ctl0")->click(); + $this->pause(500); + $this->assertVisible("${base}dlg1"); + + + $this->assertEmpty($this->byId("${base}lbl3")->text()); + $this->byId("${base}ctl2")->click(); + $this->pause(500); + $this->assertVisible("${base}dlg3"); + + // Click OK (by keys...) + $this->keys(PHPUnit_Extensions_Selenium2TestCase_Keys::ENTER); + $this->pause(500); + $this->assertEquals('Button Ok clicked', $this->byId("${base}lbl3")->text()); + } +} |