git.zarb.org Git - booh/blob - data/booh/themes/sbs/root/booh.js

   1 var images_ary = new Array();
   2 var images_loaded = new Array();
   3 var current = 0;
   4 var slideshow = 0;
   5 var slideshow_pause = null;
   6 var slideshow_timer = null;
   7
   8 for (i = 0; i < images.length; i++) {
   9     /* this array will contain 0 if image not yet loaded, 1 when loading,
  10      * 2 when complete */
  11     images_loaded[i] = 0;
  12 }
  13
  14 function dbg(t) {
  15     document.getElementById('dbg_text').innerHTML += t + "\n";
  16 }
  17
  18 /* load image, return 1 if image is finished loading */
  19 function load(i) {
  20     if (images_loaded[i] == 0) {
  21         images_ary[i] = new Image();
  22         images_ary[i].src = images[i];
  23         images_loaded[i] = 1;
  24     }
  25     if (images_loaded[i] == 1) {
  26         if (images_ary[i].complete) {
  27             images_loaded[i] = 2;
  28         } else {
  29             return 0;
  30         }
  31     }
  32     return 1;
  33 }
  34
  35 function getparam(key) {
  36     all_params = location.href.split("#")
  37     if (all_params.length > 1) {
  38         params = all_params[1].split("&");
  39         for (i = 0; i < params.length; i++) {
  40             keyvalue = params[i].split("=");
  41             if (keyvalue[0] == key) {
  42                 return keyvalue[1];
  43             }
  44         }
  45     }
  46     return null;
  47 }
  48
  49 function loadcurrent(img) {
  50     for (i = 0; i < images.length; i++) {
  51         if (images[i] == img) {
  52             current = i;
  53             display_current();
  54             return;
  55         }
  56     }
  57     current = 0;
  58     display_current();
  59 }
  60
  61 function browser_href() {
  62     all = location.href.split("/");
  63     return all[all.length - 1];
  64 }
  65
  66 /* check URL for changes; allows the URL to reflect currently showed image */
  67 var currentURL = '';
  68 function checkURL() {
  69     if (currentURL == 'ignore1') {
  70         // do nothing
  71     } else if (currentURL == 'ignore2') {
  72         currentURL = browser_href();
  73     } else {
  74         href = browser_href();
  75         if (href != currentURL) {
  76             currentURL = href;
  77             img = getparam('current');
  78             loadcurrent(img);
  79         }
  80     }
  81     setTimeout("checkURL()", 50);
  82 }
  83
  84 function preload() {
  85
  86     /* favor current image, if user clicked on `last' or something */
  87     load(current);
  88
  89     /* don't blindly preload all images at the beginning,
  90      * but rather load them one by one, in order to get
  91      * next ones faster, beginning with next to current
  92      */
  93     if (current + 1 < images.length && load(current + 1) == 0) {
  94         setTimeout("preload()", 50);
  95         return;
  96     }
  97     if (current - 1 >= 0 && load(current - 1) == 0) {
  98         setTimeout("preload()", 50);
  99         return;
 100     }
 101
 102     for (i = current + 2; i < images.length && i <= current + 5; i++) {
 103         if (load(i) == 0) {
 104             setTimeout("preload()", 50);
 105             return;
 106         }
 107     }
 108     for (i = current - 2; i >= current - 3; i--) {
 109         if (i >= 0) {
 110             if (load(i) == 0) {
 111                 setTimeout("preload()", 50);
 112                 return;
 113             }
 114         }
 115     }
 116
 117     setTimeout("preload()", 50);
 118 }
 119
 120 function add_cookie(val) {
 121     var expires = new Date(new Date().getTime() + (30 * 86400000));  // 30 days
 122     document.cookie = val
 123                       + '; expires=' + expires.toGMTString()
 124                       + '; path=/';
 125 }
 126
 127 function get_cookie(key) {
 128     if (document.cookie) {
 129         var index = document.cookie.indexOf(key);
 130         if (index != -1) {
 131             var oleft = (document.cookie.indexOf('=', index) + 1);
 132             var oright = document.cookie.indexOf(';', index);
 133             if (oright == -1) {
 134                 oright = document.cookie.length;
 135             }
 136             return document.cookie.substring(oleft, oright);
 137         }
 138     }
 139     return null;
 140 }
 141
 142 function init() {
 143
 144     preferred_pause = get_cookie('booh-slideshow-pause-' + dbltilda_theme);
 145     if (preferred_pause != null) {
 146         document.getElementById('secs').value = preferred_pause;
 147     }
 148
 149     if (getparam('run_slideshow')) {
 150         toggle_slideshow();
 151     }
 152
 153     checkURL();
 154
 155     preload();
 156
 157     if (images.length == 1) {
 158         document.getElementById("b_slideshow").disabled = true;
 159         document.getElementById("b_slideshow").setAttribute("class", "disabled");
 160     }
 161
 162     if (navigator.userAgent.indexOf('Opera') == -1) {
 163         document.onkeydown = keyDownEvent;
 164     }
 165 }
 166
 167 function update_sensibilities() {
 168     if (current == 0) {
 169         // prevent focus to stay on disabled buttons - then keyboard navigation won't work
 170         document.getElementById('thumbnails').focus();
 171         document.getElementById("b_first").disabled = true;
 172         document.getElementById("b_previous").disabled = true;
 173         document.getElementById("b_first").setAttribute("class", "disabled");
 174         document.getElementById("b_previous").setAttribute("class", "disabled");
 175     } else {
 176         document.getElementById("b_first").disabled = false;
 177         document.getElementById("b_previous").disabled = false;
 178         document.getElementById("b_first").removeAttribute("class");
 179         document.getElementById("b_previous").removeAttribute("class");
 180     }
 181
 182     if (current == images.length - 1) {
 183         // prevent focus to stay on disabled buttons - then keyboard navigation won't work
 184         document.getElementById('thumbnails').focus();
 185         document.getElementById("b_next").disabled = true;
 186         document.getElementById("b_last").disabled = true;
 187         document.getElementById("b_next").setAttribute("class", "disabled");
 188         document.getElementById("b_last").setAttribute("class", "disabled");
 189     } else {
 190         document.getElementById("b_next").disabled = false;
 191         document.getElementById("b_last").disabled = false;
 192         document.getElementById("b_next").removeAttribute("class");
 193         document.getElementById("b_last").removeAttribute("class");
 194     }
 195 }
 196
 197 function set_cursor_(value, element) {
 198
 199     if (!element || !element.style) {
 200         return;
 201     }
 202
 203     element.style.cursor = value;
 204
 205     children = element.childNodes;
 206     for (i = 0; i < children.length; i++) {
 207         set_cursor_(value, children.item[i]);
 208     }
 209 }
 210
 211 function set_cursor(value) {
 212     set_cursor_(value, document.getElementById('body'));
 213     set_cursor_(value, document.getElementById('b_first'));
 214     set_cursor_(value, document.getElementById('b_previous'));
 215     set_cursor_(value, document.getElementById('b_next'));
 216     set_cursor_(value, document.getElementById('b_last'));
 217 }
 218
 219 function show_current_text() {
 220     /* don't show text if image not yet loaded because navigator
 221      * won't refresh it during load */
 222     if (images_loaded[current] == 2) {
 223         document.getElementById('image_counter').innerHTML = ( current + 1 ) + "/" + images.length;
 224         document.getElementById('main_text').innerHTML = captions[current];
 225         for (i = 0; i < other_sizes.length; i++) {
 226             if (other_sizes[i] == "original") {
 227                 document.getElementById('link' + other_sizes[i]).href = eval("elements_" + other_sizes[i] + "[current]");
 228             } else {
 229                 document.getElementById('link' + other_sizes[i]).href = 'image-' + other_sizes[i] + dbltilda_htmlsuffix + '#current=' + eval("elements_" + other_sizes[i] + "[current]");
 230             }
 231         }
 232         document.getElementById('thumbnails').href = 'thumbnails-' + dbltilda_current_size + '-' + thumbnailspages[current] + dbltilda_htmlsuffix + '#' + images[current];
 233         set_cursor("default");
 234     } else {
 235         setTimeout("show_current_text()", 50);
 236         set_cursor("wait");
 237     }
 238 }
 239
 240 function display_current() {
 241     var main_img = document.getElementById('main_img');
 242     if (types[current] == 'image') {
 243         main_img.innerHTML = '<div class="fullscreen_image"><img src="' + images[current] + '"/></div>';
 244     } else {
 245         main_img.innerHTML = '<a class="fullscreenvideolink" href="' + videos[current] + '" '
 246                            + '   style="display:block;width:' + videos_widths[current] + 'px;height:' + (videos_heights[current] + 24) + 'px" id="player">'
 247                            + '  <div class="fullscreen_video"><img src="' + images[current] + '"/></div>'
 248                            + '  <img src="' + dbltilda_pathtobase + 'play_video.png" style="position:relative;top:-' + (videos_heights[current] + 48)/2 + 'px;border:0;background-color:transparent"/>'
 249                            + '</a>';
 250         if (dbltilda_flowplayer_active == 'true') {
 251             flowplayer("player", dbltilda_pathtobase + "flowplayer-3.1.5.swf");
 252         }
 253     }
 254     oldhref = browser_href();
 255     newhref = 'image-' + dbltilda_current_size + dbltilda_htmlsuffix + '#current=' + images[current];
 256     if (oldhref != newhref) {
 257         currentURL = 'ignore1';
 258         location.href = newhref;
 259         currentURL = 'ignore2';
 260     }
 261     show_current_text();
 262     update_sensibilities();
 263 }
 264
 265 function first() {
 266     if (slideshow == 1) {
 267         toggle_slideshow(true);
 268     }
 269
 270     current = 0;
 271     display_current();
 272 }
 273
 274 function next() {
 275     if (slideshow == 1) {
 276         toggle_slideshow(true);
 277     }
 278
 279     if (current < images.length - 1) {
 280         current++;
 281         display_current();
 282     }
 283 }
 284
 285 function next10() {
 286     if (slideshow == 1) {
 287         toggle_slideshow(true);
 288     }
 289
 290     if (current < images.length - 11) {
 291         current += 10;
 292     } else {
 293         current = images.length - 1;
 294     }
 295     display_current();
 296 }
 297
 298 function previous() {
 299     if (slideshow == 1) {
 300         toggle_slideshow(true);
 301     }
 302
 303     if (current > 0) {
 304         current--;
 305         display_current();
 306     }
 307 }
 308
 309 function previous10() {
 310     if (slideshow == 1) {
 311         toggle_slideshow(true);
 312     }
 313
 314     if (current > 10) {
 315         current -= 10;
 316     } else {
 317         current = 0;
 318     }
 319     display_current();
 320 }
 321
 322 function last() {
 323     if (slideshow == 1) {
 324         toggle_slideshow(true);
 325     }
 326
 327     current = images.length - 1;
 328     display_current();
 329 }
 330
 331 function keyDownEvent(key) {
 332     if (!key) {
 333         key = event;
 334         key.which = key.keyCode;
 335     }
 336     if (key.altKey || key.ctrlKey || key.shiftKey) {
 337         return;
 338     }
 339     switch (key.which) {
 340       case 36: // home
 341         first();
 342         break;
 343       case 35: // end
 344         last();
 345         break;
 346       case 37: // left
 347         previous();
 348         break;
 349       case 39: // right
 350         next();
 351         break;
 352       case 38: // up
 353         previous10();
 354         break;
 355       case 40: // down
 356         next10();
 357         break;
 358     }
 359 }
 360
 361 function toggle_slideshow(now) {
 362     if (slideshow == 0) {
 363         slideshow_pause = document.getElementById('secs').value;
 364         add_cookie('booh-slideshow-pause-' + dbltilda_theme + '=' + slideshow_pause)
 365         document.getElementById("b_slideshow").value = dbltilda_stop_slideshow;
 366         slideshow = 1;
 367         if (current == images.length - 1) {
 368             current = -1;
 369         }
 370         if (now) {
 371             run_slideshow();
 372         } else {
 373             setTimeout("run_slideshow()", slideshow_pause * 1000);
 374         }
 375     } else {
 376         clearTimeout(slideshow_timer);
 377         document.getElementById("b_slideshow").value = dbltilda_run_slideshow;
 378         slideshow = 0;
 379     }
 380 }
 381
 382 function run_slideshow() {
 383     if (slideshow == 0) {
 384         return;
 385     }
 386
 387     if (images_loaded[current + 1] == 2) {
 388         current++;
 389         display_current();
 390         slideshow_timer = setTimeout("run_slideshow()", slideshow_pause * 1000);
 391     } else {
 392         slideshow_timer = setTimeout("run_slideshow()", 50);
 393     }
 394
 395     if (current == images.length - 1) {
 396         toggle_slideshow(true);
 397     }
 398 }
 399
 400 function set_preferred_size(val) {
 401     var expires = new Date(new Date().getTime() + (30 * 86400000));  // 30 days
 402     document.cookie = 'booh-preferred-size-' + dbltilda_theme + '='
 403                       + val
 404                       + '; expires=' + expires.toGMTString()
 405                       + '; path=/';
 406 }
 407