Category: プログラム

PHPのinput type=”file”の制限について

input type = “file”

でuploadの数が制限されている事について

デフォルトでは20になっているので1ページ辺り20以上のファイルアップロードがあると

20より後のinputはUP出来ません。

そうなった場合は

/etc/php.ini

max_file_uploads = 80;

と加えるか書き換えるか行う。

 

 

Webページをサムネイル化する

Webページをサムネイル化してリアルタイムに表示しているサイトがありますが

どの様にやったら出来るか考えると。

1.HTMLをレンダリングして、そこから画像生成
2.画面キャプチャして画像生成

の2点くらいしか思い浮かばない。

そこで
実際にどの様に実現しているのか気になったので調べてみた。

基本的にWebサーバーとして使用するLinuxはCUIなので
画面にWebページを表示することが出来ません。
そこで、仮想GUIを作ってその中で画像キャプチャをする様です。

参考

1.Xvfb(仮想フレームバッファ)起動

2.firefox(ブラウザ)起動

3.firefox(ブラウザ)でURLにアクセス

4.ImageMagickでスクリーンショットを取る

5.画像保存

6.firefox(ブラウザ)終了

7.Xvfb(仮想フレームバッファ)サーバー終了

インストールコマンド

yum grouplist

yum groupinfo “X Window System”

yum upgrade xorg-x11-xfs

yum upgrade xorg-x11

yum upgrade xorg-x11-devel

yum upgrade xorg-x11-libs

yum groupupdate “X Window System”

yum upgrade xorg-x11-libs

yum install xorg-x11-Xvfb

yum groupinstall “X Window System”

yum groupinstall “Japanese Support”

yum groupinstall “GNOME Desktop Environment”

yum install firefox

yum install ImageMagick

FireFoxの設定

~/.mozilla/firefox/xxxxxxxx.default/

user.js
user_pref("browser.sessionstore.enabled", false);
user_pref("browser.sessionstore.resume_from_crash", false);
user_pref("browser.startup.page", 0);
user_pref("plugin.default_plugin_disabled", false);
user_pref("privacy.popups.disable_from_plugins", 3);
user_pref("alerts.totalOpenTime", 1);
user_pref("security.enable_ssl2", false);
user_pref("security.enable_ssl3", false);

userChrome.css

/* Pop-up bookmarks toolbar */
#PersonalToolbar {display: none;}
#navigator-toolbox:hover > #PersonalToolbar {display: -moz-box;}

サンプルコード


//エイリアス設定
# DISPLAY=:1.0
# export DISPLAY

//Xvfb(仮想Xサーバー)起動

$command = '/usr/X11R6/bin/Xvfb :1 -screen 0 1024x768x24 > /dev/null &';
// 1024*768のフルカラー(1677万色)のディスプレイをID1で用意するという意味

$last_line = system($command , $rtn);

//firefox起動(プロファイル”user”で起動)

$command = '/usr/bin/firefox -display :1 -width 1024 -height 800 -P "user" > /dev/null &';

$last_line = system($command , $rtn);

//60秒待つ

sleep(60);

$url = 'http://www.res-system.com/weblog/';

//サムネイル画像パス指定

$thumbimg = '/thumb/t.gif'; //サムネイル画像

$img = '/img/i.gif';        //サムネイル元画像

//firefox上でサイト表示

$command = '/usr/bin/firefox -display :1 -remote "openurl(' . $url . ')" &';

$last_line = system($command , $rtn);

//10秒待つ

sleep(10);

//ImageMagickでスクリーンショットを画像に保存

$command = '/usr/bin/import -display :1 -window root ' . $img;

$last_line = system($command , $rtn);

//保存した画像のサイズを求める

list($width, $height, $type, $attr) = getimagesize($img);

//画像の作成

$im = imagecreatefromgif($img);

//サムネイル画像加工(サムネイル元画像からサイズ縮小)

$thumb_im = imagecreatetruecolor(120, 90);

imagecopyresampled($thumb_im, $im, 0, 0, 0, 90, 120, 90, $width, $height);

