Lightbox Info Board : SQLの窓


<img src="http://ドメイン/phpを登録するパス/img.php?img=画像番号" />


<?
$mobile_flg = true;
$target = $_SERVER["HTTP_USER_AGENT"] . "DoCoMoSoftBankKDDI";

while(true) {

	$mobile_chk = strpos( $target, "DoCoMo" );
	if ( $mobile_chk == 0 ) {
		break;
	}
	$mobile_chk = strpos( $target, "SoftBank" );
	if ( $mobile_chk == 0 ) {
		break;
	}
	$mobile_chk = strpos( $target, "KDDI" );
	if ( $mobile_chk == 0 ) {
		break;
	}

	$mobile_flg = false;
	break;
}

if ( $_GET['img'] == '' ) {
	header( "Content-Type: text/html; Charset=shift_jis" ); 
}
else {
	$fname = explode( ".", $_GET['img'] );
	$ext = $fname[count($fname)-1];
	if ( strtoupper( $ext ) == "PNG" ) {
		header( "Content-Type: image/png" ); 
		responseImg($_GET['img']);
	}
	else if ( strtoupper( $ext ) == "JPG" || strtoupper( $ext ) == "JPEG" ) {
		header( "Content-Type: image/jpg" ); 
		responseImg($_GET['img']);
	}
	else {
		if ( $mobile_flg ) {
			header( "Content-Type: image/jpg" ); 
			responseImg($_GET['img'].".jpg");
		}
		else {
			header( "Content-Type: image/png" ); 
			responseImg($_GET['img'].".png");
		}
	}
	exit();
}
header( "Expires: Wed, 31 May 2000 14:59:58 GMT" ); 

$sub_domain = 'teblo';
$root_url = "http://$sub_domain.seesaa.net/pages/user/m/index";

if ( $_SERVER["HTTP_REFERER"] == '' ) {
	$_SERVER["HTTP_REFERER"] = $root_url;
}

if ( !$mobile_flg ) {
	header( "Location: $root_url" );
	exit();
}

function responseImg( $path ) {

	$fp = fopen( $path, 'rb' );

	if ( $fp ) {

		while( TRUE ) {
			if ( feof( $fp ) ) {
				break;
			}
			$ret = fread( $fp, 1024 );
			print $ret;
		}

		fclose( $fp );
	}

}

?>
<html>
<body>
<?php

require_once("ad.php");

?>
<hr>
<img src="<?= $_GET['id'] ?>">
<hr>
(*)<a href="<?= $_SERVER["HTTP_REFERER"] ?>" accesskey="*">戻る</a><br>
(0)<a href="<?= $root_url ?>" accesskey="0">このﾌﾞﾛｸﾞのﾄｯﾌﾟ</a><br>
</body>
</html>

このコードで、img パラメータが無く、id パラメータが渡された場合、カレントにあるその番号
をファイル名を持つ画像ファイルを表示する、Seesaa 用の携帯ページのサンプルになります。
( その場合、携帯からでないと画像表示ページは表示されません : よって、幅は 240ピクセル固定です )

http://lightbox.on.coocan.jp/image/mobile/img.php?id=1250192693819290.jpg

例


http://ドメイン/phpを登録するパス/img.php?id=画像番号

必要な画像を自分の手書きブログから収集する

必要な画像を表示する為に、大きな画像とサムネイル画像は手書きブログに元々あるので
取り込んで、携帯用の幅 240ピクセルの画像を GD で作成します。

IE用ボタンはクリップボードにあるデータを貼り付ける為にあります。
クリップボード内の文字列の仕様は以下のようになります

タイトル + 0x1a + 画像URL

ソースコード


<?
header( "Content-Type: text/html; Charset=shift_jis" ); 
header( "Expires: Wed, 31 May 2000 14:59:58 GMT" ); 

$sub_domain = 'teblo';
$root_url = "http://$sub_domain.seesaa.net/pages/user/m/index";

if ( $_SERVER["HTTP_REFERER"] == '' ) {
	$_SERVER["HTTP_REFERER"] = $root_url;
}

