/**
2* coverflow
3* @author ckwanhu
4*/
5var gDataImages = new Array();
6var gDataLink = new Array();
7var gZoneImage;
8var gDragOn = 0;
9var gDragStartX = 0;
10var gTimer = new Date().getTime();
11var previousTouch = '' ;
12if ( gLatenceTouchMove == undefined ) {
13 var gLatenceTouchMove = 700;
14}
15if ( gNbZones == undefined ) {
16 var gNbZones = 3 ;
17}
18if ( BaseWidth == undefined ) {
19 var BaseWidth = 0 ;
20}
21if ( BaseHeight == undefined ) {
22 var BaseHeight = 0 ;
23}
24if ( BaseDistance == undefined ) {
25 var BaseDistance = 350 ;
26}
27if ( BaseOpacity == undefined ) {
28 var BaseOpacity = 0.9 ;
29}
30
31var gMaxImage = 50;
32for (var i = 1; i < gMaxImage; i++) {
33 try {
34 eval('gDataImages['+i+'] = gImage'+i+';') ;
35 eval('gDataLink['+i+'] = gLien'+i+';');
36 }catch (e) {
37 break ;
38 }
39}
40
41var gImgCount = gDataImages.length - 1;
42if ( gPosition == undefined ) {
43 var gPosition = Math.round((gImgCount)/2) ;
44}
45
46$(document).ready(Start);
47function Start(){
48 gZoneImage = $('.AnimZoneImage').get(0);
49 gZoneImage.addEventListener("mousedown", MacScrollStart, false);
50 gZoneImage.addEventListener("mouseup", MacScrollStart, false);
51 gZoneImage.addEventListener("mousemove", MacScrollStart, false);
52 gZoneImage.addEventListener("touchend", iPhoneScrollStart, false);
53 gZoneImage.addEventListener("touchcancel", iPhoneScrollStart, false);
54 gZoneImage.addEventListener("touchmove", iPhoneScrollStart, false);
55 gZoneImage.addEventListener("touchstart", iPhoneScrollStart, false);
56 initFrames(gImgCount) ;
57 displayZones(gNbZones) ;
58}
59function displayZones(zones) {
60 var ratio ;
61 var depth ;
62 var opacity ;
63 var dist ;
64 var step = 1 / zones ;
65 var sign ;
66 var dX ;
67 var steps = new stepper (gPosition ,zones,gImgCount) ;
68 clearDiapos() ;
69 for (var i=1 ; i < steps.position.length ; i++) {
70 id = steps.position[i] ;
71 dist = steps.distance[i] ;
72 ratio = 1 - step * dist ;
73 (Math.abs(ratio) > 1) ? ratio = Math.abs(ratio) - 1 : '' ;
74 depth = Math.floor(100*ratio) ;
75 opacity = BaseOpacity* ratio ;
76 sign = i < steps.position.length/2 ? 1 : -1 ;
77 dX = -ratio*sign*(1-ratio)*BaseDistance ;
78 placeAnimDiapo(id,ratio,depth,opacity,dX,dist) ;
79 $('#AnimDiapo'+id).get(0).addEventListener("touchend", iPhoneScrollStart, false);
80 $('#AnimDiapo'+id).get(0).addEventListener("touchcancel", iPhoneScrollStart, false);
81 }
82}
83function stepper(pos ,zones,pMax) {
84 var mid = Math.ceil(zones/2) ;
85 var oMid = mid ;
86 var iCursor = 0 ;
87 var stepping = new Object() ;
88 stepping.position = new Array() ;
89 stepping.distance = new Array() ;
90 stepping.position[mid] = pos ;
91 stepping.distance[mid] = iCursor ;
92 for ( var i = oMid-1 ; i > 0 ; i -- ) {
93 ( pos <= 1) ? pos = pMax : --pos ;
94 mid -- ;
95 iCursor ++ ;
96 stepping.position[mid] = pos ;
97 stepping.distance[mid] = iCursor ;
98 }
99 pos = stepping.position[oMid] ;
100 iCursor = 0 ;
101 mid = oMid ;
102 for ( var i = oMid+1 ; i <= zones ; i ++ ) {
103 ( pos >= pMax ) ? pos = 1 : ++pos ;
104 mid ++ ;
105 iCursor ++ ;
106 stepping.position[mid] = pos ;
107 stepping.distance[mid] = iCursor ;
108 }
109 return stepping ;
110}
111
112function initFrames(zones) {
113 var txt = "";
114 for(var i = 1; i <= zones ; i++) {
115 txt += '<div id="AnimDiapo'+ i +'" class="AnimDiapo" ><img id="AnimDiapoImage'+ i +'" src="'+gDataImages[i]+'" /></div>';
116 }
117 gZoneImage.innerHTML = txt;
118 var baseImg = new Image() ;
119 baseImg.src = gDataImages[gPosition] ;
120 var imgRatio = baseImg.width/baseImg.height ;
121 var bRef = BaseWidth + BaseHeight ;
122 if (bRef > 0) {
123 ( bRef == BaseWidth) ? BaseHeight = BaseWidth / imgRatio : BaseWidth = BaseHeight * imgRatio ;
124 } else {
125 BaseWidth = 160 ;
126 BaseHeight = BaseWidth / imgRatio ;
127 }
128}
129
130function setPosition(pos ,step ,limitInf ,limitSup) {
131 pos += step ;
132 if ( pos > limitSup ) {
133 pos = limitInf ;
134 } else if ( pos < limitInf ) {
135 pos = limitSup ;
136 }
137 return pos ;
138}
139
140function diapoUpdate(offsetX){
141 var mDate = new Date();
142 if (mDate.getTime() < gTimer) return;
143 if (offsetX < 0) gPosition = setPosition(gPosition, -1 , 1 ,gImgCount) ;
144 if (offsetX > 0) gPosition = setPosition(gPosition, 1 , 1 ,gImgCount) ;
145 displayZones(gNbZones) ;
146 gTimer = mDate.getTime() + gLatenceTouchMove ;
147}
148function MacScrollStart(e) {
149 var EventMap = {"mouseup" : "touchend", "mousedown" : "touchstart", "mousemove" : "touchmove"};
150 e.preventDefault();
151 e.stopPropagation();
152 var ToucheData = {
153 target: e.target,
154 clientX: e.clientX,
155 clientY: e.clientY,
156 pageX: e.clientX,
157 pageY: e.clientY,
158 screenX: e.screenX,
159 screenY: e.screenY
160 }
161 var touches = [];
162 touches.push(ToucheData)
163 var touchEvent = document.createEvent("MouseEvents");
164 touchEvent.initMouseEvent(
165 EventMap[e.type],
166 true,
167 true,
168 e.view,
169 e.detail,
170 e.screenX,
171 e.screenY,
172 e.clientX,
173 e.clientY,
174 e.ctrlKey,
175 e.altKey,
176 e.shiftKey,
177 e.metaKey,
178 0,
179 null
180 );
181 touchEvent.touches = touches;
182 iPhoneScrollStart(touchEvent);
183}
184function iPhoneScrollStart(e) {
185 var clicId = "";
186 if (e.type == "touchstart") {
187 for (var i = 0; i < e.touches.length; i++) {
188 gDragOn = 1;
189 gDragStartX = e.touches[i].clientX;
190 }
191 }else if (e.type == "touchend" || e.type == "touchcancel"){
192 gDragOn = 0;
193 gTimer = 0;
194 if (previousTouch == "touchstart" && e.type == "touchend") {
195 previousTouch = e.type ;
196 if (typeof(gDataLink[gPosition]) != "undefined") {
197 document.location = gDataLink[gPosition];
198 }
199 }
200 }else if (e.type == "touchmove") {
201 var OffsetX;
202 for (var i = 0; i < e.touches.length; i++) {
203 if (gDragOn == 1) {
204 OffsetX = gDragStartX - e.touches[i].clientX;
205 gDragStartX = e.touches[i].clientX;
206 diapoUpdate(OffsetX);
207 }
208 }
209 }
210 previousTouch = e.type ;
211 e.preventDefault();
212 e.stopPropagation();
213}
214function clearDiapos() {
215 for ( var id = 1 ; id <= gImgCount ; id++ ) { $('#AnimDiapo'+id).hide(); }
216}
217function placeAnimDiapo(id,ratio,depth,opacity,dX,dist){
218 var ZoneW = $('.AnimZoneImage').width() ;
219 var Width = BaseWidth * ratio;
220 var Height = BaseHeight * ratio;
221 var Left = (ZoneW/2) - (Width / 2);
222 var Top = (BaseHeight/2) - (Height/2);
223 Left += dX;
224 var AnimDiapo = '#AnimDiapo' + id;
225 try {
226 $(AnimDiapo).show();
227 $(AnimDiapo).get(0).style.left = Left +'px';
228 $(AnimDiapo).get(0).style.top = Top +'px';
229 $(AnimDiapo).css('z-index',depth);
230 $(AnimDiapo).get(0).style.width = Width + 'px';
231 $(AnimDiapo).get(0).style.height = Height + 'px';
232 $(AnimDiapo).css('opacity',opacity);
233 var AnimDiapoImage = '#AnimDiapoImage' + id;
234 $(AnimDiapoImage).get(0).style.width = Width + 'px';
235 $(AnimDiapoImage).get(0).style.height = Height + 'px';
236 } catch(e) { console.log ('ERROR !!!') ; }
237}