canvas で文字を表示してみる

Firefox 3 以上限定

Canvas でテキストを表示してみる

getContext('2d') で返される CanavsRenderingContext2D オブジェクトに Firefox 3 から moz なんちゃらというメソッドやプロパティが定義されている．それを使ったもの．

参考

文字を描く - Web API | MDN

del.icio.us で他人のコメントをコピーする

del.icio.us で network, tag などのページから save this というリンクをクリックしてブックマークする時に他人のつけているコメントをそのままコピーするスクリプト．わかりにくい．

// ==UserScript==
// @name      del.icio.us Copy Note
// @namespace http://opera.higeorange.com
// @include   http://del.icio.us/*
// ==/UserScript==

(function() {
    var posts = document.evaluate('//li[@class="post"]', document, null,
        XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    for(var i = 0, l = posts.snapshotLength; i < l; i++) {
        var post = posts.snapshotItem(i);
        var note = document.evaluate('./p[@class="notes"]', post, null,
            XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
        if(note) {
            var save = document.evaluate('./div[@class="commands"]/a', post, null,
                XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
                save.href = [
                    save.href,
                    "&extended=",
                    encodeURIComponent(note.innerHTML)].join('');
        }
    }
})();

"Hashを使ってユニークにしよう！" を JavaScript で．

perl-mongers.org を

var cars = ["honda", "honda", "suzuki", "toyota", "toyota", "daihatu", "mitubishi"];

var report = {};
cars.forEach(function(car) {
    report[car] = ++report[car] || 1;
});

for(var i in report) {
    print(i + ": " + report[i]);
}

これでおk?

Canvas で簡単な図形を描いてみる

Canvas で簡単な図形を描いてみる

直線，矩形，円を描くことができる．
mouseup するまでの間の途中段階も再現しようとしたけどなんかうまくいかないので見送り．
Untitled を使おうとしたんだけれども．

追記 6/1 17:20

線，塗りつぶしの色を変更できるようにした．

メモ

offsetX, offsetY は firefox で使えない．
layerX, layerY がそれにあたるとおもったんだけど違うのか?
仕方ないので clientX - offsetLeft, clientY - offsetTop で代用

printf もどき

function printArray(format, arry) {
    var i = 0;
    return format.replace(/%s/g, function($0) {
        return arry[i++];
    });
}

var a = ["foo", "bar"];
printArray("%s+%s", a); // foo+bar

そもそも printf がどんなものか詳しくはしらないのでそれっぽいやつ．
型とか関係なし．第2引数に配列をとって順に展開していく．
エラー処理がまったくないけどきにしない．

参考

はてなブログ

Number オブジェクトのメソッド呼び出しではまったこと．

数値のメソッド呼び出しは

3.toString(2);

では Syntax Error となる．

3..toString(2); // . を二つつける．

もしくは

(3).toString(2);

とする必要がある．

問題はここから．
まず，Math.abs を Number.abs でも呼べるようにする．

Number.prototype.abs = function() {
  return Math.abs(this);
}

これを . を二つつけるやり方で呼び出してみる．

-3..abs()
>> -3

ん．なぜと思ったけど

-(3).abs()

となってしまっているようだ．

(-3).abs();

負の数字の場合 () でくくってやる必要がある．

まぁほとんどこのようなことは書かないのではまることは少ないないけどメモ．

"先頭を0で埋めて桁をそろえる" を考えてみた

http://d.hatena.ne.jp/javascripter/20080514/1210791575 より

unshift で

Number.prototype.fillZero = function(n) {
    var r = this.toString().split('');
    while(r.length <= n) {
        r.unshift('0');
    }
    return r.join('');
}

2

Number.prototype.fillZero = function(n) {
    return Array((n+1) - this.toString().split('').length).join('0') + this;
}

小数や負の数の場合も考えて

if(this < 0 || (this - Math.floor(this) != 0)) return this;

を入れてもいいかもね．