//サムネイル画像を保存

imagegif($thumb_im, $thumbimg);

//firefox終了

$command = 'killall firefox-bin > /dev/null &';

$last_line = system($command , $rtn);

//Xvfb(仮想Xサーバー)終了

$command = 'killall Xvfb > /dev/null &';

$last_line = system($command , $rtn);

抜粋しただけなのでやってみます。

PHPで画像出力

PHPで画像を出力する必要が出てきた場合が多くなってきたのでメモ。

応用すれば
・表示する画像と表示しない画像をPHPの処理で切り分ける
・PHPで画像を生成して表示する(QRコードなど)
・docomoでSSLを利用する際、別ドメインの画像が表示できないのを回避。

というような事が出来ます。

表示するだけのコードはいたってシンプルで

表示するページに適当なファイル名で

の様に記述して
そのファイル名の中(上記の場合はimageCreate.php)で

header(‘Content-type: image/jpeg’);
readfile(‘画像のパス(この場合はjpgファイル)’);

と書けば出力されます。

gifの場合は
header(‘Content-type: image/gif’);

pngの場合は
header(‘Content-type: image/png’);

としてやればOK。

ちなみにreadfileはアクセス制御されていなければ
自分のサーバーでも、ほかのサイトの画像でも取得可能です。

応用例としては

/***********************
画像を作成する処理

取得する画像のパスを作成する処理
***********************/

header(‘Content-type: (画像のタイプに合わせて)’);
readfile(‘読み込むパス’);

として、取得する画像のパスを決める値をGETなどで渡してやれば
1つのファイルで動的に画像取得が出来ます。

jQueryプラグインsuperfish、IE6でのバグ

jQueryプラグインsuperfishはマウスオーバーメニューを作成する為のプラグインです。

エフェクトも綺麗で良いプラグインなんですが、IE6でz-indexのバグがあり

修正に少し時間がかかったのでメモ。

修正する為には

jquery.bgiframe.min.jsが必要です。

IE6特有のバグになるので

<!--[if IE 6]><script type="text/javascript" src="js/jquery.bgiframe.min.js"></script><![endif]-->

と読み込んでおいて

<script type="text/javascript">
jQuery(document).ready(function(){
		//プラグインを使用する際は先にプラグインを適用
		if (typeof document.documentElement.style.maxHeight != "undefined") { //IE7以上、Firefox, Opera, Chrome等
ツjQuery("ul.sf-menu").supersubs({
            minWidth:    12,
   maxWidth:    27,
ツextraWidth:  1
ツツ        }).superfish();
ツ    });

} else { //IE6

ツjQuery("ul.sf-menu").supersubs({
            minWidth:    12,
        maxWidth:    27,
ツ            extraWidth:  1
     }).superfish().find('ul').bgIframe({opacity:false}); 
//jquery.bgiframe.min.jsを選択エリアに適用
});

}

}); </script>

とすればOK。

他のブラウザの場合は読み込んでも読みこまなくても影響がないので、IE6用のコードだけでも問題は無いです。

中ページの大きさに合わせてiframeの大きさを変える

javascript使えば出来そうだなと思っていたら、やっぱり合ったので忘れないようにメモ。

http://css-eblog.com/javascript/fit-height-iframe.html

TinyMCEのボタンコントロール一覧

ボタンコントロールの設定と一覧

