Mar 17, 2012 0
iPad2 買った！
new ipad? せっかくだから俺はこの値段が下がった iPad2 を選ぶぜ！
しかも中古。保証が効かない時期に壊れた時に必要だなーと思ったら新しいの買います。
とりあえず ipod touch のノリでアプリいれまくってる。iphone アプリだと解像度が違うからしょんぼりな見た目になりますね。そういったものは ipad 用のアプリで替えになるものを探さないといけないけど大体あるので問題は無いですね。
しばらくはこれで遊ぼう。
Mar 14, 2012 0
jQuery.ready() は onload より先に呼ばれる。
はまったのでメモ。
たとえばこんな感じで jQuery.ready と onload を両方いれた場合、jQuery.ready のほうが先に呼ばれる。
<head>
<script>
$(document).ready(function() {
console.log('jQuery.ready()');
}
</script>
</head>
<body onload="console.log('onload');">
</body>
jQuery.ready はDOMツリーの構築が終了した時に呼ばれる、onload は画像の読み込みも終了した段階で呼ばれる。という違いがあるようだ。
参考URL
jQueryのreadyメソッドはonloadイベントより前に呼ばれる at HouseTect, JavaScriptな情報をあなたに
最近 JavaScript 使う機会があったのだが、
jQuery.offset() などで要素の位置を取得しようとした場合に、画像の読み込みが終わる前に jQuery.ready() が呼ばれ、画像の高さ分を無視した値を取得していたために挙動が想定とずれてしまう。
という事があった。
しかも IE,Firefox,Opera は画像サイズもキャッシュしているのか、現象が再現しきれなかったので余計に解決に時間がかかってしまった。
たとえばこんなページ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="jquery.js"></script>
<script>
$(document).ready(function() {
console.log($('#hoge').offset().top);
});
</script>
</head>
<body onload="console.log($('#hoge').offset().top);">
<img src="example.png">
<p id="hoge">hoge</p>
</body>
</html>
chrome では 1個目と2個目で値が違うが Firefox では同じ値が出てくる。
この場合、画像に対して高さを定義してやると想定通りの挙動をしてくれる。
- <img src="example.png"> + <img src="example.png" style="height:480px;">
これでOK
Mar 12, 2012 0
Vimgrep を使ってみる。
最近まで vimgrep の存在は知っていたが全然使ったことが無かったので、覚えたほうが便利かなーと思って今覚えた。今までなんでやらんかったのか。。。
というわけで vimgrep を使ってみた。
vimgrep には 内部grep と 外部grep の二種類があるようですが今回は 内部grep を使います。
以下は WordPress のルートディレクトリで実行してます。
基本形
:vimgrep /header/ *.php // 結果 (1 of 108): * wp-blog-header.php which does and tells WordPress to load the theme.
カレントディレクトリの .php で終わるファイルを対象に header を検索します。
なんの慣習か / で区切ってますが vim で置換するときと同様に適当な記号で大丈夫です。どこまで大丈夫なのかはわかりませんが。
ただ、これ実行すると検索した結果の一番目のファイルを自動的に開くし、ステータスバー一行に結果の一番上だかだけが表示されてとても使いにくい。
なので 自動ジャンプをoffにする j それから検索結果の一覧を表示するための QuickFix と組み合わせて使います。
:vimgrep /header/j *.php | cw
// 結果
1 index.php|4 col 12| * wp-blog-header.php which does and tells WordPress to load the theme.
2 index.php|17 col 20| require('./wp-blog-header.php');
3 wp-activate.php|7 col 21| require( './wp-blog-header.php' );
4 wp-activate.php|17 col 22| do_action( 'activate_header' );
5 wp-activate.php|19 col 22| function do_activate_header() {
6 wp-activate.php|22 col 37| add_action( 'wp_head', 'do_activate_header' );
7 wp-activate.php|37 col 5| get_header();
8 wp-app.php|447 col 47| // getting warning here about unable to set headers
9 wp-app.php|450 col 59| // this could affect our ability to send back the right headers
10 wp-app.php|754 col 10| status_header('200');
[Quickfix List] :vimgrep /header
(1 of 108): * wp-blog-header.php which does and tells WordPress to load the theme.
こうすることで QuickFix で参照できます。j k で選択して enter とか押すと該当箇所へジャンプできます。
再帰的に検索
ディレクトリを再帰的に検索します。
:vimgrep /header/j **/*.php | cw
なぜ ** で再帰的に検索できるのか？
これも知らなかったのですが、help によると starstar-wildcard というらしいです。
*starstar-wildcard*
Expanding “**” is possible on Unix, Win32, Mac OS/X and a few other systems.
This allows searching a directory tree. This goes up to 100 directories deep.
再帰的といっても100ディレクトリまでのようです。実際そんな深いディレクトリまで見ないだろうけど…。
バッファ内検索
ファイルだけでなく、バッファも検索の対象にできます。
:bufdo vimgrepadd /header/ % :cw
bufdo は全てのバッファで対象のコマンドを実行するコマンドです。
vimgrepadd は vimgrep の結果に追記するためのコマンドです。
追記が終わったら cw で QuickFix を起動してます。ここをファイルを対象にする時のように | cw とするとファイルが分割で開いてしまったのがちょっと思ってた動きと違う。。。
vimgrepadd で追加しまくってるといろいろ邪魔になってくるのでそんなときは
:cexpr ""
で削除しちゃいましょう。
内部grep はこんなところかな。これ覚えたらかなり便利っすね。
Mar 7, 2012 0
WordPress に関連エントリーを表示。
追加しようしようと思って忘れてた関連エントリーの表示機能をブログに追加した。
最初はプラグイン使おうかなーって思ったが自分で書いたほうが細かい操作できるしということでPHP書いて作りました。
何をもって関連するエントリーとするかだが、今回はタグが同じだったら関連扱いにする。大体あってるはず。
コードは以下の通り。
get_the_tags() で表示しているエントリーに設定されているタグを取得し、get_posts でタグをキーにして検索をかける。get_posts で扱える引数は query_posts と大体同じらしい。
<div class="related-entry">
<?php
$tags_id_list = array();
$get_the_tags = get_the_tags();
if ($get_the_tags):
foreach ($get_the_tags as $id => $tag) {
$tags_id_list[] = $tag->term_id;
}
$line_limit = 10;
$entry_list = get_posts(array('tag__in' => $tags_id_list, 'posts_per_page' => $line_limit+1));
$line_no = 0;
$the_id = get_the_ID();
if ($entry_list) :
echo '<h3>関連記事</h3>';
echo '<ul>';
foreach ($entry_list as $entry) :
if ($the_id == $entry->ID) { continue; }
if ($entry->post_password != "") { continue; }
$line_no += 1;
$class_name = ($line_no % 2) ? 'odd' : 'even';
$permalink = '/wp/archive/' . preg_replace('/[\-:\s]/', '', $entry->post_date);
echo '<li><a href="' . $permalink . '">' . $entry->post_title . '</a></li>';
endforeach;
echo '</ul>';
endif;
endif;
?>
</div>
Mar 6, 2012 0
Opera Mobile と Opera Mini の違い。
Opera Mobile ウェブブラウザ – Android マーケットのアプリ
Opera Mini ウェブブラウザ – Android マーケットのアプリ
Android 端末向けの Opera は二種類用意されていてどっちを選ぶべきかという問題。
オペラ公式サイトにも種類毎の違いがずらずらと書かれているがここでは Android 向けに簡単に説明。
大きな違いは以下の5点。
Opera Turbo のOn/Offを自分で選択できるのが Opera Mobile, 強制Onなのが Opera Mini.
HTML5 が使えるのが Opera Mobile, 使えないのが Opera Mini.
Flash が使えるのが Opera Mobile, 使えないのが Opera Mini.
設定を細かくできるのが Opera Mobile, できないのが Opera Mini.
ストレージを10Mも使うのが Opera Mobile, 1M程度で済むのが Opera Mini.
で、どっちが良いのか？
いまどきの Android 端末は性能良いしROMも沢山あるし回線もとても速いので何も考えずに Opera Mobile をインストールすれば良いです。 Opera Mini は見なかった事に。
