SQLの窓

2014年09月27日


VBScript : JavaScript のライブラリを呼び出して、Base64 エンコードを行う

世の中には、VBScript のサンプルよりはるかに JavaScriptで動作するものがたくさんあるので、VBScript より呼び出して利用します。

Javascript base64 - Javascript tutorial with example source code にあるソースコードを base64.js としてあらかじめ作成しておきます。そのファイルを、Google ドライブの共有で外部から参照可能にしておいて使用しています。

このサンプルは、WEB 関連の用途を前提としているので、日本語は UTF-8 に変換されたものが Base64 にエンコードされますので注意して下さい。
<JOB>
<SCRIPT language="JavaScript" src="https://e71762ff0667a838154428843724525602513494.googledrive.com/host/0B9Jymqpro6gSbTZnNHVOODFnTE0/base64.js"></SCRIPT>
<SCRIPT language=VBScript>

' 日本語は、UTF-8 でエンコードされた後に base64 でエンコードされます

str = ""
For I = 0 to 127
	str = str & Chr(I)
Next


strPhp = "AAECAwQFBgcICQoLDA0ODxAREhMUFRYXGBkaGxwdHh8gISIjJCUmJygpKiss"
strPhp = strPhp & "LS4vMDEyMzQ1Njc4OTo7PD0+P0BBQkNERUZHSElKS0xNTk9QUVJ"
strPhp = strPhp & "TVFVWV1hZWltcXV5fYGFiY2RlZmdoaWprbG1ub3BxcnN0dXZ3eH"
strPhp = strPhp & "l6e3x9fn8="
if Base64.encode(str) = strPhp then
	MsgBox("一致しました")
end if

str = "VBScriptにはありませんが、JavaScriptにはたくさんのライブラリがあります!"
MsgBox(Base64.encode(str))

' **********************************************************
' PHP のコード
' **********************************************************
'$str = "";
'for( $i = 0; $i < 128; $i++ ) {
'	$str .= chr($i);
'}
'$str = base64_encode($str);
'print $str;
'

</SCRIPT>
</JOB>



タグ:Base64
posted by lightbox at 2014-09-27 22:37 | VBS + JavaScript | このブログの読者になる | 更新情報をチェックする

Google Chrome デベロッパーツールの Tips And Tricks

リロードボタン長押しでオプションメニュー



デベロッパーツールが開いている状態でのみ、メニューが表示されてリロード方法を選択できるようになります。特に、最後の『キャッシュの消去とハード再読み込み』は、ショートカットキーが無いのでこのメニューからのみ利用できます。

ドラッグ & ドロップで要素を移動



ドラッグで top_1 の div を移動中です。ドロップすると移動され、CTRL+Z で元に戻ります

CSS のカラーフォーマットをその場で変更表示

カラー部分を、SHIFT を押しながらクリックすると、フォーマットが切り替わって循環します。

複数の JavaScript ソースより文字列検索



JavaScript の整形



ソースのスペースの表示



▼ スペース


▼ タブ


コンソールから関数のブレイクポイント作成

debug( 関数名 )

インスペクト直後のオブジェクト参照

$0

dir( $0 )

表示された内容を右クリックして表示されるメニューから、要素タブの該当部分へ戻れます

console.log では、以下のフォーマット文字列が使えます

console.log('%cBlue! %cRed!', 'color: blue;', 'color: red;'); のように複数も可
Format SpecifierDescription
%sFormats the value as a string.
%d or %iFormats the value as an integer.
%fFormats the value as a floating point value.
%oFormats the value as an expandable DOM element (as in the Elements panel).
%OFormats the value as an expandable JavaScript object.
%cFormats the output string according to CSS styles you provide.
コンソールで IFRAME を選択

デフォルトでは、トップフレームなので IFRAME の中で作業したい場合に選択します



モバイルモード『Mobile emulation』で左上にフィットする



その他

コンソールでは、SHIFT+Enter で複数行可

copy コマンド( コンソールのみ ) でクリップボードへコピー

