• mataniconicomiteru for Greasemonkey

使用方法

まずはニコニコ動画の動画ページでステータスバーのGreasemonkeyアイコンを右クリック→ユーザースクリプトコマンドからOAuth認証をする必要があります。

コマンドを実行するとOAuth認証のパネルが出てくるので、ボタンからTwitterへ行きOAuth認証してPINコードをコピーしてテキストエリアに入力すると準備完了です。

認証済みだったら動画タイトル部分にまたニコのボタンが出るので、それをクリックしてコメントを入力してまたボタンを押せばTwitterへ投稿できます。(nico.msのURLを使って投稿します。

オリジナルの機能としてはコメント入力欄の右側に文字数のカウンターが付いてるぐらいです。

mataniconicomiteru for Greasemonkey

http://userscripts.org/scripts/show/83795

xpiの名前変えたいのだけどよくわからん。パッケージフォルダ名とpackage.jsonを書き換えて同名にしてもcfx xpiでエラーでる。

コード整形とシンタックスハイライトするjetpackを作った – Cherenkovの暗中模索にっき

Jetpack SDKでcfx xpiによってxpiファイルを生成して、そのアドオンをインストールするとpackage.jsonのnameに書かれていた名前がアドオンの名前になります。
しかし、package.jsonのnameはパッケージの名前なので大文字やマルチバイト文字やスペースなどが使えず自由に名前をつけようとするとエラーになります。
名前を自由につけるにはpackage.jsonにfullNameというキーを追加して、そこにスペースや大文字(マルチバイトをつけるとエラーになった…)を使った名前をつけることで、cfx xpiによって生成されたアドオンの名前に反映されます。

{
 "id": "jid0-xxxxxxxxx",
 "version": "0.1",
 "description": "test",
 "name": "test-package",
 "fullName" : "THIS is TEST package",
 "author": "azu"
}

実際の生成の流れとしてはpackage.jsonにfullNameがなかったら、nameの中身がfullNameとして扱われるようになっているみたいです。
fullNameに日本語入れる方法はよく分かりませんでした。ユニコードエスケープしてもエラーになる。
生成されるxpiファイル自体のファイル名はnameの中身が使われるようです。

Google Web Historyに見たページを自動記録するアドオン(Jetpack SDK) | Web scratch

http://efcl.info/2010/0809/res1872/

Labs/Jetpack/JEP/31 – MozillaWiki

https://wiki.mozilla.org/Labs/Jetpack/JEP/31#Packages

rawのリンク上で右クリック、[Tombloo]-[Tomblooパッチのインストール]で簡単インストールできます。

インストールすると利用サービスにはてなダイアリーが増えていると思います。
はてなブックマークと同じくはてなにログインしてから使用します。

確かその場編集モード を使ってるとポストできないらしいので、ホントはAtomAPIでやった方がよいらしい
残骸gist: 354700 – GitHub

• KIRISAKE :: Add-ons for Firefox ダウンロード先
• KIRISAKE at master from azu’s JetpackSDK – GitHub ソースコード

作った理由ですが、
移動する際に音を出すと、ちゃんとリンクをクリックできたかなどが聴覚的にも認識できるのと、上記のような音を使う事でブラウザが少し早くなったような感じがします(I shallplease)

という後付けの理由があったりしますが、HTML5のAudioタグを使って見たかったというのが第一の要因です。
そういう気分になったのは中国のJetpackerのLT資料を見つけて、pageWorkerでhtmlファイルを読み込んでその中でAudioタグを鳴らすというサンプルが載っていたので実践してみました。
見つけたLTの資料はこれJetpack SDK: The new possibility of the extensions on browser

処理的にはたいしたことはやっていませんが、Jetpack SDKにはページ移動(ページを読み込みじゃなくて、通信が始まった瞬間)に反応するAPIはまだないような感じなので、nsIWebProgressを使った普通のFirefox拡張機能と同じように直に書きました。
Components.interfacesとか使う必要性が出てくるわけですが、Jetpack SDK0.6からはCiやCcというエイリアスがデフォルトではなくなったので、以下のようにrequireしてから使う必要があります。
Jetpack SDK 0.6 がリリースされました « Mozilla Developer Street (modest)

var {Cc, Ci} = require("chrome");

ちなみにこのvar {a,b} = obj;みたいな表記は分割代入というJavaScript 1.7からの機能を使ったもので、

var Cc = require("chrome").Cc , Ci = require("chrome").Ci;

というのと同様の意味になります。一部地域ではよく見かけるので覚えておくと便利です。

• Kanasan.JS Jetpack ワークショップ: Days on the Moon
• JavaScript の分割代入まとめ – mooz deceives you

参考サイト

• Progress Listenersでロケーションバーのurl変更されたときに何かする – フリーフォーム フリークアウト
• Latest topics > Split Browser開発のよもやま話（6）：分割されたブラウザの作り込み – outsider reflex

• Googleウェブ履歴を残すGreasemonkeyスクリプト
• Opera で Google Web History を使えるようにする UserJS – mallowlabsの備忘録

などGreasemonkeyやTomblooパッチなど代わりになる手段は山ほどある気がしますが、Jetpack SDKを使いたかったのと、意外にもFirefoxアドオンとして同じ役割するものが見つからなかったので作ってみました。

他のスクリプトとの違いは大して無いと思いますが、できるだけ無駄な送信を控えるようにしています。

• 最近訪れたサイトは重複送信しない(100件ぐらいでクリアされます)
• https://はホストのみを送信
• ローカルやIPアドレスベースのURLの場合は送らない

ダウンロードはAMOからできるようにしてあります。
Firefoxアドオンのxpiを簡単における場所が無かったので、AMOに登録しておいてあります。

• Google WebHistory Updater :: Add-ons for Firefox

Jetpack SDKでコンパイル?前のソースコードはこちらに

• Google-webhistory-updater at master from azu’s JetpackSDK – GitHub

Jetpack SDKで何か作るには

Jetpack SDKで既に3つほどアドオンを作成していますが、0.5だとJetpack prototypeとできることはそこまで変わってないです。(prototypeのギャラリー無くなったみたいですね。8個ぐらい作った気がする)
Jetpack SDKで作る上で参考にしたのは

• SCRAPBLOG : Jetpack 基礎的なAPIの使い方
• Jetpack SDK – あすかぜ・ねっと とても参考になる
• Jetpack SDK Docs

最後のJetpack SDK Docsはcfx docsで開いて、jetpack-coreあたりに現在使えるAPIが載っているのでそれを見て使い方を調べるとAPIの使い方は分かる感じ。(Jetpack prototypeの頃よりはドキュメントにサンプルもあってマシになりました)
一番ハマるところはcfxとかコマンドでエラーがでるとかその辺だった気がする。
環境はWindows Vistaです。
cfx testallすら通らない場合は-aとか-bオプションを指定してみるといい。 Jetpack SDK 0.4でcfx testallを成功させる方法 (windows) – Cherenkovの暗中模索にっき
毎回オプションを付けるのが面倒になったらlocal.jsonを作りデフォルト値を決めてみましょう。
自分はjetpack用のプロファイルを作りそれを指定してます

{
  "configs": {
    "default": [
      "-a", "firefox",
      "-b", "C:\\Program Files\\Mozilla Firefox\\firefox.exe",
      "-P", "%appdata%\\Mozilla\\Firefox\\Profiles\\h545wqkn.jetpack"
    ],
    "ff37": [
      "-a", "firefox",
      "-b", "C:\\Program Files\\Mozilla Firefox 3.7\\firefox.exe",
      "-P", "C:\\Users\\admin\\AppData\\Roaming\\Mozilla\\Firefox\\Profiles\\testuser"
    ]
  }
}

package.jsonを作り、libフォルダを作りmain.jsを書いて → さあcfx runで起動しようとしたら、まずはpackage.json内にidが自動生成されます。そしてもう一度cfx runすると下のようなエラーが出てくることがあります。

Traceback (most recent call last):
  File "D:\jetpack\bin\cfx", line 6, in
    cuddlefish.run()
  File "D:\jetpack\python-lib\cuddlefish\__init__.py", line 475, in run
    include_dep_tests=options.dep_tests
  File "D:\jetpack\python-lib\cuddlefish\packaging.py", line 267, in generate_bu
ild_for_target
    add_dep_to_build(dep)
  File "D:\jetpack\python-lib\cuddlefish\packaging.py", line 254, in add_dep_to_
build
    add_section_to_build(dep_cfg, "lib", is_code=True)
  File "D:\jetpack\python-lib\cuddlefish\packaging.py", line 232, in add_section
_to_build
    validate_resource_hostname(name)
  File "D:\jetpack\python-lib\cuddlefish\packaging.py", line 65, in validate_res
ource_hostname
    raise ValueError('invalid resource hostname: %s' % name)
ValueError: invalid resource hostname: jid0-英数字-フォルダ名-lib

これはpackage.jsonのnameに大文字やマルチバイト文字やスペースなどが含まれていると出てきます。(んなの分かるか)
なので小文字英数とハイホンあたりでnameを決めておきましょう。

console.logはコマンドプロンプトの方にでてくるので、それを使って(他に何かあるのかなー)デバッグしながらmain.jsなどを完成させて、xpiをcfx xpiコマンドではき出せば完成です。
まだ設定画面やパネルなどのGUIが簡単に使えなかったりしますが、用途が合えば簡単にアドオンを作成できるのでなかなか面白いです。

Google WebHistory Updater :: Add-ons for Firefox

https://addons.mozilla.org/ja/firefox/addon/213956/

方法は単純で動画内広告も外部から読み込んだFlashで動作しているのでそのswfを読み込まないようにするだけです。
広告は以下のアドレスのブロックすると読み込まれなくなります。(正規表現でマッチするAdblockだとmedia\.scanscout\.comみたいにエスケープする。)

media.scanscout.com

ブロックされているswfはhttp://media.scanscout.com/ads/ss_ads3.swf Youtubeとか他のサイトでも使われてるとか聞きました。
自分はAdblock++を使って正規表現を使わずに単純に広告をブロックしているので、/adsをというキーワードで広告がブロックされていたようです。
一応自分のadblock++.ini (プロファイルの所にadblock++.iniがあるのでそこに上書き)
広告を全てなくしたい訳ではなくて、iframeを使って重かったり、大きな画像を使って見づらくしたり、幾度も注視点を奪うだけの広告が嫌いなだけです。

• 次世代ブラウザ Firefox – Firefox 3.6.4 リリースノート
• 次世代ブラウザ Firefox – Firefox 3.6.6 リリースノート

プロセスを分離することで、Flashがクラッシュしてもブラウザ全体を巻き込んで落ちなくなることが期待できますが、プロセスを分離したことで少し問題も発生したりします。
OOPPはWindows と Linuxで導入されましたが、環境によっては逆に不安定になったりすることや、今までFirefoxのプロセスをホックして動作していたソフトウェアが正しく動作しなくなることがあります。
具体的に言えば、Windowsでの音量ミキサ(プロセスごとに音量を設定する)やmyspeed(ブラウザ上のFlashの再生速度を変更する)などのソフトウェアはプロセスが分離されたことで上手く動かなくなったりします。
(音量ミキサの場合は”Plugin Container for Firefox”というプロセスの音量を設定することでなんとかなるかも)

OOPPの無効化

ロケーションバーにabout:configと入力して、dom.ipc.plugins.enabledと入力するとOOPPの有効無効の有無を決める設定が出てきます。

出てくる項目で、dom.ipc.plugins.enabled はOOPP全体の有無でfalseにすれば無効となります。
dom.ipc.plugins.enabled.npswf32.dll はFlashのプロセスを分離するかを決めることができ、入っているプラグインごとにそれぞれ決めることができます。
プラグイン同士で連携していたりすることがあるらしいので、全てをtrue(有効)かfalse(無効)のどちらかにした方がいい気がします。
falseにすると今まで同じようにプロセスは一緒になるので(音量ミキサやmyspeedも動作する)、OOPPが安定したりソフトウェアが対応するまでは無効化するのもありかと思います。

MozillaZine.jp :: トピックを表示 – 【ヒント】Firefox 3.6.4 と OOPP について

http://forums.mozillazine.jp/viewtopic.php?t=10328&sid=4b9e3ceea6409b2f1e02c4db6fef54c6

このuserChrome.jsを読み込むと、

fbug
Clipboard.get
Clipboard.set

などのメソッドがGreasemonkeyスクリプトから使えるようになります。
fbugはconsole.logと同じ動作ですが、Firebugのウィンドウを開いていない状態(Firebugがオフ)でもFirebugのウィンドウを開いてからlogを出してくれる関数です。(元ネタはxqjs)
Clipboardの方はjetpack prototypeからのコピペなのであんまり確認してません。

当たり前ですがこのuseChrome.jsをインストールしてない人の環境ではfbugなどの関数は使えないため、デバッグ目的か自分用のGreasemonkeyに使用する感じになると思います。
以下のようにデバッグ時のみ動く関数でラップしておけば、配布の際にDEBUG = false;とするだけでいいので楽かも知れません。

var DEBUG = true;

    log("なんとか");
    // DEBUG - http://gist.github.com/428596
    function log() {
        if ( typeof DEBUG != 'undefined' && DEBUG ) {
            fbug.apply(this, arguments);
        }
    }

何かもっと便利なデバッグ関数とか作れそうな気がします。
多分Greasemonkeyスクリプトからしか動かないようにできているので(あんまり自信ない)、そこまで危険な事は起こらないかと思いますが安全は保証できないので自己責任でというテンプレを入れておく。

gist: 428596 – Greasemonkeyから使える関数を追加するuserChrome.js- GitHub

http://gist.github.com/428596

xAuthを使えば楽な気もしますがブラウザベースのものはxAuthを使わずにOAuthを使ってねとの事です

大部分は

• TwitterクライアントのOAuth対応(Javascript編) | tomatomax.net
• Twitter API を OAuth で認証するスクリプトを 0 から書いてみた – trial and error
• H.Basic認証/OAuth認証 (陽昇れども地の底に光届かず)

を参考に書きました。
何となく分かるかも知れませんが、今回扱うアプリはApplication Typeがclientタイプのものです。

今回書いたラッパーは以下のOAuthライブラリを簡単に扱うためのものになってます。
OAuth.js
SHA-1.js
http://code.google.com/p/oauth/source/browse/code/javascript/ あたりにある。
ラッパーと併せて3つのjsからなりますが、3回も@requireするのは面倒だったので一つのファイルにまとめたソースコードをOAuth for Greasemonkey for Greasemonkeyに置いてあります。
OAuth.jsはApache license ver2、SHA-1.jsはBSDライセンスになっています。
自分が書いたラッパー部分はMITライセンスとしておきます(基本的に自由に使える)
しかし、いつ変更するか分からないので自分で別途保存して@requireする方が良いでしょう。
追記: githubに置いたのでこちらを利用した方がいいと思います

• azu’s OAuth-for-Greasemonkey at master – GitHub

以下はラッパー部分だけを抜き出したものです。(2010/08/07現在のソースから)
ここに書いてあるのは古いと思うので上のリンクから適当に見て下さい。

// TwitterOauth for Greasemonkey
function TwitterOauth(){
    this.initialize.apply(this, arguments);
}
TwitterOauth.prototype = {
    initialize: function(con) {
        var accessor = this.getAccessor();
        if(accessor){
            this.accessor = accessor;
        }else{
            this.accessor.consumerKey = con.consumerKey;
            this.accessor.consumerSecret = con.consumerSecret;
            this.accessor.token = "";
            this.accessor.tokenSecret = "";
        }
    },
    accessor : {
        consumerKey : "",
        consumerSecret: "",
        token: "",// response access_token
        tokenSecret: "", // response access_token_secret
    },
    // temp for request
    request : {
        token :"",// response oauth_token
        tokenSecret: ""// response oauth_token_secret
    },
    // トークンが取得済みかの真偽値を返す
    isAuthorize : function(){
        var accessor = this.accessor;
        if(accessor.consumerKey && accessor.consumerSecret && accessor.token && accessor.tokenSecret){
            return true;
        }else{
            return false;
        }
    },
    getAccessor : function(){
        var accessor = GM_getValue("OAuthAccessor", null);
        if(accessor){
            return JSON.parse(accessor);
        }else{
            return false;
        }
    },
    // 取得したトークンを保存
    saveAccessor : function(){
        GM_setValue("OAuthAccessor",JSON.stringify(this.accessor));
    },
    deleteAccessor : function(){
        var clientInfo = {
            consumerKey: this.accessor.consumerKey,
            consumerSecret: this.accessor.consumerSecret,
        }
        GM_deleteValue("OAuthAccessor");
        this.initialize(clientInfo);
    },
    // 認証ページのURLを取得
    getRequestToken : function(callback){
        var message = {
          method: "GET",
          action: "https://twitter.com/oauth/request_token",
          parameters: {
            oauth_signature_method: "HMAC-SHA1",
            oauth_consumer_key: this.accessor.consumerKey
          }
        };
        OAuth.setTimestampAndNonce(message);
        OAuth.SignatureMethod.sign(message, this.accessor);
        var target = OAuth.addToURL(message.action, message.parameters);
        var self = this;
        var options = {
          method: message.method,
          url: target,
          onload: function(d) {
            if(d.status == 200){
                var res = d.responseText;
                var parameter = self.getParameter(res);
                self.request.token = parameter["oauth_token"];
                self.request.tokenSecret = parameter["oauth_token_secret"];
                // requestURLを引数にcallback
                if(callback){
                    callback("https://twitter.com/oauth/authorize?oauth_token="+self.request.token);
                }
            }else{
                alert(d.statusText);
            }
          },
        };
        GM_xmlhttpRequest(options);

    },
    // pinを元にAccess Tokenを取得して保存、callbackにはaccessorオブジェクトを渡す
    getAccessToken : function(pin ,callback) {
        var message = {
          method: "GET",
          action: "https://twitter.com/oauth/access_token",
          parameters: {
            oauth_signature_method: "HMAC-SHA1",
            oauth_consumer_key: this.accessor.consumerKey,
            oauth_token: this.request.token, // Request Token
            oauth_verifier: pin
          }
        };
        OAuth.setTimestampAndNonce(message);
        OAuth.SignatureMethod.sign(message, this.request);
        var target = OAuth.addToURL(message.action, message.parameters);
        var self = this;
        var options = {
          method: message.method,
          url: target,
          onload: function(d) {
            if(d.status == 200){
                /* 返り値からAccess Token/Access Token Secretを取り出す */
                var res = d.responseText;
                var parameter = self.getParameter(res);
                self.accessor.token = parameter["oauth_token"];
                self.accessor.tokenSecret = parameter["oauth_token_secret"];
                // Accessorの保存
                self.saveAccessor();
                if(callback){
                    callback(self.accessor);
                }
            }else{
                alert(d.statusText);
            }
          },
        };

        GM_xmlhttpRequest(options); // 送信
    },
    // api+?+query にアクセスした結果をcallbackに渡す
    get : function(api, query, callback) {
        var btquery = (query)? "?"+this.buildQuery(query) : "";
        var message = {
          method: "GET",
          action: api + btquery,
          parameters: {
            oauth_signature_method: "HMAC-SHA1",
            oauth_consumer_key: this.accessor.consumerKey,// queryの構築
            oauth_token: this.accessor.token // Access Token
          }
        };
        OAuth.setTimestampAndNonce(message);
        OAuth.SignatureMethod.sign(message, this.accessor);
        var target = OAuth.addToURL(message.action, message.parameters);
        var options = {
          method: message.method,
          url: target,
          onload: function(d) {
            if(d.status == 200){
                if(callback){
                    callback(d.responseText);
                }
            }else{
                callback(d.statusText);
            }
          },
        };
        GM_xmlhttpRequest(options); // 送信
    },
    post : function(api, content, callback) {
        var message = {
          method: "POST",
          action: api,
          parameters: {
            oauth_signature_method: "HMAC-SHA1",
            oauth_consumer_key: this.accessor.consumerKey,
            oauth_token: this.accessor.token // Access Token
          }
        };
        // 送信するデータをパラメータに追加する
        for ( var key in content ) {
          message.parameters[key] = content[key];
        }
        OAuth.setTimestampAndNonce(message);
        OAuth.SignatureMethod.sign(message, this.accessor);
        var target = OAuth.addToURL(message.action, message.parameters);
        var options = {
            method: message.method,
            url: target,
            onload: function(d) {
                if (d.status == 200) {
                    if (callback) {
                        callback(d.responseText);
                    }
                } else {
                    // typeof d == object
                    callback(d);
                }
            }
        };
        GM_xmlhttpRequest(options); // 送信
    },
    // GM_xmlhttpRequest風に使う
    xhr : function(opts){
        if(!(opts && opts.url && opts.method)){
            GM_log("URLまたはメソッドが指定されていません");
            return;
        }
        var message = {
          method: opts.method,
          action: opts.url,
          parameters: {
            oauth_signature_method: "HMAC-SHA1",
            oauth_consumer_key: this.accessor.consumerKey,
            oauth_token: this.accessor.token // Access Token
          }
        };
        // POST - opts.dataは文字列でもオブジェクトでも可能にする
        if(opts && opts.method.toLowerCase() == "post" && opts.data){
            if(typeof(opts.data) === "string"){// 文字列からパラメータオブジェクトを作る
                opts.data = this.getParameter(opts.data);
            }
            var content = opts.data;
            if(typeof(content) === "object"){
                for(var key in content) {
                    message.parameters[key] = content[key];
                }
            }
        }
        OAuth.setTimestampAndNonce(message);
        OAuth.SignatureMethod.sign(message, this.accessor);
        opts.url = OAuth.addToURL(message.action, message.parameters);// URLを書き換え
        GM_xmlhttpRequest(opts);// 送信
    },
    // utility関数
    // http://kevin.vanzonneveld.net
    urlencode : function (str) {
        str = (str+'').toString();
        return encodeURIComponent(str).replace(/!/g, '%21').replace(/'/g, '%27').replace(/\(/g, '%28').
                                                                        replace(/\)/g, '%29').replace(/\*/g, '%2A').replace(/%20/g, '+');
    },
    // オブジェクトからクエリを生成
    buildQuery : function(formdata, numeric_prefix, arg_separator) {
        // *     example 1: http_build_query({foo: 'bar', php: 'hypertext processor', baz: 'boom', cow: 'milk'}, '', '&');
        // *     returns 1: 'foo=bar&php=hypertext+processor&baz=boom&cow=milk'
        // *     example 2: http_build_query({'php': 'hypertext processor', 0: 'foo', 1: 'bar', 2: 'baz', 3: 'boom', 'cow': 'milk'}, 'myvar_');
        // *     returns 2: 'php=hypertext+processor&myvar_0=foo&myvar_1=bar&myvar_2=baz&myvar_3=boom&cow=milk'
        var value, key, tmp = [];
        var self = this;
        var _http_build_query_helper = function (key, val, arg_separator) {
            var k, tmp = [];
            if (val === true) {
                val = "1";
            } else if (val === false) {
                val = "0";
            }
            if (val !== null && typeof(val) === "object") {
                for (k in val) {
                    if (val[k] !== null) {
                        tmp.push(_http_build_query_helper(key + "[" + k + "]", val[k], arg_separator));
                    }
                }
                return tmp.join(arg_separator);
            } else if (typeof(val) !== "function") {
                return self.urlencode(key) + "=" + self.urlencode(val);
            } else {
                throw new Error('There was an error processing for http_build_query().');
            }
        };

        if (!arg_separator) {
            arg_separator = "&";
        }
        for (key in formdata) {
            value = formdata[key];
            if (numeric_prefix && !isNaN(key)) {
                key = String(numeric_prefix) + key;
            }
            tmp.push(_http_build_query_helper(key, value, arg_separator));
        }

        return tmp.join(arg_separator);
    },
    // Query String から 連想配列を返す
    getParameter: function(str){
      var dec = decodeURIComponent;
      var par = {}, itm;
      if(typeof(str) == 'undefined') return par;
      if(str.indexOf('?', 0) > -1) str = str.split('?')[1];
      str = str.split('&');
      for(var i = 0; str.length > i; i++){
        itm = str[i].split("=");
        if(itm[0] != ''){
          par[itm[0]] = typeof(itm[1]) == 'undefined' ? true : dec(itm[1]);
        }
      }
      return par;
   }
};

OAuth認証を手助けすることを目的に書いたので、アクセストークンを使って実際にAPIをたたく部分のTwitterOauth.getやTwitterOauth.postは適当です。
ラッパーの動作自体はそこまで難しい事はやってないので、OAuth認証の手順を理解する方が大切です。
Twitter Applications | dev.twitter.com から自分の作成するGreasemonkeyをnew appから登録しておきます。
Application TypeはClientならPINコードを使うタイプ、Browserなら認証したときにリダイレクトするURLを決めてそのURLでアクセストークンを受け取れます。今回はClientタイプつまりPINコードを使う方法です。

登録でClientを選ぶ

ユーザーにPINコードをコピーさせてそれを入力させるという動作が、普通のWebサービスではあまり見ない流れだと思います。このラッパーでやっているOAuth認証の流れを簡単に図にするとこんな流れです。(Browserタイプよりユーザーの負担が大きい)

もっとコアの流れをみるならOAuthのやり取りを読み取ってみる – 風柳メモ とか

実際にGreasemonkeyでやってる動画 YouTube – Post Now browsing to Twitter for Greasemonkey
かなり大雑把な流れなので詳しくは他のサイトを参照して下さい。
基本的にはトークンなどを元にしてOAuth.jsのOAuth.SignatureMethod.signでシグネチャを作成して、それを元に新たなトークンを受け取ってまたOAuth.SignatureMethod.signでシグネチャを作るみたいな繰り返しです。
最終的にAPIを叩く際に必要なものがアクセストークンとなります。

1. リクエストトークンとリクエストトークンシークレットをもらいに行く。(タイムスタンプとconsumerKeyで一意な情報を元にする)
2. もらってきたリクエストトークンを使って認証ページのURLを作る。
   (https://twitter.com/oauth/authorize?oauth_token= + リクエストトークンが認証ページのURL)
3. ユーザーに認証の動作を行ってもらう。
4. 認証するとPINコードが表示されるので、ユーザーにPINコードをコピーしてアプリに入力してもらう。
5. 入力してもらったPINコードを元にアクセストークンとアクセストークンシークレットをもらいに行く。(アクセストークンがAPIにたたくときに必要となるものです。リクエストトークンは認証時に必要となるだけなので使い捨てです。)
6. アクセストークンをもらったら保存して完了。

実際にラッパーを使った大筋の流れとして、まずラッパーを呼び出して各自のアプリ情報を渡して初期化します。

// http://dev.twitter.com/apps に書いてある。
var clientInfo = {
    name: 'アプリ名',
    consumerKey: '各自アプリ',
    consumerSecret: '各自アプリ',
}
// TwitterOauthにクライアント情報を渡してnewする(必須)
var tw = new TwitterOauth(clientInfo);

そして、tw.isAuthorize() で既にアクセストークンを持っているかを調べられる(持ってたら直ぐにAPIをたたける)ので、持っていなかったらリクエストトークンをもらいに行きます。

if(tw.isAuthorize()){// まだ認証していない
    tw.getRequestToken(callback);
    // callbackに渡る引数は認証ページのURL
}

getRequestTokenのcallback関数には認証ページのURLが渡るので、それを元にユーザーにそのページに行ってもらいアプリのOAuth認証してPINコードをコピーしてきてもらいます。
PINコードを入力してもらう必要があるので、適当な入力エリアを作っておく必要もあります。

// アクセストークンをもらいに行く。
// アクセストークンを取得できたら自動で保存処理を行っています。
// callbackにはaccessor(アクセストークンなどが入ったオブジェクト)を渡しますが、使い道は…
tw.getAccessToken(callback);
// 取得したアクセストークンを捨てたいときは
// tw.deleteAccessor() で破棄できます。

アクセストークンを取得して保存できたらOAuth認証は完了です。
アクセストークンを持っていればAPIをたたけるので、tw.get、tw.postを使ってAPIを叩きます。

   // get第二引数はクエリになるオブジェクトを渡す
   // 以下はapi?q=oauth&per_page=5 となる。
    var query = {
        q : "oauth",
        per_page : 5
    }
    // get : function(api, query, callback)
    tw.get("http://api.twitter.com/1/users/search.json" , query ,function(res){
        if(typeof res != "object"){// Twitterのエラー時はリスポンスのオブジェクトをそのまま返すため
            console.log(res); // firebug
        }
    })

    // postはそのまま何も工夫がない。
    var content = {status: "update test", source: clientInfo.name};
    tw.post('http://twitter.com/statuses/update.json', content ,function(){
        console.log(res); // firebug
    });

Twitter API Wiki / Twitter API Documentation を参考に使う。
HTTP MethodがGETならそのクエリになるようにAPIのURLとクエリオブジェクトをtw.getに渡す。
HTTP MethodがPOSTなら、APIのURLにcontentとなるオブジェクトを渡す。という感じでかなり適当な作りをしています。
twigadge のようにもう少し機能別に作った方が使いやすくなると思います。

以上で説明のようなそうでないものは終わりですが、以下に簡単なサンプルGreasemonkeyを置いてあります。

• GreasemonkeyでOAuth認証を手助けするライブラリとそのサンプル
  (猿アイコンのユーザースクリプトから認証とget、postのテストができます。できれば自分のconsumerKeyとか使ってね。)

追記

新たにxhrというメソッドを追加しました。(上記ならtw.xhr({})みたいな使い方)
xhrメソッドはGM_xmlhttpRequestと同じようにオプションのオブジェクトを引数にとって、APIと通信します。
GM_xmlhttpRequestをラップしているので、感覚的にはGM_xmlhttpRequestと同じ感じで使えると思います。
一つサンプル

// ↓↓↓↓Your Script↓↓↓↓ の所までがOAuth認証のパネルを作ったりするテンプレート的なものです。
OAuth認証が済んでない（tw.isAuthorize()==false)なら途中でreturnされるので、既存コードの上部に// ClientInfomation から // ↓↓↓↓Your Script↓↓↓↓までをコピペして、API周りを修正すれば簡単にOAuth認証に対応できます。(できる限り自分の登録したアプリのclientInfoを使って下さい)
当たり前ですが、その時@requireでOAuth.jsの3点セットを読み込んでおいて、インストールし直す必要があります(@requireが動作するのはインストール時のみ)
APIを叩くときにOAuth認証で得たアクセストークンからシグネチャを作る必要があるので、GM_xmlhttpRequestでそのままAPIを叩いたままでは通りません。そこで今回追加したxhrメソッドの出番です。
Getメソッドの場合だとGM_xmlhttpRequestをtw.xhrに変更するだけで既存のコードは通ると思います。
POSTメソッドもGM_xmlhttpRequestをxhrメソッドに変えるだけで大体通ると思います。
GM_xmlhttpRequestだとdata部分は文字列で書くので、そのまま”foo=fizz&bar=bazz”と書く方法と下のようにオブジェクト書く方法が使えます。(オブジェクトの方が効率がいい)

data : {
    foo:fizz,
    bar:bazz,
}

サンプルは猿アイコンを右クリックからでるユーザーコマンドで、xhrのそれぞれgetとpostをテストする関数が動作するだけです。

以下リンクまとめ

ライブラリの置き場所。こっちが多分一番新しい。

azu’s OAuth-for-Greasemonkey at master – GitHub

http://github.com/azu/OAuth-for-Greasemonkey

実際にラッパーを使ったGreasemonkey

Post Now browsing to Twitter for Greasemonkey

http://userscripts.org/scripts/show/46441

上のGreasemonkeyで使ってるラッパーライブラリとかをまとめたもの

OAuth for Greasemonkey for Greasemonkey

http://userscripts.org/scripts/show/78102

主な変更点を箇条書きすると以下のような感じです。

変更内容
1. OAuth対応
BASIC認証が2010年6月末に廃止されるためOAuth認証に対応しました。
設定画面から認証できます。
BlowsingNow!などの外部サーバを経由するものとは違い、PINコードを使ってGreasemonkeyスクリプト単体でOAuth認証を行います。
2. 入力UIがサイトの影響を受けなくなった
入力UI自体は以前と同じですが、サイト側CSSの影響を受けることがあったのを改善し、影響を受けないようにしました。
3. 設定項目の変更
以前と設定項目が変わったため設定の互換性がありません。
そのため、以前のものはアンインストールからインストールして下さい。

1. 短縮URLの選択肢が増えた
   新たにbit.ly(j.mp)、goo.glを追加しました。
   bit.ly(j.mp)はAPIの設定も行えます。
2. Ctrl+Enterでのポスト
   デフォルトはEnterで送信ですが、設定のチェックの意味が逆になったという変更。(正直気にすることはない)
   設定でCtrl+Enterでポストするように変更できます。
3. Twitterアカウントの入力項目廃止
   以前はベーシック認証を使っていたので、Twitterアカウントの入力項目がありましたが、OAuth認証に対応したため廃止しました。

OAuth認証は設定の一番下に表示されます。(いつでも認証を解除する事ができます。)
4. 短縮URLのリトライ機能
短縮URLサービスのサーバにアクセスできないときに(5秒でタイムアウト)、別の短縮URLサービスに切り替えて短縮します。

ぱっとした変化を見ると、OAuthに対応したのと、bit.ly、goo.glなどの短縮URLが使えるようになったぐらいかな。

OAuth認証の手順

Greasemonkey 単体でOAuth認証を行うようにしたので手順が少し複雑です。
以下の動画を参考にして下さい。

文字で書くと、

1. ステータスバーのGreasemonkeyアイコンを右クリック
   ユーザースクリプトコマンド→Post Now browsing to Twitter Settingから設定画面へ
2. OAuth認証をまだしてないなら、”Sign in with Twitter”ボタンが表示されるのでクリック
3. OAuth認証ページが開くので、そこへ行き許可(Allow)する。
4. PINコードが表示されるのでCtrl+Cなどでコピーする。
5. 再び設定画面に戻り、インプットボックスへPINコードをCtrl+V(ペースト)して、Comfirmボタンを押す。
6. Success!出たら、ページでショートカットキー(デフォルトはCtrl+Shift+Enter)を押し、入力UIを出す。
7. 適当にコメントとかを書いたらEnter(設定でCtrl+Enterに変えられます)でTwitterへポストする
8. 投稿できたらOK

5ぐらいまでがOAuth認証の手順で、6以降は投稿する手順。

以下感想
OAuthに対応してるGreasemonkeyが皆無で結局自分で色々書かないといけなかった。
OAuth.jsとかライブラリを使ってるので結構サイズが大きくなった。
OAuthページとかのアイコンがやっつけ感酷いのでアイコン募集中。

機能説明ページ

Post Now browsing to Twitter | Web scratch

http://efcl.info/post-now-browsing-to-twitter/

スクリプト配布ページ

Post Now browsing to Twitter for Greasemonkey

http://userscripts.org/scripts/show/46441