iPhone用 JavaScript コンソールにPermalink機能を追加

投稿者 nanki 2008-09-17 00:41:00 GMT

前回作成したコンソールに、permalink機能を追加。

URLの#以降に/jsconsoe/#javascript:alert(123)といった形で保存する。

このままブックマークに保存すれば、書いている途中のスクリプトを次回ロードできる。

ブックマークした後に、#以前を削除すれば、そのままbookmarkletに。


iPhone/iPod touch用 JavaScript コンソール

投稿者 nanki 2008-09-09 18:55:00 GMT

iPhone/iPodのキーボードは、まったくもってプログラミングに向かいないけれども、 ちょっとしたJavaScriptを試してみたい時はあるので、どうにかならないか試してみた。

jsconsole for iphone

JavaScript Console for iPhone

若干妙なところもあるけど、一応動く。 ちょっとしたコードなら、思ったよりさくさく?かける。

高度なカーソル移動や、単語境界まで削除、みたいな機能は欲しいなぁ。

やっぱり、touchイベントを使うので、普通のSafariで動かない。めんどい… textareaのスクロールも…

AJAX Libraries API を使って、著名なライブラリをロードできる機能もつけてみた。

http://tools.netswitch.jp/jsconsole/?lib=j,ju こんな感じにすると、jQuery, jQueryUIを読み込んでいる(はず).

j=jQuery, ju=jQuery UI, p=prototype, s=scriptaculous, m=mootools, d=dojo

書き上がったJavaScriptはメールで送信できるらしい。

参考:

iPhone/iPod用Todoリスト

投稿者 nanki 2008-09-04 05:40:00 GMT

動機: MobileSafariはマウス系のイベントが(そのままでは)あんまり動いてくれないために、哀しい思いをする事が多々あるので、一度その辺をちゃんと調べてみたかった。

結果: いい!楽しいものができた。

せっかく作るのだから、タッチセンサを生かしたインターフェースにしたかったので、 まずは Todoリストに必要な本質的な機能を洗い出す。

  • タスク追加
  • 優先順位
  • 完了
  • 削除

タスクの編集機能なんかははあえて省いているし、タスク名しかない。

それらの機能を連続的なインタラクションの中に組み込むことを主眼に構想を練る。

「削除」→「本当に削除しますか」→「OK」なんてのを5回も繰り返すのはいけない。 でも、間違えて削除してしまうようなのもダメ。

Todo list for iPhone
指先一つで一気にタスクが完了する魔法のツール!

html/css/js で動くモックを作って、最後にモデル部分をサーバ側と通信するように調整して完成。

試していただける方はこちらからどうぞ。

Create Accountすると、専用のURLが作成されます。 URL認証なので、そのままブックマークすればOK. URLをそのまま晒して*ジャック計画とかが漏れても自己責任で。

最後にJavaScript的な話をすると、

  • マウスイベントを全部iPhone用のイベントに置換
  • CPUパワーの違いでイベント処理がいっぱいいっぱいになる対策
  • 絶対位置を指定するデバイスなので、マウス用のインタラクションを一部修正

というような点でscriptaculousのdragdrop.js を直接書換えています。 なので、普通のSafariでも動きません!あしからず。

追記: Safari でも動くようにした。

ご意見・感想などはコメント欄へ。

参考:

todo.switch - todo.dotswitch.net


<div class="entry">
  <h2><a href="" /></h2>
</div>

このような文書で、aのリンク先を訪れると、div.entryの色が変わるようにしたい。

XPathみたいに、こういう子要素を持つノード、という指定は、CSSではできないっぽいので、JavaScriptでやるのが穏便かと思いきや、

div.entry {
  position: relative;
}
 
div.entry > h2 > a:visited:after {
  content: " ";
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  z-index: -1;
  background-color:gray;
}

でうまくいった。

iPhone向けなので、Safari限定で考えられるのがうれしいところ。

実際には背景色ではなくて、新たに生成されたノードをdiv.entryにぴったり張り付くようにしている。

で、この情報をJavaScriptから取れるとどのサイトにアクセスしたか、という情報が取れてしまうので色々対策されているらしいんですが… どうやって防ぐんだろう。


実践 Common Lisp

投稿者 nanki 2008-07-29 14:04:00 GMT

RubyKaigi2008のゴルフ大会の景品としてオーム社様よりいただきました。

Rubyistこそ読めとのこと、じっくり読ませていただきます。