あの忌まわしいprototype汚染から逃れることが可能で、しかもクロスブラウザ対応にもできちゃうという魔法のフレームワークjQueryがはてなブログでは使えるの！？はたしてその真相はいかに！？
<script type="text/javascript">
$(document).ready(function(){
var hoge = $("<button>これはボタンです</button>");
hoge.click(function(){
alert("ボタンがあったらクリックしたくなるのが人間というものです。");
});
$(".entry-content:first").append(hoge);
});
</script>Code language: HTML, XML (xml)Javascriptと正確にはCSSを使って、ウィンドウをスクリプト側から縮小させる方法です。
Firefoxは、IEやChromeにはある「zoom: 1.0;」のようなCSSがなく、独自に「.MozTransform=”scale(0.1)”;」があります。しかしこれ、ちょっとやっかいで縮小するとウィンドウが中央に配置されて、画面のまわりが余白だらけになってしまいます。これをどうにか左寄せしようと思います。
xが0.1のとき
13000
xが0.2のとき
5800
xが0.5のとき
1440Code language: CSS (css)このxの数式がなんなのか当ててみましょう。
私は・・わかりませんでした・・・orz
これはワイド画面のディスプレイでとあるページで画面の左上寄せに必要だった余白部分のサイズの数値です。
しょうがないので、Firefoxの縮小の挙動を考えてみることにしました。
ウィンドウの横の長さが980だったとしたら、それを0.8倍にしたら、784。
つまり、もともとのウィンドウのサイズ980-784で196だけ小さくなった。
この196というのは余白分。画面は中央に表示されているので、左と右の２つの幅ということになる。
なので、これを2で割ると、その半分の余白のサイズが求められます。
var htmlElm = document.getElementsByTagName("html")[0];
htmlElm.style.MozTransform="scale(1)";
var sx = document.body.clientWidth * 1.0;
var sy = document.body.clientHeight * 1.0;
var a = 0.5;
htmlElm.style.position = "absolute";
htmlElm.style.left = "-"+((sx-sx*a)/2.0)+"px";
htmlElm.style.top = "-"+((sy-sy*a)/1.98)+"px";
htmlElm.style.MozTransform="scale("+a+")";Code language: JavaScript (javascript)フレームページの場合はこうする。
var sx = document.getElementById("iframe").contentDocument.body.scrollWidth * 1.0;
var sy = document.getElementById("iframe").contentDocument.body.scrollHeight * 1.0;Code language: JavaScript (javascript)PHPで書くコードは、おもしろいほどぐちゃぐちゃになるんだよね(^_^;)
コードを書くところが の間なので、HTMLのどこにコードを書いても問題がないのがPHP。だから、モジュールをインクルードするところも自由と言ったら自由になってしまう。
それに、Cのようにヘッダファイルというものがないし、Pythonのようにファイル名がそのままクラス名になったりするわけでもないし、インクルードファイルがHTMLでも問題ない。PHPはプログラム言語と言ってしまっていいのかわからないほど、マークアップ言語に限りなく近いベースになっている感じがする。
だからなのか、今までPHPをやってこなかった自分でもどこのPHPの書籍を読んでなくてもすんなりとPHPを書けてしまった。初めてじっくりかいたけど、なんていうか・・・なにかひっかかるものがあった。このもやもやを解決するためにも、Pythonを見習ってPHPでプログラミングするためのプログラムデザインを考えてみようと思います。
PHPは「.php」ファイルに直接アクセスしてその処理をサーバーサイドで表示させますが、ディレクトリのどのphpファイルにも自由にHTTPからアクセスできるようになるのは、セキュリティ上リスクがあるのではないかと考えます。例えば、index.phpからインクルードするための内部だけで使われるPHPファイルがあったとしたら、そのファイルにindex.phpを経由せずともアクセスすることが可能になってしまいます。
.htaccessではこのように書きます。
#Rewriteを使う
RewriteEngine On
#ベースのディレクトリ
RewriteBase /
#アクセスを許可するディレクトリを指定
RewriteCond %{REQUEST_URI} !^/css/(.*)
RewriteCond %{REQUEST_URI} !^/js/(.*)
RewriteCond %{REQUEST_URI} !^/img/(.*)
#全てのアクセスをindex.phpに飛ばす
RewriteRule .* index.phpCode language: PHP (php)このようにすれば、index.phpにディレクトリ配下のファイルへのアクセスがあった場合index.phpに飛ばすことが出来ます。ただ、Rewriteを使えるようにするには、Apache側で、モジュールを追加する必要があります。
詳しくが「mod_rewrite.so」で検索するか、下記URLで調べてみるといいです。
http://memorva.jp/memo/linux/mod_rewrite.php
とりあえずどこでもインクルードできるのがPHP。だから気づけばディレクトリがファイルの山で、しかもファイル名が適当で何がなんなのかわからなくなってしまうことを避けるためにも、クラスは「classes」フォルダに纏めることにします。
<?php
class Hoge {
public $hage = 1;
public function hoge(){
print($hage -> var);
}
}
?>Code language: HTML, XML (xml)こんなファイルを作ったら、classesフォルダに「hoge.php」という名前で保存します。
このクラスが使いたくなったら、
include("classes/Hoge.php");
$hoge = new Hoge();Code language: PHP (php)として使用します。classesフォルダより前に何か書かなくてもいいの？ という場合でも問題はありません。なぜからphpファイルへのアクセスは全て「index.php」を介しているので、カレントディレクトリが変わるようなことはまずありえません。index.phpにアクセス解析を仕込むことも可能になります(笑)
別に「pages」でもいいと思います。「pages」フォルダを作成したら、そこに作りたいページのファイルを設置します。
しかし、設置しただけでは表示できることができませんので、index.phpを編集します。
$url = $_SERVER["REQUEST_URI"];
if (preg_match("/^welcome\\/?$/", $url)){
include("views/welcome.php");
}
else if (preg_match("/^information\\/?$/", $url)){
include("views/information.php");
}Code language: PHP (php)これで呼び出せるようになる上にアドレスバーにはちゃんと/welcome/と表示することができます。
外部からダウンロードしたphpのライブラリや、ひとつの機能だけをもったphpファイルを入れておきます。classesフォルダと分けるのは、他からDLしてきたファイルは必ずファイル名=クラス名となっているわけではないので分ける必要があります。
一つの機能だけを持ったファイルというのは
modules/hoge.php
function hoge() {
return "hoge";
}Code language: JavaScript (javascript)のようなそんなかんじのものです。
将来的にサイトを全体的に変更する必要がでてきた場合などに対処するために、index.phpの先頭にはサイトそのものの設定用の変数や言語パックのインクルードなど用意しておきます。
index.php
$DEBUG = true;
$SITE_TITLE = "Hoge Site";
$SITE_VARTION = "1.00";
include("language.php");
〜Code language: PHP (php)ブログのように、どのページにアクセスしても同じデザインのページで、本文だけ違うといったサイトをよく見かけると思います。そのように実装する場合は、index.phpにui.phpをインクルードするようにし、「ui.phpのインクルード」 → 「views/xxx.php」というふうにすることで全てのページに共通したuiで表示させることができます。
だいたい重要なことは上に書きましたが、やってはいけないこととして箇条書きにしていきます。