plugins/viewer/template.php

   1 <html>
   2 <head>
   3 <title> <?= IMAGES_DIR.$simpleImagePath ?> </title>
   4 <style type="text/css">
   5 html, body {
   6 height: 100%;
   7 }
   8 body {
   9 margin: 0;
  10 text-align: center;
  11 background: black;
  12 color: white;
  13 }
  14 #theimage {
  15 max-width: 100%;
  16 max-height: 100%;
  17 }
  18 a {
  19         color: white;
  20         text-decoration: none;
  21 }
  22 #next, #previous, #up {
  23         position: fixed;
  24         font-size: 4em;
  25         font-weight: bold;
  26 }
  27
  28 #up {
  29         top: 0;
  30         left: 0;
  31
  32 }
  33 #next {
  34         top: 50%;
  35         right: -0;
  36
  37 }
  38 #previous {
  39         top: 50%;
  40         left: 0;
  41 }
  42 img {
  43         border: 0;
  44 }
  45 </style>
  46
  47 <?php if ($nextImageUrl !== '' and $firefox) { ?>
  48 <link rel="prefetch" href="<?= $nextImageUrl ?>" />
  49 <link rel="prefetch" href="<?= $nextPageUrl ?>" />
  50 <?php } ?>
  51
  52 </head>
  53 <body>
  54
  55 <a href="<?= $imageUrl ?>"><img src="<?= $imageUrl ?>" id="theimage" /></a>
  56
  57 <div id="up">
  58 <a href="<?= $directoryUrl ?>" title="Back to directory">^</a>
  59 </div>
  60
  61 <?php if ($nextPageUrl !== '') { ?>
  62 <div id="next">
  63 <a href="<?= $nextPageUrl ?>" title="Next image">&gt;</a>
  64 </div>
  65 <?php } ?>
  66
  67 <?php if ($prevPageUrl !== '') { ?>
  68 <div id="previous">
  69 <a href="<?= $prevPageUrl ?>" title="Previous image">&lt;</a>
  70 </div>
  71 <?php } ?>
  72
  73 <script type="text/javascript">
  74
  75 <?php if ($nextImageUrl !== '' and ! $firefox) { ?>
  76 window.onload = function() { // for browsers not supporting link rel=prefetch
  77         var im = new Image();
  78         im.src = '<?= $nextImageUrl ?>';
  79         var req = new XMLHttpRequest();
  80         req.open('GET', '<?= $nextPageUrl ?>', false);
  81         req.send(null);
  82 };
  83 <?php } ?>
  84
  85 // keyboard navigation
  86 function keyup(e)
  87 {
  88         switch (e.keyCode) {
  89                 case 37: // left
  90                         window.location = "<?= $prevPageUrl ?>";
  91                 break;
  92                 case 39: // right
  93                 case 32: // space
  94                         window.location = "<?= $nextPageUrl ?>";
  95                 break;
  96                 case 38: // up  (down is 40)
  97                         window.location = "<?= $directoryUrl ?>";
  98                 break;
  99                 case 13: // enter
 100                         window.location = "<?= $imageUrl ?>";
 101                 break;
 102         }
 103 }
 104
 105 if (document.addEventListener) {
 106         document.addEventListener("keyup", keyup, false);
 107 }
 108 </script>
 109
 110 </body>
 111 </html>