JavaScript
jQuery Mobile でスマートフォン用ページを作成しているんですけど、スマートフォンからのアクセスかどうかを判断して、サーバー側で生成する HTML を切り替えるのが面倒です。PC 用ページではクライアント MVC を採用していて、PC からのアクセスのときは J…
Backbone.js を使ってクライアント MVC で実装したとしても、画面遷移のたびにサーバーと通信していては、データが表示されるまで結局ユーザーは待たされます。操作が固まらない、ただそれだけ。それに何度も通信していては、サーバー側に余計な負担もかかり…
Backbone.js が注目されがちですけど、Backbone.js を支えている Underscore.js も、実はかなり便利なライブラリです。公式サイトを見ると、よさげなメソッドが盛りだくさん。 Underscore.js 私自身はまだ Backbone.js のついでに使っている段階ですけどね。…
jQuery や Backbone.js で UI を開発していて面倒なのが、サーバー側の API を呼び出す部分の実装です。呼び出したい API が既に実装されていないと、細かいところまで作り込めません。あと、上手く動かなかったときも面倒です。原因がクライアント側ならす…
最近は Backbone.js をよく触っています。Backbone.js を使った場合、そこそこな規模の UI が出来あがるわけで、品質を上げるためにはテストが必要不可欠です。Backbone.js みたいな MVC フレームワークを導入するメリットとしては、「役割がはっきりしてソ…
モバイル版 Basecamp に使われていると聞いて興味を抱いていた、JavaScript の MVC フレームワーク Backbone.js。Model と View は先日試しました。 作って覚える Backbone.js - present でも、Controller はまだ。「今度試す」といってやらないことが多い私…
Web サービスにリッチな UI を実装したいけど、jQuery だけだとコードがスパゲッティになりそうなので、JavaScript の MVC フレームワークを使うことにしました。候補は Backbone.js と Knockout.js の2つ。どちらも最近はてブで注目を浴びましたね。 Backbo…
朝夕はすごく涼しくなりましたね。むしろ寒いくらいです。もうすっかり秋ですね。秋だけに、絵を描いてみたくなりました。ただし、使うキャンバスは絵画用じゃなく、HTML5 のものですけど。線を引くところから初めて、画像を表示するまで、一通り試したコー…
前回、非常に苦労して Pjax を試しました。 Pjax に挑戦したら思っていた以上に苦労した話 - present ページ移動を非同期で行えるようになったので、次はフォームの submit 後も同じようにページを移動したい、と考えてしまうのは当然ですよね。これも Pjax …
GitHub が採用している、非同期でぬるぬる動く画面遷移、これ pushState と Ajax を組み合わせたテクニックで実現されているんですね。その名も Pjax。HTML5 の history.pushState を使うからブラウザの履歴にも対応でき、しかも URL がキレイ。Pjax につい…
はじめに 例えば、UI ウィジェットを生成して何かしたり、サービスの API を呼び出して何かしたりするコードは、テストが困難です。DOM が変更されたら正しいテストにならない可能性があるし、API 呼び出しで環境が破壊されたら困りますからね。そこでモック…
はじめに UI フレームワークとかすっとばして、いきなりテストです。Closure Library 使って Web アプリを作るということは、それなりの規模の RIA を作るということ。ちょっとしたやつなら jQuery でいいですからね。それなりの規模の RIA の品質を高めるに…
はじめに .NET 歴が長いので、データソースと聞くとデータバインドを連想してしまいます。でも残念ながら、Closure Library の UI フレームワークはデータバインドを提供していません。今後に期待。Google Closure のデータソース機能は goog.ds 名前空間で…
はじめに Closure Library に少しずつ慣れてきたので、自分が覚えたことをブログに整理してみます。Closure Library は機能が多すぎるので、私が使い方を覚えた順番で書いていく予定。まずはイベントから。 Closure Library のイベントの基本 イベント機能は…
jQuery から Closure Library への移行を決意 jQuery は部分的に Ajax を取り入れるのには最適ですが、フル Ajax な Web アプリを開発するのは超大変。目的の UI コンポーネントを探すのも一苦労です。その点、Closure Library は Google の Web サービスで…
Kay Framework の RESTViewGroup や appengine-rest-server を使って生成した RESTful な API を、JavaScript から呼び出すための jQuery プラグインを作ってみました。 (function(){ function Rest(url){ this.url = url; this.filters = new Array(); } Re…
最近 Flickr を始めたんですが、保存している写真ををダウンロードしたり、ブログ貼付用タグを取得するのが面倒ですね。写真の詳細ページに移動して、サイズ選択ページに移動して、ってページ移動多すぎ！1枚貼り付けるだけなら我慢できますが、数枚貼り付け…
はてなダイアリーの日記編集画面(詳細)に、トラックバック URL を入力する欄があります。ここに自動で URL を入力する Greasemonkey 用スクリプトを書いてみました。 // ==UserScript== // @name AutoInsertTrackbackUrls // @namespace http://d.hatena.ne.…
もんたメソッドを実現する jQuery プラグインを作ってみました！ JavaScript と jQuery の勉強も兼ねて。 JRuby の勉強は、愛機 VAIO type T をリカバリしてしまい、環境がきれいさっぱり無くなったので、また今度。 作成した jQuery プラグインがこちら。 /…
下の記事を読んで、つい作ってしまいました＞＜ タイマー機能で時間を賢く使うスクリプト（Mac版） 10分おきに注意してくれるグリモンです。2ch まとめサイトばかり読んでしまって仕事がはかどらない人は使うといいんじゃないかな？ // ==UserScript== // @n…
AddFavorite メソッドで追加できる。ただし IE のみ。 var title = window.document.title; var url = window.document.URL; window.external.AddFavorite(url, title); AddFavorite メソッドの第1引数に渡せる URI はスキームが http か https か ftp のも…
JavaScript の勉強を再開。まず、現在のページのスクロール量を取得してみる。 var obj = new Object(); obj.x = document.documentElement.scrollLeft || document.body.scrollLeft; obj.y = document.documentElement.scrollTop || document.body.scrollTo…
下書きを保存するつもりが、間違って公開してしまう事が多いので、それを防ぐために Greasemonkey スクリプトを書いてみました。 // ==UserScript== // @name ConfirmPublish // @namespace http://d.hatena.ne.jp/griefworker/ // @include http://d.hatena…
JavaScript の勉強のために、Greasemonkey のユーザースクリプトを書いてみようかな。とりあえず今回はテンプレートだけ用意しておきます。 // ==UserScript== // @name スクリプト名 // @author 作者名 // @namespace 作者のサイトURL // @description スク…
id:amachang の ロケーションバーアニメーション タイトルアニメーション が面白かったんで、JavaScript 未経験ながら試してみました。見よう見まねで(;^_^A「タイトルとロケーションバーが既にあるなら、残るは本文しかない！」というわけで、本文の見出し…