if ( $_GET['send'] == '実行' ) {
	$fname2 = explode( "/", $_GET['url'] );
	$fname2 = $fname2[count($fname2)-1];
	$fname = explode( ".", $fname2 );

//	$chk = file_exists( $fname2 );
	file_put_contents( "{$fname[0]}.png", file_get_contents($_GET['url']) );
	file_put_contents( "{$fname[0]}_120.jpg", file_get_contents($_GET['url'] . "_S.jpg") );
	file_put_contents( "{$fname[0]}.txt", $_GET['ttl'] );
	$ret = ImageConvert( $fname[0], 240, 60 );

}

function ImageConvert( $filename, $size, $q ) {

	global $err_message;

	# ファイルの属性等を取得
	$target	= getimagesize( "$filename.png" );
 
	# 現在のサイズ
	$width	= $target[0];
	$height	= $target[1];

	$width_new	= $size;	// 幅固定
	$height_new = (int)( ($height/$width)*$width_new );
 
	$jpeg		= @imagecreatefrompng ( "$filename.png" );
	if ( $jpeg === false ) {
		return false;
	}
	# 新しいイメージ
	$jpeg_new	= @imagecreatetruecolor( $width_new, $height_new );
	if ( $jpeg_new === false ) {
		return false;
	}

	# サイズ変更して新しいイメージへ転送
	$ret = @imagecopyresampled(
		$jpeg_new,
		$jpeg,
		0,
		0,
		0,
		0,
		$width_new,
		$height_new,
		$width,
		$height
	);

	if ( !$ret ) {
		return false;
	}

	# JPEG ファイルとして、出力
	$ret = @imagejpeg ( $jpeg_new, "$filename.jpg", $q );
	if ( !$ret ) {
		return false;
	}

	return true;
}

?>
<html>
<head>
<script type="text/javascript">
function setData() {
	var str = clipboardData.getData("Text")
	reg = new RegExp(String.fromCharCode(160),"g");
	var aData = str.split(String.fromCharCode(0x1a));

	document.getElementsByName("ttl")[0].value = aData[0];
	if ( aData.length == 2 ) {
		document.getElementsByName("url")[0].value = aData[1];
	}
}
</script>
</head>
<body>
<form>
タイトル:<br>
<input type="text" name="ttl" style='width:250px' value="<?= $_GET['ttl'] ?>">
<input type="button" value="IE用セット" onClick='setData()'>
<br>
ＵＲＬ:<br>
<input type="text" name="url" style='width:500px' value="<?= $_GET['url'] ?>">
<br>
<input type="submit" name="send" value="実行">
</form>
<hr>
<img src="<?= ( $fname[0] . ".jpg" ) ?>">
<hr>
<img src="<?= ( $fname[0] . "_120.jpg" ) ?>">
<hr>
<img src="<?= ( $fname[0] . ".png" ) ?>">
<hr>
(*)<a href="<?= $_SERVER["HTTP_REFERER"] ?>" accesskey="*">戻る</a><br>
(0)<a href="<?= $root_url ?>" accesskey="0">このﾌﾞﾛｸﾞのﾄｯﾌﾟ</a><br>
</body>
</html>

登録用のクリップボードデータを作成する IE 拡張

右クリックで表示されるポッフアップメニューに登録して、手書きブログの大きい画像
を表示する画面で画像上を右クリックして取得します。また、SHIFT キーを押しながら
実行すると、仕様どおりのIMG 要素を使った貼り付けコードが取得されます

30行目の以下の部分を変更する必要があります
strInstall = "http://ドメイン/phpを登録するパス"

SHIFT キーを押しながら取得すると以下のようになります


<img src="http://ドメイン/phpを登録するパス/img.php?img=画像番号" style='border:solid 1px #000000'  alt="タイトル" />

ie_tebloimg.wsf


<JOB>
<COMMENT>
************************************************************
IE 拡張メニューインストーラ

■手書きブログのページ上の画像からタイトルとURLを取得

■著作権その他

このプログラムはフリーです。どうぞ自由に御使用ください。
著作権は作者である私(lightbox)が保有しています。
また、本ソフトを運用した結果については、作者は一切責任を
負えせんのでご了承ください。
************************************************************
</COMMENT>

