日々の記録

ほどよく書いてきます。

画像一覧HTML作成のスクリプト

2017年01月23日 00時12分12秒 | プログラム
画像を表にして整理するのに便利なので作ってみた。
観察データを横並びに確認したいときなど、Excelに貼るよりも便利だから。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- 20170121 -->
<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>画像サムネイル一覧テーブル作成</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 = "";

    FileNameList.value = FileNameList.value.replace(/\r\n/g, "\n");
    FileNameList.value = FileNameList.value.replace(/[\n]+$/g,"").trim(); //最後の改行コード処理
    
    if(FileNameList.value.length===0){
        alert("Input File Names");
    }
    
    else{
        var FileNameArray = FileNameList.value.split("\n");
        TempText += '<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">\n';
        TempText += '<html>\n<head>\n<meta content="text/html; charset='+ChSet+'" http-equiv="Content-Type">\n';
        TempText += '<style type="text/css">\ntable{\n';
        TempText += '  border-collapse:collapse;\n}';
        TempText += '\ntd{\n';
        TempText += '  border:1px black solid;\n';
        TempText += '  text-align:center;\n}';
        TempText += '\n';
        TempText += '<\/style>\n';
        TempText += '<title>Image Table<\/title>\n<\/head>\n<body>\n\n<table>\n';
        var i = 0;
        var j = 1;
        TempText += '  <tr><td><\/td><td colspan="' + ColNum + '">Image(s)<\/td><\/tr>\n  <tr>\n    <td>Index' + j++ + '<\/td>\n';
        for(i=0;i<FileNameArray.length;i++){
            if((i % ColNum ===0) && (i !== 0 )){
                TempText += '  <\/tr>\n  <tr>\n    <td>Index' + j++ + '<\/td>\n';
            }
        TempText += '    <td><img alt="" src="' + ImgDir + FileNameArray[i] + '" title="' + FileNameArray[i] + '"><\/td>\n';
        }
        if(FileNameArray.length % ColNum !==0){
            for(i=(FileNameArray.length % ColNum); i<ColNum ; i++){
                TempText += '    <td><\/td>\n';
            }
        }
    }
    TempText += '  <\/tr>\n<\/table>\n<\/body>\n<\/html>';
    
    htmlOut.value = TempText;
    
    var StopTime = new Date();
    var dT=StopTime-StartTime;
    note.value = "処理時間:" + dT + "[ms]";

}
</script>
</head>
<body>
	画像サムネイル一覧テーブル作成<br>
	<form name="form" action="post">
		<input type="text" name="ImgDir" value="small/" class="param"><span>:dir of the thumbnail images</span><br>
		<input type="text" name="LinkDir" value="org/" class="param"><span>:dir of the images</span><br>
		<input type="text" name="TableCol" value="11" class="param"><span>:number of columns</span><br>
		<input type="text" name="chrSet" value="sjis" class="param"><span>:charactor set</span><br>
		<textarea name="FileList" cols="40" rows="15">
                </textarea>
		<textarea name="HTMLOut" cols="120" rows="15">HTML output</textarea><br>
		<input type="button" value="Generate" onclick="MakeTable()"><br>
		<textarea name="Note" cols="50" rows="2">Log</textarea><br>
	</form>

</body>

</html>

コメント
 
 
 
 
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

降雪

2017年01月15日 02時39分29秒 | バイク

雪だ。名古屋で雪になるのは何年かに一回と珍しい現象である。

スタッドレスなので走行という点ではなんとかなるけど、窓ガラスの雪かき面倒なのでこのまま放置。出かける予定もないし。

バイクにも積もっている。コチラは乾くまで放置となるでしょう。

コメント (1)
 
 
 
 
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

UV-LED 365nm

2017年01月14日 16時49分26秒 | 光り物

UVのLEDライトを買ってみた。365nmの波長とのこと。

単三電池でも、単三サイズのリチウムイオン電池でもOKらしいが、手元には単三電池しか無いので単三電池で運用してみる。

外観はこんな感じ。

先端が伸びることでフォーカス位置の調整が可能。

ワイド照射

スポット照射（チップの形が見える）

 

身の回りの蛍光色素をかなり励起できるので、

・ハガキの宛名に印字されるコード
・パスポート
・ワイシャツ
・賃貸物件の床のシミｗ

