1 | //************************************************************************** |
---|
2 | |
---|
3 | //=== THE CODE STARTS HERE - no need to change anything below === |
---|
4 | |
---|
5 | //=== global variables ==== |
---|
6 | theImages = new Array(); //holds the images |
---|
7 | imageNum = new Array(); //keeps track of which images to omit from loop |
---|
8 | normal_delay = 200; |
---|
9 | delay = normal_delay; //delay between frames in 1/100 seconds |
---|
10 | delay_step = 20; |
---|
11 | delay_max = 2000; |
---|
12 | delay_min = 20; |
---|
13 | dwell_multipler = 3; |
---|
14 | dwell_step = 1; |
---|
15 | end_dwell_multipler = dwell_multipler; |
---|
16 | start_dwell_multipler = dwell_multipler; |
---|
17 | current_image = first_image; //number of the current image |
---|
18 | timeID = null; |
---|
19 | status = 0; // 0-stopped, 1-playing |
---|
20 | play_mode = 0; // 0-normal, 1-loop, 2-sweep |
---|
21 | size_valid = 0; |
---|
22 | |
---|
23 | //===> Make sure the first image number is not bigger than the last image number |
---|
24 | if (first_image > last_image) |
---|
25 | { |
---|
26 | var help = last_image; |
---|
27 | last_image = first_image; |
---|
28 | first_image = help; |
---|
29 | } |
---|
30 | |
---|
31 | //===> Preload the first image (while page is downloading) |
---|
32 | theImages[0] = new Image(); |
---|
33 | theImages[0].src = modImages[0]; |
---|
34 | imageNum[0] = true; |
---|
35 | |
---|
36 | //============================================================== |
---|
37 | //== All previous statements are performed as the page loads. == |
---|
38 | //== The following functions are also defined at this time. == |
---|
39 | //============================================================== |
---|
40 | |
---|
41 | //===> Stop the animation |
---|
42 | function stop() |
---|
43 | { |
---|
44 | //== cancel animation (timeID holds the expression which calls the fwd or bkwd function) == |
---|
45 | if (status == 1) |
---|
46 | clearTimeout (timeID); |
---|
47 | status = 0; |
---|
48 | } |
---|
49 | |
---|
50 | |
---|
51 | //===> Display animation in fwd direction in either loop or sweep mode |
---|
52 | function animate_fwd() |
---|
53 | { |
---|
54 | current_image++; //increment image number |
---|
55 | |
---|
56 | //== check if current image has exceeded loop bound == |
---|
57 | if (current_image > last_image) { |
---|
58 | if (play_mode == 1) { //fwd loop mode - skip to first image |
---|
59 | current_image = first_image; |
---|
60 | } |
---|
61 | if (play_mode == 2) { //sweep mode - change directions (go bkwd) |
---|
62 | current_image = last_image; |
---|
63 | animate_rev(); |
---|
64 | return; |
---|
65 | } |
---|
66 | } |
---|
67 | |
---|
68 | //== check to ensure that current image has not been deselected from the loop == |
---|
69 | //== if it has, then find the next image that hasn't been == |
---|
70 | while (imageNum[current_image-first_image] == false) { |
---|
71 | current_image++; |
---|
72 | if (current_image > last_image) { |
---|
73 | if (play_mode == 1) |
---|
74 | current_image = first_image; |
---|
75 | if (play_mode == 2) { |
---|
76 | current_image = last_image; |
---|
77 | animate_rev(); |
---|
78 | return; |
---|
79 | } |
---|
80 | } |
---|
81 | } |
---|
82 | |
---|
83 | document.animation.src = theImages[current_image-first_image].src; //display image onto screen |
---|
84 | document.control_form.frame_nr.value = current_image; //display image number |
---|
85 | |
---|
86 | delay_time = delay; |
---|
87 | if ( current_image == first_image) delay_time = start_dwell_multipler*delay; |
---|
88 | if (current_image == last_image) delay_time = end_dwell_multipler*delay; |
---|
89 | |
---|
90 | //== call "animate_fwd()" again after a set time (delay_time) has elapsed == |
---|
91 | timeID = setTimeout("animate_fwd()", delay_time); |
---|
92 | } |
---|
93 | |
---|
94 | |
---|
95 | //===> Display animation in reverse direction |
---|
96 | function animate_rev() |
---|
97 | { |
---|
98 | current_image--; //decrement image number |
---|
99 | |
---|
100 | //== check if image number is before lower loop bound == |
---|
101 | if (current_image < first_image) { |
---|
102 | if (play_mode == 1) { //rev loop mode - skip to last image |
---|
103 | current_image = last_image; |
---|
104 | } |
---|
105 | if (play_mode == 2) { |
---|
106 | current_image = first_image; //sweep mode - change directions (go fwd) |
---|
107 | animate_fwd(); |
---|
108 | return; |
---|
109 | } |
---|
110 | } |
---|
111 | |
---|
112 | //== check to ensure that current image has not been deselected from the loop == |
---|
113 | //== if it has, then find the next image that hasn't been == |
---|
114 | while (imageNum[current_image-first_image] == false) { |
---|
115 | current_image--; |
---|
116 | if (current_image < first_image) { |
---|
117 | if (play_mode == 1) |
---|
118 | current_image = last_image; |
---|
119 | if (play_mode == 2) { |
---|
120 | current_image = first_image; |
---|
121 | animate_fwd(); |
---|
122 | return; |
---|
123 | } |
---|
124 | } |
---|
125 | } |
---|
126 | |
---|
127 | document.animation.src = theImages[current_image-first_image].src; //display image onto screen |
---|
128 | document.control_form.frame_nr.value = current_image; //display image number |
---|
129 | |
---|
130 | delay_time = delay; |
---|
131 | if ( current_image == first_image) delay_time = start_dwell_multipler*delay; |
---|
132 | if (current_image == last_image) delay_time = end_dwell_multipler*delay; |
---|
133 | |
---|
134 | //== call "animate_rev()" again after a set amount of time (delay_time) has elapsed == |
---|
135 | timeID = setTimeout("animate_rev()", delay_time); |
---|
136 | } |
---|
137 | |
---|
138 | |
---|
139 | //===> Changes playing speed by adding to or substracting from the delay between frames |
---|
140 | function change_speed(dv) |
---|
141 | { |
---|
142 | delay+=dv; |
---|
143 | //== check to ensure max and min delay constraints have not been crossed == |
---|
144 | if(delay > delay_max) delay = delay_max; |
---|
145 | if(delay < delay_min) delay = delay_min; |
---|
146 | } |
---|
147 | |
---|
148 | //===> functions that changed the dwell rates. |
---|
149 | function change_end_dwell(dv) { |
---|
150 | end_dwell_multipler+=dv; |
---|
151 | if ( end_dwell_multipler < 1 ) end_dwell_multipler = 0; |
---|
152 | } |
---|
153 | |
---|
154 | function change_start_dwell(dv) { |
---|
155 | start_dwell_multipler+=dv; |
---|
156 | if ( start_dwell_multipler < 1 ) start_dwell_multipler = 0; |
---|
157 | } |
---|
158 | |
---|
159 | //===> Increment to next image |
---|
160 | function incrementImage(number) |
---|
161 | { |
---|
162 | stop(); |
---|
163 | |
---|
164 | //== if image is last in loop, increment to first image == |
---|
165 | if (number > last_image) number = first_image; |
---|
166 | |
---|
167 | //== check to ensure that image has not been deselected from loop == |
---|
168 | while (imageNum[number-first_image] == false) { |
---|
169 | number++; |
---|
170 | if (number > last_image) number = first_image; |
---|
171 | } |
---|
172 | |
---|
173 | current_image = number; |
---|
174 | document.animation.src = theImages[current_image-first_image].src; //display image |
---|
175 | document.control_form.frame_nr.value = current_image; //display image number |
---|
176 | } |
---|
177 | |
---|
178 | //===> Decrement to next image |
---|
179 | function decrementImage(number) |
---|
180 | { |
---|
181 | stop(); |
---|
182 | |
---|
183 | //== if image is first in loop, decrement to last image == |
---|
184 | if (number < first_image) number = last_image; |
---|
185 | |
---|
186 | //== check to ensure that image has not been deselected from loop == |
---|
187 | while (imageNum[number-first_image] == false) { |
---|
188 | number--; |
---|
189 | if (number < first_image) number = last_image; |
---|
190 | } |
---|
191 | |
---|
192 | current_image = number; |
---|
193 | document.animation.src = theImages[current_image-first_image].src; //display image |
---|
194 | document.control_form.frame_nr.value = current_image; //display image number |
---|
195 | } |
---|
196 | |
---|
197 | //===> "Play forward" |
---|
198 | function fwd() |
---|
199 | { |
---|
200 | stop(); |
---|
201 | status = 1; |
---|
202 | play_mode = 1; |
---|
203 | animate_fwd(); |
---|
204 | } |
---|
205 | |
---|
206 | //===> "Play reverse" |
---|
207 | function rev() |
---|
208 | { |
---|
209 | stop(); |
---|
210 | status = 1; |
---|
211 | play_mode = 1; |
---|
212 | animate_rev(); |
---|
213 | } |
---|
214 | |
---|
215 | //===> "play sweep" |
---|
216 | function sweep() { |
---|
217 | stop(); |
---|
218 | status = 1; |
---|
219 | play_mode = 2; |
---|
220 | animate_fwd(); |
---|
221 | } |
---|
222 | |
---|
223 | //===> Change play mode (normal, loop, swing) |
---|
224 | function change_mode(mode) |
---|
225 | { |
---|
226 | play_mode = mode; |
---|
227 | } |
---|
228 | |
---|
229 | //===> Load and initialize everything once page is downloaded (called from 'onLoad' in <BODY>) |
---|
230 | function launch() |
---|
231 | { |
---|
232 | for (var i = first_image + 1; i <= last_image; i++) |
---|
233 | { |
---|
234 | theImages[i-first_image] = new Image(); |
---|
235 | theImages[i-first_image].src = modImages[i-first_image]; |
---|
236 | imageNum[i-first_image] = true; |
---|
237 | document.animation.src = theImages[i-first_image].src; |
---|
238 | document.control_form.frame_nr.value = i; |
---|
239 | } |
---|
240 | |
---|
241 | // this needs to be done to set the right mode when the page is manually reloaded |
---|
242 | change_mode (1); |
---|
243 | fwd(); |
---|
244 | } |
---|
245 | |
---|
246 | //===> Check selection status of image in animation loop |
---|
247 | function checkImage(status,i) |
---|
248 | { |
---|
249 | if (status == true) |
---|
250 | imageNum[i] = false; |
---|
251 | else imageNum[i] = true; |
---|
252 | } |
---|
253 | |
---|
254 | //==> Empty function - used to deal with image buttons rather than HTML buttons |
---|
255 | function func() |
---|
256 | { |
---|
257 | } |
---|
258 | |
---|
259 | //===> Sets up interface - this is the one function called from the HTML body |
---|
260 | function animation() |
---|
261 | { |
---|
262 | count = first_image; |
---|
263 | } |
---|
264 | |
---|
265 | // --> |
---|
266 | |
---|
267 | function MM_jumpMenu(targ,selObj,restore){ //v3.0 |
---|
268 | eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); |
---|
269 | if (restore) selObj.selectedIndex=0; |
---|
270 | } |
---|
271 | //--> |
---|
272 | </SCRIPT> |
---|
273 | |
---|
274 | <link href="animate_styles.css" rel="stylesheet" type="text/css"> |
---|
275 | </head> |
---|
276 | |
---|
277 | <body bgcolor="#FFFFFF" onLoad="launch()"> |
---|
278 | |
---|
279 | |
---|
280 | |
---|
281 | <table border=1 align=center cellpadding=3 cellspacing=0 id="frame"> |
---|
282 | |
---|
283 | <tr> |
---|
284 | |
---|
285 | <td valign="top" id="leftnav"> |
---|
286 | |
---|
287 | <!-- |
---|
288 | |
---|
289 | <h1>Frame Controls</h1> |
---|
290 | <p>Choose another forecast:</p> |
---|
291 | |
---|
292 | <form name="form1" method="post" action=""> |
---|
293 | <p> |
---|
294 | <select name="menu1" onChange="MM_jumpMenu('parent',this,1)"> |
---|
295 | |
---|
296 | <option value="none.html" selected> </option> |
---|
297 | <option value="none.html"> </option> |
---|
298 | |
---|
299 | </select> |
---|
300 | </p> |
---|
301 | </form> |
---|
302 | |
---|
303 | --!> |
---|
304 | |
---|
305 | Results from LMD meteorological models.<br> |
---|
306 | All rights reserved. Copy forbidden.<br> |
---|
307 | Contact us for external use (site, publication)<br> |
---|
308 | |
---|
309 | Plots made with Python [EPD distribution]<br> |
---|
310 | |
---|
311 | <p>Play Mode:<br><br> |
---|
312 | <a href="JavaScript: func()" onClick="change_mode(1);rev()"> |
---|
313 | <img border=0 hspace=0 vspace=0 width=29 height=24 src="http://www.lmd.jussieu.fr/~aslmd/images/button_rev.png" alt="+1"></a> |
---|
314 | <a href="JavaScript: func()" onClick="stop()"> |
---|
315 | <img border=0 hspace=0 vspace=0 width=29 height=24 src="http://www.lmd.jussieu.fr/~aslmd/images/button_stop.png" alt="+1"></a> |
---|
316 | |
---|
317 | <a href="JavaScript: func()" onClick="change_mode(1);fwd()"> |
---|
318 | <img border=0 hspace=0 vspace=0 width=29 height=24 src="http://www.lmd.jussieu.fr/~aslmd/images/button_fwd.png" alt="+1"></a> |
---|
319 | </p> |
---|
320 | |
---|
321 | <p>Adjust Speed:<br><br> |
---|
322 | <a href="JavaScript: func()" onClick="change_speed(delay_step)"> |
---|
323 | <img border=0 hspace=0 vspace=0 width=29 height=24 src="http://www.lmd.jussieu.fr/~aslmd/images/button_slow.png" alt="+1"></a> |
---|
324 | <a href="JavaScript: func()" onClick="change_speed(-delay_step)"> |
---|
325 | <img border=0 hspace=0 vspace=0 width=29 height=24 src="http://www.lmd.jussieu.fr/~aslmd/images/button_fast.png" alt="+1"></a> |
---|
326 | |
---|
327 | </p> |
---|
328 | |
---|
329 | |
---|
330 | <p>Advance One Frame:<br><br> |
---|
331 | <a href="JavaScript: func()" onClick="decrementImage(--current_image)"> |
---|
332 | <img border=0 hspace=0 vspace=0 width=29 height=24 src="http://www.lmd.jussieu.fr/~aslmd/images/button_rev1.png" alt="+1"></a> |
---|
333 | <a href="JavaScript: func()" onClick="incrementImage(++current_image)"> |
---|
334 | <img border=0 hspace=0 vspace=0 width=29 height=24 src="http://www.lmd.jussieu.fr/~aslmd/images/button_fwd1.png" alt="+1"></a> |
---|
335 | </p> |
---|
336 | |
---|
337 | |
---|
338 | <form method="post" name="control_form"> |
---|
339 | |
---|
340 | <p>Frame No:</p> |
---|
341 | <p> |
---|
342 | <input type="text" name="frame_nr" value="9" size="2" onFocus="this.select()" onChange="go2image(this.value)"></input> |
---|
343 | <br />   <br /> |
---|
344 | </p> |
---|
345 | |
---|
346 | </form> |
---|
347 | <p> |
---|
348 | <A HREF="http://www-mars.lmd.jussieu.fr/mars/publi/jgr99_gcm.pdf">About LMD Mars Global Circulation Model</A></a><br /><br /> |
---|
349 | <A HREF="http://dl.dropbox.com/u/11078310/my_papers/spiga_jgr_SF09.pdf">About LMD Mars Mesoscale Model</A></a><br /><br /> |
---|
350 | <A HREF="http://www-mars.lmd.jussieu.fr">About the Mars Climate Database</A></a><br /><br /> |
---|
351 | </p> |
---|
352 | </td> |
---|
353 | |
---|
354 | <td valign="top" id="content"> |
---|
355 | <!-- |
---|
356 | <h1>LMD Planetary Atmospheres Team</h1> |
---|
357 | --> |
---|
358 | |
---|
359 | |
---|
360 | <!--<p><img WIDTH="525" name="animation" border="0" src="images/loading.gif" ALT="model image">--!> |
---|
361 | <p><img WIDTH="600" name="animation" border="0" src="images/loading.gif" ALT="model image"> |
---|
362 | </p> |
---|
363 | </tr> |
---|
364 | </table> |
---|
365 | |
---|
366 | |
---|
367 | </body> |
---|
368 | </html> |
---|
369 | |
---|