[訂正版] Javascriptでクラスを継承する

Posted filed under Javascript.

Photo by spud murphy  先ほどの記事のコードにミスがあり、継承を行うと、親クラスも書き換えてしまうバグがありました。コメントやTwitterで報告いただいた方々ありがとうございます。  あの後、調べて見れると、あまりスマートに継承を実現する方法は無いみたいですが、ユーザが作ったクラス(StringなどのAtomic型を除く)は下記のコードで継承が行えます。  特に、Array型を継承するのは、無理なようです。[]を上書きできないので、どうしようも無いみたいです。残念。

[間違え] Javascriptでクラスの継承をする [訂正予定]

Posted filed under Javascript.

Photo by GLUEKITS  すみません。下記記事は間違っています。近々訂正記事を書きます。 →訂正記事 Javascriptでクラスベースっぽく書いてる時に、継承したくなった場合の書き方。 ググってもすぐ出なかったのでメモ。 IE6,7,8 Firefox2,3,3.5 Safari 3,4で確認。

[メモ] サーバサイドJavascriptのNode.jsをOSXにインストールする。

Posted filed under nodejs.

 自分メモ。Node.jsを、OSX上にインストールする。 node.jsのインストール curl -O http://s3.amazonaws.com/four.livejournal/20100209/node-v0.1.28.tar.gz tar xfz node-v0.1.28.tar.gz cd node-v0.1.28 ./configure make sudo make install dbslayerのインストール (要MacPorts) sudo port install apr apr-util db46 curl -O http://code.nytimes.com/downloads/dbslayer-beta-12.tgz tar xfz dbslayer-beta-12.tgz cd dbslayer ./configure make sudo make install

CSSを拡張するプリプロセッサを考える

Posted filed under Javascript.

Photo by Aaron Landry  CSSで、式とかマクロが使えたらなーと思うことがよくあるので、この際だからプリプロセッサを作ろうと思っています。  文法としては、CSSの構造を大きく変えないで行きます。あくまでプリプロセッサ的な役割で。Sassの様に構文を変えてしまうと、デザイナーの人が取っつき難くなりそうで。  今のところ、考えている文法の例を下に置きました。誰でも考えそうな所で、includeによる読み込み、ネストをサポート、式と制御構造のサポートを行います。  このプリプロセッサはサーバサイドで動的に生成するのではなく、一度静的にCSSに変換して使うことを考えています。その為、User agentなど外部からの変数はサポートしません。  使い方としては、コマンドラインツールによる変換と、Javascriptによる動的な読み込みをサポートする予定です。 開発中は、HTML内に<script src=”ecss_loader.js?test.ecss”></script>と書くことで、サーバに何も導入することなく、動的に拡張されたCSSを読み込むことが出来るようにします。  文法や機能のアイディア、同じようなプロダクトを知っている!と言う方がいましたら、ぜひコメントお願いします。

緯度経度を文字列で表すGeoHash

Posted filed under Javascript, Ruby.

 なんか世間的に位置情報アプリが流行ってるらしいし、Google App Engine(GAE)も楽しそう。どうせだから、GAEでなんか位置情報アプリでも作ってみよう!と思ってTwitterに書き込んだところ、Geohashという、位置情報のプロトコル?を教えてもらいました。  これは、その名の通り、位置情報をハッシュで表す規格なのですが、いろいろおもしろい特徴があり、調べているうちに楽しくなってきたので、勢い余ってPure Rubyのライブラリまで書いちゃいました。  そのあと、結局ライブラリを作ったところで満足して、アプリは何も作らなかったので、せめてGeohashの解説でも書いておこうと思います。

Javascriptだけでコンテンツの言語を切り替えするスクリプト

Posted filed under Javascript.

Photo by keepps  前回のブラウザの言語をJavascriptから調べるを元に、ページのメッセージを言語切り替えするスクリプトを作ってみました。  実際のページは、これです。  一つのHTMLの中に複数の言語のメッセージを書き、それぞれの言語をCSSのクラスで指定することで、ブラウザに合わせた言語のみが表示されるようになります。  日本語版のブラウザで見ると「こんにちは世界」、英語版やポルトガル語版のブラウザで見ると、それぞれの言語でメッセージが表示されます。  デフォルトの言語は英語に設定しているので、日本語やポルトガル語以外のブラウザで見た場合は、英語のメッセージが表示されます。  このスクリプトでは、JSでブラウザの言語を取得したあと、表示するCSSを切り替えることで、メッセージ切り替えを実現しています。使い方などはページのソースを参考にしてください。  設置する前には、CSSとこのスクリプトはなるべく先頭で実行するようにしてください。あまり下の方で読み込むと画面がちらつく可能性があります。  言語の切り替えするなら、Apacheのcontent negotiationでいいじゃん!ってご意見を複数から頂いたのですが、Railsのpage cacheで使いたい、複数言語のHTMLを作ると修正が面倒なので、1つのHTMLで全部の言語を記述したい、Google翻訳APIとも組み合わせたいなぁ、などの理由で作ってみました。  なお、動作確認は、FF3 (3.0.1), FF2 (2.0.16), IE6 (SP2 6.0.2900), IE7 (7.0.5730), Safari3 (3.1.2), iPhone Safari (OS 2.1), Opera9 (9.27), Google Chrome (0.2.149.30)、Wii ブラウザで取れていますが、Windows MobileのIEやOperaでは動かない事を確認しています。  Window MobileのIEやOperaでJavascriptのデバグの方法をご存じの方は教えていただけますか?

ブラウザの言語をJavascriptから調べる。

Posted filed under Javascript.

Photo by midnightglory  多言語対応のサイトを作っていると問題になるのが、メッセージの切り替えです。PHPやRailsを使っている場合は、HTTP_ACCEPT_LANGUAGEを見てメッセージ生成を切り替えれば良いのですが、静的ファイルの場合は、そうは行きません。  そこで、今回はJavascriptだけでブラウザの言語を取得する方法を調べてみました。  ググっていると、ブラウザ依存ですが取得する方法が見つかったので、各ブラウザで検証した所、navigator.browserLanguage、navigator.language、navigator.userLanguageのいずれかで取得できることが分りました。  ただ、この値はブラウザのデフォルト言語環境のなので、HTTP_ACCEPT_LANGUAGEとは違う値が返ってきます。たとえば、日本語OSに英語版のFirefoxを入れている場合は、”en”が返ります。  それでまとめてみたのが、このbrowserLanguage()です。 実行すると”en”や”ja”などの言語情報が返ってきます。

Google Chart APIで日本語が通るか試してみる

Posted filed under Javascript.

 グラフが簡単に生成できるAPI、Google Chart APIが公開されたので、早速使ってみました。  Railsのプラグインとかは誰かが作ってくれるだろうから、自分でやらないとして、気になるのは日本語が通るのか。 早速試してみたところ、ひらがなは通るが漢字や長音記号は通らない。おしい。あと一歩。 修正 13:47 Typo: 感じ→漢字 矢崎さんありがとうございました。 追記 14:20 弾さんの所で、ブラウザから簡単に試せるフォームが公開されてます。