1
|
|
|
<?php |
2
|
|
|
namespace Ajax\ui\components; |
3
|
|
|
|
4
|
|
|
use Ajax\JsUtils; |
5
|
|
|
use Ajax\ui\properties\Animation; |
6
|
|
|
use Ajax\common\components\SimpleComponent; |
7
|
|
|
use Ajax\service\JString; |
8
|
|
|
|
9
|
|
|
/** |
10
|
|
|
* Composant JQuery UI Accordion |
11
|
|
|
* |
12
|
|
|
* @author jc |
13
|
|
|
* @version 1.001 |
14
|
|
|
*/ |
15
|
|
|
class Accordion extends SimpleComponent { |
16
|
|
|
|
17
|
|
|
public function __construct(JsUtils $js) { |
18
|
|
|
parent::__construct($js); |
19
|
|
|
$this->params = array( |
20
|
|
|
"active" => 0 |
21
|
|
|
); |
22
|
|
|
$this->uiName = "accordion"; |
23
|
|
|
} |
24
|
|
|
|
25
|
|
|
/** |
26
|
|
|
* Which panel is currently open. |
27
|
|
|
* Multiple types supported: |
28
|
|
|
* Boolean: Setting active to false will collapse all panels. |
29
|
|
|
* This requires the collapsible option to be true. |
30
|
|
|
* Integer: The zero-based index of the panel that is active (open). |
31
|
|
|
* A negative value selects panels going backward from the last panel. |
32
|
|
|
* |
33
|
|
|
* @param Boolean $value |
34
|
|
|
* default : 0 |
35
|
|
|
* @return $this |
36
|
|
|
*/ |
37
|
|
|
public function setActive($value) { |
38
|
|
|
return $this->setParam("active", $value); |
39
|
|
|
} |
40
|
|
|
|
41
|
|
|
/** |
42
|
|
|
* If and how to animate changing panels. |
43
|
|
|
* Multiple types supported: |
44
|
|
|
* Boolean: A value of false will disable animations. |
45
|
|
|
* Number: Duration in milliseconds with default easing. |
46
|
|
|
* String: Name of easing to use with default duration. |
47
|
|
|
* Object: Animation settings with easing and duration properties. |
48
|
|
|
* Can also contain a down property with any of the above options. |
49
|
|
|
* "Down" animations occur when the panel being activated has a lower index than the currently active panel. |
50
|
|
|
* |
51
|
|
|
* @param mixed $value |
52
|
|
|
* default : {} |
53
|
|
|
* @return $this |
54
|
|
|
*/ |
55
|
|
|
public function setAnimate($value) { |
56
|
|
|
if ($value instanceof Animation) |
57
|
|
|
$value = $value->getParams(); |
58
|
|
|
else if (is_string($value)) { |
59
|
|
|
$animation = new Animation(); |
60
|
|
|
$animation->setEasing($value); |
61
|
|
|
} |
62
|
|
|
$this->setParam("animate", $value); |
63
|
|
|
return $this; |
64
|
|
|
} |
65
|
|
|
|
66
|
|
|
/** |
67
|
|
|
* Whether all the sections can be closed at once. |
68
|
|
|
* Allows collapsing the active section. |
69
|
|
|
* |
70
|
|
|
* @param Boolean $value |
71
|
|
|
* default : false |
72
|
|
|
* @return $this |
73
|
|
|
*/ |
74
|
|
|
public function setCollapsible($value) { |
75
|
|
|
return $this->setParamCtrl("collapsible", $value, "is_bool"); |
76
|
|
|
} |
77
|
|
|
|
78
|
|
|
/** |
79
|
|
|
* Disables the accordion if set to true. |
80
|
|
|
* |
81
|
|
|
* @param Boolean $value |
82
|
|
|
* default : false |
83
|
|
|
* @return $this |
84
|
|
|
*/ |
85
|
|
|
public function setDisabled($value) { |
86
|
|
|
return $this->setParamCtrl("disabled", $value, "is_bool"); |
87
|
|
|
} |
88
|
|
|
|
89
|
|
|
/** |
90
|
|
|
* The event that accordion headers will react to in order to activate the associated panel. |
91
|
|
|
* Multiple events can be specified, separated by a space. |
92
|
|
|
* |
93
|
|
|
* @param string $value |
94
|
|
|
* default : click |
95
|
|
|
* @return $this |
96
|
|
|
*/ |
97
|
|
|
public function setEvent($value) { |
98
|
|
|
$this->setParam("event", $value); |
99
|
|
|
return $this; |
100
|
|
|
} |
101
|
|
|
|
102
|
|
|
/** |
103
|
|
|
* Selector for the header element, applied via . |
104
|
|
|
* |
105
|
|
|
* find() on the main accordion element. |
106
|
|
|
* Content panels must be the sibling immediately after their associated headers. |
107
|
|
|
* |
108
|
|
|
* @param string $value |
109
|
|
|
* css/JQuery Selector |
110
|
|
|
* default : "> li > :first-child,> :not(li):even" |
111
|
|
|
* @return $this |
112
|
|
|
*/ |
113
|
|
|
public function setHeader($value) { |
114
|
|
|
return $this->setParam("header", $value); |
115
|
|
|
} |
116
|
|
|
|
117
|
|
|
/** |
118
|
|
|
* Controls the height of the accordion and each panel. |
119
|
|
|
* Possible values: |
120
|
|
|
* "auto": All panels will be set to the height of the tallest panel. |
121
|
|
|
* "fill": Expand to the available height based on the accordion's parent height. |
122
|
|
|
* "content": Each panel will be only as tall as its content. |
123
|
|
|
* |
124
|
|
|
* @param String $value |
125
|
|
|
* default : content |
126
|
|
|
* @return $this |
127
|
|
|
*/ |
128
|
|
|
public function setHeightStyle($value) { |
129
|
|
|
return $this->setParamCtrl("heightStyle", $value, array( |
130
|
|
|
"auto", |
131
|
|
|
"fill", |
132
|
|
|
"content" |
133
|
|
|
)); |
134
|
|
|
} |
135
|
|
|
|
136
|
|
|
/** |
137
|
|
|
* Icons to use for headers, matching an icon provided by the jQuery UI CSS Framework. |
138
|
|
|
* Set to false to have no icons displayed. |
139
|
|
|
* header (string, default: "ui-icon-triangle-1-e") |
140
|
|
|
* activeHeader (string, default: "ui-icon-triangle-1-s") |
141
|
|
|
* |
142
|
|
|
* @param String $value |
143
|
|
|
* default : { "header": "ui-icon-triangle-1-e", "activeHeader": "ui-icon-triangle-1-s" } |
144
|
|
|
* @return $this |
145
|
|
|
*/ |
146
|
|
|
public function setIcons($value) { |
147
|
|
|
if (is_string($value)) { |
|
|
|
|
148
|
|
|
if (JString::startsWith($value, "{")); |
149
|
|
|
$value = "%" . $value . "%"; |
150
|
|
|
} |
151
|
|
|
$this->setParam("icons", $value); |
152
|
|
|
return $this; |
153
|
|
|
} |
154
|
|
|
|
155
|
|
|
/** |
156
|
|
|
* Triggered after a panel has been activated (after animation completes). |
157
|
|
|
* If the accordion was previously collapsed, ui.oldHeader and ui.oldPanel will be empty jQuery objects. |
158
|
|
|
* If the accordion is collapsing, ui.newHeader and ui.newPanel will be empty jQuery objects. |
159
|
|
|
* |
160
|
|
|
* @param string $jsCode |
161
|
|
|
* @return $this |
162
|
|
|
*/ |
163
|
|
|
public function onActivate($jsCode) { |
164
|
|
|
return $this->addEvent("activate", $jsCode); |
165
|
|
|
} |
166
|
|
|
|
167
|
|
|
/** |
168
|
|
|
* Triggered directly before a panel is activated. |
169
|
|
|
* Can be canceled to prevent the panel from activating. |
170
|
|
|
* If the accordion is currently collapsed, ui.oldHeader and ui.oldPanel will be empty jQuery objects. |
171
|
|
|
* If the accordion is collapsing, ui.newHeader and ui.newPanel will be empty jQuery objects. |
172
|
|
|
* |
173
|
|
|
* @param string $jsCode |
174
|
|
|
* @return $this |
175
|
|
|
*/ |
176
|
|
|
public function onBeforeActivate($jsCode) { |
177
|
|
|
return $this->addEvent("beforeActivate", $jsCode); |
178
|
|
|
} |
179
|
|
|
|
180
|
|
|
/** |
181
|
|
|
* Triggered when the accordion is created. |
182
|
|
|
* If the accordion is collapsed, ui.header and ui.panel will be empty jQuery objects. |
183
|
|
|
* |
184
|
|
|
* @param string $jsCode |
185
|
|
|
* @return $this |
186
|
|
|
*/ |
187
|
|
|
public function onCreate($jsCode) { |
188
|
|
|
return $this->addEvent("create", $jsCode); |
189
|
|
|
} |
190
|
|
|
} |
191
|
|
|
|