ドットインストール代表のライフハックブログ
![IDEA * IDEA](https://cdn-ak-scissors.b.st-hatena.com/image/square/570b3be4fc9a4b2a5624e2694ea030afe43f5143/height=288;version=1;width=512/http%3A%2F%2Fwww.ideaxidea.com%2Fwp-content%2Fuploads%2F2009%2F08%2Fa_1.gif)
最近ではAjaxの流行もあり,JavaScriptのライブラリがかなり充実していますね。これらのライブラリの関数を始めとしたJavaScriptの関数を,Flashムービーから呼ぶことができれば,Flashムービーだけでは実現が難しい処理も意外に簡単にできてしまうこともあります。 ムービーを表示しているHTMLドキュメントのURIを取得する あけましておめでとうございます。本年もよろしくお願いいたします。 さてさて,図1のムービーでは,ムービーを表示しているHTMLファイルのURI(URL)を表示しています。 図1:ムービーを表示しているHTMLファイルのURIを取得するムービー(クリックするとムービーを表示します) Flashムービーでは,ムービー自身のURIは「_urlプロパティ」を使って取得できますが,ムービーを表示しているHTMLファイルのURIまでは取得できません。では,図1のム
BlueShoes: JavaScript Collection Get all the above components in one package. There is an example that uses most of the components.忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」。 既に紹介したと思っていたJavaScriptライブラリであるBlueShoesの紹介。 ご存知の方も多いと思いますが、知らない人も多いようですね。 ライブラリ、というより、リッチなコンポーネント集といったイメージで、次のような様々なコントロールが使えます。 WYSIWYGエディタ Excel風スプレッドシート ツリービュー スライダーコントロール 他にも下記の様々なリッチコンポーネントが使えます。 入力系コンポーネ
Realtime validation using Ajax Ajaxなどを駆使して、入力値を動的にチェックするライブラリ、realtime validation を公開しました。 >> http://masuidrive.jp/validation 正規表現とメッセージを指定するだけで、入力した瞬間にユーザに対してガイドメッセージを表示させる事ができ、今までの様に画面遷移後にエラーが出て、ユーザがエラー位置を把握しづらいと言う事がありません。 フォームの入力値をリアルタイムにバリデーション「Realtime validation」。 prototype.js と、配布している validate.js を読み込んだあと次のようなコードを書くだけ。 Validator.register({ "#mail" : { "/^([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2
Ajaxを使ってその場でMySQLの値を書き換えられるウィジェット作成ライブラリ「MySQLPHPGrid」 2007年01月17日- MySQLPHPGrid MySQLPHPGrid puts data from a MySQL table in a configurable grid on a webpage. Ajaxを使ってその場でMySQLの値を書き換えられるウィジェット作成ライブラリ「MySQLPHPGrid」。 MySQLの値をちょこっと書き換えたいインタフェースを作る場合はどのように行っているでしょうか? Excelのようであり、phpMyAdminのようでもある使いやすい直感的なUIを持つウィジェットをMySQLPHPGridを使うことで簡単に実現できます。 (セル部分をクリックするとその場で書き換えることが出来、左端の削除ボタンで行を削除することも可能) どのくらい簡
昨晩はライブドアで開催されたテクノロジーセミナーで「Technologies for UI」という題でプレゼンをやりました。 発表資料はpdfかhtmlで公開する予定ですが、とりあえずテキストだけ先にアップしておきます。 http://ma.la/files/livedoor/seminar2006/seminar.txt プレゼンツールがFirefox専用だったりするので、これも少し手直しして公開予定です。 こういう機会があるたびにプレゼンツールを作ってるような気がします。 ---- 追記:12/15 ライブドアのtechblogの方に発表資料をアップしました。 http://blog.livedoor.jp/techblog/paper/ldtech2006/ 上下カーソルキーでページをめくれます。
最近,Webプログラミングの世界で静かなブームになっている言語があります。何を隠そうJavaScriptです。JavaScriptはご存知のとおり,クライアントサイドすなわちWebブラウザ上で動作するタイプのプログラミング言語です。最初にJavaScriptが実装されたのは,今から10年以上前の1995年,Netscape Navigator2.0でのことです(登場当時はLiveScriptと呼ばれていました)。決して新しい言語ではありません。それが,どうして再び注目されることになったのでしょう。その理由は,Webインタフェースのプログラミングで,JavaScriptの有効性や利便性が再発見され,言語そのものが持つユニークさや機能が技術者の関心を集めているからです(図1)。 JavaScriptを使うのはダサかった? Webインタフェースの技術といってもHTMLしかなかったころ,様々なプロ
最近Linuxの勉強もかねて作っているのが、超シンプルなアーキテクチャーのHTTPサーバー。そこそこ動き始めたのだが、それだけでは面白くないので、サーバー側からイベントに応じてデータをPushできるCometの機能を足してみた。 ストレステストのために、昨日からこのブログにこっそりとテスト用のIFRAMEを貼り付けてあったのだが(そのおかげで、バグを三つばかり見つけることができた―感謝、感謝^^)、安定して動き始めたので、見栄えを整えてこのブログの右上に貼り付けてみた。 題して、「リアルタイム・ページビュー・カウンター(RPV Counter)」。Totalはこのカウンターをリセットしてからのページビューの数、Currentはその時点でこのブログを見ている人の数(ただしノイズあり)、PeakはCurrentの過去最大値だが、ページを再ロードせずとも、それぞれのカウンターが自動的にアップデー
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー!古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
Edgewall Softwareは9月26日(フランス時間)、PAXT 0.0.2をリリースした。PAXTはGNU GENERAL PUBLIC LICENSE Version 2の下で公開されているオープンソースソフトウェア。PHP向けAjaxテンプレートライブラリのひとつで「Php AjaX with Templates」を省略した名称になっている。公開されてからまだ間もなく、1カ月ほど前に最初のバージョンであるPAXT 0.0.1がリリースされたばかり。 同パッケージはSmartyテンプレートエンジンを採用しており、先のハウツー「PHP PEARでちょい楽Ajax!」で紹介したHTML_AJAXを使っている。このHTML_AJAXも成果物に同梱されているが、デプロイの際はアクセス権の設定に注意しよう。
Ajaxian.comにおいて23日(米国時間)、"Ajaxian.com 2006 Survey Results"調査結果が報告された。本報告はAjaxian.comの調査によるもので、今回で2回目になる。865人から回答を得ている。もっとも人気のあるAjaxフレームワークはPrototype.js、Script.aculo.usが2位につけている。言語ではPHPがもっとも人気が高く、次いでJavaとなっている。 主な結果は次のとおり。 ポピュラーAjaxフレームワーク Prototype - 43% Script.aculo.us - 33% Dojo - 19% DWR - 12% Moo.fx - 11% iQuery - 7% Yahoo! UI - 5% Rico - 5% Atlas - 4% MochiKit - 4% XAJAX - 4% Google Web Toolk
さて、お待たせしました。いよいよCometとLingrについての技術解説です。 ■Comet解説 さて、まずはCometとは何で、どういう背景によって生まれたのか、についての解説から始めます。 まず前提として、Webアプリケーションにおいては、通信開始のトリガーは常にクライアント側が握っています。つまりURLを入力したりボタンをクリックしたときなどに通信が発生することになるわけですが、このようなアーキテクチャは、サーバ側で発生した変化をリアルタイムにクライアント側に通知することが原理的にできないことを意味します。 チャット・アプリケーションでは、複数のユーザから不定期にメッセージが送信され、それが他の参加者に一斉に配信されなければなりません。しかし、メッセージを受け取ったサーバ側では、それをクライアントに即座にプッシュで通知する方法がないのです。 そのため、一定期間ごとにブラウザがサーバに
AJAXは洗剤の名前!? スパムメールの“スパム”が、もともとアメリカに古くからあるハムの缶詰の商品名をもじったものだと知らない人はいまどき少ないだろうが、最近話題の“Ajax”(エイジャックス:Asynchronous JavaScript and XML)が、アメリカで販売されている洗剤のブランド名をもじったものだと知らない人はいるのではないだろうか。 WikipediaでAjaxの項を引いて、もう少し“Ajax”という名前の元をたどると、それはギリシア神話に出てくる英雄の名前だったり、小惑星の名前だったり、はたまた16世紀末にイギリスで発明された水洗トイレのことだったりするようだが、ここでは、それはどうでもいい。 IT業界では昔から製品名やプロジェクト名を付けるときに、まず略称ありき、という遊びがよく行われる。たとえば東京工業大学の大規模分散スパコン、“TSUBAME(ツバメ)”とい
September 5, 2006 in Online | Permalink TrackBack TrackBack URL for this entry: https://www.typepad.com/services/trackback/6a00d8341bfeba53ef00d8345e02e269e2 Listed below are links to weblogs that reference Gucci 2.0: » Gucci: Web 2.0 Redesign。 from 貧相なWebノート いまはWebサイトはFlashを使って構築することが当たり前になりましたが、ファッションブランド「Gucci」のサイトはちょっと違う。 FlashではなくThomas Fuchsがプログラムしたscript.aculo.usを用いてサイトを構築していますが、これでFlashを使っ
JSONがRFCの1つになったからというわけではないだろうが、Ajaxサービスがいよいよ使いやすくなってきた。フリッカーの写真を楽しく掲載できるツール、スティッキー型ブログ、その場で画像編集、本格的なテストができるツールなどが登場した(編集部) FlickrStorm flickrshow 投稿型の写真掲載サイトとして人気のあるフリッカーを活用する話題2点です。 FlickrStormは、上記リンクからサイトを訪問すると、真っ白な画面が見えるだけで何が面白いのかピンとこないでしょう。しかし、paris(別の単語かもしれません)と書かれた個所をクリックした瞬間に、後ろに“simply hit ENTER”と出て、ここでENTERキーを押せば検索が実行されることが分かります。 同時にその下の2つのアイコンに、your history、 your trayという名前と説明文が浮かび上がり、機能を
そのサービスはAjaxフレームワークで一変できるか?:Web 2.0で変わるWebプログラミングの常識(1/4 ページ) 「prototype.js」と呼ばれるJavaScriptフレームワーク。多くのAjaxを応用したサービスで使われている「Ajaxフレームワークのデファクト」だ。 このオンライン・ムックPlus「Web 2.0で変わるWebプログラミングの常識」では、これまでにAjaxの概要(第1回)から発展系としてどのような取り組みあるのか(第2回)、そして、効率的な組み込み方法の一つとしてJSONと呼ばれるデータ形式のやり取り(第3回)、Webサービスとの連携(第4回)について解説した。 Ajaxアプリケーションの開発では、Webブラウザ依存の問題を解消したり、DOMツリーを操作するといった必要性がある。しかし、開発者が一からコード記述していくのは現実的ではない。そこで一般には、何
Ajaxはどのように実現されているのだろうか? こんな疑問に応えるべく、サンプルを挙げてみよう。Ajaxの基本は、単に「JavaScriptでHTTP通信をする」というだけに過ぎないことが分かる。 オンライン・ムックPlus「Web2.0で変わるWebプログラミングの常識」の第1回目では、Ajaxが使われる背景と、どのような場合に適しているかを解説した。 今回はサンプルアプリケーションを取り上げていこう。ポイントは、もっとも基本的な例に限定したことであり、開発者である読者が今すぐにでも既存のWebアプリケーションへ組み込むことができるよう配慮した点だ。 まず最初に、以下の図2に示す2つのテキストボックスに注目してほしい。その「和」と「差」をそれぞれ計算し、結果を埋め込むという処理を挙げてみよう。 「和」と「差」を計算する処理の部分は、サーバ側に用意したPHPプログラムで行うことにする(図3
Ajaxの本質、「非同期メッセージ型ウェブ・アプリケーション」のススメ サーバとのデータのやりとりに必ずしもXMLを使う必要はないのでAjaxのxはおかしいというのは同感。実際、遊びで作ったAjaxアプリケーションでもCSVでデータを渡すようにしたし。でもJavascriptはAjaxの肝だと思うなぁ。「Flashであろうとも良いし」って、それはFlashじゃないですか:-)。 思うに、Ajaxが受けてるのはプログラマ(? デザイナじゃない人)に対してなんじゃないかなぁ。今までWebアプリケーションでリッチなユーザインタフェースというとFlashなわけだけど、Flashってデザイナの人が作るもんだというイメージがある(偏見?)。プログラマはDB周りとかロジックとかの裏方の部分を作り、華やかな表舞台のユーザインタフェースはデザイナがFlashで作る。そしてプログラマはそれを羨望のまなざしで見
いまさら確認するのも何だがAJAXって別に新技術ではない.DHTMLが設計された頃から念頭に置かれていたし,細々とあちこちのサイトで実装されていた.びっくりしたことに,僕が最近通った自動車学校のWeb予約システムもAJAXになってた.MyWebOSなんて99年だっけ.AJAXという造語というか,そういう定義を生んだGoogleの戦略がすごいのは,gmailやgoogle mapでAJAXを奇貨に市場をひっくり返した点だ.けれどもAJAXにも限界はあるし,次の課題へ向けて面白い競争が展開されることになるだろう. だから日本のベンチャーが「サービスのAJAX対応をしたいのだが,技術者がいなくて」的にコボすのは二重の意味で恥ずかしい.即ち既存の技術者がAJAX程度に枯れた技術にもキャッチアップできない*1ことと,既存のビジネスでAJAXをフォローアップしようとしているだけで,Googleのように
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く