など色々なものが励起できて面白い。

単三リチウムイオン買おうかな。 

コメント
 
 
 
 
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

50,000km

2017年01月12日 00時09分07秒 | バイク

バイクのODOメーターが50,000kmになった。

コメント (4)
 
 
 
 
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

JavaScriptを使った文字列連結を使ってファイル名一覧、コマンド一覧などを作成する。

2017年01月09日 19時27分58秒 | プログラム

仕事で網羅的な観察データを作成するとき、ある程度規則的なファイル名になることがある。
そのファイル名を一覧表にするのにファイル名から一覧表を作ればいいのだが、時折サンプルがなかったりと欠落がある場合がある。
そんな時のために網羅的なデータの一覧を作成しておいて、表を作っておくと便利じゃないかと思って作ってみた。

左から順番に文字列を網羅的に連結していくだけ。毎回プログラムっていうのも面倒臭いので、こうしたものがあると多少は便利になるかなと。

文字列を連結するだけなので、フォルダ作成のコマンドを大量に作るという用途にも使えるのでは無いだろうか。

 

連結したい文字列を増やす場合はhtmlソースの<textarea name="List" cols="15" rows="10">List[n]</textarea>を増やせばよい。

<!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>文字列結合</title>
<script type="text/javascript">
    function MakeNameList(){
    var StartTime = new Date();
    var NameListArray = new Array();
    var textOut = document.form.FileNameOutput;

    //配列の格納、末尾の改行はreplaceで削除しておく。
    for(i=0;i<document.form.List.length;i++){
        NameListArray[i] = document.form.List[i].value.replace(/\n+$/g,"").split("\n");
    }

    var TempText = "";
    var tempArray = new Array();

    //配列に構造があるが、データは無い、とするため、""のブランクを入れておく。    
    tempArray[0]="";
    for(var k=0, lenk = NameListArray.length;k<lenk;k++){
        TempText = "";
        for(var i=0, leni = tempArray.length;i<leni;i++){
            var lenj = NameListArray[k].length;
            for(var j=0, lenj=NameListArray[k].length;j<lenj;j++){
                TempText += tempArray[i] + NameListArray[k][j] + "\n";
            }
        }
        tempArray = TempText.replace(/\n+$/g,"").split("\n");
    }
    textOut.value = TempText;
    TempText = "";

    var StopTime = new Date();
    var dT = StopTime - StartTime;
    document.form.Note.value = tempArray.length + "データ\n" + "処理時間" + dT + "[ms]"; 
}
</script>
</head>

<body>
<form name="form" action="post">
<textarea name="List" cols="15" rows="10">List1</textarea>
<textarea name="List" cols="15" rows="10">List2</textarea>
<textarea name="List" cols="15" rows="10">List3</textarea>
<textarea name="List" cols="15" rows="10">List4</textarea>
<textarea name="List" cols="15" rows="10">List5</textarea>
<textarea name="List" cols="15" rows="10">List6</textarea>
<textarea name="List" cols="15" rows="10">List7</textarea>
<br>
<textarea name="FileNameOutput" cols="125" rows="10">output</textarea><br>
<textarea name="Note" cols="50" rows="2">ログ</textarea><br>
<input type="button" value="Generate" onclick="MakeNameList()"><br>
</form>
</body>

</html>
コメント
 
 
 
 
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

月と金星

2017年01月02日 18時34分45秒 | 星空

金星と月が接近していた。

割ときれいだった。

地球照を見ようとおもうと明るいところが白飛び、白飛びしないと地球照が見えない。

コメント
 
 
 
 
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

新年夜空

2017年01月01日 17時53分26秒 | 星空

2017初夜空。

南の空はオリオン、冬の大三角形。途中露光不足で線が切れちゃったけど。

北の空は北斗七星とその円周運動。

90秒露光のコンポジット。なお寒くて電池の減りが相当早い。外気温-5℃くらい。

コメント
 
 
 
 
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

文字サイズ変更

メッセージ

メッセージメッセージを送る

カレンダー

2017年1月
日 月 火 水 木 金 土
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31

カテゴリー

バックナンバー

アクセス状況

アクセスアクセス
閲覧 381 PV UP!
訪問者 199 IP DOWN!
トータルトータル
閲覧 1,201,567 PV 
訪問者 680,677 IP