‘JavaScript’ カテゴリーのアーカイブ

node.js用のglob

PHP的にglobコマンドでファイル一覧を取得したかったので書いてみました。

var
  fs = require('fs');

fs.glob = function (path, pattern, callback) {
  fs.readdir(path, function (cb) {
    return function (err, files) {
      if (!err) {
        var files2 = [];
        for (var index in files) {
          if (files[index].match(pattern)) {
            files2.push(files[index]);
          }
        }
        cb(err, files2);
      }
      else {
        cb(err, files);
      }
    }
  } (callback));
};

fs.glob('.', /.*\.log/i, function (err, files) {
  console.log(files);
});

こんなんでいいのかな。一応動いているっぽいです。

[ 'npm-debug.log',
  'service.log',
  'test.20120621.log',
  'test.20120621090035.log',
  'test.20120621090058.log',
  'test1.log',
  'test1.old.log',
  'test2.log' ]

Node.jsはPowerPCで使えないという話

LinuxでPowerPCのアーキテクチャを選択する場合は注意が必要です。

わざわざWindows版もMac版も用意されているのだからアーキテクチャはほぼ不問なんだと思ってました…

OpenBlocks(debian squeeze)にNode.jsをnvmからインストールしようとしたところ、WAFがエラーを出しました。

root@squeeze:~# nvm install v0.6.18
######################################################################## 100.0%
Checking for program g++ or c++          : /usr/bin/g++
Checking for program cpp                 : /usr/bin/cpp
Checking for program ar                  : /usr/bin/ar
Checking for program ranlib              : /usr/bin/ranlib
Checking for g++                         : ok
Checking for program gcc or cc           : /usr/bin/gcc
Checking for program ar                  : /usr/bin/ar
Checking for program ranlib              : /usr/bin/ranlib
Checking for gcc                         : ok
Checking for library dl                  : yes
Checking for openssl                     : not found
Checking for function SSL_library_init   : yes
Checking for header openssl/crypto.h     : yes
Checking for library util                : yes
Traceback (most recent call last):
  File "/root/nvm/src/node-v0.6.18/tools/waf-light", line 158, in <module>
    Scripting.prepare(t, cwd, VERSION, wafdir)
  File "/root/nvm/src/node-v0.6.18/tools/wafadmin/Scripting.py", line 145, in prepare
    prepare_impl(t, cwd, ver, wafdir)
  File "/root/nvm/src/node-v0.6.18/tools/wafadmin/Scripting.py", line 135, in prepare_impl
    main()
  File "/root/nvm/src/node-v0.6.18/tools/wafadmin/Scripting.py", line 188, in main
    fun(ctx)
  File "/root/nvm/src/node-v0.6.18/tools/wafadmin/Scripting.py", line 241, in configure
    conf.sub_config([''])
  File "/root/nvm/src/node-v0.6.18/tools/wafadmin/Configure.py", line 221, in sub_config
    self.recurse(k, name='configure')
  File "/root/nvm/src/node-v0.6.18/tools/wafadmin/Utils.py", line 634, in recurse
    f(self)
  File "/root/nvm/src/node-v0.6.18/wscript", line 399, in configure
    conf.env['DEST_CPU'] = canonical_cpu_type(conf.env['DEST_CPU'])
  File "/root/nvm/src/node-v0.6.18/wscript", line 60, in canonical_cpu_type
    " but NOT '" + arch + "'.")
Exception: supported architectures are arm, ia32, x64 but NOT 'powerpc'.
nvm: install v0.6.18 failed!

nvmでしか試していませんが、恐らくnodeをmakeしても同じです。これはV8エンジンがPowerPCに非対応なのが原因です。http://code.google.com/p/v8/

あとはこの辺り参照。

Is it possible to make Node.js use Rhino as the Javascript engine? – Stack Overflow

Issue 692 – waf – cannot build nodejs (uses waf) on OS X ppc – The meta build system – Google Project Hosting

一応、V8をPowerPCで動くようにするプロジェクトはあるみたいですが…

https://github.com/ic/v8-powerpc

Long-term goal: Get Node.js and Google Chrome to PowerPC users.

らしいので気長に待つしか…

あとはSpiderMonkeyにV8のAPI実装してNodeに結合するspidernodeですね。

https://github.com/zpao/spidernode

ちょっと求めているものとは違うんですよね…動くのかわからないし。

あー、どうしよっかなー…


html5uploaderで複数アップロード時のバグ修正

Gmailのようなドラッグアンドドロップでファイルをアップロードする機能が使いたかったので探していたところ、見つけたのがhtml5uploaderです。JSと、サーバーサイドのPHPが付いてます。

html5uploader

デモ
http://www.weeby.pl/blog/html5uploader/uploader.html

比較的簡単な構造で最低限のアップロード機能を実装しているので、elFinderと組み合わせて使うことにしました。

で、表題のバグですが、複数のファイルを同時にアップロードすることはできるのですが、時々サーバからNo file to uploadというメッセージが返ってくることがあります。リクエストを見ると、送るはずのContent-Lengthが0バイトで、データを送信していないようです。

原因はonloadendイベントの関数でreaderオブジェクトを直接呼び出して使ってるからですね。というわけで修正。

