From 65c9fbf5366d5e496d4defa3e35bc232e0801c42 Mon Sep 17 00:00:00 2001
From: ville rantanen <ville.rantanen@helsinki.fi>
Date: Tue, 26 Feb 2013 13:56:24 +0200
Subject: [PATCH] adding spots for navigation for touch screens

---
 galleryscript.js | 14 ++++++++++++--
 gallerystyle.css | 13 +++++++++++++
 2 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/galleryscript.js b/galleryscript.js
index 0988cdb..3dac417 100644
--- a/galleryscript.js
+++ b/galleryscript.js
@@ -987,12 +987,12 @@ function showbigimage(i) {
         linkToBig = '<a class="linktobig" onclick="slidenextrestart()">';
     }
     if (isHTML(imagelist[i])) {
-        $('#imagecontainer').html('<div id="imagebig">'+linkToBig+
+        $('#imagecontainer').html('<span id="prevTouch"/><span id="nextTouch"/><div id="imagebig">'+linkToBig+
             '<iframe id="imagesingle" src="'+encodeURIComponent(imagelist[i])+'"></a></div>');
         $('#imagesingle').css('width',width);
         $('#imagesingle').css('height',height);
     } else { // is image 
-        $('#imagecontainer').html('<div id="imagebig">'+linkToBig+
+        $('#imagecontainer').html('<span id="prevTouch"/><span id="nextTouch"/><div id="imagebig">'+linkToBig+
             '<img id="imagesingle" src="'+mediumstr+'" title="'+titlestring(imagedesc[i])+'"></a></div>');
         $('#imagesingle').css('max-width',width);
         $('#imagesingle').css('max-height',height);
@@ -1003,6 +1003,16 @@ function showbigimage(i) {
         $('#imagesingle').css('background-image','url("_tn/tn_'+encodeURIComponent(imagelist[i])+'.jpg")');
     }
     $('#imagecontainer').css('height',height);
+    $('#prevTouch').click(function() {
+        currentimage-=1;
+        if (currentimage<0) { currentimage=imagelist.length-1; }
+        showimage(currentimage);
+    });
+    $('#nextTouch').click(function() {
+        currentimage+=1;
+        if (currentimage>(imagelist.length-1)) { currentimage=0; }
+        showimage(currentimage);
+    });
     
     $('#desccontainer').html(getProgressEl()+currentlink(i)+imagedesc[i]);
     $('#desccontainer').css('display','block');
diff --git a/gallerystyle.css b/gallerystyle.css
index 34a3378..22fab07 100644
--- a/gallerystyle.css
+++ b/gallerystyle.css
@@ -226,6 +226,19 @@ iframe {
     line-height: 40px;
     font-family: sans-serif;
 }
+#prevTouch,#nextTouch {
+    width: 10%;
+    height: inherit;
+    position: absolute;
+    display: block;
+    z-index: 1;
+    cursor: pointer;
+}
+#prevTouch:hover,#nextTouch:hover {
+    background-color: rgba(238,238,238,0.5);
+}
+#prevTouch { left:0px; }
+#nextTouch { right:0px; }
 .thumbmenu {
     font-size: small;
     margin: 4px 4px 4px 15px;