dock.xml
12.3 KB
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
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE components PUBLIC "-//AJAX4JSF//CDK Generator config/EN"
"http://labs.jboss.com/jbossrichfaces/component-config.dtd"
>
<components>
<component>
<name>org.richfaces.Dock</name>
<family>org.richfaces.Dock</family>
<classname>org.richfaces.component.html.HtmlDock</classname>
<superclass>org.richfaces.component.UIDock</superclass>
<description>
The Dock - as anyone familiar with a Mac will know - is a set of iconic images that expand when rolled over
with the cursor, and usually perform some action when clicked. This plugin mimics that behaviour by
transforming a contiguous set of HTML images into an expanding Dock, vertical or horizontal, with or without
labels.
Note that this component will not work if it's children render anything else except "<script>", "<a>"
or "<img>".
</description>
<renderer generate="false" override="true">
<name>org.richfaces.DockRenderer</name>
<classname>org.richfaces.renderkit.html.DockRenderer</classname>
</renderer>
<tag>
<name>dock</name>
<classname>org.richfaces.taglib.DockTag</classname>
<superclass>
org.ajax4jsf.webapp.taglib.HtmlComponentTagBase
</superclass>
<!--
<test>
<classname>org.richfaces.taglib.HtmlDockTagTest</classname>
<superclassname>org.ajax4jsf.tests.AbstractJspTestCase</superclassname>
</test>
-->
</tag>
&ui_component_attributes;
&html_style_attributes;
<property>
<name>active</name>
<classname>int</classname>
<description>
This designates one of the menu's elements to be fully expanded when the dock is initialised. The option
takes a zero-based index of the position of the desired menu element (image) within the dock - so if you
want the 4th of 6 images to be expanded, set active : 3.
Warning : There are consequences to using this option, which might possibly only become apparent when
you try it. I have provided it because it has specifically been requested, but ... if you set a mid-menu
image initially active, and the user then enters the dock at either end, it is quite likely that the
dock will simply collapse to its 'at rest' state because the resultant animation takes the mouse off the
dock!
</description>
<defaultvalue>-1</defaultvalue>
</property>
<property>
<name>align</name>
<classname>java.lang.String</classname>
<description>
values = 'top', 'middle', 'bottom', left', center', 'right'
Fixes the horizontal/vertical main axis, and direction of expansion.
For a horizontal menu:
* 'top' : fixes the top edge of the dock, so that images expand down
* 'middle' : fixes the middle of the images, so that images expand up and down equally
* 'bottom' : fixes the bottom edge of the dock, so that images expand up
For a vertical menu:
* 'left' : fixes the left edge of the dock, so that images expand right
* 'center' : fixes the center of the images, so that images expand left and right equally
* 'right' : fixes the right edge of the dock, so that images expand left
</description>
<defaultvalue>"bottom"</defaultvalue>
</property>
<property>
<name>coefficient</name>
<classname>double</classname>
<description>
Attenuation coefficient. This controls the relationship between the distance from the cursor and the
amount of expansion of any affected image within that distance. A coefficient of 1 makes the expansion
linear with respect to distance from cursor; a larger coefficient gives a greater degree of expansion
the closer to the cursor the affected image is (within distance). # distance : integer, default = 72
Attenuation distance from cursor, ie the distance (in pixels) from the cursor that an image has to be
within in order to have any expansion applied.
Note that attenuation is always calculated as if the Dock was 'at rest' (no images expanded), even
though there may be expanded images at the time.
</description>
<defaultvalue>1.5</defaultvalue>
</property>
<property>
<name>duration</name>
<classname>int</classname>
<description>
The duration (in milliseconds) of the initial 'on-Dock' expansion, and the 'off-Dock' shrinkage.
</description>
<defaultvalue>300</defaultvalue>
</property>
<property>
<name>fadeIn</name>
<classname>int</classname>
<description>
The amount of time (in milliseconds) for the initial fade-in of the Dock after initialisation. By
default this is set to 0 (zero), which means that the Dock is displayed in full as soon as it can be ( =
show() ). There may be occasions when a 'softer' presentation of the Dock is desirable, and setting
fadeIn to, for example, 400 would fade the Dock in over that period.
</description>
<defaultvalue>0</defaultvalue>
</property>
<property>
<name>fadeLayer</name>
<classname>java.lang.String</classname>
<description>
By default the fade-in effect (see fadeIn above) is applied to the original target menu element. By
specifying either 'wrap' or 'dock' here, the fade-in element can be switched to the child or grand-child
(ie. div.jqDockWrap or div.jqDock, respectively) of the original target menu element. This option only
has any effect if fadeIn is set, and is really only useful for cases where, for example, background
colours have been styled on the original menu element or div.jqDock, and you don't want them to be faded
in.
</description>
<defaultvalue>null</defaultvalue>
</property>
<property>
<name>flow</name>
<classname>boolean</classname>
<description>
If set, this alters the default dock behaviour such that the Dock is not auto-centered and the wrap
element (.jqDockWrap, which is relatively positioned) expands and collapses to precisely contain the
Dock (.jqDock); this allows elements positioned around the docked menu to adjust their own relative
position according to the current state of the docked menu.
Warning : There are consequences to using this option, which might possibly only become apparent when
you try it. I have provided it because it has specifically been requested, but with flow enabled, if you
aim your mouse at a specific menu option you will probably find that quite often you don't stay on that
option without having to move the mouse again!
</description>
<defaultvalue>false</defaultvalue>
</property>
<property>
<name>idle</name>
<classname>int</classname>
<description>
The period of time (in milliseconds) after the mouse has left the menu (without re-entering, obviously!)
before the Dock attempts to go to sleep.
</description>
<defaultvalue>0</defaultvalue>
</property>
<property>
<name>inactivity</name>
<classname>int</classname>
<description>
The period of time (in milliseconds) after which the Dock will shrink if there has been no movement of
the mouse while it is over an expanded Dock.
</description>
<defaultvalue>0</defaultvalue>
</property>
<property>
<name>labels</name>
<classname>java.lang.String</classname>
<description>
values = 'true', 'false', 'tl', 'tc', 'tr', 'ml', 'mc', 'mr', 'bl', 'bc', 'br'
This enables/disables display of a label on the current image. Allowed string values are 2 characters in
length: the first character indicates horizontal position (t=top, m=middle, b=bottom) and the second
indicates vertical position (l=left, c=center, r=right). So 'br' means bottom-right! If simply set to
true, jqDock will use its default positioning for the label, which is 'tl' (top-left) for any align
setting other than 'top' or 'left'. The defaults for 'top' and 'left' alignment are 'br' (bottom-right)
and 'tr' (top-right) respectively. To determine the text for the label, jqDock looks firstly for text in
the image's 'title' attribute; if not found, it will then look for text in the 'title' attribute of the
parent link - if there is one - and use that if found.
Please be aware that enabling this option with one of the middle/center label positions (eg. 'ml', 'bc',
etc) may have a slight effect on the performance of the Dock, simply due to the additional processing
required to position the label correctly.
</description>
<defaultvalue>"false"</defaultvalue>
</property>
<property>
<name>loader</name>
<classname>java.lang.String</classname>
<description>
values = 'image', 'jquery'
This overrides the default image loader used by jqDock. Depending on the browser, jqDock uses an image
loader based on either "new Image()", or the jQuery HTML constructor "jQuery('<img/>')...". If your
Dock is not being displayed, and you have triple checked all your image paths, try setting this option
to 'image' or 'jquery' to override the default loader.
</description>
<defaultvalue>null</defaultvalue>
</property>
<property>
<name>noBuffer</name>
<classname>boolean</classname>
<description>
By default, while the dock is asleep the most recent mouse event is buffered, and when the dock is
nudged awake that buffered event is used and acted upon - before any other mouse event that might occur
subsequent to the 'nudge'. Setting the noBuffer option to true will prevent buffering of the mouse
events.
</description>
<defaultvalue>false</defaultvalue>
</property>
<property>
<name>size</name>
<classname>int</classname>
<description>
This is the maximum value (in pixels) of the minor axis dimension for the 'at rest' images. For example,
an image of natural dimensions 90x120 (width x height), placed in a horizontal Dock (say, 'align' =
'bottom') would, by default, be sized down to 36x48. This is because height is the minor axis in a
horizontal Dock, and to keep the presentation of the 'at rest' images neat and tidy it is the height
that is governed by the size option. Conversely, in a vertical Dock it would be the width that was
capped at the size value, with height being set proportionately.
</description>
<defaultvalue>48</defaultvalue>
</property>
<property>
<name>step</name>
<classname>int</classname>
<description>
The timer interval (in milliseconds) between each animation step of the 'on-Dock' expansion, and the
'off-Dock' shrinkage.
</description>
<defaultvalue>50</defaultvalue>
</property>
</component>
</components>