From dd994bf6f54608b8b5a09d69c7304f4f51f8f2de Mon Sep 17 00:00:00 2001
From: ville rantanen <ville.rantanen@helsinki.fi>
Date: Tue, 1 Oct 2013 16:46:41 +0300
Subject: [PATCH] New structure for storing images

---
 Qalbum.py        |  60 +++++++++++++-------------
 galleryscript.js | 108 ++++++++++++++++++++++-------------------------
 2 files changed, 81 insertions(+), 87 deletions(-)

diff --git a/Qalbum.py b/Qalbum.py
index 5784f42..61c7437 100755
--- a/Qalbum.py
+++ b/Qalbum.py
@@ -132,20 +132,25 @@ def getpathlist(path,options=False):
 
 def pathscript(path,list):
     ''' Returns the javascript string of pathlist and pathimage arrays '''
-    scrstr='<script language="javascript">'
+    scrstr='<script language="javascript">var pathlist=['
+    elements=[]
     for p in list:
         imglist=getimagelist(os.path.join(path,p))
         pathlist=getpathlist(os.path.join(path,p))
-        scrstr+='pathlist.push(["'+unicode(p,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'",'+str(len(imglist)+len(pathlist))+']);'
+        this_str='{ name:"'+unicode(p,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'", '
+        this_str+='size:'+str(len(imglist)+len(pathlist))+', '
         if len(imglist)>0:
-            scrstr+='pathimage.push("'+unicode(p,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'/_tn/tn_'+unicode(imglist[0],encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'.jpg");'
+            this_str+='image:"'+unicode(p,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'/_tn/tn_'+unicode(imglist[0],encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'.jpg"}'
         else:
-            scrstr+='pathimage.push("");'
-    scrstr+='</script>'
+            this_str+='image:"" }'
+        elements.append(this_str)
+    scrstr+=','.join(elements)+'];</script>'
     return scrstr
 
 def pathlinks(path,list):
     ''' Returns the HTML string of subfolders '''
+    if len(list)==0:
+        return '<div id="pathcontainer"></div>'
     pathstr='<div id="pathcontainer">'
     pathstr+='<h1>Subfolders</h1>'
     for p in list:
@@ -164,24 +169,28 @@ def pathlinks(path,list):
 
 def imagescript(path,list):
     ''' Returns the javascript string of imagelist and imagedesc '''
-    strout='<script language="javascript">'
+    strout='<script language="javascript">var imagelist=['
     descriptions=getdescriptions(path,list)
     times=getfiletimes(path,list)
     n=0
+    elements=[]
     for i in list:
         try:
             desc=singlequotes.sub("\\'",unicode(descriptions[n],encoding="utf8").encode('ascii', 'xmlcharrefreplace'))
         except:
             desc=singlequotes.sub("\\'",filter(lambda x: x in string.printable, descriptions[n]).encode('ascii', 'xmlcharrefreplace'))
-        strout+='imagelist.push("'+unicode(i,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'");'
-        strout+='imagedesc.push(\''+desc+'\');\n'
-        strout+='imagetime.push('+str(times[n])+');\n'
+        this_str='\n{name:"'+unicode(i,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'", '
+        this_str+='desc:\''+desc+'\', '
+        this_str+='time:'+str(times[n])+'}'
+        elements.append(this_str)
         n+=1
-    strout+='</script>'
+    strout+=','.join(elements)+'];</script>'
     return strout
 
 def imagelinks(path,list):
     ''' Returns the HTML string of images '''
+    if len(list)==0:
+        return '<div id="thumbcontainer"></div>'
     strout='<div id="thumbcontainer"><noscript>'
     strout+='<h1>Images</h1>'
     descriptions=getdescriptions(path,list)
@@ -200,12 +209,11 @@ def imagelinks(path,list):
 
 def filescript(path,list):
     ''' Returns the javascript string of filelist '''
-    strout='<script language="javascript">'
-    n=0
+    strout='<script language="javascript">var filelist=['
+    elements=[];
     for i in list:
-        strout+='filelist.push("'+unicode(i,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'");'
-        n+=1
-    strout+='</script>'
+        elements.append('"'+unicode(i,encoding="utf8").encode('ascii', 'xmlcharrefreplace')+'"')
+    strout+=','.join(elements)+'];</script>'
     return strout
 
 def filelinks(path,list):
@@ -385,27 +393,19 @@ def traverse(path,crumbs,inputs,options):
     filelist=getnonimagelist(path,options)
     print(str(len(pathlist))+' paths, '+str(len(imagelist))+' images, '+str(len(filelist))+' other files')
     crumbstring=crumblinks(crumbs,options.gallery,options.parent)
-    if len(pathlist)>0:
-        pathstring=pathlinks(path,pathlist)
-        pathjs=pathscript(path,pathlist)
-    else:
-        pathstring='<div id="pathcontainer"></div>'
-        pathjs=''
+    pathjs=pathscript(path,pathlist)
+    pathstring=pathlinks(path,pathlist)
     filestring=filelinks(path,filelist)
-    filejs=filescript(path,filelist)
-    if len(imagelist)>0:
-        imagestring=imagelinks(path,imagelist)
-        imagejs=imagescript(path,imagelist)
-    else:
-        imagestring='<div id="thumbcontainer"></div>'
-        imagejs=''
-   
+    #filejs=filescript(path,filelist) # Filelist is not currently used in javascript
+    imagestring=imagelinks(path,imagelist)
+    imagejs=imagescript(path,imagelist)
+
     f=open(os.path.join(path,"index.html"),"w")
     f.write(header)
     f.write('<div id="preloadcontainer"></div>')
     f.write(pathjs)
     f.write(imagejs)
-    f.write(filejs)
+    #f.write(filejs)
     f.write(crumbstring)
     f.write(pathstring)
     f.write('<div id="imagecontainer">'+getinfo(path,options)+'</div>')
diff --git a/galleryscript.js b/galleryscript.js
index dedc665..5115266 100644
--- a/galleryscript.js
+++ b/galleryscript.js
@@ -924,12 +924,6 @@ e&&e.document?e.document.compatMode==="CSS1Compat"&&e.document.documentElement["
 /*  ------------ Qalbum functions start here ------------- */
 var maxThumb=10;
 var uagent = navigator.userAgent.toLowerCase();
-var pathlist=[];
-var pathimage=[];
-var imagelist=[];
-var filelist=[];
-var imagedesc=[];
-var imagetime=[];
 var marklist=[]
 var currentimage=-1;
 var currentlist=-1;
@@ -1002,27 +996,27 @@ function showbigimage(i) {
     var width=document.body.clientWidth-30;
     var height=document.body.clientHeight-225;
     if (fullscreen) { height=height+200; }
-    if (originals) { mediumstr=encodeURIComponent(imagelist[i]);  }
-    else { mediumstr='_med/med_'+encodeURIComponent(imagelist[i])+'.jpg'; }
-    var linkToBig = '<a class="linktobig" href="'+encodeURIComponent(imagelist[i])+'" target="_blank">';
+    if (originals) { mediumstr=encodeURIComponent(imagelist[i].name);  }
+    else { mediumstr='_med/med_'+encodeURIComponent(imagelist[i].name)+'.jpg'; }
+    var linkToBig = '<a class="linktobig" href="'+encodeURIComponent(imagelist[i].name)+'" target="_blank">';
     if (slideshowinterval!=0) {
         linkToBig = '<a class="linktobig" onclick="slidenextrestart()">';
     }
-    if (isHTML(imagelist[i])) {
+    if (isHTML(imagelist[i].name)) {
         $('#imagecontainer').html('<span id="prevTouch"/><span id="nextTouch"/><div id="imagebig">'+linkToBig+
-            '<iframe id="imagesingle" src="'+encodeURIComponent(imagelist[i])+'"></a></div>');
+            '<iframe id="imagesingle" src="'+encodeURIComponent(imagelist[i].name)+'"></a></div>');
         $('#imagesingle').css('width',width);
         $('#imagesingle').css('height',height);
     } else { // is image 
         $('#imagecontainer').html('<span id="prevTouch"/><span id="nextTouch"/><div id="imagebig">'+linkToBig+
-            '<img id="imagesingle" src="'+mediumstr+'" title="'+titlestring(imagedesc[i])+'"></a></div>');
+            '<img id="imagesingle" src="'+mediumstr+'" title="'+titlestring(imagelist[i].desc)+'"></a></div>');
         $('#imagesingle').css('max-width',width);
         $('#imagesingle').css('max-height',height);
         if ($.browser.msie) { // IE does not work with max*
             $('#imagesingle').css('width','auto');
             $('#imagesingle').css('height',height);
         }
-        $('#imagesingle').css('background-image','url("_tn/tn_'+encodeURIComponent(imagelist[i])+'.jpg")');
+        $('#imagesingle').css('background-image','url("_tn/tn_'+encodeURIComponent(imagelist[i].name)+'.jpg")');
     }
     $('#imagecontainer').css('height',height);
     $('#imagecontainer').data('ID',i);
@@ -1037,13 +1031,13 @@ function showbigimage(i) {
         showimage(currentimage);
     });
     
-    $('#desccontainer').html(getProgressEl()+currentlink(i)+imagedesc[i]);
+    $('#desccontainer').html(getProgressEl()+currentlink(i)+imagelist[i].desc);
     $('#desccontainer').css('display','block');
     if (fullscreen) {
           $('#imagecontainer')[0].scrollIntoView(true);
     }
     addswipe('#imagecontainer');
-    if (zoom & !isHTML(imagelist[i])) {
+    if (zoom & !isHTML(imagelist[i].name)) {
         $(document).ready(function() {
             
             var options = {  
@@ -1056,7 +1050,7 @@ function showbigimage(i) {
             $('#imagesingle').css('display','none');
             // hide the distorted imagesingle
             var bigImg=new Image();
-            bigImg.src=encodeURIComponent(imagelist[i]);
+            bigImg.src=encodeURIComponent(imagelist[i].name);
             $('.linktobig').jqzoom(options);
             $(bigImg).load(function() {
                 if (bigImg.width < width) {
@@ -1073,7 +1067,7 @@ function showbigimage(i) {
 function currentlink(i) {
     // gets the search term for this image
     index = location.href.split("?");
-    s='<a title="Link to this page" href="'+index[0]+'?q='+escape(imagelist[i])+'">['+String(i+1)+']</a> ';
+    s='<a title="Link to this page" href="'+index[0]+'?q='+escape(imagelist[i].name)+'">['+String(i+1)+']</a> ';
     return s;
 }
 
@@ -1085,20 +1079,20 @@ function preload(i) {
     left=Math.max(0,i-1);
     left=Math.min(left,imagelist.length-1);
     if (originals) { 
-        prestr='<img src="'+encodeURIComponent(imagelist[left])+'" />';
-        prestr+='<img src="'+encodeURIComponent(imagelist[right])+'" />'; 
+        prestr='<img src="'+encodeURIComponent(imagelist[left].name)+'" />';
+        prestr+='<img src="'+encodeURIComponent(imagelist[right].name)+'" />'; 
     } else { 
-        prestr='<img src="_med/med_'+encodeURIComponent(imagelist[left])+'.jpg" />';
-        prestr+='<img src="_med/med_'+encodeURIComponent(imagelist[right])+'.jpg" />'; 
+        prestr='<img src="_med/med_'+encodeURIComponent(imagelist[left].name)+'.jpg" />';
+        prestr+='<img src="_med/med_'+encodeURIComponent(imagelist[right].name)+'.jpg" />'; 
     }
     maxThumb=getmaxthumbs();
     ends=getThumbStartEnd(i+maxThumb,maxThumb);
     for (n=ends.first; n<ends.last; n++) {
-        prestr+='<img src="_tn/tn_'+encodeURIComponent(imagelist[n])+'.jpg"/>';
+        prestr+='<img src="_tn/tn_'+encodeURIComponent(imagelist[n].name)+'.jpg"/>';
     }
     ends=getThumbStartEnd(i-maxThumb,maxThumb);
     for (n=ends.first; n<ends.last; n++) {
-        prestr+='<img src="_tn/tn_'+encodeURIComponent(imagelist[n])+'.jpg"/>';
+        prestr+='<img src="_tn/tn_'+encodeURIComponent(imagelist[n].name)+'.jpg"/>';
     }
     $('#preloadcontainer').html(prestr);
     preloadcheck();
@@ -1146,10 +1140,10 @@ function thumblist(n,curr) {
            ' <span class="menuitem" id="setupbutton" onclick="usersetupflip()">(S)etup</span>';
     thumbstr='<div><span class="headsmall">Images</span>'+menustr+'</div><div id="thumbrow">'+leftstr;
     for (i=ends.first; i<ends.last; i++) {
-        if (isHTML(imagelist[i])) {
-            thumbstr+='<span id="n'+i+'" class="imagebox thumbbox"><img class="thumbimage" title="'+titlestring(imagedesc[i])+'" onclick="showimage('+String(i)+')" ><br/><a href="'+encodeURIComponent(imagelist[i])+'" target="_blank" title="'+titlestring(imagedesc[i])+'">'+nicestring((imagelist[i]))+'</a></span>';
+        if (isHTML(imagelist[i].name)) {
+            thumbstr+='<span id="n'+i+'" class="imagebox thumbbox"><img class="thumbimage" title="'+titlestring(imagelist[i].desc)+'" onclick="showimage('+String(i)+')" ><br/><a href="'+encodeURIComponent(imagelist[i].name)+'" target="_blank" title="'+titlestring(imagelist[i].desc)+'">'+nicestring((imagelist[i].name))+'</a></span>';
         } else {
-            thumbstr+='<span id="n'+i+'" class="imagebox thumbbox"><img class="thumbimage" title="'+titlestring(imagedesc[i])+'" onclick="showimage('+String(i)+')" src="_tn/tn_'+encodeURIComponent(imagelist[i])+'.jpg"><br/><a href="'+encodeURIComponent(imagelist[i])+'" target="_blank" title="'+titlestring(imagedesc[i])+'">'+nicestring((imagelist[i]))+'</a></span>';
+            thumbstr+='<span id="n'+i+'" class="imagebox thumbbox"><img class="thumbimage" title="'+titlestring(imagelist[i].desc)+'" onclick="showimage('+String(i)+')" src="_tn/tn_'+encodeURIComponent(imagelist[i].name)+'.jpg"><br/><a href="'+encodeURIComponent(imagelist[i].name)+'" target="_blank" title="'+titlestring(imagelist[i].desc)+'">'+nicestring((imagelist[i].name))+'</a></span>';
         }
     }
     thumbstr+=rightstr+'</div>';
@@ -1195,7 +1189,7 @@ function allthumbs() {
     // Shows all the thumbnails in the current folder
     thumbstr='<div id="thumbrow">';
     for (i=0; i<imagelist.length; i++) {
-        thumbstr+='<span id="n'+i+'" class="imagebox thumbbox"><a href="?p='+(i+1)+'"><img title="'+titlestring(imagedesc[i])+'" src="_tn/tn_'+(encodeURIComponent(imagelist[i]))+'.jpg"></a></span>';
+        thumbstr+='<span id="n'+i+'" class="imagebox thumbbox"><a href="?p='+(i+1)+'"><img title="'+titlestring(imagelist[i].desc)+'" src="_tn/tn_'+(encodeURIComponent(imagelist[i]))+'.jpg"></a></span>';
     }
     thumbstr+='</div>';
     $('#thumbcontainer').html(thumbstr);
@@ -1210,7 +1204,7 @@ function allmediums() {
     // Shows all the medium sized in the current folder
     thumbstr='<div id="thumbrow">';
     for (i=0; i<imagelist.length; i++) {
-        thumbstr+='<span id="n'+i+'" class="medium"><img id="img'+i+'" title="'+titlestring(imagedesc[i])+'" onclick="showimage('+String(i)+')" src="_med/med_'+(encodeURIComponent(imagelist[i]))+'.jpg"></span>';
+        thumbstr+='<span id="n'+i+'" class="medium"><img id="img'+i+'" title="'+titlestring(imagelist[i].desc)+'" onclick="showimage('+String(i)+')" src="_med/med_'+(encodeURIComponent(imagelist[i]))+'.jpg"></span>';
     }
     thumbstr+='</div>';
     $('#thumbcontainer').html(thumbstr);
@@ -1230,7 +1224,8 @@ function subfoldersmalllist() {
     pathstr='<span class="pathsmalllink">Subfolders: ';
     pathstr+='<span class="pathsmalllink">(<a href="javascript:void(0);" onclick="subfoldersmalllist();">text</a> <a href="javascript:void(0);" onclick="subfolderbiglist();">icon</a> <a href="javascript:void(0);" onclick="subfolderdetaillist();">list</a>)</span> ';
     for (p=0; p<pathlist.length; p++) {
-        pathstr+='<a href="'+encodeURI(pathlist[p][0])+'/index.html">'+nicestring(pathlist[p][0])+'</a>('+String(pathlist[p][1])+')/ ';
+        pathstr+='<a href="'+encodeURI(pathlist[p].name)+'/index.html">'+
+                     nicestring(pathlist[p].name)+'</a>('+String(pathlist[p].size)+')/ ';
     }
     pathstr+='</span>';
     if (pathlist.length==0) {
@@ -1242,10 +1237,10 @@ function subfolderbiglist() {
     // Shows a subfolder list with thumbnails
     pathstr='<h2>Subfolders: <span class="pathsmalllink">(<a href="javascript:void(0);" onclick="subfoldersmalllist();">text</a> <a href="javascript:void(0);" onclick="subfolderbiglist();">icon</a> <a href="javascript:void(0);" onclick="subfolderdetaillist();">list</a>)</span></h2>';
     for (p=0; p<pathlist.length; p++) {
-        if (pathimage[p].length>0) {
-            imgstr='<span class="pathbox" id="p'+p+'" style="background-image:url(\''+encodeURI(pathimage[p])+'\');">';
+        if (pathlist[p].image.length>0) {
+            imgstr='<span class="pathbox" id="p'+p+'" style="background-image:url(\''+encodeURI(pathlist[p].image)+'\');">';
         } else { imgstr='<span class="pathbox" id="p'+p+'">'; }
-        pathstr+='<a title="'+pathlist[p][0]+'" href="'+encodeURI(pathlist[p][0])+'/index.html">'+imgstr+'<span class="pathlink"><span class="pathlinktext">'+nicestring(pathlist[p][0])+' ('+String(pathlist[p][1])+')</span></span></span></a>';
+        pathstr+='<a title="'+pathlist[p].name+'" href="'+encodeURI(pathlist[p].name)+'/index.html">'+imgstr+'<span class="pathlink"><span class="pathlinktext">'+nicestring(pathlist[p].name)+' ('+String(pathlist[p].size)+')</span></span></span></a>';
     }
     if (pathlist.length==0) {
         $('#pathcontainer').html('');
@@ -1256,10 +1251,10 @@ function subfolderdetaillist() {
     // Shows a subfolder list with thumbnails
     pathstr='<h2>Subfolders: <span class="pathsmalllink">(<a href="javascript:void(0);" onclick="subfoldersmalllist();">text</a> <a href="javascript:void(0);" onclick="subfolderbiglist();">icon</a> <a href="javascript:void(0);" onclick="subfolderdetaillist();">list</a>)</span></h2>';
     for (p=0; p<pathlist.length; p++) {
-        if (pathimage[p].length>0) {
-            imgstr='<span class="pathbox" id="p'+p+'" style="background-image:url(\''+encodeURI(pathimage[p])+'\');position:relative;top:-35px;" >';
+        if (pathlist[p].image.length>0) {
+            imgstr='<span class="pathbox" id="p'+p+'" style="background-image:url(\''+encodeURI(pathlist[p].image)+'\');position:relative;top:-35px;" >';
         } else { imgstr='<span class="pathbox" id="p'+p+'">'; }
-        pathstr+='<div class="pathdetailrow"><a title="'+pathlist[p][0]+'" href="'+encodeURI(pathlist[p][0])+'/index.html">'+imgstr+'</span><span class="pathdetaillink"><span class="pathdetaillinktext">'+(pathlist[p][0])+' ('+String(pathlist[p][1])+')</span></span></a></div>';
+        pathstr+='<div class="pathdetailrow"><a title="'+pathlist[p].name+'" href="'+encodeURI(pathlist[p].name)+'/index.html">'+imgstr+'</span><span class="pathdetaillink"><span class="pathdetaillinktext">'+(pathlist[p].name)+' ('+String(pathlist[p].size)+')</span></span></a></div>';
     }
     if (pathlist.length==0) {
         $('#pathcontainer').html('');
@@ -1268,14 +1263,12 @@ function subfolderdetaillist() {
 }
 function sortlist(property) {
     // sorts the image list based on time or name, or reverse sort
-    var templist=[]
-    var tempmark=[]
-    var tempcurrent=imagelist[currentimage];
-    for (i in imagelist) {
-        templist.push({name:imagelist[i], time:imagetime[i], desc:imagedesc[i]});
-    }
+    if (currentimage!=-1) { var tempcurrent=imagelist[currentimage].name; }
+    var templist=imagelist;
+    var tempmark=[];
+
     for (i in marklist) {
-        tempmark.push(imagelist[marklist[i]]);
+        tempmark.push(imagelist[marklist[i]].name);
     }
     if (property=='time') {
         templist.sort(function(a,b) {
@@ -1294,20 +1287,21 @@ function sortlist(property) {
     if (property=='rev') {
         templist.reverse();
     }
-    for (i in imagelist) {
-        imagelist[i]=templist[i].name;
-        imagetime[i]=templist[i].time;
-        imagedesc[i]=templist[i].desc;
-        if (imagelist[i] == tempcurrent) {
-            currentimage=parseInt(i);
-        }
-    }
+    
+    imagelist=templist;
     var markidx=0;
     marklist=[];
-    for (i in tempmark) {
-        markidx=imagelist.indexOf(tempmark[i]);
+    for (i in imagelist) {
+        markidx=tempmark.indexOf(imagelist[i].name);
         if (markidx!=-1) {
-            marklist.push(markidx);
+            marklist.push(parseInt(i));
+        }
+    }
+    if (currentimage!=-1) { 
+        for (i in imagelist) {
+            if (imagelist[i].name == tempcurrent) {
+                currentimage=parseInt(i);
+            }
         }
     }
     thumblist(currentimage,currentimage);
@@ -1323,7 +1317,7 @@ function request(type) {
         // Fetch ?q=search request and present first match.
             if ((query[0]=="q") && query.length>1 && query[1].length>0) {
                 for (imname in imagelist) {
-                    if (imagelist[imname].indexOf(unescape(query[1])) != -1) {
+                    if (imagelist[imname].name.indexOf(unescape(query[1])) != -1) {
                         return parseInt(imname);
                         break;
                     }
@@ -1415,8 +1409,8 @@ function marklisteditor() {
     var dlstr='<a href="data:text/csv,File%0A';
     for (i in marklist) {
         liststr+='<div><span class="menuitem thumbmenu" onclick="unmarkitem('+i+');">X</span>'+
-                 '<span class="thumbmenu markedtext" onclick="showimage('+marklist[i]+');">'+imagelist[marklist[i]]+'</span></div>';
-        dlstr+=imagelist[marklist[i]]+'%0A';
+                 '<span class="thumbmenu markedtext" onclick="showimage('+marklist[i]+');">'+imagelist[marklist[i]].name+'</span></div>';
+        dlstr+=imagelist[marklist[i]].name+'%0A';
     }
     dlstr+='">Download as file</a>';
     liststr+='<div class="thumbmenu">'+
@@ -1437,7 +1431,7 @@ function marklisttable() {
     cel.cols=80;
     cel.hasfocus=false;
     for (i in marklist) {
-        cel.value=cel.value+'"'+imagelist[marklist[i]]+'"\r\n';
+        cel.value=cel.value+'"'+imagelist[marklist[i]].name+'"\r\n';
     }
     var rows=cel.value.split(/\r?\n|\r/).length + 1;
     cel.rows=rows;