<SCRIPT
	language="VBScript"
	src="http://homepage2.nifty.com/lightbox/laylaClass.vbs">
</SCRIPT>

<SCRIPT language=VBScript>
' ***********************************************************
' 処理開始
' ***********************************************************
Call laylaFunctionTarget( "http://homepage2.nifty.com/lightbox/" )
Call laylaLoadFunction( "baseFunction.vbs" )

' img.php がある URL
strInstall = "http://ドメイン/phpを登録するパス"

' //////////////////////////////////////////////////////////
' インストール時の表示名
strProgName	= "手書きブログの画像情報"
' インストールファイル名( 拡張子は .htm となる )
strProgFile	= "img_tebroibfo"
' メニューとウインドウのタイトルに表示する文字列
' レジストリに登録するのでユニークである必要があります
strRegName	= "－◎手書きブログの画像情報"
' 対象となるコンンテンツ
nTargetType 	= &H2
' &H3F : UNKNOWNを除く全て
' &H1  : DEFAULT
' &H2  : IMAGE
' &H4  : CONTROL
' &H8  : TABLE
' &H10 : TEXTSELECT
' &H20 : ANCHOR
' &H40 : UNKNOWN

' 画面ありかどうか
bIsGUI = False
' //////////////////////////////////////////////////////////



' Csript.exe で実行を強制
' Crun

print strProgName & " をインストールします"
if not OkCancel( "インストールしてもよろしいですか?" ) then
	Wscript.Quit
end if

' ファイルシステムオブジェクト作成
GetFso

' 問題をできるだけ避ける為にc ドライブ固定(必要ならばここを変更)
strInstallPath1 = "c:\laylaClass"
strInstallPath2 = "c:\laylaClass\menuex"
strInstallPath3 = "c:\laylaClass\menuex\" & strProgFile & ".htm"
on error resume next
if not Fso.FolderExists( strInstallPath1 ) then
	Call Fso.CreateFolder( strInstallPath1 )
	if Err.Number <> 0 then
		ErrorFlg = True
	end if
end if
if not Fso.FolderExists( strInstallPath2 ) then
	Call Fso.CreateFolder( strInstallPath2 )
	if Err.Number <> 0 then
		ErrorFlg = True
	end if
end if
on error goto 0

strText = Replace(GetInline("MenuExt"),"$REGNAME", strRegName )
strText = REplace( strText, "$TARGET", strInstall )

Call PutTextFile( strInstallPath3, strText )_

' レジストリ処理用オブジェクト作成
GetWshShell

on error resume next
WshShell.RegWrite _
	"HKCU\Software\Microsoft\Internet Explorer\MenuExt\"&strRegName&"\", _
	strInstallPath3, _
	"REG_SZ"
WshShell.RegWrite _
	"HKCU\Software\Microsoft\Internet Explorer\MenuExt\"&strRegName&"\Contexts", _
	nTargetType, _
	"REG_DWORD"
WshShell.RegWrite _
	"HKCU\Software\Microsoft\Internet Explorer\MenuExt\"&strRegName&"\Html", _
	"<img src=""$URL"" galleryimg=""no"" style='border-style:solid;border-width:1px;border-color:#000000' $ALT $TITLE />", _
	"REG_SZ"

if bIsGUI then
	' この定義があると、画面あり
	WshShell.RegWrite _
		"HKCU\Software\Microsoft\Internet Explorer\MenuExt\"&strRegName&"\Flags", _
		&H1, _
		"REG_DWORD"
end if
on error goto 0

print "処理が終了しました"

Wscript.Quit

</SCRIPT>

