root / trunk / web / dojo / dojox / mobile / app / List.js
History | View | Annotate | Download (7.92 KB)
1 |
/*
|
---|---|
2 |
Copyright (c) 2004-2010, The Dojo Foundation All Rights Reserved.
|
3 |
Available via Academic Free License >= 2.1 OR the modified BSD license.
|
4 |
see: http://dojotoolkit.org/license for details
|
5 |
*/
|
6 |
|
7 |
|
8 |
if(!dojo._hasResource["dojox.mobile.app.List"]){ |
9 |
dojo._hasResource["dojox.mobile.app.List"]=true; |
10 |
dojo.provide("dojox.mobile.app.List");
|
11 |
dojo.experimental("dojox.mobile.app.List");
|
12 |
dojo.require("dojo.string");
|
13 |
dojo.require("dijit._Widget");
|
14 |
(function(){
|
15 |
var _1={};
|
16 |
dojo.declare("dojox.mobile.app.List",dijit._Widget,{items:null,itemTemplate:"",emptyTemplate:"",labelDelete:"Delete",labelCancel:"Cancel",controller:null,autoDelete:true,enableDelete:true,_templateLoadCount:0,_mouseDownPos:null,constructor:function(){ |
17 |
this._checkLoadComplete=dojo.hitch(this,this._checkLoadComplete); |
18 |
this._replaceToken=dojo.hitch(this,this._replaceToken); |
19 |
this._postDeleteAnim=dojo.hitch(this,this._postDeleteAnim); |
20 |
},postCreate:function(){ |
21 |
var _2=this; |
22 |
if(this.emptyTemplate){ |
23 |
this._templateLoadCount++;
|
24 |
} |
25 |
if(this.itemTemplate){ |
26 |
this._templateLoadCount++;
|
27 |
} |
28 |
dojo.addClass(this.domNode,"list"); |
29 |
var _3;
|
30 |
this.connect(this.domNode,"onmousedown",function(_4){ |
31 |
var _5=_4;
|
32 |
if(_4.targetTouches&&_4.targetTouches.length>0){ |
33 |
_5=_4.targetTouches[0];
|
34 |
} |
35 |
var _6=_2._getRowNode(_4.target);
|
36 |
if(_6){
|
37 |
_2._setDataInfo(_6,_4); |
38 |
_2._selectRow(_6); |
39 |
_2._mouseDownPos={x:_5.pageX,y:_5.pageY}; |
40 |
_2._dragThreshold=null;
|
41 |
}else{
|
42 |
} |
43 |
}); |
44 |
this.connect(this.domNode,"onmouseup",function(_7){ |
45 |
if(_7.targetTouches&&_7.targetTouches.length>0){ |
46 |
_7=_7.targetTouches[0];
|
47 |
} |
48 |
var _8=_2._getRowNode(_7.target);
|
49 |
if(_8){
|
50 |
_2._setDataInfo(_8,_7); |
51 |
if(_2._selectedRow){
|
52 |
_2.onSelect(_8._data,_8._idx,_8); |
53 |
} |
54 |
this._deselectRow();
|
55 |
} |
56 |
}); |
57 |
if(this.enableDelete){ |
58 |
this.connect(this.domNode,"mousemove",function(_9){ |
59 |
dojo.stopEvent(_9); |
60 |
if(!_2._selectedRow){
|
61 |
return;
|
62 |
} |
63 |
var _a=_2._getRowNode(_9.target);
|
64 |
if(_2.enableDelete&&_a&&!_2._deleting){
|
65 |
_2.handleDrag(_9); |
66 |
} |
67 |
}); |
68 |
} |
69 |
this.connect(this.domNode,"onclick",function(_b){ |
70 |
if(_b.touches&&_b.touches.length>0){ |
71 |
_b=_b.touches[0];
|
72 |
} |
73 |
var _c=_2._getRowNode(_b.target,true); |
74 |
if(_c){
|
75 |
_2._setDataInfo(_c,_b); |
76 |
} |
77 |
}); |
78 |
this.connect(this.domNode,"mouseout",function(_d){ |
79 |
if(_d.touches&&_d.touches.length>0){ |
80 |
_d=_d.touches[0];
|
81 |
} |
82 |
if(_d.target==_2._selectedRow){
|
83 |
_2._deselectRow(); |
84 |
} |
85 |
}); |
86 |
if(!this.itemTemplate){ |
87 |
throw Error("An item template must be provided to "+this.declaredClass); |
88 |
} |
89 |
this._loadTemplate(this.itemTemplate,"itemTemplate",this._checkLoadComplete); |
90 |
if(this.emptyTemplate){ |
91 |
this._loadTemplate(this.emptyTemplate,"emptyTemplate",this._checkLoadComplete); |
92 |
} |
93 |
},handleDrag:function(_e){ |
94 |
var _f=_e;
|
95 |
if(_e.targetTouches&&_e.targetTouches.length>0){ |
96 |
_f=_e.targetTouches[0];
|
97 |
} |
98 |
var _10=_f.pageX-this._mouseDownPos.x; |
99 |
var _11=Math.abs(_10);
|
100 |
if(_11>10&&!this._dragThreshold){ |
101 |
this._dragThreshold=dojo.marginBox(this._selectedRow).w*0.6; |
102 |
if(!this.autoDelete){ |
103 |
this.createDeleteButtons(this._selectedRow); |
104 |
} |
105 |
} |
106 |
this._selectedRow.style.left=(_11>10?_10:0)+"px"; |
107 |
if(this._dragThreshold&&this._dragThreshold<_11){ |
108 |
this.preDelete(_10);
|
109 |
} |
110 |
},handleDragCancel:function(){ |
111 |
if(this._deleting){ |
112 |
return;
|
113 |
} |
114 |
dojo.removeClass(this._selectedRow,"hold"); |
115 |
this._selectedRow.style.left=0; |
116 |
this._mouseDownPos=null; |
117 |
this._dragThreshold=null; |
118 |
this._deleteBtns&&dojo.style(this._deleteBtns,"display","none"); |
119 |
},preDelete:function(_12){ |
120 |
var _13=this; |
121 |
this._deleting=true; |
122 |
dojo.animateProperty({node:this._selectedRow,duration:400,properties:{left:{end:_12+((_12>0?1:-1)*this._dragThreshold*0.8)}},onEnd:dojo.hitch(this,function(){ |
123 |
if(this.autoDelete){ |
124 |
this.deleteRow(this._selectedRow); |
125 |
} |
126 |
})}).play(); |
127 |
},deleteRow:function(row){ |
128 |
dojo.style(row,{visibility:"hidden",minHeight:"0px"}); |
129 |
dojo.removeClass(row,"hold");
|
130 |
this._deleteAnimConn=this.connect(row,"webkitAnimationEnd",this._postDeleteAnim); |
131 |
dojo.addClass(row,"collapsed");
|
132 |
},_postDeleteAnim:function(_14){ |
133 |
if(this._deleteAnimConn){ |
134 |
this.disconnect(this._deleteAnimConn); |
135 |
this._deleteAnimConn=null; |
136 |
} |
137 |
var row=this._selectedRow; |
138 |
var _15=row.nextSibling;
|
139 |
row.parentNode.removeChild(row); |
140 |
this.onDelete(row._data,row._idx,this.items); |
141 |
while(_15){
|
142 |
if(_15._idx){
|
143 |
_15._idx--; |
144 |
} |
145 |
_15=_15.nextSibling; |
146 |
} |
147 |
dojo.destroy(row); |
148 |
dojo.query("> *:not(.buttons)",this.domNode).forEach(this.applyClass); |
149 |
this._deleting=false; |
150 |
this._deselectRow();
|
151 |
},createDeleteButtons:function(_16){ |
152 |
var mb=dojo.marginBox(_16);
|
153 |
var pos=dojo._abs(_16,true); |
154 |
if(!this._deleteBtns){ |
155 |
this._deleteBtns=dojo.create("div",{"class":"buttons"},this.domNode); |
156 |
this.buttons=[];
|
157 |
this.buttons.push(new dojox.mobile.Button({btnClass:"mblRedButton",label:this.labelDelete})); |
158 |
this.buttons.push(new dojox.mobile.Button({btnClass:"mblBlueButton",label:this.labelCancel})); |
159 |
dojo.place(this.buttons[0].domNode,this._deleteBtns); |
160 |
dojo.place(this.buttons[1].domNode,this._deleteBtns); |
161 |
dojo.addClass(this.buttons[0].domNode,"deleteBtn"); |
162 |
dojo.addClass(this.buttons[1].domNode,"cancelBtn"); |
163 |
this._handleButtonClick=dojo.hitch(this._handleButtonClick); |
164 |
this.connect(this._deleteBtns,"onclick",this._handleButtonClick); |
165 |
} |
166 |
dojo.removeClass(this._deleteBtns,"fade out fast"); |
167 |
dojo.style(this._deleteBtns,{display:"",width:mb.w+"px",height:mb.h+"px",top:(_16.offsetTop)+"px",left:"0px"}); |
168 |
},onDelete:function(_17,_18,_19){ |
169 |
_19.splice(_18,1);
|
170 |
if(_19.length<1){ |
171 |
this.render();
|
172 |
} |
173 |
},cancelDelete:function(){ |
174 |
this._deleting=false; |
175 |
this.handleDragCancel();
|
176 |
},_handleButtonClick:function(_1a){ |
177 |
if(_1a.touches&&_1a.touches.length>0){ |
178 |
_1a=_1a.touches[0];
|
179 |
} |
180 |
var _1b=_1a.target;
|
181 |
if(dojo.hasClass(_1b,"deleteBtn")){ |
182 |
this.deleteRow(this._selectedRow); |
183 |
}else{
|
184 |
if(dojo.hasClass(_1b,"cancelBtn")){ |
185 |
this.cancelDelete();
|
186 |
}else{
|
187 |
return;
|
188 |
} |
189 |
} |
190 |
dojo.addClass(this._deleteBtns,"fade out"); |
191 |
},applyClass:function(_1c,idx,_1d){ |
192 |
dojo.removeClass(_1c,"first last");
|
193 |
if(idx==0){ |
194 |
dojo.addClass(_1c,"first");
|
195 |
} |
196 |
if(idx==_1d.length-1){ |
197 |
dojo.addClass(_1c,"last");
|
198 |
} |
199 |
},_setDataInfo:function(_1e,_1f){ |
200 |
_1f.item=_1e._data; |
201 |
_1f.index=_1e._idx; |
202 |
},onSelect:function(_20,_21,_22){ |
203 |
},_selectRow:function(row){ |
204 |
if(this._deleting&&this._selectedRow&&row!=this._selectedRow){ |
205 |
this.cancelDelete();
|
206 |
} |
207 |
if(!dojo.hasClass(row,"row")){ |
208 |
return;
|
209 |
} |
210 |
dojo.addClass(row,"hold");
|
211 |
this._selectedRow=row;
|
212 |
},_deselectRow:function(){ |
213 |
if(!this._selectedRow||this._deleting){ |
214 |
return;
|
215 |
} |
216 |
this.handleDragCancel();
|
217 |
dojo.removeClass(this._selectedRow,"hold"); |
218 |
this._selectedRow=null; |
219 |
},_getRowNode:function(_23,_24){ |
220 |
while(_23&&!_23._data&&_23!=this.domNode){ |
221 |
if(!_24&&dojo.hasClass(_23,"noclick")){ |
222 |
return null; |
223 |
} |
224 |
_23=_23.parentNode; |
225 |
} |
226 |
return _23;
|
227 |
},render:function(){ |
228 |
dojo.query("> *:not(.buttons)",this.domNode).forEach(dojo.destroy); |
229 |
var _25=[];
|
230 |
var row,i;
|
231 |
dojo.addClass(this.domNode,"list"); |
232 |
for(i=0;i<this.items.length;i++){ |
233 |
row=dojo._toDom(dojo.string.substitute(this.itemTemplate,this.items[i],this._replaceToken,this)); |
234 |
_25.push(row); |
235 |
} |
236 |
for(i=0;i<this.items.length;i++){ |
237 |
_25[i]._data=this.items[i];
|
238 |
_25[i]._idx=i; |
239 |
this.domNode.appendChild(_25[i]);
|
240 |
} |
241 |
if(this.items.length<1&&this.emptyTemplate){ |
242 |
dojo.place(dojo._toDom(this.emptyTemplate),this.domNode,"first"); |
243 |
} |
244 |
if(dojo.hasClass(this.domNode.parentNode,"mblRoundRect")){ |
245 |
dojo.addClass(this.domNode.parentNode,"mblRoundRectList"); |
246 |
} |
247 |
var _26=dojo.query("> div:not(.buttons)",this.domNode); |
248 |
_26.addClass("row");
|
249 |
if(_26.length>0){ |
250 |
dojo.addClass(_26[0],"first"); |
251 |
dojo.addClass(_26[_26.length-1],"last"); |
252 |
} |
253 |
},_replaceToken:function(_27,key){ |
254 |
if(key.charAt(0)=="!"){ |
255 |
_27=dojo.getObject(key.substr(1),false,_this); |
256 |
} |
257 |
if(typeof _27=="undefined"){ |
258 |
return ""; |
259 |
} |
260 |
if(_27==null){ |
261 |
return ""; |
262 |
} |
263 |
return key.charAt(0)=="!"?_27:_27.toString().replace(/"/g,"""); |
264 |
},_checkLoadComplete:function(){ |
265 |
this._templateLoadCount--;
|
266 |
if(this._templateLoadCount<1&&this.get("items")){ |
267 |
this.render();
|
268 |
} |
269 |
},_loadTemplate:function(url,_28,_29){ |
270 |
if(!url){
|
271 |
_29(); |
272 |
return;
|
273 |
} |
274 |
if(_1[url]){
|
275 |
this.set(_28,_1[url]);
|
276 |
_29(); |
277 |
}else{
|
278 |
var _2a=this; |
279 |
dojo.xhrGet({url:url,sync:false,handleAs:"text",load:function(_2b){ |
280 |
_1[url]=dojo.trim(_2b); |
281 |
_2a.set(_28,_1[url]); |
282 |
_29(); |
283 |
}}); |
284 |
} |
285 |
},_setItemsAttr:function(_2c){ |
286 |
this.items=_2c||[];
|
287 |
if(this._templateLoadCount<1&&_2c){ |
288 |
this.render();
|
289 |
} |
290 |
},destroy:function(){ |
291 |
if(this.buttons){ |
292 |
dojo.forEach(this.buttons,function(_2d){ |
293 |
_2d.destroy(); |
294 |
}); |
295 |
this.buttons=null; |
296 |
} |
297 |
this.inherited(arguments); |
298 |
}}); |
299 |
})(); |
300 |
} |