theme_advanced_buttons1:"",            //ツールバー1段目の設定
theme_advanced_buttons1_add:"",        //ツールバー1段目に加える
theme_advanced_buttons1_add_before:"", //ツールバー1段目の前に加える
theme_advanced_disable:"",             //指定のボタンを使用不可にする
  • bold : 太字 (Ctrl+B)
  • italic : 斜体 (Ctrl+I)
  • underline : 下線 (Ctrl+U)
  • striketrough : 取り消し線
  • justifyleft : 左揃え
  • justifycenter : 中央揃え
  • justifyright : 右揃え
  • justifyfull: 両端揃え
  • style :スタイル(class)
  • format : フォーマット
  • fontfamily :フォント
  • wp_more : <!窶杜ore窶・gt;タグ (WP)
  • wp_page : <!窶渡extpage窶・gt;タグ (WP)
  • cut : 切り取り
  • copy : コピー
  • paste : 貼り付け
  • pastetext : 貼り付け(テキスト形式)
  • pasteword : 貼り付け(HTML形式)
  • search : 検索
  • replace :置き換え
  • bullist : 箇条書き<ul><li>
  • numlist : 段落番号<ol><li>
  • outdent : アウトデント
  • indent : インデント<blockquote>
  • undo : 元に戻す (Ctrl+Z)
  • redo : 繰り返し (Ctrl+Y)
  • link :リンクを挿入・編集
  • unlink :リンクを外す
  • anchor :アンカーリンク
  • image :イメージを挿入・編集
  • cleanup :コードを整える
  • chelp :ヘルプ
  • wp_help : ヘルプ(WP)
  • code :HTHLソースを表示する
  • insertdate : 日付の挿入
  • inserttime : 時間の挿入
  • forecolor : フォントカラー
  • backcolor : バックカラー

  • tablecontrols : テーブル(表)の挿入・編集
  • hr : <hr>水平線の挿入
  • removeformat :書式の削除
  • visualaid : 見えない要素の可視切り替え
  • sub : <sub>下付き
  • sup : <sup>上付き
  • charmap : 特殊文字を挿入
  • emotions : 顔キャラを挿入
  • rtl : dir=”rtl” 文字の方向(右→左)
  • ltr : dir=”ltr” 文字の方向(左→右)
  • preview : プレビュー
  • fullscreen : フルスクリーンモード
  • insertlayer : レイヤの挿入
  • moveforward :前面へ移動
  • movebackward :後面へ移動
  • absolute :絶対位置を指定
  • styleprops :スタイルを指定
  • cite :<cite> 引用・参照
  • abbr :<abbr> 略語
  • acronym :<acronym> 頭字語
  • del :<del> 後から削除された
  • ins :<ins> 後から挿入された
  • attribs :属性の編集
  • visualchars :制御文字の可視切り替え
  • nonbreaking : の挿入
  • zoom : ズーム(IE)
  • template :テンプレートの呼び出し

設定オプション

エディタの各部分の位置やサイズ

theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_path_location : "bottom",
theme_advanced_resizing : true,
theme_advanced_resize_horizontal : false,

その他オプション

//スタイルコントロールの設定
theme_advanced_styles : "class1=class1;class2=class2;",

//フォーマットコントロールの設定
theme_advanced_blockformats : "p,div,h1,h2,h3,h4,h5,h6,pre,blockquote,code",

//エディタ内のスタイルシート
//(wp-tinyMCEではthemes/(あなたのテーマ)/editor.cssがデフォルトとなっております)
content_css : "editor.css"

//日付や時間の挿入のフォーマット
plugin_insertdate_dateFormat : "%Y-%m-%d",
plugin_insertdate_timeFormat : "%H:%M:%S",

//エディタ内の自動的に改行
nowrap : false,

//出力するHTMLを自動に整形する <pre>内が勝手に整形された!
apply_source_formatting :false,

//*firefoxのみ Enterキーで改行した場合true:<p> false:<br /> falseにしたら文末のタグから出られない!
force_p_newlines : true,

よく使うリンク,イメージ,メディア等を登録

external_link_list_url :  "mylinklist.js",
external_image_list_url : "myimagelist.js",
media_external_list_url : "mymedialist.js",
template_external_list_url : "mytemplatelist.js",

窶・mylinklist.js 窶貼r

var tinyMCELinkList = new Array(
	// Name, URL
	["Moxiecode", "http://www.moxiecode.com"],
	["Freshmeat", "http://www.freshmeat.com"],
	["Sourceforge", "http://www.sourceforge.com"]
);

窶・myimagelist.js 窶貼r

