Project

General

Profile

Statistics
| Revision:

root / trunk / web / dojo / dojox / mobile / app / ImageThumbView.js @ 10

History | View | Annotate | Download (4.04 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.ImageThumbView"]){
9
dojo._hasResource["dojox.mobile.app.ImageThumbView"]=true;
10
dojo.provide("dojox.mobile.app.ImageThumbView");
11
dojo.experimental("dojox.mobile.app.ImageThumbView");
12
dojo.require("dijit._Widget");
13
dojo.require("dojo.string");
14
dojo.declare("dojox.mobile.app.ImageThumbView",dijit._Widget,{items:null,urlParam:"url",itemTemplate:"<div class=\"mblThumbInner\">"+"<div class=\"mblThumbOverlay\"></div>"+"<div class=\"mblThumbMask\">"+"<div class=\"mblThumbSrc\" style=\"background-image:url(${url})\"></div>"+"</div>"+"</div>",minPadding:5,maxPerRow:3,baseClass:"mblImageThumbView",selectedIndex:-1,cache:null,postCreate:function(){
15
this.inherited(arguments);
16
var _1=this;
17
var _2="mblThumbHover";
18
this.addThumb=dojo.hitch(this,this.addThumb);
19
this.handleImgLoad=dojo.hitch(this,this.handleImgLoad);
20
this._onLoadImages={};
21
this.cache=[];
22
this.visibleImages=[];
23
this.connect(this.domNode,"onclick",function(_3){
24
var _4=_1._getItemNodeFromEvent(_3);
25
if(_4){
26
_1.onSelect(_4._item,_4._index,_1.items);
27
dojo.query(".selected",this.domNode).removeClass("selected");
28
dojo.addClass(_4,"selected");
29
}
30
});
31
this.resize();
32
this.render();
33
},onSelect:function(_5,_6,_7){
34
},_setItemsAttr:function(_8){
35
this.items=_8||[];
36
this.render();
37
},_getItemNode:function(_9){
38
while(_9&&!dojo.hasClass(_9,"mblThumb")&&_9!=this.domNode){
39
_9=_9.parentNode;
40
}
41
return (_9==this.domNode)?null:_9;
42
},_getItemNodeFromEvent:function(_a){
43
if(_a.touches&&_a.touches.length>0){
44
_a=_a.touches[0];
45
}
46
return this._getItemNode(_a.target);
47
},resize:function(){
48
this._thumbSize=null;
49
this._size=dojo.marginBox(this.domNode);
50
this.render();
51
},render:function(){
52
var i;
53
var _b;
54
var _c;
55
var _d;
56
while(this.visibleImages.length>0){
57
_d=this.visibleImages.pop();
58
this.cache.push(_d);
59
dojo.addClass(_d,"hidden");
60
_d._cached=true;
61
}
62
if(!this.items||this.items.length==0){
63
return;
64
}
65
for(i=0;i<this.items.length;i++){
66
_c=this.items[i];
67
_b=(dojo.isString(_c)?_c:_c[this.urlParam]);
68
this.addThumb(_c,_b,i);
69
}
70
if(!this._thumbSize){
71
return;
72
}
73
var _e=0;
74
var _f=-1;
75
var _10=this._thumbSize.w+(this.padding*2);
76
var _11=this._thumbSize.h+(this.padding*2);
77
var _12=this.thumbNodes=dojo.query(".mblThumb",this.domNode);
78
var pos=0;
79
for(i=0;i<_12.length;i++){
80
if(_12[i]._cached){
81
continue;
82
}
83
if(pos%this.maxPerRow==0){
84
_f++;
85
}
86
_e=pos%this.maxPerRow;
87
this.place(_12[i],(_e*_10)+this.padding,(_f*_11)+this.padding);
88
if(!_12[i]._loading){
89
dojo.removeClass(_12[i],"hidden");
90
}
91
if(pos==this.selectedIndex){
92
dojo[pos==this.selectedIndex?"addClass":"removeClass"](_12[i],"selected");
93
}
94
pos++;
95
}
96
var _13=Math.ceil(pos/this.maxPerRow);
97
if(this._numRows!=_13){
98
this._numRows=_13;
99
dojo.style(this.domNode,"height",(_13*(this._thumbSize.h+this.padding*2))+"px");
100
}
101
},addThumb:function(_14,url,_15){
102
var _16;
103
if(this.cache.length>0){
104
_16=this.cache.pop();
105
}else{
106
_16=dojo.create("div",{"class":"mblThumb hidden",innerHTML:dojo.string.substitute(this.itemTemplate,{url:url},null,this)},this.domNode);
107
}
108
dojo.addClass(_16,"hidden");
109
var _17=dojo.create("img",{});
110
_17._thumbDiv=_16;
111
_17._conn=dojo.connect(_17,"onload",this.handleImgLoad);
112
_17._url=url;
113
_16._loading=true;
114
this._onLoadImages[url]=_17;
115
_17.src=url;
116
this.visibleImages.push(_16);
117
_16._index=_15;
118
_16._item=_14;
119
_16._url=url;
120
_16._cached=false;
121
if(!this._thumbSize){
122
this._thumbSize=dojo.marginBox(_16);
123
this.calcPadding();
124
}
125
},handleImgLoad:function(_18){
126
var img=_18.target;
127
dojo.disconnect(img._conn);
128
dojo.removeClass(img._thumbDiv,"hidden");
129
img._thumbDiv._loading=false;
130
dojo.query(".mblThumbSrc",img._thumbDiv).style("backgroundImage","url("+img._url+")");
131
delete this._onLoadImages[img._url];
132
},calcPadding:function(){
133
var _19=this._size.w;
134
var _1a=this._thumbSize.w;
135
var _1b=_1a+this.minPadding;
136
this.maxPerRow=Math.floor(_19/_1b);
137
this.padding=(_19-(_1a*this.maxPerRow))/(this.maxPerRow*2);
138
},place:function(_1c,x,y){
139
dojo.style(_1c,{"-webkit-transform":"translate("+x+"px,"+y+"px)"});
140
}});
141
}