table コマンドと、console.table メソッド




タグ:Google Chrome
posted by lightbox at 2014-09-27 18:09 | Google Chrome | このブログの読者になる | 更新情報をチェックする

PHP : htmlentities : テキストエリアによるテキスト処理

テキストエリアで長いソースコード等を入力して保存する場合、読み込んで表示する時のみ htmlentities 変換してから TEXTAREA 要素で挟む必要があります。

変換結果の確認は、Google Chrome のコンソールで 『$("body > form > table > tbody > tr:nth-child(2) > td:nth-child(2) > textarea").innerHTML』です
<?php
header( "Content-Type: text/html; Charset=utf-8" );
header( "pragma: no-cache" );
header( "Expires: Wed, 31 May 2000 14:59:58 GMT" );
header( "Cache-control: no-cache" );

// POST メソッドで送信された時のみ処理する
// ( URL から呼び出された場合は処理しない )
if ( $_SERVER['REQUEST_METHOD'] == 'POST' ) {

	if ( $_POST['send'] == '読み出し' ) {
		$text = @file_get_contents("./text.data");
		$text = htmlentities( $text, ENT_NOQUOTES, "utf-8" );
	}
	if ( $_POST['send'] == '書き込み' ) {
		file_put_contents("./text.data", $_POST['text'] );
		$text = htmlentities( $_POST['text'], ENT_NOQUOTES, "utf-8" );
	}

}

?>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>HTML雛形</title>
<style type="text/css">
* {
	font-family: "メイリオ","MS Pゴシック";
	font-size: 16px;
}
.column {
	border-style:solid;
	border-width:1px;
	border-color:#000000;
	padding: 4px;
}
</style>

<script type="text/javascript">
function submitForm() {
	if ( !confirm( "Submit ボタンで送信しますか?" ) ) {
		return false;
	}
	return true;
}
</script>

</head>
<body>

<form
	name="frm"
	method="post"
	action=""
	onsubmit='return submitForm();'
>
<table
	border=1
	style='
		border-collapse:collapse;
		border-style:solid;
		border-width:1px;
		border-color:#000000;
	'
>

<tr>
	<td class="column" colspan=2>
	<input
		type="submit"
		name="send"
		value="読み出し"
	>
	<input
		type="submit"
		name="send"
		value="書き込み"
	>
	</td>
</tr>

<tr>
	<td class="column">テキストエリア</td>
	<td class="column">
<textarea
	name="text"
	cols="60"
	rows="15"
><?= $text ?></textarea>
	</td>
</tr>

</table>
</form>


</body>
</html>





タグ:PHP htmlentities
posted by lightbox at 2014-09-27 16:20 | PHP + WEBアプリ | このブログの読者になる | 更新情報をチェックする

PHP : 超簡易ログ

複雑な処理ですと、画面に表示しづらい場合があります。そんな時、その場限りのログです
file_put_contents( uniqid().".log", $vaiue );

// 以下は配列やオブジェクトを出力したい場合

file_put_contents( uniqid().".log", print_r( $_POST, true ) );




posted by lightbox at 2014-09-27 16:20 | PHP + WEBアプリ | このブログの読者になる | 更新情報をチェックする

PHP : 入力値のデバッグ

ソースコードの最下部に追加すれば良いと思います。
<?php
print "<pre>";
print_r($_GET);
print_r($_POST);
print "</pre>";
?>

デバッグする文字列に HTML が含まれている場合は、以下のようにするといいと思います。
<?php
foreach( $_POST as $key => $value ) {
	$_mypost[$key] = htmlentities( $value, ENT_NOQUOTES, "utf-8" );
}
print "<pre>";
print_r($_mypost);
print "</pre>";
?>



タグ:PHP
posted by lightbox at 2014-09-27 16:20 | PHP + WEBアプリ | このブログの読者になる | 更新情報をチェックする

Seesaa の特定のカテゴリ(複数)の場合のみ、記事の下に参照リンクやコンテンツを付加する方法

