[暴満館] タグ: javascriptのエントリ

Home / Diary / タグ: javascript

12 »

はてなアンテナの未読リンクを一気に開くUser JavaScript
del.icio.usがアップグレード
スクリプト色々更新
mp3へのリンクにGoogleのmp3プレイヤーを埋め込むユーザースクリプト
ExternalInterfaceに挑む
Flashを利用したストレージが動かん
JavaScriptでCSSを弄る際のメモをまとめた
ニンテンドーDSブラウザでAjax
PHP Markdown ExtraをJavaScriptに移植した
JavaScriptでCSSを弄る際のメモその3 Opera9について

はてなアンテナの未読リンクを一気に開くUser JavaScript

タイトルまんま。ページ上部のボタンを押すとアンテナの未読リンクをデフォルトでは10個ずつ開く。全部ボタンは全部一気に開く。これだけ。一応Firefoxでも動作。

hatena-antenna-open-unvisited.user.js

毎回ポチポチ開くのが面倒だったんで作った。

URLについて

はてなアンテナは登録しているURLをクロールした際に更新されていたら、クロール時の時刻をURLの後ろにつけつつ、はてなアンテナのリダイレクトページのURLで開くようにしてくる。例えばうちのサイトなら、

http://a.hatena.ne.jp/go?http://bmky.net/20081112000000

こんな感じ。このおかげでブラウザ側がリンクの未読を記録してくれるので、これを利用して一気に開いている。

しかし、この方法だと一気に100ページ開くときはリダイレクトページを同時に100個開くことになる。リダイレクトページのサーバーがどれぐらいのスペックかどうかは知らないが、瞬間的に100リクエストを個人が出しちゃいかんよなぁ。

そこで、リダイレクトページのURLを削除して、後ろについたクロール時刻を「？」をつけてパラメーターとすることにした。

http://bmky.net/?20081112000000

まあ、落としどころとしてはこんな感じ？　リダイレクトページにアクセスした際に、はてな側がなんらかの情報を取得していたりしたらどうしようもないけど、まぁいいや。

というわけで一応完成。はてな用のスクリプトは初めて作ったかも。唯一使ってるサービスがアンテナというのもアレだが。

Info

投稿日: 2008年11月12日
タグ: firefox、javascript、opera、userjs
このエントリの固定リンク: http://bmky.net/diary/log/1907.html
ブックマークに追加する
コメント: コメントを投稿する

2008
1112

Tagsfirefox javascript opera userjs

⇧

del.icio.usがアップグレード

URLもhttp://del.icio.us/からhttp://delicious.com/に。URLは前のほうが好きだったんだがなぁ。それと、一部機能がJavaScriptが有効じゃないと使えないのはダメだろ。

んで、APIも微妙に変わってるようなので、手元のスクリプトを一部修正した。

SBMCommentsViewer

880行目～906行目を以下のように修正。

