attachment:wydiwys.js of wydiwys

   1 //  wydiwys navigation function
   2 //  v0.2  2009 Aug 7 by Keith Lofstrom   
   3 //     with window scaling and preload
   4 
   5 $(window).resize(  function(){ scale() });
   6 
   7 // keyboard / remote navigation
   8 
   9 function navigate( current, first, prev, enter, next, last ) {
  10    $(document).ready(function(){   
  11       scale();                       // scale the new drawing
  12       $(document).keydown( function(e) {
  13          switch (e.which) {
  14             case 36: window.location = first;  break; // home      key
  15             case 35: window.location = last;   break; // end       key
  16             case 40: window.location = next;   break; // down      key
  17             case 39: window.location = next;   break; // right     key
  18             case 32: window.location = next;   break; // space     key
  19             case 37: window.location = prev;   break; // left      key
  20             case 38: window.location = prev;   break; // up        key
  21             case  8: window.location = prev;   break; // backspace key
  22             case 13: window.location = enter;  break; // enter     key
  23             // wireless remote
  24             case 34: window.location = next;   break; // forward   button
  25             case 33: window.location = prev;   break; // back      button
  26             case 66: window.location = enter;  break; // enter     button
  27          }
  28       });
  29       // preload next images
  30       if ( first !== current ) { pload ( first ) }
  31       if ( prev  !== current ) { pload ( prev  ) }
  32       if ( next  !== current ) { pload ( next  ) }
  33       if ( last  !== current ) { pload ( last  ) }
  34    });
  35 }
  36 
  37 //  preload the next image
  38 function pload( image_with_html ) {
  39    var image_without_html = image_with_html.replace( /\.htm(l)?/ ,'' );
  40    jQuery("<img>").attr("src", image_without_html );
  41 }
  42 
  43 //  scale the current image
  44 //  for best results, this requires margins and padding to be zero
  45 
  46 function scale() {
  47    var WindowHeight = $(window).height();
  48    var WindowWidth  = $(window).width();
  49    var WindowAspect = WindowWidth/WindowHeight;
  50    $('img').each(function(){           // OK, only one img, but this is easy
  51       var ImageHeight = $(this).height();
  52       var ImageWidth  = $(this).width();
  53       var ImageAspect  = ImageWidth/ImageHeight;
  54 
  55       if( ImageAspect < WindowAspect ) {               // wide image
  56          $(this).height( WindowHeight ) ;
  57          $(this).width( WindowHeight*ImageAspect );
  58       } else {                                         // tall image
  59          $(this).height( WindowWidth/ImageAspect );
  60          $(this).width ( WindowWidth  ) ;
  61       }
  62    }); 
  63 }