Seesaaブログの page_name 変数の3つ以上の OR 条件の記述方法 の発展形です。上記の場合は、HTML テンプレート内で書きましたが、今回は「記事コンテンツ」内です。

(重要)
article_category 変数は、以下のループの中でのみ有効です。OR 記述が有効なのは、article_category 等の単独変数のみで、article.category という変数には使用できません。
<% loop:list_article -%>
<% /loop -%>
特定のカテゴリ(複数)の場合のみ、記事の下に参照リンクやコンテンツを付加します。

どうやら、変数の種類によって「できる、できない」があるようで、カテゴリ名ではできませんでした。OR 条件の書き方のルールとしては、これではっきりしましたが常に2項になるように「かっこ」でくくればいいようです。
<% if: (((article_category eq '10046946') + (article_category eq '10046812')) + ((article_category eq '10047034') + (article_category eq '10046894'))) + (((article_category eq '10046774') + (article_category eq '10046952')) + (article_category eq '10047062') ) -%>

<div class="listCategoryArticle" style='margin-top:15px;'>
【VBScript関連のカテゴリ】<br />
<ul>
<li><a href="http://logicalerror.seesaa.net/category/10046946-1.html">VBS + ADO</a></li>
<li><a href="http://logicalerror.seesaa.net/category/10046812-1.html">VBS + JavaScript</a></li>
<li><a href="http://logicalerror.seesaa.net/category/10047034-1.html">VBS + Shell</a></li>
<li><a href="http://logicalerror.seesaa.net/category/10046894-1.html">VBS + WMI</a></li>
<li><a href="http://logicalerror.seesaa.net/category/10046774-1.html">VBS + インターネット</a>
<li><a href="http://logicalerror.seesaa.net/category/10046952-1.html">VBS + ファイルシステム</a>
<li><a href="http://logicalerror.seesaa.net/category/10047062-1.html">VBS + 特殊オブジェクト</a>
</ul>
</div>

<% /if -%>





Seesaa独自タグ簡易リファレンス

タグ:Seesaa
posted by lightbox at 2014-09-27 15:14 | Seesaa プログ管理支援 | このブログの読者になる | 更新情報をチェックする

バッチファイル内の Call コマンドによるサブルーチンの呼び出し( errorlevel を戻して if で判断する )

コマンドプロントの拡張機能である、ラベルによる呼び出しは、デフォルトで有効になっています
CALL :ラベル 引数
以下に引数errorlevel を使用したサンプルを示します
@echo off
REM ****************************************
REM コマンドの先頭の @ は、そのコマンドの表示を抑制
REM echo off は以降のコマンドの表示を抑制
REM ****************************************

REM ****************************************
REM サブルーチンの呼び出し
REM ****************************************
call :GetDay 09
if errorlevel 1 ( 
	echo 現在の月は引数と一致しました & date /T
) else ( 
	echo 現在は引数以外の月です & date /T
)

REM ****************************************
REM 処理の終わり
REM ****************************************
goto end



REM ****************************************
REM サブルーチン
REM date /t で 2009/08/16 というような表示を / で区切り
REM 2番目の 08 を %%i へセットする
REM ****************************************
:GetDay
@for /F "delims=/ tokens=2" %%i in ('date /t') do (
	REM 現在が引数と一致する場合
	if "%%i"=="%1" (
		REM サブルーチンからの脱出と同時に errorlevel のセット
		exit /B 1
	)
)
REM 一致しなかった場合のサブルーチンからの脱出
exit /B 0

REM ****************************************
REM 記述の終わり
REM ****************************************
:end



REM ****************************************
REM 【補足】
REM
REM date /t の /t と call :ラベルは何れもデフォルトで有効な
REM コマンド拡張機能 です。
REM ****************************************

要点

:GetDay にジャンプして、exit コマンドで元へ戻ります。
exit /B で cmd.exe を終了するのでは無く制御を call の呼び出し元へ移します
exit /B 数値 によって、結果を戻り値として返します