var tinyMCEImageList = new Array(
	// Name, URL
	["Logo 1", "logo.jpg"],
	["Logo 2 Over", "logo_over.jpg"]
);

窶・mylinklist.js 窶貼r

var tinyMCEMediaList = new Array(
	// Name, URL
	["Some Flash 1", "test1.swf"],
	["Some Flash 2", "test2.swf"]
);

窶・mytemplatelist.js 窶貼r

var tinyMCETemplateList = [
	// Name, URL, Description
	["Simple snippet", "templates/snippet1.htm", "Simple HTML snippet."],
	["Layout", "templates/layout1.htm", "HTML Layout."]
];

FireFox&IEお気に入り登録ボタンの処理

お気に入り登録ボタンを作成する際、ブラウザによって登録の仕方が違うので、処理をブラウザ毎に切り替える必要がある。
処理は以下の通り

function addBookmark(title,url) {
if (window.sidebar) {
window.sidebar.addPanel(title, url,”");
} else if( document.all ) {
window.external.AddFavorite( url, title);
} else if( window.opera && window.print ) {
return true;
}
}

上記javascriptを記述したら

<input type=”button” value=”お気に入りに登録” onClick=”addBookmark(document.title, location.href);”>

とボタンを生成して完了。

FlowindのPHP関数PickUp(nl2br)

第一回のリンク先から見つけた関数です。

string nl2br ( string string )

stringに含まれるすべての改行文字の 前に ‘<br />’ を挿入して返します。

注意: PHP 4.0.5以降、nl2br() は XHTML互換となってい ます。PHP 4.0.5より前の全てのバージョンでは、 nl2br() は、stringの全 ての改行記号の前に’<br />’の代わりに ‘<br>’を挿入し て返します。

PHPマニュアル-nl2br

FlowindのPHP関数PickUp(wordwrap)

関数を調べていて、すぐには使わないけどもメモしておきたい関数等を書きとめていきます。

string wordwrap ( string str [, int width [, string break [, bool cut]]] )

オプションの widthパラメータで指定したカ ラム番号で文字列strを分割します。(オプショ ンの)breakパラメータを用いて行は分割されま す。

widthまたはbreakが 指定されない場合、wordwrap()は75カラムで自動的に 分割し、’\n‘ (改行)を用いて分割します。

cutが1に設定された場合、文字列は常に指定し た幅でラップされます。このため、指定した幅よりも長い単語がある場 合には、分割されます。

PHPマニュアル-wordwrap

ファイルのパス検索(glob関数)

フォルダ内にあるファイルを検索したい。

特定の拡張子のファイル一覧を取得したい。

といった処理の際、

scandirやdir関数ですべてのファイルを引っ張ってきてLoopで回して、該当するファイルだけ取り出す。

とやっていましたが、もっと便利な関数がありました。

glob関数です。

array  glob (  string  $pattern [,  int  $flags = 0   ] )

optionには

  • GLOB_MARK – 各戻り値にスラッシュを追加します
  • GLOB_NOSORT – ディレクトリに存在するファイルを返します (ソートはされません)
  • GLOB_NOCHECK – 検索パターンにマッチするファイルが 見つからない場合に検索パターン自身を返す
  • GLOB_NOESCAPE – バックスラッシュによってメタ文字をクォートしません
  • GLOB_ONLYDIR- ディレクトリだけを取得する
  • GLOB_BRACE-複数のパターンを指定する
  • GLOB_ERR-エラーが発生した際に処理をストップする(ver 5.1以降)

が存在し、結構多いニーズに答えてくれる関数がこのglob関数です。

複数指定する場合はoptionにGLOB_BRACEを指定して以下のように書けば

foreachツ(glob("{*.jpg,*.jpeg,*.gif,*.png}",ツGLOB_BRACE)ツasツ$filename)ツ{
echoツ'<imgツsrc="'ツ.ツ$filenameツ.ツ'"ツalt="'ツ.ツ$filenameツ.ツ'"ツ/>';
}

これで画像の拡張子をもつファイルのpathが取得できます。

PHPリファレンス-glob

WordPress Themes