WebGLでライフゲームしてみた - by edvakf in hatena
JavaScript Advent Calendar 2011 WebGL駅伝17日目になります。ほぼ独走状態でやってきましたが、明日から数日は書けそうにないと思うので、もしよかったら誰か代わりに書きませんか？ id:ultraist さんとか id:ndruger さんとかいかがでしょうか（チラッ）。とりあえず明日は id:nakamura001 さんに書いていただけることになりました。 さて、表題のライフゲーム（Conway's Game of Life）というのは、ゲーミフィケーションやソーシャルゲーム的な意味のゲームではなく、ゲーム理論的な意味のゲームです。ある条件に添って個々の構成単位がほぼ独立に振る舞うことによって、全体として何らかの現象が観測できる、という遊びです。 白マスを死んだセル（細胞）、黒マスを生きたセルとして、それぞれのセルはある時刻の次の時刻に以下のような状態に変
ブラウザがクラッシュしてもテキストエリアの内容を保存しておく UserJS - by edvakf in hatena
最近、久しぶりにしばらく Firefox を使ってた。Firefox すごい。何がすごいって、クラッシュしても OS がカーネルパニック起こしても書きかけのブログが消えてなかったこと。 これは羨ましい。ということで UserJS を書いた。 注意: localStorage を使うので、ページ側から見られてしまったり、ページのスクリプトに思わぬ副作用を与える可能性があることを承知した上で使ってください。それから、もしブラウザがデフォルトでそういう機能を提供することになったら手動でアンインストールしてください。 http://gist.github.com/440103 ↑raw というところをクリックすれば生のスクリプトを表示。Chrome だったらそのときにインストールしますかという表示が出るはず。 Opera と Chrome と Safari (NinjaKit) で動くのを確認した
VP8 コーデックのライセンスについて - by edvakf in hatena
オープンソースとして公開された VP8 コーデックですが、それについて何か書こうと思っていたら、素敵な記事がもう書かれていました。 BLOG.MINAWA.NET: Xiph + Matroska + Google = WebM 重要なのはここですね。 ちょっとおもしろいのが、今回の件でついでに発表されたパートナー企業の顔触れです。MozillaやOperaといった直接関係のある企業や、 SorensonといったOn2のライバル的企業(VP8がBSDライセンスなので独自で開発するのかな)や、AMDやARM、MIPSやTIといった PCから組み込み系までのハードウェア企業の賛同も取り付けているようです。こうやってみると、見事に家電系のメーカーがいませんね。そりゃそうか。そういった企業は既にH.264側ですからね。 パートナーとして発表されたのは、Google、Mozilla、Adobe、Op
Bloggerではてな記法を使うユーザースクリプト - by edvakf in hatena
Blogger に個人的なブログを作ったので、慣れ親しんだはてな記法が使えるようにしてみた。 Opera, Chrome, Firefox (Greasemonkey) で使えるはず。 http://gist.github.com/346427 (ソース) http://gist.github.com/346427.txt#blogger-hatena-syntax.user.js (Greasemonkey でインストール) (Chrome は自動インストールにならないみたいなので、blogger-hatena-syntax.user.js という名前で保存して Drag & Drop したらいいかな) text-hatena.js を使わせてもらった。 特徴は、スーパー pre 記法のシンタックスハイライトに対応していること。オリジナルの text-hatena.js はスーパー pr
//から始まるURL - by edvakf in hatena
このブログでも前に一回出てきたことがあるんだけど、// から始まる URL のことが紹介されていた。(問題・このブログのどの記事で出てきたでしょうか?) Using Protocol Relative URLs to Switch between HTTP and HTTPS - HttpWatch Blog <img src="//example.com/img/foo.jpg" />とか書いてあると、そのページのプロトコル (http: か https:) をブラウザが勝手に補完してくれるので HTTP と HTTPS を使い分けるのに便利だよっていう話。 ただし、IE7と8では // から始まる URL で指定されたスタイルシートは何故か2回リクエストが出てしまうので気をつけましょう。…らしい。(受け売りです) High Performance Web Sites :: 5a Mis
要素が画面上に見えているかどうかを調べる - by edvakf in hatena
document.elementFromPoint という便利な関数を知ったので、今作っている Chrome 用 Migemo ページ内検索で使ってみた。 これが困ったことに、ブラウザごとにかなり挙動が違うのだけど、本来の動作はこんな感じらしい。 待望の document.elementFromPoint が Firefox 3.0a8pre にて実装された。仕様は nsIDOMNSDocument.idl に詳しく書いてあるが、おおよそ以下の通りである。 HTML, XUL どちらの document に対しても使用可能 document の左上を (0, 0) とし、位置 (x, y) にある実際に見えている要素を取得する 同一の document 内に存在する要素のみ取得可能。例えばインナーフレーム内の document 内に存在する要素は取得できず、代わりに iframe 要素を返
ある要素が見える位置までスクロール - by edvakf in hatena
into_viewport という関数を作ってみた。 Chrome 以外ではチェックしてない。(でも IE 含め、他のブラウザで使えない関数などは使ってないはず) IE に getComputedStyle が無いのを忘れてた。var s = getComputedStyle(elem, null); のところを var s = window.getComputedStyle ? getComputedStyle(elem, null) : elem.currentStyle; にしたらいいのかな? (IE 持ってないのでわからない) 微修正。body や html 要素に overflow:auto などが着いてると変なことになる件。あと、Firefox と Opera では互換モードのとき document.body.scrollTop が使えて、標準モードのときは document.
英語のニュースを読みやすくするブックマークレット - by edvakf in hatena
英語のニュースサイトって、文字が小さくてびっしり書いてあって読みにくいんだけど、大抵は専門家のインタビューが引用されてて、そこだけ読めば要点はわかる場合が多い。 というわけで、引用符で囲まれているところを強調するブックマークレットを作った。(非 IE 用) javascript:(function(){var r=document.evaluate('//body//text()[(contains(., \'“\') and contains(., \'”\')) or (contains(., \'"\') and contains(., \'"\')) and not (local-name(./ancestor::*[1])="script" or local-name(./ancestor::*[1])="style" or local-name(./ancestor::*[1]
Canvas万華鏡 - by edvakf in hatena
2010年の書き初めは Canvas でした。 元日に出た Opera 10.50 pre-alpha からは HTML5 の video 要素が有効になり、とりわけ canvas に drawImage で video のフレームが置けるということで、早速 Ubuntu に Opera 10.50 を入れて遊んでました。 後で気付いたのですが、Video on Canvas は Firefox 3.5 でも普通に使えました。 その Video on Canvas がおもしろそうだったので、前からやってみたかった万華鏡を書いてみました。 http://edv.sakura.ne.jp/product/video_canvas/rectangle.html http://edv.sakura.ne.jp/product/video_canvas/triangle.html 下のほうが万華鏡ら
Automatic AutoPatchWork - by edvakf in hatena
タイトルは↓に引っ掛けました。あまり意味ないです。 ManualPatchWorkを使って手動でAutoPatchWorkにページをロードさせる « ku 前から思ってたんですが、AutoPagerize (一族)で、「ドキュメントの残りの高さ」を決め打ちして継ぎ足すタイミングを判断するのはあまり良い方法では無いですよね。 document 中にある pageElement の位置とスクロール具合で判断したらもっと汎用的なのにと思って AutoPatchWork にパッチを書いてみました。 --- AutoPatchWork.js_original 2009-12-10 11:12:07.000000000 -0500 +++ AutoPatchWork.js 2009-12-10 11:18:07.000000000 -0500 @@ -179,8 +179,11 @@ } functi
140字以内ブックマークレット - by edvakf in hatena
個人的にハマってる140字以内のブックマークレット。"javascript:" で既に11字使ってるのが痛い。 その1。 今月のカレンダー。 javascript:d=new Date;d.setDate(1);w=d.getDay();c=[];i=0;while(w--)c[i++]='\t';for(n=1;n<32;n++)c[i++]=n+(i%7?'\t':'\n');alert(c.join('')); 139字。 30日までの月と31日までの月と2月を分けようと思うと160字超えてしまう。閏年を判定すると180字ぐらいになってしまう。どうにかならんかなー。 119字でできた。 javascript:d=new Date;d.setDate(1);w=i=d.getDay();for(c='';w--;c+='\t');for(n=1;n<32;c+=n+++(++i%7?'
「HTML5のcanvasで作る画像フィルター」は自分ならこう書く - by edvakf in hatena
ASCII.jp：HTML5のcanvasで作る画像フィルター｜古籏一浩のJavaScriptラボ こちらの記事をたまたま拝見して、コメント欄もなければトラックバックもできないようなので、どうやって反応を返せばいいのかわからないけれど、もし古籏一浩さんご本人が見てくれたらいいなあ、ということで書きます。 全体的にはとても素晴らしい記事なのですが、いくつか言いたいことがあります。 ImageData まず、CanvasRenderingContext2D#createImageData というメソッド。これは知りませんでした。 Opera には window.ImageData というグローバルオブジェクトとして似たものが定義されています。(createImageData と違い、第三引数に配列を渡せるのが特徴ですが) if (window.CanvasRenderingContext2D
自前でキーボードショートカットを実装するウェブサイトは、キーボードでブラウジングする人のことをもっと考えてあげてください - by edvakf in hatena
簡単なことですが、ウェブサイトがキーボードショートを実装した場合、主にそれを使ってくれるのは、「普段からキーボードでブラウジングすることに慣れている人」です。 普段マウスを使う人は、どれだけ便利なショートカットがあったとしても、それに気付くことすらありません。 そして、キーボードでブラウジングする人が嫌うことのベスト3がこんな感じだと思います。 Flash 自分のショートカットをウェブページのショートカットに乗っ取られること。 自分のショートカットとウェブページのショートカットが同時に働いてしまうこと。 2番目は例えば Google Maps で、「もっと下」を見ようとしてマウスのホイールを回したら、ズームしちゃってウゼー!ってのと同じです。 この場合、よっぽどそのショートカットが使いやすくない限り、積極的に使いたいと思いません。 j/k で次のページ・前のページへ移動させるブログとかあり
AutoPagerizeのSITEINFOを使って本文以外を消してしまう実験 - by edvakf in hatena
oAutoPagerize が入っているなら 0AutoPagerize.SITEINFO.js が入っているはずなので、それをおもしろいことに使えないかと思って、本文以外の要素を表示しないスクリプトを作ってみた。 実験的に作ったものでクロスブラウザとか考えていない。DOMContentLoaded があるので Opera でしか動かないはず。あまりちゃんとメンテするつもりはないので使用はお勧めしない。誰かが改良して役に立つことがあるかもしれないので作ってみた。 cleanAutoPagerize.js gist: 52875 - GitHub まず、SITEINFO はグローバルスコープに作られて、oAutoPagerize 実行時点で破棄されるため、その間に捕捉しておく必要がある。(名前順にスクリプトを読み込むと cleanAutoPagerize.js は 0AutoPagerize
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