if や else の結果で複数コマンドを実行したい場合は & でつなげます。
( if文は キーワードが行の先頭になければ複数行で記述できますが、コマンドは & でつなげる場合1行で記述する必要があります )


関連する記事


posted by lightbox at 2014-09-27 13:54 | コマンド : バッチファイル | このブログの読者になる | 更新情報をチェックする

コマンドプロンプト : テキストファイルの初期化と FOR でファイル列挙の方法

FOR : カレントのファイル列挙
FOR /D : カレントのディレクトリ列挙
FOR /F : テキストファイル内を列挙
FOR /R : 全てのファイル( サブディレクトリ内全て )列挙

実行内容

(3〜5)
オプションなしの FOR コマンドで、カレントファイルの一覧を *.* のワイルドカードで列挙しています

(8〜9)
> による リダイレクトの左辺に type nul という nul を表示するという結果を置いて、初期化しています。

(12〜14)
/D オプションで、カレントのディレクトリの一覧を列挙し、dir.txt に >> で追加書き込みをしています。( 本来実行するたびに追加されますが、実行前に初期化しています )

(17〜19)
/F オプションで列挙の対象をファイルにし、DO でファイル名を指定しています

(22〜24)
/R オプションで下位階層の全てのフォルダ内のファイル一覧を列挙して、all.txt に書き込んでいます。
@echo off
echo ファイル一覧
FOR %%i IN (*.*) DO (
	echo %%i
)

REM ファイル初期化
type nul > dir.txt
type nul > all.txt

echo 1階層 ディレクトリ一覧作成
FOR /D %%i IN (*.*) DO (
	echo %%i >> dir.txt
)

echo dir.txt 内列挙
FOR /F %%i IN (dir.txt) DO (
	echo %%i
)

echo 全階層 ファイル一覧
FOR /R %%i IN (*.*) DO (
	echo %%i >> all.txt
)



関連する記事


posted by lightbox at 2014-09-27 13:54 | コマンドプロンプト | このブログの読者になる | 更新情報をチェックする

Firefox、IE11 の canvas で動作する楕円( ellipse )関数

ellipse 関数は、Google Chrome で動作しますが、現時点で Firefox と IE11 で動作してなかったので、計算で Google Chrome の ellipse をエミュレートしました。
<style type="text/css">
#circle {
	border: solid 1px #000000;
}
</style>

<canvas id="circle"></canvas>

<script type="text/javascript">
	var canvas = document.getElementById("circle");
	canvas.width = 300;
	canvas.height = 300;
	var draw = canvas.getContext("2d");

	draw.beginPath();
	draw.fillStyle = "#c0c0c0";

	ellipse( draw, 80, 50, 100, 85, 0, Math.PI*2, false);
	draw.fill();
	draw.lineWidth = 3;
	draw.stroke();

// *********************************
// 楕円関数
// *********************************
function ellipse( obj, x, y, a, b, o1, o2, o3 ) {
	draw.save();
	draw.scale( 1, b / a );
	draw.arc(x, y+((a-b)+((y-a)-(y-a)*(b/a)))*(a/b), a, o1, o2, o3);
	draw.restore();

}
</script>
save と restore は、伸縮する楕円の枠線の太さが変わらないようにする処理です。計算は、scale による伸縮による座標の移動を逆計算したものです。


posted by lightbox at 2014-09-27 00:33 | JavaScript | このブログの読者になる | 更新情報をチェックする

2014年09月26日


GD で画像縮小。『1) 単純縮小、2) 幅にあわす 3) 高さにあわす 4) 任意の幅と高さ』をその他の処理も含めてクラスでまとめ( class GD )

読み出す画像は、Google の短縮 URL で動作確認しています。使用目的としては、画像をアップロードして縮小して保存する事ですが、保存前に必要ならば GD を使って修正をする事も想定しています。
<?php
# 新しいオブジェクト
$GD = new GD();

