2013年05月 | ぼくのgeekなひとりごと・・・

相対的な経過時間

2013年05月11日 12時44分

先日書いたPHP版相対的な経過時間を今回はJavaScriptに置き換えてみました。

 1. function relativeDate( d ){
 2.   var ts = d.getTime() / 1000;
 3.   var now_ts = new Date().getTime() / 1000;
 4.   var delta = now_ts - ts;
 5.   if( delta <= 60 ){
 6.     return '1分以内';
 7.   }else if( delta <= 86400 ){
 8.     var hours = parseInt(( delta / 3600 ), 10 );
 9.     var min = parseInt((( delta % 3600 ) / 60 ), 10 );
10.     if( hours && min ){
11.       return hours +'時間'+ min +'分前';
12.     }else if(hours){
13.       return hours +'時間前';
14.     }else if(min){
15.       return min +'分前';
16.     }
17.   }else if( delta <= 604800 ){
18.     var days = parseInt(( delta / 86400), 10 );
19.     var hours = parseInt((( delta % 86400 ) / 3600 ), 10 );
20.     if( days && hours ){
21.       return days +'日'+ hours +'時間前';
22.     }else if(days){
23.       return days +'日前';
24.     }else if(hours){
25.       return hours +'時間前';
26.     }
27.   }else{
28.     return d.getFullYear() +'年' +( d.getMonth() + 1 ) +'月' + d.getDate() + '日 '
               + d.getHours() +'時'+ d.getMinutes() +'分';
29.   }
30. }

１行目：
相対的な経過時間を求めたいDate型を受け取る関数を用意します。

２行目：
受け取ったDate型からタイムスタンプを取得します。PHPと違いgetTime関数は1970年1月1日午前0時からのミリ秒（1000分の１秒）を返すため、値を1000で割る必要があります。

３行目：
現在の日時が設定されたDate型からタイムスタンプを取得します。

４行目：
現在のタイムスタンプと経過時刻を求めたい日時のタイムスタンプの差分を求めます。

５〜６行：
３行目で求めた差分（以下、差分）の値が60以下の場合、60秒以下ということになるので、「１分以内」を返します。

７〜16行：
差分が86400（＝60秒×60分×24時間）以下の場合、その差分は１日以内になるので、
さらに差分を3600（＝60秒×60分）で割り整数にすることでN時間を求めます。
さらに差分を3600（＝60秒×60分）で割った余りを60で割整数にすることでN分を求めます。

10〜11行：
N時間、N分共に0ではない場合、「N時間N分前」を返します。

12〜13行：
N分が0の場合、「N時間前」を返します。

14〜15行：
N時間が0の場合、「N分前」を返します。

17〜26行：
差分が604800（＝86400（＝60秒×60分×24時間）×７日）以下の場合、その差分は１週間以内になるので、
さらに差分を86400（＝60秒×60分×24時間）で割り整数にすることでN日を求めます。
さらに差分を86400（＝60秒×60分×24時間）で割った余りを3600で割整数にすることでN時間を求めます。

20〜21行：
N日、N時間共に0ではない場合、「N日N時間前」を返します。

22〜23行：
N時間が0の場合、「N日前」を返します。

24〜25行：
N日が0の場合、「N時間前」を返します。

27〜28行：
上記にも当てはまらなかった場合、「N年N月N日 N時N分」を返します。

JavaScriptを覚えるなら

JavaScript 第6版

新品価格
￥4,410から
(2013/5/7 15:34時点)

ディレクトリ・ツリー

2013年05月07日 14時37分

ディレクトリの中身をずらっとツリー構造で取得したいときがあります。

例では、起点となるディレクトリのパスを引数に持つ、最低限の関数です。サイトマップの生成などにどうぞ。

 1. function dir_tree_recursion( $path ){
 2.   if( !is_dir($path)) return false;
 3.   $nodes = array();
 4.   if( $h = opendir($path)){
 5.     while(( $node = readdir($h)) !== false ){
 6.       if(( $node !== '.' ) && ( $node !== '..' )) continue;
 7.       if( is_dir( $path .'/'. $node )){
 8.         array_push( $nodes, dir_tree_recursion( $path .'/'. $node ));
 9.       }elseif( is_file( $path .'/'. $node )){
10.         array_push( $nodes, $path .'/'. $node ):
11.       }
12.     }
13.     closedir($h);
14.   }
15.   return $nodes;
16. }

２行目：
引数で渡されたパスがディレクトリであれば処理を続行します。

３行目：
戻り値となる配列を用意。

４〜14行：
パスのディレクトリ・ハンドルを開き、ディレクトリからノードを取得し、ノードに対する処理を行っていきます。

６行目：
ノードが自身と上位階層のディレクトリを指す場合は除外します。

７〜８行：
パスとノードを結合（※１）した対象がディレクトリである場合、再帰的に処理を続行した結果を戻り値に追加します。

９〜10行：
対象がファイルの場合、ノードを戻り値に追加します。

13行目：
ディレクトリ・ハンドルを閉じます。

15行目：
戻り値を返します。

PHPを覚えるなら

初めてのPHP5 増補改訂版

新品価格
￥3,045から
(2013/5/7 15:38時点)

jQueryを拡張してみる（１）

2013年05月07日 12時18分

最近ではWEBアプリケーションの構築でJavaScriptを使うことも多くなってますね。
WEBアプリケーションを構築する際に今まではPHPを使ってたので、PHPライクな関数でjQueryを拡張してみようと思います。

実装する関数は、HTMLタグを除去するstripTags関数と特殊文字をHTMLエンティティに変換するhtmlSpecialChars関数の２つ。

 1. $.extend({
 2.   'stripTags':function(text){
 3.     return $('<div>').html(text).text();
 4.   },
 5.   'htmlSpecialChars':function(text){
 6.      return $('<div>').text(text).html();
 7.   }
 8. });

