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
242
243
244
245
246
247
248
249
|
//>>built
define("dojox/mobile/_ItemBase", [
"dojo/_base/kernel",
"dojo/_base/config",
"dojo/_base/declare",
"dijit/registry", // registry.getEnclosingWidget
"dijit/_Contained",
"dijit/_Container",
"dijit/_WidgetBase",
"./TransitionEvent",
"./View"
], function(kernel, config, declare, registry, Contained, Container, WidgetBase, TransitionEvent, View){
/*=====
var Contained = dijit._Contained;
var Container = dijit._Container;
var WidgetBase = dijit._WidgetBase;
var TransitionEvent = dojox.mobile.TransitionEvent;
var View = dojox.mobile.View;
=====*/
// module:
// dojox/mobile/_ItemBase
// summary:
// A base class for item classes (e.g. ListItem, IconItem, etc.)
return declare("dojox.mobile._ItemBase", [WidgetBase, Container, Contained],{
// summary:
// A base class for item classes (e.g. ListItem, IconItem, etc.)
// description:
// _ItemBase is a base class for widgets that have capability to
// make a view transition when clicked.
// icon: String
// An icon image to display. The value can be either a path for an
// image file or a class name of a DOM button. If icon is not
// specified, the iconBase parameter of the parent widget is used.
icon: "",
// iconPos: String
// The position of an aggregated icon. IconPos is comma separated
// values like top,left,width,height (ex. "0,0,29,29"). If iconPos
// is not specified, the iconPos parameter of the parent widget is
// used.
iconPos: "", // top,left,width,height (ex. "0,0,29,29")
// alt: String
// An alt text for the icon image.
alt: "",
// href: String
// A URL of another web page to go to.
href: "",
// hrefTarget: String
// A target that specifies where to open a page specified by
// href. The value will be passed to the 2nd argument of
// window.open().
hrefTarget: "",
// moveTo: String
// The id of the transition destination view which resides in the
// current page.
//
// If the value has a hash sign ('#') before the id (e.g. #view1)
// and the dojo.hash module is loaded by the user application, the
// view transition updates the hash in the browser URL so that the
// user can bookmark the destination view. In this case, the user
// can also use the browser's back/forward button to navigate
// through the views in the browser history.
//
// If null, transitions to a blank view.
// If '#', returns immediately without transition.
moveTo: "",
// scene: String
// The name of a scene. Used from dojox.mobile.app.
scene: "",
// clickable: Boolean
// If true, this item becomes clickable even if a transition
// destination (moveTo, etc.) is not specified.
clickable: false,
// url: String
// A URL of an html fragment page or JSON data that represents a
// new view content. The view content is loaded with XHR and
// inserted in the current page. Then a view transition occurs to
// the newly created view. The view is cached so that subsequent
// requests would not load the content again.
url: "",
// urlTarget: String
// Node id under which a new view will be created according to the
// url parameter. If not specified, The new view will be created as
// a sibling of the current view.
urlTarget: "",
// transition: String
// A type of animated transition effect. You can choose from the
// standard transition types, "slide", "fade", "flip", or from the
// extended transition types, "cover", "coverv", "dissolve",
// "reveal", "revealv", "scaleIn", "scaleOut", "slidev",
// "swirl", "zoomIn", "zoomOut". If "none" is specified, transition
// occurs immediately without animation.
transition: "",
// transitionDir: Number
// The transition direction. If 1, transition forward. If -1,
// transition backward. For example, the slide transition slides
// the view from right to left when dir == 1, and from left to
// right when dir == -1.
transitionDir: 1,
// transitionOptions: Object
// A hash object that holds transition options.
transitionOptions: null,
// callback: Function|String
// A callback function that is called when the transition has been
// finished. A function reference, or name of a function in
// context.
callback: null,
// sync: Boolean
// If true, XHR for the view content specified with the url
// parameter is performed synchronously. If false, it is done
// asynchronously and the progress indicator is displayed while
// loading the content. This parameter is effective only when the
// url parameter is used.
sync: true,
// label: String
// A label of the item. If the label is not specified, innerHTML is
// used as a label.
label: "",
// toggle: Boolean
// If true, the item acts like a toggle button.
toggle: false,
// _duration: Number
// Duration of selection, milliseconds.
_duration: 800,
inheritParams: function(){
var parent = this.getParent();
if(parent){
if(!this.transition){ this.transition = parent.transition; }
if(this.icon && parent.iconBase &&
parent.iconBase.charAt(parent.iconBase.length - 1) === '/'){
this.icon = parent.iconBase + this.icon;
}
if(!this.icon){ this.icon = parent.iconBase; }
if(!this.iconPos){ this.iconPos = parent.iconPos; }
}
},
select: function(){
// summary:
// Makes this widget in the selected state.
// description:
// Subclass must implement.
},
deselect: function(){
// summary:
// Makes this widget in the deselected state.
// description:
// Subclass must implement.
},
defaultClickAction: function(e){
if(this.toggle){
if(this.selected){
this.deselect();
}else{
this.select();
}
}else if(!this.selected){
this.select();
if(!this.selectOne){
var _this = this;
setTimeout(function(){
_this.deselect();
}, this._duration);
}
var transOpts;
if(this.moveTo || this.href || this.url || this.scene){
transOpts = {moveTo: this.moveTo, href: this.href, url: this.url, scene: this.scene, transition: this.transition, transitionDir: this.transitionDir};
}else if(this.transitionOptions){
transOpts = this.transitionOptions;
}
if(transOpts){
return new TransitionEvent(this.domNode,transOpts,e).dispatch();
}
}
},
getParent: function(){
// summary:
// Gets the parent widget.
// description:
// Almost equivalent to _Contained#getParent, but this method
// does not cause a script error even if this widget has no
// parent yet.
var ref = this.srcNodeRef || this.domNode;
return ref && ref.parentNode ? registry.getEnclosingWidget(ref.parentNode) : null;
},
setTransitionPos: function(e){
// summary:
// Stores the clicked position for later use.
// description:
// Some of the transition animations (e.g. ScaleIn) needs the
// clicked position.
var w = this;
while(true){
w = w.getParent();
if(!w || w instanceof View){ break; }
}
if(w){
w.clickedPosX = e.clientX;
w.clickedPosY = e.clientY;
}
},
transitionTo: function(moveTo, href, url, scene){
// summary:
// Performs a view transition.
// description:
// Given a transition destination, this method performs a view
// transition. This method is typically called when this item
// is clicked.
if(config.isDebug){
var alreadyCalledHash = arguments.callee._ach || (arguments.callee._ach = {}),
caller = (arguments.callee.caller || "unknown caller").toString();
if(!alreadyCalledHash[caller]){
kernel.deprecated(this.declaredClass + "::transitionTo() is deprecated." +
caller, "", "2.0");
alreadyCalledHash[caller] = true;
}
}
new TransitionEvent(this.domNode, {moveTo: moveTo, href: href, url: url, scene: scene,
transition: this.transition, transitionDir: this.transitionDir}).dispatch();
}
});
});
|
