1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
|
<?php
/**
* TJuiDroppable class file.
*
* @author Fabio Bas <ctrlaltca[at]gmail[dot]com>
* @link http://www.pradosoft.com/
* @copyright Copyright © 2013-2014 PradoSoft
* @license http://www.pradosoft.com/license/
* @package Prado\Web\UI\JuiControls
*/
namespace Prado\Web\UI\JuiControls;
use Prado\Prado;
use Prado\Web\Javascripts\TJavaScript;
use Prado\Web\UI\ActiveControls\ICallbackEventHandler;
use Prado\Web\UI\ActiveControls\TActivePanel;
Prado::using('System.Web.UI.JuiControls.TJuiControlAdapter');
Prado::using('System.Web.UI.ActiveControls.TActivePanel');
/**
* TJuiDroppable class.
*
* TJuiDroppable is an extension to {@link TActivePanel} based on jQuery-UI's
* {@link http://jqueryui.com/droppable/ Droppable} interaction.
* When a {@link TJuiDraggable} is dropped over a TJuiDroppable panel, the
* {@link onDrop OnDrop} event will be triggered. The event hanler will receive
* a {@link TJuiEventParameter} object containing a reference to the dropped control
* in the <tt>DraggableControl</tt> property.
*
* <code>
* <com:TJuiDraggable
* ID="drag1"
* Style="border: 1px solid red; width:100px;height:100px;background-color: #fff"
* >
* drag me
* </com:TJuiDraggable>
*
* <com:TJuiDroppable
* ID="drop1"
* Style="border: 1px solid blue; width:600px;height:600px; background-color: lime"
* OnDrop="drop1_ondrop"
* >
* drop it over me
* </com:TJuiDroppable>
* </code>
*
* <code>
* public function drop1_ondrop($sender, $param)
* {
* $draggable=$param->DraggableControl;
* $offset=$param->getCallbackParameter()->offset;
* $target=$param->getCallbackParameter()->target->offset;
* $top=$offset->top - $target->top;
* $left=$offset->left - $target->left;
* $this->label1->Text="Dropped ".$draggable->ID." at: <br/>Top=".$top." Left=".$left;
* }
* </code>
*
* @author Fabio Bas <ctrlaltca[at]gmail[dot]com>
* @package Prado\Web\UI\JuiControls
* @since 3.3
*/
class TJuiDroppable 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('addClasses', 'appendTo', 'axis', 'cancel', 'connectToSortable', 'containment', 'cursor', 'cursorAt', 'delay', 'disabled', 'distance', 'grid', 'handle', 'helper', 'iframeFix', 'opacity', 'refreshPositions', 'revert', 'revertDuration', 'scope', 'scroll', 'scrollSensitivity', 'scrollSpeed', 'snap', 'snapMode', 'snapTolerance', 'stack', 'zIndex');
}
/**
* Array containing valid javascript events
* @return array()
*/
public function getValidEvents()
{
return array('activate', 'create', 'deactivate', 'drop', 'out', 'over');
}
/**
* @return array list of callback options.
*/
protected function getPostBackOptions()
{
return $this->getOptions()->toArray();
}
/**
* 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()."').droppable(".$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 OnActivate event
* @param object $params event parameters
*/
public function onActivate ($params)
{
$this->raiseEvent('OnActivate', $this, $params);
}
/**
* Raises the OnCreate event
* @param object $params event parameters
*/
public function onCreate ($params)
{
$this->raiseEvent('OnCreate', $this, $params);
}
/**
* Raises the OnDeactivate event
* @param object $params event parameters
*/
public function onDeactivate ($params)
{
$this->raiseEvent('OnDeactivate', $this, $params);
}
/**
* Raises the OnDrop event
* @param object $params event parameters
*/
public function onDrop ($params)
{
$this->raiseEvent('OnDrop', $this, $params);
}
/**
* Raises the OnOut event
* @param object $params event parameters
*/
public function OnOut ($params)
{
$this->raiseEvent('OnOut', $this, $params);
}
/**
* Raises the OnOver event
* @param object $params event parameters
*/
public function OnOver ($params)
{
$this->raiseEvent('OnOver', $this, $params);
}
/**
* This method is invoked when a callback is requested. The method raises
* 'OnCallback' event to fire up the event handlers. If you override this
* method, be sure to call the parent implementation so that the event
* handler can be invoked.
* @param TCallbackEventParameter event parameter to be passed to the event handlers
*/
public function onCallback($param)
{
$this->raiseEvent('OnCallback', $this, $param);
}
}
|