１行目：
jQueryの拡張を宣言。

２〜８行：
拡張したい関数名をキー値に持つFunction型を定義していきます。

３行目：
stripTagsの処理。指定した要素を引数で渡された文字列をHTML文字列の規定値としてセットし、テキストノードとして結合する。

６行目：
htmlSpecialCharsの処理。指定した要素を引数で渡された文字列をエスケープされたHTMLエンティティとしてセットし、HTML文字列に変換する。

jQueryを覚えるなら

jQueryクックブック

新品価格
￥3,780から
(2013/5/7 15:37時点)

JavaScriptの配列を拡張してみる（１）

2013年05月06日 18時24分

痒いところに手が届かないJavaScriptの配列・・・

まずは個人的に良く使うシャッフル関数を拡張します。

 1. Array.prototype.shuffle = function(){
 2.   var i = this.length;
 3.   while(i){
 4.     var j = Math.floor( Math.random() * i );
 5.     var t = this[--i];
 6.     this[i] = this[j];
 7.     this[j] = t;
 8.   }
 9.   return this;
10. }

１行目：
Arrayオブジェクトのプロトタイプにshuffle関数を実装します。

２〜８行：
配列の長さを取得し、その長さ分デクリメントしながらループさせます。

４行目：
配列の長さを上限にした乱数を取得し、それを整数に繰り下げ（※配列は0から数えられるため）、変数ｊに代入しておく。

５行目：
ループカウンタをデクリメントした位置の値を変数ｔに代入しておく。

６行目：
ループカウンタの位置の値を、乱数で取得した変数ｊの位置の値で置き換える。

７行目：
乱数で取得した変数ｊの位置の値を、変数ｔで置き換える。

９行目：
配列を返す。

使い方は簡単です。

 1. // 配列listを生成
 2. var list = [1,2,3,4,5];
 3. // 配列listをシャッフルする
 4. list.shuffle();
 5. console.log(list); // [2,5,3,1,4]

JavaScriptを覚えるなら

JavaScript 第6版

新品価格
￥4,410から
(2013/5/7 15:34時点)

相対的な経過時間

2013年05月05日 17時40分

はじめまして・・・GW中に始めた「ぼくのgeekなひとりごと・・・」は、そのタイトルの通り自分の為にgeekなことをメモしちゃおうと思います。

最近Facebookなどで見かける「何分前」、「何時間前」、「何日前」のような相対的な時間表記。

PHPの日付および時刻に関する関数に相対的な書式はサポートされてますが、記事の投稿日時などを相対的に求めたい時にどうぞ。

 1. function relative_date($ts){
 2.   $now_ts = time();
 3.   $delta = $now_ts - $ts;
 4.   if( $delta <= 60 ){
 5.     echo '1分以内';
 6.   }else if( $delta <= 86400 ){
 7.     $hours = (int)( $delta / 3600 );
 8.     $min = (int)(( $delta % 3600 ) / 60 );
 9.     if( $hours && $min ){
10.       echo $hours .'時間'. $min .'分前';
11.     }else if($hours){
12.       echo $hours .'時間前';
13.     }else if($min){
14.       echo $min .'分前';
15.     }
16.   }else if( $delta <= 604800 ){
17.     $days = (int)( $delta / 86400 );
18.     $hours = (int)( $delta % 86400 ) / 3600 );
19.     if( $days && $hours ){
20.       echo $days .'日'. $hours .'時間前';
21.     }else if($days){
22.       echo $days .'日前';
23.     }else if($hours){
24.       echo $hours .'時間前';
25.     }
26.   }else{
27.     echo date( 'Y年n月j日 H時i分', $ts );
28.   }
29. }

１行目：
相対的な経過時間を求めたい日時のタイムスタンプを受け取る関数を用意します。

２〜３行：
現在のタイムスタンプを取得し、現在のタイムスタンプと経過時刻を求めたい日時のタイムスタンプの差分を求めます。

４〜５行：
３行目で求めた差分（以下、差分）の値が60以下の場合、60秒以下ということになるので、「１分以内」を出力します。

６〜15行：
差分が86400（＝60秒×60分×24時間）以下の場合、その差分は１日以内になるので、
さらに差分を3600（＝60秒×60分）で割り整数にキャストすることでN時間を求めます。
さらに差分を3600（＝60秒×60分）で割った余りを60で割整数にキャストすることでN分を求めます。

９〜10行：
N時間、N分共に0ではない場合、「N時間N分前」を出力します。

11〜12行：
N分が0の場合、「N時間前」を出力します。

13〜14行：
N時間が0の場合、「N分前」を出力します。

16〜25行：
差分が604800（＝86400（＝60秒×60分×24時間）×７日）以下の場合、その差分は１週間以内になるので、
さらに差分を86400（＝60秒×60分×24時間）で割り整数にキャストすることでN日を求めます。
さらに差分を86400（＝60秒×60分×24時間）で割った余りを3600で割整数にキャストすることでN時間を求めます。

19〜20行：
N日、N時間共に0ではない場合、「N日N時間前」を出力します。

21〜22行：
N時間が0の場合、「N日前」を出力します。

23〜24行：
N日が0の場合、「N時間前」を出力します。

26〜27行：
上記にも当てはまらなかった場合、「N年N月N日 N時N分」を出力します。

文字列を出力する間数echoをreturnに変更することで求めた文字列を返す関数としても使えます。

PHPを覚えるなら

初めてのPHP5 増補改訂版

新品価格
￥3,045から
(2013/5/7 15:38時点)