<COMMENT>
******** ●ここを変更● ********
</COMMENT>
<RESOURCE id="MenuExt">
<![CDATA[
<meta http-equiv="content-type" content="text/html; charset=SHIFT_JIS">
<SCRIPT language="VBScript">

	Dim WshShell,RegName,strLocation,obj,doc

	Set WshShell = CreateObject("WScript.Shell")
	RegName = "$REGNAME"

	' *************************************************
	' ウインドウサイズ
	' *************************************************
'	window.dialogWidth = "900px"
'	window.dialogHeight = "610px"

'	window.dialogTop = "100px"
'	window.dialogLeft = (window.screen.width/2)&"px"

	strLocation = external.menuArguments.location

	on error resume next
	ExecuteGlobal "function dummy(): end function"
	on error goto 0

	' SHIFTとCTRL用変数
	Dim keyflg1,keyflg2
	keyflg1 = False
	keyflg2 = False

Function setObj( src )
	Set obj = src
End Function
</SCRIPT>

<SCRIPT language="JavaScript">
setObj(external.menuArguments.event.srcElement);
</SCRIPT>
<html>
<head>
<title>$REGNAME</title>
<base target="_self">
</head>
<BODY>
<!--SHIFTとCTRLがおされているかどうかを取得するボタン-->
<INPUT id="btn" type=button onClick='keyflg1=window.event.shiftKey:keyflg2=window.event.ctrlKey'>
</BODY>
</html>
<SCRIPT language="VBScript">

	' ボタンの呼び出し
	document.getElementById("btn").click()

	on error resume next
	' *************************************************
	' 画像専用処理( レジストリ 0x2 )
	' *************************************************
	str = obj.src
	if Err.Number <> 0 then
		str = "URL を取得できませんでした"
	else
		txt = obj.alt
		txt = Trim( txt )
		if txt = "" then
			txt = obj.title
		end if

		if keyflg1 then
			aFn = Split( str, "/" )
			fn1 = aFn(Ubound(aFn))
			aFn = Split( fn1, "." )
			fn2 = "$TARGET/img.php?img=" & aFn(0)

			strText = "<img src=""" & _
				fn2 & _
				""" style='border:solid 1px #000000' " & _
				" alt="""& txt &""" />"
			strText2 = strText
		else
			txt = obj.alt
			txt = Trim( txt )
			if txt <> "" then
				strText = txt
			else
				strText = obj.title
			end if

			strText2 = txt & vbCrLf & str
			strText = txt & Chr(&H1A) & str
		end if

		' 取得できたらクリップボードにセット
		Call window.clipboardData.setData("Text",strText)

	end if
	on error goto 0

	alert(strText2)


</SCRIPT>
]]>
</RESOURCE>

</JOB>

Seesaa の携帯ページに設置する外部画像を表示させるコード

Seesaa の仕様だと思いますが、外部の画像を貼り付けると画像がそのまま表示されないので
スクリプトで変更しています。実際のモバイル環境では確認できていませんが、i モード HTML
ブラウザでは正しく表示されています。


<script type="text/javascript"><!--
try {
	len = document.getElementsByTagName("img").length;
	for( content_idx = (len-1); content_idx >= 0; content_idx-- ) {
		if ( document.getElementsByTagName("img")[content_idx].getAttribute("alt") == 'カメラ' ) {
			document.getElementsByTagName("img")[content_idx]
			.parentNode.removeChild(document.getElementsByTagName("img")[content_idx]);
		}
	}
}
catch(e){}

try {
	len = document.getElementsByTagName("A").length;
	for( content_idx = 0; content_idx < len; content_idx++ ) {
		if ( document.getElementsByTagName("A")[content_idx].firstChild.nodeValue == '画像' ) {
			document.getElementsByTagName("A")[content_idx]
			.removeChild(document.getElementsByTagName("A")[content_idx].firstChild);
			var imgUrl = document.getElementsByTagName("A")[content_idx].getAttribute("href");
			var brContent = document.createElement("br");
			document.getElementsByTagName("A")[content_idx].appendChild(brContent);
			var imgContent = document.createElement("img");
			var lens = imgUrl.length;
			if ( imgUrl.substr( lens - 5, 5 ) == "S.jpg" ) {
				imgContent.setAttribute("width","60");
				imgContent.style.width = "60px";
			}
			imgContent.setAttribute("src",imgUrl);
			imgContent.style.borderWidth = "0px";
			document.getElementsByTagName("A")[content_idx].appendChild(imgContent);
		}
	}

}
catch(e){}

//-->
</script>