// Once the process of reading file
this.loadEnd = function() {
	bin = reader.result;

// Once the process of reading file
this.loadEnd = function() {
	bin = event.target.result;

に修正して完了です。

Pluploadの方が高性能かつソースもきれいでよく出来てるのですが、GPLなんですよね。コマーシャルライセンスは10ユーロなんで良心的で安いんですが。今回はファイルマネージャーに統合しちゃいたかったので、小型のhtml5uploaderにしてみました。

elFinderがDnDのアップロードに対応しないかなぁ。


実はFiddlerがすごすぎたので、機能まとめ紹介

今までFiddlerをただのセッションの中身を確認できるLocal Proxyとしてしか見ていなかったのですが
改めて良く調べると色々できることが多すぎると判明。感動したので便利な機能をまとめてみました。

先に簡単に説明しておくと、FiddlerはMicrosoftが無料で配布しているWeb Debugging Proxyです。

Windows環境にインストールして、ブラウザとサーバの間の通信を読んだり操作したりできます。

配布サイトはこちら。

Fiddler Web Debugger – A free web debugging tool

動作環境は「Windows 2000 / XP / 2003 / Vista with Microsoft .NET Framework v2.0 or later」

今回使ったバージョンは、2009年9月10日時点で最新の安定版、2.2.4.6。

とりあえず簡単に目次。

  • セッションのリクエスト一覧を確認する
  • やり取りしているヘッダ情報を見る
  • リクエスト・レスポンスの実際のデータの中身を確認する
  • セッション一覧表示をフィルタリングして、特定のContent-Typeだけ表示するようにする
  • リクエストを自分で作る
  • AutoResponderで特定のURLに対して、ローカルのファイルを割り当てる
  • Fiddler起動時にProxyを自動的に切り替える
  • Webページに対する一連の自動テストを実行する
  • サンドボックス
  • JScript.NETで拡張できる
  • C#やVB.NETで拡張できる
  • UIに好きな項目を追加できる
  • ブレークポイントの設定

マークアップエンジニアにおすすめしたいのは

  • セッション一覧表示をフィルタリングして、特定のContent-Typeだけ表示するようにする
  • AutoResponderで特定のURLに対して、ローカルのファイルを割り当てる

あたり。

プログラマには全部おすすめ。

詳細は「続き」からどうぞ。

(さらに…)



qooxdooのエラーログウィンドウの制御

  <body>
    <script type="text/javascript">
      if (!qx.IS_SOURCE) {
        qx.log.Logger.ROOT_LOGGER.setMinLevel(qx.log.Logger.LEVEL_ERROR);
      }
      qx.core.Init.getInstance().setApplication(test.Application);
    </script>
  </body>

index.htmlをこんな感じにしておくと、ビルド後はERROR以上のメッセージしかログウィンドウに表示しない。
開発中は普通にデバッグ情報も出せるので便利。

ちなみに他のログレベルは以下の通り。(qooxdoo 0.6.6の場合)

すべてのログを表示する
LEVEL_ALL

アプリケーションをデバッグするのに役立つきめ細かい情報を表示する
LEVEL_DEBUG

荒いレベルのアプリケーションの動作の進捗を示すメッセージを表示する
LEVEL_INFO

潜在的な問題を警告として表示する
LEVEL_WARN

アプリケーションが実行し続けられるかどうかというレベルのエラーを表示する
LEVEL_ERROR

おそらくアプリケーションの動作が中止するレベルのエラーを表示する
LEVEL_FATAL

すべてのロギングをオフにする
LEVEL_OFF



Qooxdoo 0.6.6リリースと、0.7-alpha1

また新バージョン出ました。

今回の変更点は、バグフィックスとメモリリークの解消、IE7に関する問題の修正がメインのようです。

あと、Quickstartというビルド不要のシンプルなアプリケーションが追加されました。

quickstart/Application.js
このファイルを編集して開発することによって、ビルドの手間とかが省けるというもの。
まぁ、最適化がなされない分、ファイルそのものは大きくなりますけど。

Fixed tooltip support qx.ui.embed.GalleryList and qx.ui.embed.Gallery

GalleryListでtooltip試してみましたが、動かないような…?
まぁ、どちらにしろGalleryList全体でひとつのtooltipを出すような形になってしまうので、まだちょっと使えないかなぁ…

The only major API change in this release: qx.Class has been renamed to qx.Clazz to avoid a future name clash with 0.7.

あと、qx.Classをqx.Clazzにリネームする必要があるようなので注意。
今作ってたものは何も変更なしで動いたので良し。


qx.ui.embed.GalleryListの選択時にアイテムのインデックスを取得する

…方法は、ちょっと簡単にはいかない感じ…

GalleryListが、qx.ui.basic.Terminatorの派生クラスで、アイテム自体はdiv要素を並べているだけなのでインデックスとか取れないようだ。

とりあえず試行錯誤の記録。最終的には、numberプロパティとして設定した#01とかの文字をDOM要素から抜き出して判断するという、微妙な対応に。

var galleryList = new qx.ui.embed.GalleryList(galleryData);
galleryList.getManager().addEventListener("changeSelection", function(e) {
  alert(e.getData()); // DIV
  alert(e.getTarget()); // DomSelectionManager
  alert(e.getTarget().getItemHashCode( e.getTarget().getSelectedItem() )); // 550
  alert(e.getTarget().getSelectedItem().firstChild); // DIV
  alert(e.getTarget().getSelectedItem().firstChild.innerHTML); // #01
  alert(e.getTarget().getSelectedItem().childNodes[0].firstChild.nodeValue); // #01
  var num = Number( e.getTarget().getSelectedItem().childNodes[0].firstChild.nodeValue.match(/#0?([0-9]+)/i)[1] );
  …
});

うーむ、使いにくい。
VerticalLayoutに自分でオブジェクト突っ込んでいった方が楽かも…

マネージャにqx.manager.selection.DomSelectionManagerクラスが指定されているので、getItems()でdivリスト取得して、上から順にisEqual(var vItem1, var vItem2)とかした方が確実だとは思う。
遅いと思うけど。

ちなみに、リストの並べ替えもGalleryListでやろうとして地獄を見た。