TJuiDialog

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 &copy; 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&amp;notheme=true&amp;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());
+	}
+}