# WEB よりイメージを作成
# Google の短縮url で動作します
$GD->LoadJpeg( "http://goo.gl/CO1XaJ" );

# 赤のパレットを作成
$red = $GD->CreateColor( 255, 0, 0 );

# 線の太さを設定
$GD->SetLineWidth( 3 );

# パラメータの処理
if ( ctype_digit( $_GET['x'] ) ) {
	$x = $_GET['x'];
}
else {
	$x = 135;
}
if ( ctype_digit( $_GET['y'] ) ) {
	$y = $_GET['y'];
}
else {
	$y = 118;
}

# 楕円を描画
$GD->Arc( $x, $y, 60, 35, $red );

# 黒のパレットを作成
$black = $GD->CreateColor( 0, 0, 0 );

# 白のパレットを作成
$white = $GD->CreateColor( 255, 255, 255 );

# 点線のスタイルを作成
$style = array(
	$black,$black,$black,$black,$black,
	$white,$white,$white,$white,$white
);

# 線の太さを設定
$GD->SetLineWidth( 1 );

# スタイルを使用して斜め線を描画
$GD->Line( 20, 30, 200, 100, $style );

# 指定の大きさで新しいオブジェクトを作成
//$GD->Copy( $GD2, 0.3 );
//$GD->CopyW( $GD2, 100 );
//$GD->CopyH( $GD2, 200 );
$GD->CopyWH( $GD2, 600, 400 );

# 縮小画像をファイルとして保存
$GD2->SaveJpeg( "uf3_001.jpg" );

# ブラウザに表示
$GD2->Response( );

# 後処理
$GD->DestroyColor( $red );
$GD->Destroy( );
$GD2->Destroy( );


# ***********************
# クラス
# ***********************
class GD {

	var $im;
	var $type;

# ***********************
# コンストラクタ
# ***********************
	function GD( ) {
	}

# ***********************
# キャンバス作成
# ***********************
	function CreateCanvas( $Width, $Height, $Type="PNG" ) {
		$this->type = $Type;
		$this->im = imagecreatetruecolor($Width, $Height);
	}

# ***********************
# PNG ロード
# ***********************
	function LoadPng( $Target ) {
		$this->type = "PNG";
		$this->im = ImageCreateFromPng($Target);
	}
 
# ***********************
# JPEG ロード
# ***********************
	function LoadJpeg( $Target ) {
		$this->type = "JPEG";
		$this->im = ImageCreateFromJpeg($Target);
	}

# ***********************
# 色リソース作成
# ***********************
	function CreateColor( $Red, $Green, $Blue ) {
		$ret = ImageColorAllocate (
			$this->im,
			$Red, $Green, $Blue );
		return $ret;
	}

# ***********************
# 線幅設定
# ***********************
	function SetLineWidth( $Width ) {
		ImageSetThickness( $this->im, $Width );
	}

# ***********************
# 直線の描画
# ***********************
	function Line( $x1, $y1, $x2, $y2, $Option ) {
		if ( is_array( $Option ) ) {
			ImageSetStyle( $this->im, $Option );
			ImageLine(
				$this->im, $x1, $y1, $x2, $y2, IMG_COLOR_STYLED );
		}
		else {
			ImageLine(
				$this->im, $x1, $y1, $x2, $y2, $Option );
		}
	}

# ***********************
# 矩形の描画
# ***********************
	function Box( $x, $y, $w, $h, $Color, $fill=FALSE ) {
		if ( $fill ) {
			imageFilledRectAngle(
				$this->im, $x, $y, $x+$w, $y+$h, $Color );
		}
		else {
			ImageRectAngle(
				$this->im, $x, $y, $x+$w, $y+$h, $Color );
		}
	}

# ***********************
# 楕円の描画
# ***********************
	function Arc( $x, $y, $w, $h, $Color ) {
		ImageArc( $this->im, $x, $y, $w, $h, 0, 359, $Color );
	}

# ***********************
# ブラウザへ出力
# ***********************
	function Response( ) {
		switch( $this->type ) {
			case "PNG":
				header('Content-Type: image/png');
				ImagePng( $this->im );
				break;
			case "JPEG":
				header('Content-Type: image/jpeg');
				ImageJpeg( $this->im );
				break;
		}
	}

# ***********************
# PNG 保存
# ***********************
	function SavePng( $FilePath ) {
		ImagePng( $this->im, $FilePath );
	}

# ***********************
# JPEG 保存
# ***********************
	function SaveJpeg( $FilePath, $Quality=75 ) {
		ImageJpeg( $this->im, $FilePath, $Quality );
	}

# ***********************
# 色リソース開放
# ***********************
	function DestroyColor( $Color ) {
		ImageColorDeallocate( $this->im, $Color );
	}

# ***********************
# イメージの破棄
# ***********************
	function Destroy( ) {
		ImageDestroy ( $this->im );
	}

# ***********************
# 伸縮された新しいイメージの作成
# ***********************
	function Copy( &$New, $rate ) {
		$w = ImageSx( $this->im );
		$h = ImageSy( $this->im );
		$New = new GD();
		$New->im = ImageCreateTrueColor( $w * $rate, $h * $rate );
		$w2 = ImageSx( $New->im );
		$h2 = ImageSy( $New->im );
		ImageCopyResampled(
			$New->im,
			$this->im,
			0,0,0,0,
			$w2, $h2,
			$w, $h
		);
		$New->type = $this->type;
	}

