フォルダの中にある画像、Ralphaというソフトで縮小するのだが、サムネイルの一覧があるといいなと思ってこんなのを作ってみた。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <title>Make thumnail image table</title> <style type="text/css"> .param{ width:100px; } </style> <script type="text/javascript"> function MakeTable(){ var StartTime = new Date(); var FileNameList = document.form.FileList; var htmlOut = document.form.HTMLOut; var note = document.form.Note; var ChSet = document.form.chrSet.value; var ImgDir = document.form.ImgDir.value; var LinkDir = document.form.LinkDir.value; var ColNum = document.form.TableCol.value; var TempText = ""; //delete \r \n at the end of list FileNameList.value = FileNameList.value.replace(/[\r\n]+$/g,""); if(FileNameList.value.length===0){ alert("ファイルリストを入力してください"); } else{ var FileNameArray = FileNameList.value.split("\n"); TempText=''; TempText+='<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">'; TempText+='<html>\n<head>\n<meta content="text/html; charset='+ ChSet +'" http-equiv="Content-Type">\n'; TempText+='<style>table{border-collapse: collapse;}\ntd{border:1px black solid;}<\/style>'; TempText+='<title>Make thumnail image table<\/title>\n<\/head>\n<body>\n'; TempText+=' <table>\n <tr>\n'; var i=0; for(i=0;i<FileNameArray.length;i++){ FileNameArray[i]=FileNameArray[i].replace(/[\r\n]/g,""); if((i % ColNum === 0) && (i !==0 )){ TempText += ' <\/tr>\n <tr>\n'; } TempText+=' <td><a href="' + LinkDir + FileNameArray[i] + '"><img alt="" src="' + ImgDir + FileNameArray[i] + '" title="' + FileNameArray[i] + '"><\/a><\/td>\n'; } if(FileNameArray.length % ColNum !== 0){ for(i=(FileNameArray.length % ColNum) ; i<ColNum ; i++){ TempText += ' <td> <\/td>\n'; } } TempText += ' <\/tr>\n <\/table>\n'; TempText += '<\/body>\n<\/html>'; htmlOut.value = TempText; var StopTime = new Date(); var dT = StopTime - StartTime; note.value = "it took " + dT/1000 + "sec\n"; } } </script> </head> <body> 画像サムネイルの一覧テーブルを作成します。<br> 大きなファイル、小さなファイルを同じ名前で別のフォルダに用意しておき、小さいファイルでサムネイルを作成し、リンク先として大きな画像を用意します。 <form name="form" action="post"> <input type="text" name="chrSet" value="sjis" class="param"><span>:charset</span><br> <input type="text" name="ImgDir" value="small/" class="param"><span>:directroy of small images as thumbnail</span><br> <input type="text" name="LinkDir" value="org/" class="param"><span>:directory of large images</span><br> <input type="text" name="TableCol" value="5" class="param"><span>:number of table columns</span><br><br> <br> <textarea name="FileList" cols="20" rows="20">file names here</textarea> <textarea name="HTMLOut" cols="100" rows="20"></textarea><br> <input type="button" value="Generate Html" onclick="MakeTable()"><br> <textarea name="Note" cols="50" rows="3">hogehoge</textarea><br> </form> </body> </html>
アクセス
トータル
