2014年10月のブログ記事一覧-日々の記録

サムネイルのテーブル作成のJavaScript

2014年10月31日 22時30分10秒 | その他雑記

フォルダの中にある画像、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>

太陽黒点がでかい

2014年10月25日 12時56分59秒 | AVR

機材：Nikon D90 + Nikon AF70-300 F4-5.6G + ND100000 filter

コメント (2)

renameコマンドの処理（備忘録）

2014年10月18日 17時12分14秒 | プログラム

Webカメラを使って連続写真を撮っていて動画にしようなどともくろんでいる。
しかしながら現在インターネットから手に入れたフリーソフトが画像を記録すると、ファイル名のフォーマットが

yyyymmddhmmss.jpg

になっている。hourがhhじゃないので、名前の順にソートするとおかしくなるので、更新日時の順番にソートしなくてはならない。まずコマンドプロンプトで

dir /b /od　> _dir.txt

と入力してファイル名を_dir.txtファイルに入れる。テキストファイルの先頭のアンダーバーはソートしたときに一番上に来るようにするのが目的なので、別に無くてもいい。
次に、ファイル名を順番に名前変更するのだが、今までエクセルを使っていたのだが、以下のJavaScriptコードで実行することにした。ダミーデータでの試験ではうまく言っているようだ。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metacontent="text/html; charset=utf-8"http-equiv="Content-Type">
<title>Make Rename Command</title>
<script type="text/javascript">
function MakeRenameCommand(){
    var StartTime = new Date();
    var textIn = document.form.TextIn;
    var textOut = document.form.TextOut;
    textOut.value="";
    var note = document.form.Note;
    var FnArray = textIn.value.split("\n");
    var inIndex=0;
    var outIndex=1;
    for(inIndex=0;inIndex<FnArray.length;inIndex++){
        if(FnArray[inIndex].slice(-4)===".jpg" || FnArray[inIndex].slice(-4)===".JPG"){
            textOut.value += 'rename "' + FnArray[inIndex] + '" "' + ('0000'+outIndex).slice(-4) + '.jpg"\n';
            outIndex++;
        }
    }
    var StopTime = new Date();
    var dT = StopTime - StartTime;
    note.value = outIndex + "files\n";
    note.value += "it took " + dT/1000 + "sec\n";
}
</script>
</head>
<body>
    <formname="form"action="post">
        <textareaname="TextIn"cols="50"rows="20"></textarea>
        <textareaname="TextOut"cols="50"rows="20"></textarea><br>
        <inputtype="button"value="Make Rename commands"onclick="MakeRenameCommand()"><br>
        <textareaname="Note"cols="50"rows="2"></textarea><br>

    </form>
</body>
</html>