	function CopyW( &$New, $w_new ) {
		$w = ImageSx( $this->im );
		$rate = $w_new / $w;
		$h = ImageSy( $this->im );
		$New = new GD();
		$New->im = ImageCreateTrueColor( $w_new, $h * $rate );
		$w2 = ImageSx( $New->im );
		$h2 = ImageSy( $New->im );
		ImageCopyResampled(
			$New->im,
			$this->im,
			0,0,0,0,
			$w2, $h2,
			$w, $h
		);
		$New->type = $this->type;
	}

	function CopyH( &$New, $h_new ) {
		$w = ImageSx( $this->im );
		$h = ImageSy( $this->im );
		$rate = $h_new / $h;
		$New = new GD();
		$New->im = ImageCreateTrueColor( $w * $rate, $h_new );
		$w2 = ImageSx( $New->im );
		$h2 = ImageSy( $New->im );
		ImageCopyResampled(
			$New->im,
			$this->im,
			0,0,0,0,
			$w2, $h2,
			$w, $h
		);
		$New->type = $this->type;
	}

	function CopyWH( &$New, $w_new, $h_new ) {
		$w = ImageSx( $this->im );
		$h = ImageSy( $this->im );
		$New = new GD();
		$New->im = ImageCreateTrueColor( $w_new, $h_new );
		$w2 = ImageSx( $New->im );
		$h2 = ImageSy( $New->im );
		ImageCopyResampled(
			$New->im,
			$this->im,
			0,0,0,0,
			$w2, $h2,
			$w, $h
		);
		$New->type = $this->type;
	}
}


タグ:gd PHP
posted by lightbox at 2014-09-26 22:18 | PHP + WEBアプリ | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します


Windows
container 終わり

フリーフォントで簡単ロゴ作成
フリーフォントでボタン素材作成
フリーフォントで吹き出し画像作成
フリーフォントではんこ画像作成
ほぼ自由に利用できるフリーフォント
フリーフォントの書体見本とサンプル
画像を大きく見る為のウインドウを開くボタンの作成

Android SDK ポケットリファレンス
改訂版 Webデザイナーのための jQuery入門
今すぐ使えるかんたん ホームページ HTML&CSS入門
CSS ドロップシャドウの参考デモ
PHP正規表現チェッカー
Google Hosted Libraries
cdnjs
BUTTONS (CSS でボタン)
イラストAC
ぱくたそ
写真素材 足成
フリーフォント一覧
utf8 文字ツール
右サイド 終わり
base 終わり