[945] | 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 | |
---|