var delicious_rss = "http://delicious.com/rss/url/";
var delicious_url = "http://delicious.com/";
var delicious_favicon = "http://delicious.com/favicon.ico";
var delicious_page = "http://delicious.com/url/" + MD5_hexhash(uri.replace(/%23/g, '#'));
function dlLoadRSS() {
    GM_xmlhttpRequest({
      method: "GET",
      url: delicious_rss + MD5_hexhash(uri.replace(/%23/g, '#')),
      onload: function(response) {
          var r;
          var comments = [];
          //var tags = [];
          if (r=response.responseText.match(/<item>[\s\S]*?<\/item>/mg)) {
              comment_area.addCount(r.length, delicious_favicon, delicious_page);
              var len = (r.length < MAX_GET_COUNT) ? r.length : MAX_GET_COUNT;
              for (var i=0; i<len; i++){
                  r[i].match(/<item>\s*<title>[^<]+<\/title>\s*<pubDate>([^<]*)<\/pubDate>[\s\S]*?<link>[^<]+<\/link>\s*<dc:creator><!\[CDATA\[([^\]]+)\]\]><\/dc:creator>[\s\S]*?(?:<description>([^<]*)<\/description>\s*)?((?:\s*<category[^>]*?>[^<]*?<\/category>)*)\s*<\/item>/ );
                  var date = RegExp.$1;
                  var user = RegExp.$2;
                  var comment = RegExp.$3;
                  var categories = RegExp.$4;
                  var tags = [];

                  date.match( /^[a-z]+, (\d+) ([a-z]+) (\d{4}) (\d\d):(\d\d):(\d\d).*?$/i );
                  var d = RegExp.$1;
                  var yyyy = RegExp.$3;
                  var hh = RegExp.$4;
                  var mm = RegExp.$5;
                  var ss = RegExp.$6;
                  var m = RegExp.$2;
                  m = m.replace( /Jan/i, "01" )
                       .replace( /Feb/i, "02" )
                       .replace( /Mar/i, "03" )
                       .replace( /Apr/i, "04" )
                       .replace( /May/i, "05" )
                       .replace( /Jun/i, "06" )
                       .replace( /Jul/i, "07" )
                       .replace( /Aug/i, "08" )
                       .replace( /Sep/i, "09" )
                       .replace( /Oct/i, "10" )
                       .replace( /Nov/i, "11" )
                       .replace( /Dec/i, "12" )
                       ;
                  date = new Date(yyyy, m, d, hh, mm, ss );
                  if(categories){
                      categories.replace( /<category[^>]*?>([^<]*?)<\/category>/g,
                          function( $0, tag ) { tags.push( tag ); }
                      );
                  }
                  if(comment.match(/&lt;p class="description">([^<]+)&lt;\/p>/)){
                      comment = comment.replace(/^\s+|\s+$/g, "");
                  }

ついでにlivedoorClipのユーザー名の位置が微妙に変わったので修正。

1028行目（上の修正を当てた後は1047行目）を以下のように修正。

var userName = userA.href.replace( /^.*\//, "" );

sbmcomments.rb

このサイトのエントリについたコメントを取得するやつ。元のソースで使っていたREXMLが利かなくなったのでsimple-rssで取得するようにした。

def get_delicious_comments( url )
    posts = []
    host  = 'feeds.delicious.com'
    path  = '/v2/rss/url/' + Digest::MD5.hexdigest( url )
    body  = Net::HTTP.start( host, 80 ).get( path ).body

    rss = SimpleRSS.new( body )

    rss.items.each do |item|
        if item.description != nil
            post = {
                :date => "",
                :user => item.dc_creator,
                :cmnt => item.description,
                :site => "del.icio.us"
            }

            posts.push( post )
        end
    end

    return posts
end

del.icio.usからの取得部分をこんな感じに直したんだが、今度は肝心のGet URLsが500でどうしたもんかと。

追記

SBMCommentsViewerの作者の方にスクリプトをgistに上げていただいたので、修正版をダウンロードできます。

sbmcommentsviewer.user.js（リンク先はgist内）

さらに変更が入ったりしたらgist: 3883の右端にあるrevisionかforkを追えばいいハズ。

Info

投稿日: 2008年8月3日
タグ: firefox、javascript、ruby、userjs
このエントリの固定リンク: http://bmky.net/diary/log/1788.html
ブックマークに追加する
コメント: コメントを投稿する

SBM Comments

asiamoth: お、del.icio.usってURLが変わっていたのか！必須グリモンのSBMCommentsViewerが動かなくて困っていたので、さっそく修正した。

2008
0803

Tagsfirefox javascript ruby userjs

⇧

スクリプト色々更新

No More Scripts

本体：nomorescripts_main.js
設定ファイル：nomorescripts_domains.js

大幅に修正。セカンドレベルドメインにも対応したので、ブロック指定が楽になった。

基本的に外部参照ファイルをブロックしているわけだが、NoScript同様、メニューを開くだけでそのサイトがどれだけ外部参照コンテンツ、というか広告の類を貼りまくっているかが一目瞭然なので・・・

おびただしいがいぶドメインのかずかず

こーいったサイトが多いからこそ、このようなスクリプトが必要になる。

Pragger

自作したPragger用プラグイン

elem_cacheは無かったことに。ラジオ新着関係を全部修正。ニコニコ動画検索も修正。クラブニンテンドーの未回答アンケートもファミコン探偵倶楽部を遊んだのでようやく対応。

そういや、Praggerをレンタルサーバー上で動かしているんだが、一部のプラグインの動作が、ssh上で実行した時とcron経由で実行した時とローカルで実行した時の動作が違ってしまって非常に困る。というかcron。明らかに入っているはずのプラグインがnot foundだったりわけわからん。

そもそも、ローカルのコマンドライン上で実行しているのがイレギュラーだから、サーバー上で動かしてみるべきなのか？

js-markdown-extra

リンクの参照スタイル使用時にtitleを省略か空白にしていると正しく変換されなかったのを指摘して頂いたので修正。ありがとうございます。

Info

投稿日: 2008年5月31日
タグ: javascript、opera、ruby、userjs
このエントリの固定リンク: http://bmky.net/diary/log/1765.html
ブックマークに追加する
コメント: コメントを投稿する

2008
0531

Tagsjavascript opera ruby userjs

⇧

mp3へのリンクにGoogleのmp3プレイヤーを埋め込むユーザースクリプト

Inline Google Mp3 Player — Userscripts.org

その発想、YESだね！

んが、@include *で全てのページを開く度に全てのリンクを走査されてはたまらないので、スクリプトを/packer/で圧縮してOperaのブックマークレットとして登録。んむ、ディモールト・ベネ。

しかし、適当に巡回していると未だにmp3をlzhで圧縮してるとこが結構あったりするのであった。数年前の名残で拡張子がmp3のままアップロードできないとかいうレガシーなレンタルサーバーなのだろう。

で、それらを大量にダウンロードして解凍すると、裸で出てきたり、フォルダに入ってたり、マトリョーシカだったり、HTMLが落ちてきてたりしてブチギレ金剛ですよ。

いやまあ、mp3で抽出すりゃいいってのはわかるんだがね。

んで、それらをプレイヤーにぶち込むと、今度はID3タグが空っぽで、またブチｇ

Info

投稿日: 2007年7月7日
タグ: javascript、userjs
このエントリの固定リンク: http://bmky.net/diary/log/1544.html
ブックマークに追加する
コメント: コメントを投稿する

2007
0707

Tagsjavascript userjs

⇧

ExternalInterfaceに挑む

Flashのストレージが動かないと書いたが、状況を整理してみる。

まず、テストページは動作する。

ブラウザ	save2local.js	storage.js
IE	○	○
Firefox	○	×
Opera	○	×

これらをダウンロードして組み込み、ホスト上で動かすと動作しない。いや、正確には動作したりしなかったり、だ。何がトリガーとなって動作するかがわからない。

一応、最小構成で動作させると動いた。

そもそも、FlashとJavaScript間で直接通信するのはExternalInterfaceというらしく、これが働いていないおかげで、結果としてFlashのストレージが機能していないようだ。

というわけで幾つか策を練ってみた。検証には3ブラウザで動作したsave2localを使用する。Flashのバージョンは全て9.0.16.0だ。

DOMの汚染

真っ先に思いついたのがコレ。特殊なアプリに組み込んでいるから動作しないのではないか？

そこで、最小構成で動作するページを用意し、そのページをIFrameで呼び出し、

document.getElementById( id ).contentWindow.save2local.saveData( key, value );

こなかじに直接引っ張ってみる。

結果：失敗

まさかIFrame内まで汚染するというのか！？と思ったが、さすがにそれはないだろう。だとすると他の原因があるはずだ。しかも、動作したりしなかったりしていたということから見ても、ほんの少しの違いで動作するようなもののはずだ。

JQueryを外す

結果：失敗

とりあえずやってみた。期待はしていなかったが。

ぐぐる

同様にハマってそうな上記2エントリを発見。試しにexternalやらAllowScriptAccessを付けてみた。

結果：失敗

ウボァー

ムネンアトヲタノム

全っっっ然わからん。俺が扱うには経験値が足りなかったということか。つーわけで素直に諦め・・・ようとしたところで動いた。一箇所直しただけで。それを元に戻す。・・・動かなかった。まさか、これで確定？

テストページ

つまり、こういうことか。

Flashがdisplay:noneになっていると、ExternalInterfaceが動作しない・・・っ！

考察

なぜにdisplay:noneだと動作しないかというと、まずCSSが読み込まれて、Flashを入れるdivにdisplay:noneが設定される。

display:noneが設定されている場合、その中の要素がsrcで何がしかのソースを指していたとしても、どうせ見えないんだからとブラウザ側はダウンロードしようとしない。

つまり、ExternalInterfaceしたくてもFlashそのものが読み込まれていなかったんだよ！

動かなかった原因は明らかにこちら側のミスだったわけであり、そしてこの諦念・・・

・・・でも、それだったら、display:noneな中にFlashを指定して、FlashVarsで渡したものが動作する理由がわからん。

それに、後からdisplay:noneにした場合、既にFlashは読み込まれているから動作すると思ったんだが、動作しなかった。なぜに。

とりあえず分かったのは、noneにしなけりゃ動くっぽいことか。

先生、事件です

IEで動いたり動かなかったりしてる。

新しいタブで開く。⇒動く
↓
F5で更新。⇒動かない。

・・・なぜに初回のみ動くのだ。ってInternetExplorerなら問題無かった。Sleipnir 2.5だと初回のみだった。

あと、IEはdisplay:noneとか関係無しに動いた。さらにわけが分からなくなる。

補足

AllowScriptAccessを設定すると、値によって動作する環境が変化する。

always: ActionScript による JavaScript の呼び出しを常に許可します。
sameDomain: SWF と HTML ページのドメインが一致する場合にのみ、ActionScript による JavaScript の呼び出しを許可します。
never: ActionScript による JavaScript の呼び出しを常に許可しません。

Adobe - デベロッパーセンター : Flash Player 8 のセキュリティ機能の変更点

デフォルトはhttp://上でないと動かないので、恐らくsameDomainだと思われる。

save2local.swf.addParam("AllowScriptAccess", "always");

このようにalwaysを設定してやると、IE以外はfile://な環境でも動作した。

と思ったら

同じテストファイルをPC変えて動作させたら全ブラウザがローカルで起動しなくなった。Flashのバージョンは同じなんだが・・・

疑問

上記の方法ならばstorage.jsのほうも同じ方法で動くはずだと思ったが、動作せず。

storage.jsはテストページの時点でIEしか動作しなかったので、IE専用かと思ったが、IEもだめだった。当然display:noneは設定していない。なぜ・・・

戦い終わって～神々の黄昏～

レイアウトが崩れるのを避けるためにdisplay:noneにしていたのが、そもそもの間違いだった。というわけで、width:0、height:0で適当な場所に転がす。んむ、動作した。

ExternalInterfaceの動作条件にはまだ分からない部分があるが、とりあえず使えるようになっただけでも大きな一歩か。だがあまりにも不安定すぎる。なんなんだこれは。

Info

投稿日: 2007年3月8日
タグ: flash、javascript
このエントリの固定リンク: http://bmky.net/diary/log/1516.html
ブックマークに追加する
コメント: コメントを投稿する

2007
0308

Tagsflash javascript

⇧

Flashを利用したストレージが動かん

Cookieによるデータの保存は容量が少ないのが欠点で、それを解消する為にFlashを利用してローカルとデータをやりとりするものなんだが、最小構成にしようが何しようが全く動かん。

if( navigator.appName.indexOf( "Microsoft" ) != -1 ) {
    return window[name];
} else {
    return document[name];
}

両スクリプトともこの部分で引っかかってるようなのだが原因がさっぱりわからん。唯一save2local.jsのテストページだけは動作したが、Firebugでゴリゴリ掘っていっても原因が掴めず。つーか、テストページ丸ごと保存してローカルで動かすとやっぱり反応しないし。ちゃんと設定パネルでセキュリティは大丈夫なようにしてるんだがなぁ・・・

で、ぐぐってみても動かないという話が見当たらない。・・・一体どこが悪いんだ。

Info

投稿日: 2007年2月23日
タグ: flash、javascript
このエントリの固定リンク: http://bmky.net/diary/log/1513.html
ブックマークに追加する
コメント: コメントを投稿する

2007
0223

Tagsflash javascript

⇧

JavaScriptでCSSを弄る際のメモをまとめた

JavaScriptによるCSSの操作

まとめた理由: 書いた俺自身が、あれどーやんだっけな～、と自分の書いた文書をあちこち探してたことがあったから。

というわけで、サクっとまとめつつ、Opera9の仕様とかにも合わせたり、関数を微妙に改良したりとかいろいろ変更を加えた。

今後CSS関係で何か分かったらこっちに追加するつもり。

Info

投稿日: 2006年8月24日
タグ: css、javascript
このエントリの固定リンク: http://bmky.net/diary/log/1431.html
ブックマークに追加する
コメント: コメントを投稿する

2006
0824

Tagscss javascript

⇧

ニンテンドーDSブラウザでAjax

っぽいことをする。

XMLHttpRequestがダメなだけで、iframeを使ってテキスト取得とかは可能。俗に言うIFRAMEHTTPRequest。もしくはHTTP.Push？

var iframe = document.createElement( "iframe" );
iframe.src = <ローカルファイル>;
iframe.onload = function( ) {
//読み込み完了時の動作
}
document.body.appendChild( iframe );

最小構成だとこなかじ。当然のことながら呼び出すコンテンツは同じドメインのものでないと、内部にアクセスした途端にエラーが返ってくる。

んで、XMLHttpRequestではないので色々と制限を受ける。

HTMLを読み込んだ時は、画像やらスクリプトやら諸々全てが完全に読み込まれてから初めてonloadが発生したり、POSTで取得できなかったり。（がんばればできるという話を聞いたが）

textやscriptを読むときは注意が必要。内部でpre要素に入れられつつ、[<>"&]が文字参照に変換されてしまっているので元に戻す必要がある。

var doc = <iframeオブジェクト>.contentWindow.document;
if( doc.doctype == null ) { //nullだとhtmlではない・・・らしい
    alert( doc.body.innerHTML
    .replace( /^<pre>|<\/pre>$/i, "" )
    .replace( /&quot;/g, "\"" )
    .replace( /&lt;/g, "<" )
    .replace( /&gt;/g, ">" )
    .replace( /&amp;/g, "&" )
    );
}
else {
    alert( doc.body.innerHTML );
}

外部のコンテンツはとりあえず取得できる。が、したらしたで今度は貧弱なDSの側で色々しなきゃいかん場合もあるので、ある程度はサーバーサイドと相談するのがいいかもしれん。

補足。試しにGoogleのHTMLソースを取得してalertさせたら、画面暗転してから（この時点で既に読み込みは完了してる）ソース表示まで10秒近くかかった。・・・そこまで負荷がかかるのか。（というか描画全般に弱いのかな？）

Info

投稿日: 2006年8月1日
タグ: game、javascript、opera
このエントリの固定リンク: http://bmky.net/diary/log/1421.html
ブックマークに追加する
コメント: コメントを投稿する

2006
0801

Tagsgame javascript opera

⇧

PHP Markdown ExtraをJavaScriptに移植した

劣化してるけど。

js-markdown-extra

js-markdownというものは以前から存在していたけど、やっぱり定義リストやテーブルも使えるといいよねー。

そこで、正規表現の勉強も兼ねてPHP Markdown Extraを移植してみようじゃあないか、と思って作ってみたのがこれ。PerlとJavaScriptの正規表現は全然違うので移植に苦労したが、ある程度までなら再現してくれるだろう。たぶん。

使い道だが・・・ブログやwiki投稿前のリアルタイムプレビューに使ったりとかかな？　俺は愛用しているテキストエディタの「Alpha」に組み込んで、ショートカットキー一発でHTMLに変換するようにしてる。ちょっとしたHTMLを書きたいときとか超便利。

JavaScriptの正規表現の限界+勉強不足のせいで不具合がそこそこあり、複雑な構文を変換しようとすると固まる可能性があるので、利用の際は注意して欲しい。ローカルでの利用を激しく推奨。

Info

投稿日: 2006年7月8日
タグ: javascript
このエントリの固定リンク: http://bmky.net/diary/log/1411.html
ブックマークに追加する
コメント: コメントを投稿する

2006
0708

Tagsjavascript

⇧

JavaScriptでCSSを弄る際のメモその3 Opera9について

このエントリは、JavaScriptによるCSSの操作として新たに書き直しました。

前々回、前回同様いい加減な部分もあるので、鵜呑みにしないように。

Changelog

…

Added support for DOM level 2 Style Sheets and associated parts of DOM level 2 CSS. (Yay!!)

Friday once more! - Opera Desktop Team

DOM2CSSが遂に！

早速インストールして色々試してみたけど、基本はFirefoxと一緒でIEの良いとこ取りになってる。コードの書き換えはほとんど必要なし。ありがとう、おぺらたん！

スタイルシートルールの追加と無効

基本的な方法は前々回と一緒。3ブラウザ共通。

スタイルシートルールの取得

基本的な使い方は前々回と一緒。

Operaの場合、返ってくる値の自動補完は無効。つまりIEと一緒で、実際に記述したプロパティの値しか返ってこないっぽい。

div.hoge { background : #668 }

getStyleValue( "div.hoge", "background" );
//IE : #668
//Firefox : rgb(136, 102, 102) none repeat scroll 0% 0%
//Opera : #668

要素に適用されているスタイルを取得する

ここでちょいと前々回の修正。

FirefoxはgetComputedStyleを利用して取得するが、この場合得られる値は何が何でもpx換算されてしまう。

仮にemで指定した場合、ブラウザのフォント設定によって結果が変わってしまう。ブラウザ側で18pxと設定してCSSに1emと記述した場合、1em=1文字の大きさ=設定された18pxとなり、18pxが返ってくる。

ブラウザ側でCtrl++でフォントを大きくした場合でもしっかり対応してくれるので、使いようによっては便利かもしれない。上記の例なら、2回フォントを大きくしてから取得すれば、しっかり50%増しの27pxが返ってくる。試していないが、モニタ解像度を96dpiから72dpiに変えたりすれば、pt指定の値も変化するものと思われる。

なお、OperaはgetComputedStyleでもcurrentStyleでも両方イケるので、記述した値をまんま取得したいならcurrentStyleで取得するべきだ。

getComputedStyleで取得する場合、OperaはFirefoxと違ってブラウザ側のフォントサイズ変更には追従してくれないので注意。300%まで拡大してもデフォルトサイズが返ってくる。

それと、OperaのgetPropertyValueはFirefoxと違い、一括指定したプロパティでもIE同様に取得することができる。

#hoge { margin : 1em }

getActiveStyle( $( "hoge" ), "margin" );
//IE : 1em
//Firefox : null
//Opera(currentStyle) : 1em
//Opera(getPropertyValue) : 16px

軽くまとめる

IE: －セレクタ毎に分割登録される; × 擬似要素（:visited等）が取得できない; × 全称セレクタが削除されて登録される
Firefox: －セレクタ毎に分割登録されない; ○ ブラウザに忠実なpxサイズ取得; △ プロパティの自動補完; × 一括指定セレクタで取得できない
Opera: －セレクタ毎に分割登録されない; ○ IE/Firefox両方の方法で取得できる

雑感

Operaがいい感じに仕上がってきたので、ボチボチ使い始めてる。

デフォルトでも最低限の機能が揃ってるOperaをライトユーザーに。拡張をブヂュルブヂュル入れてパワーアップ！　スワップしてくれるぜー！　というコアユーザーはFirefox、という風に住み分けてもいいんじゃないかと思えるようになってきた。

描画周りが速いOperaをwebアプリケーション専用ランチャーにでもしようかなーとか思ってたり。メーラーとして使ってもいいだろうし。

そういやOperaは各種携帯端末だけじゃなく、DSでも使える上にwii標準搭載らしい。実にいいね。

InternetExplorer？　dataスキーム未実装でスクリプト処理速度が亀でAcid2が血の海でまともにCSSが使えないブラウザなんて存在しませんよ。ファンタジーやメルヘンじゃあるまいし。

Info

投稿日: 2006年6月14日
タグ: css、javascript
このエントリの固定リンク: http://bmky.net/diary/log/1393.html
ブックマークに追加する
コメント: コメントを投稿する

SBM Comments

Cald

Opera Config Setting

nabeso

いつか復帰したときの為に、オペラの設定変更用拡張

asiamoth

これ�

2006
0614

Tagscss javascript

⇧

URLについて

追記

No More Scripts

Pragger

DOMの汚染

JQueryを外す

ぐぐる

ムネンアトヲタノム

考察

先生、事件です

補足

と思ったら

疑問

戦い終わって ～神々の黄昏～

Changelog

スタイルシートルールの追加と無効

スタイルシートルールの取得

要素に適用されているスタイルを取得する

軽くまとめる

雑感

戦い終わって～神々の黄昏～