Creating a Photo Gallery using Python
I'm a novice programmer and thought it would be a fun learning experience to create a photo gallery using python. I've gotten pretty far in the project, but recently got stuck.
I have a folder filled with photos. I was able to generate an index page with thumbnails. When I click on a thumbnail, a larger version appears. However, when someone clicks the larger version, I'd like it to go to the next photo. Right now, the user has to click back to the index page to get to the next photo. Here's the index page with working thumbnails.
http://dl.dropbox.com/u/26085098/CCC%20Culinary%20Food%20and%20Wine%20Event%202011/index.html
The python script I used to create the gallery is shown below.
I would love if someone could point me in the right direction. Also, any suggestions on making my code more elegant would be greatly appreciated.
import os
index=os.listdir开发者_Go百科('./Images')
x=len(index)
for fname in index:
while x>0:
x=x-1
index[x] = '<a href="./' + index[x].replace("jpg", "html") + '">' + '<img src="./Thumbs/' + index[x] + '" />' + '</a>'
listString='\n'.join(index)
title=os.getcwd()
title=title.split("/")
title=title.pop()
file = open("index.html", 'w')
file.write('<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"' + '\n')
file.write(' "http://www.w3.org/TR/html4/loose.dtd">' + '\n')
file.write('<html>' + '\n')
file.write('<title>' + title + '</title>' + '\n')
file.write('<head>' + '\n')
file.write('<style>' + '\n')
file.write('body {padding:10px;background-color:black;margin-left:15%;margin-right:15%;font-family:"Lucida Grande",Verdana,Arial,Sans-Serif;color: white;}' + '\n')
file.write('img {border-style:solid;border-width:5px;border-color:white;}' + '\n')
file.write('</style>' + '\n')
file.write('</head>' + '\n')
file.write('<body>' + '\n')
file.write('<h1>' + title + '</h1>' + '\n')
file.write(listString + '\n')
file.write('</body>' + '\n')
file.write('</html>')
file.close()
next=os.listdir('./Images')
x=len(next)
for name in next:
while x>0:
x=x-1
next[x] = next[x].replace("jpg", "html")
image=os.listdir('./Images')
page=os.listdir('./Images')
x=len(page)
for fname in page:
while x>0:
x=x-1
page[x] = page[x].replace("jpg", "html")
file = open(page[x], 'w')
file.write('<a href="./' + next[x] + '">' + '<img height="95%" src="./Images/' + image[x] + '" />' + '</a>')
file.close()
I tried making the next url show up by incrementing "next", but it gives me an error.
next[x] = next[x+1].replace("jpg", "html")
IndexError: list index out of range
x=len(next)
for name in next:
while x>0:
x=x-1
next[x] = next[x].replace("jpg", "html")
Since you aren't really resetting x between iterations of for, this probably doesn't do what you intended.
Same for the next loop starting with:
for fname in page:
while x>0:
x=x-1
If your images are numbered 0:n-1, the algorithm to create the links is quite simple:
For image
Mlink toKwhereK:- Is
M + 1as long asM <= n-1 - Is
0(or itself, as you decide) whenM == n-1
- Is
to be more pythonic, you can replace your list manipulations by list comprehension :
index=["".join(['<a href="./', item.replace("jpg", "html"), '">', '<img src="./Thumbs/', item, '" />', '</a>']) for item in os.listdir('./Images')]
instead of
x=len(index)
for fname in index:
while x>0:
x=x-1
index[x] = '<a href="./' + index[x].replace("jpg", "html") + '">' + '<img src="./Thumbs/' + index[x] + '" />' + '</a>'
Got it to work. Here's the python script if anyone's interested. I just had to append another item to the "next" list.
import os
index=os.listdir('./Images')
x=len(index)
for fname in index:
while x>0:
x=x-1
index[x] = '<a href="./' + index[x].replace("jpg", "html") + '">' + '<img src="./Thumbs/' + index[x] + '" />' + '</a>'
listString='\n'.join(index)
title=os.getcwd()
title=title.split("/")
title=title.pop()
file = open("gallery.html", 'w')
file.write('<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"' + '\n')
file.write(' "http://www.w3.org/TR/html4/loose.dtd">' + '\n')
file.write('<html>' + '\n')
file.write('<title>' + title + '</title>' + '\n')
file.write('<head>' + '\n')
file.write('<style>' + '\n')
file.write('body {font-size:small;padding:10px;background-color:black;margin-left:15%;margin-right:15%;font-family:"Lucida Grande",Verdana,Arial,Sans-Serif;color: white;}' + '\n')
file.write('img {border-style:solid;border-width:5px;border-color:white;}' + '\n')
file.write('h1 {text-align:center;}' + '\n')
file.write('a:link {color: grey; text-decoration: none;}' + '\n')
file.write('a:visited {color: grey; text-decoration: none;}' + '\n')
file.write('a:active {color: grey; text-decoration: none;}' + '\n')
file.write('a:hover {color: grey;text-decoration: underline;}' + '\n')
file.write('</style>' + '\n')
file.write('</head>' + '\n')
file.write('<body>' + '\n')
file.write('<h1>' + title + '</h1>' + '\n')
file.write(listString + '\n')
file.write('</body>' + '\n')
file.write('</html>')
file.close()
next=os.listdir('./Images')
image=os.listdir('./Images')
page=os.listdir('./Images')
next.append('gallery.html')
x=len(next)
y=len(page)
z=len(image)
for fname in page:
while y>0:
y=y-1
x=x-1
z=z-1
page[y] = page[y].replace("jpg", "html")
file = open(page[y], 'w')
file.write('<html>' + '\n')
file.write('<title>' + title + '</title>' + '\n')
file.write('<head>' + '\n')
file.write('<script type="text/javascript">function delayer(){window.location = "./' + next[x].replace("jpg", "html") +'"}</script>' + '\n')
file.write('<style>' + '\n')
file.write('body {font-size:small;text-align:center;background-color:black;font-family:"Lucida Grande",Verdana,Arial,Sans-Serif;color: white;}' + '\n')
file.write('a:link {color: white; text-decoration: none;}' + '\n')
file.write('a:visited {color: white; text-decoration: none;}' + '\n')
file.write('a:active {color: white; text-decoration: none;}' + '\n')
file.write('a:hover {color: white;text-decoration: underline;}' + '\n')
file.write('</style>' + '\n')
file.write('</head>' + '\n')
file.write('<body onLoad="setTimeout(\'delayer()\', 3000)">' + '\n')
file.write('<p><a href="gallery.html">' + title + '</a></p>' + '\n')
file.write('<a href="./' + next[x].replace("jpg", "html") + '">' + '<img height="90%" src="./Images/' + image[z] + '" />' + '</a>')
file.write('</body>' + '\n')
file.write('</html>')
file.close()
加载中,请稍侯......
精彩评论