Home > プログラミング Archive

プログラミング Archive

ユーザースクリプト(LDR shortcut key read by rate)のFirefox3対応

Andre's garden - livedoor Readerのフィードをレートごとに既読にするGreasemonkey

をFirefox3に対応にしました。


ldr_shortcut_key_read_by.user.js

window.addEventListener("load", function() {
	
	var fns = new Array();
	for (var k=0;k<=5;k++) {
		var fn = '(function(){var sl = window.subs.model.get_by_rate('+k+').list;for (var i=0;i<sl.length;i++) window.touch_all(sl[i].subscribe_id);})'; 
		fns[k] = 'eval("'+'window.Keybind.add(String(' + k + '), ' + fn + ');'+'");';
	}
	
	var script = document.createElement('script');
	script.type = 'text/javascript';
	script.innerHTML = fns.join("");
	document.getElementsByTagName('head')[0].appendChild(script);
	
}, false);

このあたりを参考にさせていただきました。感謝^^
Firefox3 + GreasemonkeyでunsafeWindowのプロパティが取れない件を解決する方法 - koumiyaの日記
GreasemonkeyをBookmarklet的に実行してみる - 0x集積蔵

ああ・・・優しくないソースなぁ。もっと上手くかけそう^^;

こっちはなーんにもしなくてFirefox3で動きます。
Andre's garden - 他のサイトでもニコニコ動画をポップアップできるようになりました。

Kanasan.JS JavaScript第5版読書会#5に参加しました

JavaScript、実は2ヶ月くらいごぶさた・・・でもはずせねー


そして今回も堺筋本町12番出口から東西反対に歩いてぎりぎり会場に到着しました。


技術的なことは今回も高度だったのでスルー気味(あとで消化・・・)
あと、前の日京都いってた人大杉です。


読書会について

ustream.tvを観ながら書いてます。 この仕組みはすごくありがたいです。 それにしてもKanasanの顔がいつも見える。 女性が見たらサブリミナルでほれる人がいるかもしれないと本気で心配している。

Kanasan.JS : JavaScript Workshop in Kansai: Ustream.TV Show, Chat Room, LIVE Streaming Video. Webcam Chat, Webcast, News Events. Online Video Cam Community


ひっかかったところのみ


第2章 クライアントサイドJavaScriptから


13.2.1 script タグ
>kanasan 個人的にはscriptタグにもonloadが欲しいです。

確かに。

自分で作ったコードもそうだけど重いライブラリの読み込みでオブジェクトができてなかったり、とかくロードの順番がらみはよく泣かされます。


13.2.4 defer属性
scriptの実行を遅延する。
重いScriptの処理を待たなくてもよくなる。


でも、IEだけーーー、しかも実装に問題ありって^^;


サプライズ

途中からサイボウズラボのamacahangさんとtakesakoさんがいらした。 すっげーびっくり。

プレゼン

休憩後にプレゼン(休憩後の頭によい刺激)

どれもおもしろかったー!のですがメモし忘れていた><ので抜粋


nanto_vi さん
ゆの in ECMAScript: Days on the Moon
すごい。
なんというDSL。いろんな方向にすごすぎです。
「無駄に無駄がない。完璧な無駄」という表現はこのプレゼンにぴったりはまっています。
いつもながら説明が理路整然としていて本当にわかりやすいです。


takesakoさん
同一出身ポリシーに関係していたようなしないような・・・
飲んだら記憶が飛んでしまいました><


Yharaさん
ブックマークレットをブックマークレットから選択できるサービス。
斬新なアイデア。
特定のサイトでつかいたいブックマークレットが絞れるとか期待が膨らみます^^/


Yuyaさん
新しいサービス
LDR candle - livedoor Readerの未読数を株式チャート風に表示!
積読を消化するモチベーションに。


KIMOTOさん
javascriptでprivate変数を実現する方法について
DelphiやC#から入ったのでprivateつけたくなる感覚わかります。

懇親会について

学校の雰囲気の居酒屋。 小学校風の教室で給食代わりにビール。オツです。 懇親会は初めてでしたが、紙飛行機に書かれたWEBのステータスコードで普通に会話がなりたったり、コアな話が満載でとても楽しいひとときでした。 あ、テストは70点でした。 まちがった3問中2問が主語と述語の問題。 やはり日本語能力に疑問があることが判明したw

最後にKanasanならびにスタッフのみなさんありがとうございます。
へっぽこプログラマの私でも継続して勉強会に参加できるのは、今度もいってみたいと思わせる雰囲気を作っている皆さんのおかげです。

他のサイトでもニコニコ動画をポップアップできるようになりました。

「おらには隠された力があるみたいだ!」

^^;

Nico multi-pop-drag-resizeの拡張について

インストール

nicomultipopdragresize.user.js
nicomultipopdragresizepa.user.js

1.他のサイトでもニコニコ動画へのリンクがあればポップアップできるようになりました。

下のイメージのようにニコニコ動画へのリンクに反応してポップアップボタンが追加されます。(サイト例:はてなブックマーク - タグ ウッーウッーウマウマ(


サーバーの負荷を懸念してポップアップできる動画は、最大5つまでにしています。が、ソースがわかる人なら制限をはずすのは難しくないです。程度についてはご配慮ください。私の場合は動画を5つも並べたらパラレルに流れる動画の情報量が多すぎてとてもムリ^^;○王拳は、3倍が限度ですね。


2.ポップアップ先の動画プレーヤの拡大縮小ができるようになりました。

ほぼ自動。上下のドラッグに反応して動画の大きさを自動調節します。

3.ショートカットの設定画面をwで呼びだせるようになりました。

他のサイトでショートカットがかぶる方は、変えてください。OKで設定保存。cancelなら何もしません。

ショートカットの初期値も若干変わりました。(設定の詳細は、Andre's garden - ニュータイプっぽくニコニコ動画の一覧から動画を先読みするGreasemonkeyのショートカットキーを参考にしてください。)


i:初期化
ctrl+r:リロード(私の環境でLDRとかぶるから。それだけです^^)
d:全動画の非表示
m:マニュアルモード切り替え(自動/マニュアル)
w:キーバインド設定画面を開く

設定したキーの意味(大文字小文字は区別しません)

・w → wキーを押す。
・ctrl+w →コントロール(Ctrl)ボタンを押しながらwキーを押す。 
・shift+w →シフト(Shift)ボタンを押しながらwキーを押す。 


レベルアップ内容について

1については前からできることはわかっていたのですが、ニコニコ動画的にどうなんだろうと思って自重していました。
今回、規約を見てみたのですが特にまずくなかったようだったので(まぁ、所詮ユーザースクリプトですからね)のでレベルアップしてみました。
2は(自分的に)とてつもなく便利です。オミトロンというとんでもなく多機能なツールのニコニコ動画閲覧用フィルタをぼーっと眺めていたらjavascriptで実現可能なことがわかってしまったので採用してみました^^/
3は、1からLDRやGoogle Reader上で動かしているとショートカットがかぶるので自然と必要になった機能です。

その他

・ポップアップリンクは、基本的に同列にあるノードの直前のリンクをたどっているだけなので観れないものもあります。(全てには対応できないです。)

・ニコニュースやコントローラーも消した形で動画を観れたりするといいのかもしれませんが、大変そうだったの断念しました。
・ニコニコ動画のサムネイルからポップアップはできそうなのでそのうち改善する予定です。
・ポップアップ先の動画で全画面表示をするとレイアウトが崩れます。私はあまり使わないのですが、きになるようなら直すかもしれません。
・ショートカットキーのUIのメリット・デメリットがわかってきました。邪魔でなければAutoPagerizeのようなUIが設定にはいいのかもしれませんね。

関連エントリ

Andre's garden - ニュータイプっぽくニコニコ動画の一覧から動画を先読みするGreasemonkeyなんですが、以下のエントリでご紹介いただいています。ありがとうございます^^
最近興味深かったページ | 王様の箱庭
Web scratch ≫ ニコニコ動画用Greasemonkeyスクリプトのまとめ


追記(3/30)

ニコニコ動画のサムネイルからポップアップできるようになりました

サムネイル右横にあるポップアップのみ有効です。

参考動画スペインにある超デンジャラスな道「El Caminito del Rey」‐ニコニコ動画(SP1)

ニコ動観れない方はこちらから↓(by ニコ動サムネイル生成-EX

スペインにある超デンジャラスな道「El Caminito del Rey」
スペインにある超デンジャラスな道「El Caminito del Rey」

リンクのすぐ後ろにポップアップボタンを追加するようにしました。

マイリストのようにイメージ付のリンクが連続して並んでいる場合でもポップアップできるようになってます。(見た目は微妙ですけど・・・)

インストール元は更新済み(nicomultipopdragresize.user.jsのみ更新)です。

更新でレベルアップしない方は、firefoxのツール→Greasemonkey→ユーザースクリプトの管理→Nico multi-pop-drag-resizeを選択→アンインストールしてからもう一度インストールしてください。

追記(3/31)

nm形式(ニコニコムービーメーカの動画)のリンクにも対応しました。

ニュータイプっぽくニコニコ動画の一覧から動画を先読みするGreasemonkey

「ぼくが、一番ニコ動をうまく使えるんだーーー!ずぎゅーーん」

「・・・ばかな、あんどれ」

なんてことを言われたどうかはわかりませんが、Youtube用のGreasemonkeyにYouTube動画を同一画面上に開いてリサイズできるGreasemonkey|WEBマーケティングブログというのがありまして、便利だったのでニコニコ動画用につくってみました。

「マイリスト」「ランキング」「タグ検索」「キーワード検索」等の動画一覧の動画リンク横にあるボタンをクリックすると画面遷移することなしに動画をポップアップで起動できるようになります。

まるで先読みの・・・のような操作感!(笑)

大量の動画をポップアップすることもできますが、ぶっちゃげ私のマシンではCPUの性能が追いつかない(まさにニュータイプwww)のであまり試してません。ま、サーバーに優しくね^^(試したのは今のところ同時6個くらいまで・・・爆発しそうでした。)

[簡単な使い方]

1.インストール

Greasemonkeyと下のユーザースクリプトをインストールしてください。都合上スクリプトが2つになってます。nicomultipopdragresize.user.jsだけでも動きますが、その場合、自動モード(後述)のみになります。

nicomultipopdragresize.user.js
nicomultipopdragresizepa.user.js

2.利用できる画面

ニコニコ動画の一覧(例タグ検索 演奏してみた‐ニコニコ動画(SP1))を開きます。動画のリンク横に下のイメージのようなポップアップボタンがあるので押してください。小さなウィンドウ(ポップアップ画面)が起動して動画が見れます。

3.ポップアップ画面について

閉じたいときは画面左上の×ボタンで閉じてください。リサイズは、下のイメージのように画面右下の端をドラッグして下さい。画面上のドラッグバーをドラッグ&ドロップして画面移動もできます。

4.ショートカットキー

i :初期化 ポップアップ画面のサイズ・位置・スクロールの位置(縦)を初期化します。

r :リロード
Friefox拡張(※)によっては、動的にリンクが増えたりするものもあるので、更新されたリンクに対してポップアップボタンを追加します。

(※)試したのは私の使っている拡張マイリストとAutoPagerize(ウノウラボ Unoh Labs: Webブラウジングを快適にするAutoPagerize)です。いつもお世話になりまくってます。

m :ポップアップ画面内の縦スクロール位置の設定方法の切り替え
OKならマニュアルモード→一番最後に移動した縦スクロール位置を記憶。
キャンセルなら自動調整モード(初期値)→動画が見える位置まで自動スクロール。

d :ポップアップ画面を全て閉じる
ポップアップが増えすぎたり、画面の外に移動してしまってカオスな状況になった人のために。

5.他のユーザースクリプトとのコンフリクト(衝突)について

ユーザースクリプト(以下US)の宿命(?)で他のUSに影響を与えることがあります。 例えばポップアップの画面内で拡張マイリストの登録をすると動画のIDが正しく取れません。

原因は、ポップアップ先の画面で特定の場所にジャンプする都合上、URLの後に~#flvplayer_container、#flvplayer_container_mをつけているからです。(動画のIDを抜き出す処理に影響したりします。)

対応(1)もっともシンプル

ポップアップ先の画面では他のUSを使わない。

ポップアップ画面内でいろんなことをやった場合どうなるかはあんまりテストしてません。
動画をみるだけにしておいたほうがよいかも。

対応(2)USなんとなくわかります人向け

ポップアップ先の画面で使われている他のUSを編集。以下のURLを除外URLにする。

編集したUSがポップアップ時のみ無効になります。

http://www.nicovideo.jp/watch*#flvplayer_container
http://www.nicovideo.jp/watch*#flvplayer_container_m

対応(3)USカスタマイズすればいんじゃない?人向け
私はポップアップ先でも拡張マイリスト使いたい(ワガママなやつ^^;)ので以下のようにしました。
nicovideoadditionalmylis.user.js
function getVideoInfo()の1019行あたり
//var m = w.location.href.match(/^http:\/\/.*?\.nicovideo\.jp\/watch\/([^\/]+)/);
var m = w.location.href.match(/^http:\/\/.*?\.nicovideo\.jp\/watch\/([a-z0-9]+)/);

6.ちょっと改善


・ポップアップ画面を閉じるときに位置とサイズを記憶しますので初期化するときは全画面閉じてないとあまり意味がなかったりします。
・友人にテストしてもらったら文字入力時にショートカットが有効になるのがウザイという助言(グッジョブ!ありがとう^^)をもらったので「shortcuts.js」(すばらしいライブラリです。)を取り込んで無効にしました。


7.プログラム的なところ


・スクリプトが2つになったのが残念。
開いたポップアップ(iframeで作成)のスクロールバーが親から制御できなかった。結果、ポップアップ先で動くスクリプトを別に作成。iframeはじめてまともにつかった(w)のですが理解し切れてないようです。
wrappedJSObjectでできそうな気がしたんですけどだめでした。

参考サイト
304 - narucissus is Not Modified: Greasemonkeyで遊ぶ(その1)
XPCNativeWrapper - MDC

・元ソースから改変しまくったので無駄が多い。
直せたら総リファクタしたいくらい。ただ、ユーザースクリプトの賞味期限を考えるとこのままでもいいかなーと考えたりもします。

おまけ

はてなスターが沢山ついているエントリーがうらやますぃーので少しタイトルと序文をいい感じに工夫してみましたウヒヒw

参考サイト
トレビアンな文章が書けるテクニック! - livedoor ディレクター Blog

関連エントリ

Andre's garden: livedoor Readerのフィードをレートごとに既読にするGreasemonkey

追記(3/31)

レベルアップしました。Andre's garden - 他のサイトでもニコニコ動画をポップアップできるようになりました。

livedoor Readerのフィードをレートごとに既読にするGreasemonkey

livedoor Reader(LDR)便利ですよね。
よく読むフィードには、レートをつけて時間がないときにはそれだけ読んでいます。
でも、ずっと不思議に思っていたのが、読み終わっていないフィードを既読にする時、すべてを既読にする機能しかなかったこと。

あっさり実現できるので何か意図があるはず(ポリシーのあるシステムは大好きです^^)なんですけど、5つ星レートも読みきれない時がある私には、たまりたまった4つ星レート以下を全部既読にしたくて、「レートごとに既読にできないかなー」と常々思っていました。

そんなある日、ぼーっと
LDR、「既読する」にショートカットキーを割り当てるGreasemonkeyスクリプト - 実用

を読んで、ついに脳みそのシナプスが発火しました(笑)

ldrshortcutkeyreadbyrate.user.js

livedoor Readerのフィードをレートごとに既読にするGreasemonkeyです。

0~5をショートカットキーにわりあてていて、押したショートカットのレートのフィード(例えば、5なら5つ星レート)が既読になります。

Greasemonkey(グリースモンキー)なのでFirefox限定です。
グリースモンキーについてはこちら(Greasemonkey入門 ~よくわかるグリースモンキーの使い方 ~ | Google Mania - グーグルの便利な使い方)が詳しいです。グリースモンキーはとんでもなく便利です。もうこれなしでは生きてゆけないw

ソースも短いのでさらしてみます。(ひー、変なところがあったら教えてください^^)

// ==UserScript==
// @name			LDR shortcut key read by rate
// @namespace		http://andre-garden.com
// @description	LDR shortcut key of 0..5 make rateing entry read.
// @include		http://reader.livedoor.com/*
// ==/UserScript==

window.addEventListener("load", function() {
  var uw = unsafeWindow;
for (var k=0;k<=5;k++) {
var fn = 'function(){
var sl = uw.subs.model.get_by_rate(' + k + ').list;
for (var i=0;i<sl.length;i++)
uw.touch_all(sl[i].subscribe_id);
}';
uw.Keybind.add(String(k), eval(fn));
}
}, false);

追記
LDRってFirebugをはじくようになってるみたいなんですけど、こういう場合ってみなさんどうやって開発してるんでしょうね。ゴリゴリデバッグ。結局、jash使ったりしましたがどうも使い方がわかってないのでもどかしいです。

ブログ上のコード記法がめちゃくちゃになってきたので手抜きでtextareaにしました。
決定版みたいな方法どなたかおしえてほしいです^^;

更に追記(3/15 17:00)
ブログにコードを貼り付ける方法で悩むの巻 | IDEA*IDEAを参考に<pre class="code">...</pre>のスタイルにしました。

ニコ動サムネイルリンクジェネレーター(はてブ用)を拡張してみました。

また、手抜きっぽいタイトルですが・・・前回に続いて

ニコ動サムネイル生成-EX(はてブ)

ブックマークレットを作ってみました。(しかし長い名前だ。てきとうに変えてください><)

作成できるサムネイルの種類が2つ増えました。

・ニコニコ動画サムネイル風

KURIKINTON FOX - Ride on sky

4:3
再生:51133
コメント:2087
マイリスト:876

2007年03月06日 13:03:13 投稿

KURIKINTON FOX - Ride on sky
オリジナルカッコイイ!

ww yべよ はじめてきく かっけーーーー 野外プレイwwwww 聞いてて心地よいです

(※1)

・ニコニコ動画マイリスト風

【初音ミク】melody...3D PV ver1.50

4分42秒

2007年12月15日 22:50:13 投稿
再生:563616 | コメント:90561 | マイリスト:34079

【初音ミク】melody...3D PV ver1.50

(※2)

登録の仕方は、前のAndre's garden: ニコ動サムネイルリンクジェネレーター(はてブ用)を作ってみました。
と同じです。

全てHTMLで生成しているのでタグがCSSの影響を受けるのはご勘弁を。
ニコニコ動画は、影響を遮断するため完全にiframeタグでヘッダーからCSSまで生成してますね。
サーバーにサムネイル用のファイルを置くほど太っ腹ではないもので^^

後、変わったところと言えば、サムネイルの情報(タイトルやコメント等)を取得する都合上、「ニコ動サムネイル生成-EX(はてブ)」を使用するサイトが、はてなブックマーク上ではなく元のニコニコ動画のサイト(例えば、KURIKINTON FOX - Ride on sky‐ニコニコ動画(SP1))になりました。(※3)

なのでニコニコ動画のアカウントがないと作成しにくいかもしれませんね。
サムネイルリンクのリンク先は、もちろん(笑)ニコニコ動画が観れるはてなブックマークです。
ブックマークをしていないニコニコ動画の場合、リンク先で「登録されていません」とでますが、「このエントリーをブックマークに追加」とすれば、当然ながら観れるようになります。

しかし、なんということでしょう!(ビフォア・○フター風w)
URLさえわかれば視聴できてしまうんですねーー。これ仕様としてありなんでしょうか…^^;

[補足]

それにしてもニコ動の動画は、紹介したくても紹介しづらいですね。(著作権的にw)
選んだ動画はどちらもオリジナルのコンテンツです。

(※1)
Youtubeでも昔から有名なギタリストです。よく聴きました。
こんな風にオリジナル曲とか弾けたら楽しいんだろうなー。

(※2)
ほっとんど唯一2次創作が許容されているコンテンツといえば初音ミク
この動画ははじめて観ましたが再生数:56万オーバーとはすさまじい。
好みはあるでしょうが曲も動画もおそろしいほどのクオリティ。
無償でこれを作る人の技術力がすごいです。

(※3)
ドメイン越えができなかっただけです。

開発時の参考サイト

スクリプトの動的ロード ・・・ 色々めんどう。ActionScript3.0はimportがあるだけで偉いわw
suVeneのあれ: [JavaScript]動的ロード(遅延ロード)3
jQuery ・・・ 便利です。
API/1.2/Ajax - jQuery JavaScript Library
クエリストリング取得 ・・・ というかなんで標準でないの?
Script雑感: Javascript:クエリストリングからパラメータ配列を生成する関数とその逆の関数

懸念事項 ・・・ 対策したからたぶん大丈夫^^;IEさんには泣かされます。このブラウザを考慮しなかったら1/3くらいの工数で終わるのに。
[IE] URL に使用可能な文字数は最大 2,083 文字

ニコ動サムネイルリンクジェネレーター(はてブ用)を作ってみました。

ずっと子猫のターン! ~(ノ?・ω・)ノ {ママ~)‐ニコニコ動画(RC2)
ずっと子猫のターン! ~(ノ?・ω・)ノ {ママ~)‐ニコニコ動画(RC2)

上のようなリンクが生成できるブックマークレットを作ってみました。

ニコ動サムネイル生成(はてブ)

このリンクを右クリックしてお気に入りに追加してください。
ブックマークレット登録についてはこちら(ブックマークレット - はてな)の説明が詳しいです。

後は、はてなブックマーク - ずっと子猫のターン! ~(ノ?・ω・)ノ {ママ~)‐ニコニコ動画(RC2)のようなページ(※1)で登録した「ニコ動サムネイル生成(はてブ)」をお気に入りから選択すればリンク生成済み画面へ移動します。

はてなブックマーク

移動後

Andre's garden: ちょっと奥さん、ニコ動がログインしなくても視聴できるらしいわよ
を書いたときにはてブへのリンクがあまりにさみしかったのでついカッとなって・・・

ニコニコの動画を紹介する際にまだまだプレーヤが貼れないブログも多いですが、これで少しは紹介しやすくなるかも。
(・・・はてなブックマークの利用者ってはてなダイアリーやってる確率高いから意味がないのかもしれんと思ったり思わなかったり^^;)

ちなみに動画は2月22日(ねこの日)にニコニコ動画で観たけしからん動画です(笑)
私は、あやうく死亡するところでした。
まったく、けしからん。にやにやしてヤバイです。

参考
※1ニコニコ動画対応について - はてなブックマーク日記 - 機能変更、お知らせなど
※windowsのFirefox,IE,Operaで試してみました。他は動かないかも^^

追記(3/12)
拡張しました。
Andre's garden: ニコ動サムネイルリンクジェネレーター(はてブ用)を拡張してみました。

便利です。FlashDevelop 3.0.0(ようやくActionScript3.0の入口2)

少し前に試してほったらかしになりそうだったので備忘程度に
タイトルは手抜き・・・いや統一性を意識してw

結局、FlashDevelopも試すことに、やはり.NetでIDEは捨てがたい。。。

FlashDevelopのインストールの一連やり方はここをみるだけでできます。
(FlashDevelop3.0.0Beta2/Flex2 SDK)
FlashDevelop3.0.0Beta2をActionScript3のIDEとして使う

日本語化したい人はこちらが参考になります。
(FlashDevelop-3.0.0-Beta4/Flex2 SDK)
[ヅラド] FlashDevelop のインストールと環境設定

私は、Flex3 SDKを既に入れているので(fcshはFlex3 SDKについてます)のでFlashDevelop3.0.0 Beta4のインストールと日本語化のみ行いました。

インストール終わっての感想
・インテリセンス(ActionScript3.0)便利。(このために入れたといってもいいくらい。他の開発環境はどうなんでしょう?)
・標準で「AS2」「AS3」「JScript」「HaXe」「HTML」「CSS」「XML」「Text」のシンタックスを選択できる。これも見やすくなるのでうれしい。
・プロジェクトの管理はソリューションエクスプローラーで楽。
・ウィンドウ分割も縦に分割してからその分割した画面を横に分割できる。
・要は、VisualStudioライク。慣れてる人にはいいということ。

オープンソースなのでまるごとsvnからソースも落とせます。
http://www.flashdevelop.org/community/viewtopic.php?t=24

時間があれば分析したいところですが(VS2008)ドキュメントもフォーラムだけっぽいし、ソース(もちろんコメントも何もかも英語オンリー)を読むのにしんどくなってきて^^;とりあえず分析停止。思考も停止。。。

このように開発環境としてはすばらしいFlashDevelop(以下FD)なのですが、既にRascutで監視ビルドに目覚めてしまった私にはどうしてもビルド時にRascutを呼びたいわけで。。。。

試してみたところFDの「Tool→Command Prompt」からコマンドプロンプトを起動できる。
Rascutのコマンドを打つ・・・「Rascut .........」

・・・ワンクリックのほうがよくね?
Rascutを起動するバッチを作る。
FDのソリューションエクスプローラーからバッチを起動。
できた\^o^/
バッチをFDから開いて設定を編集。。。。
あれ?文字化けしてバッチ起動せず^^;
FDのエディタをUTF-8に対応させたのですがコマンドプロンプトはShift-JISなのでUTF-8で保存されたバッチファイルでは起動ができないのです。(やり方みつからなかったです。FDのエディタはShift-JIS未対応)

「作るか・・・」

前回と同じ流れ(手抜きではない、^^)ですが、今回は、ちょー簡単なのであっさり完了。

できた\^o^/
↓クリックしたら監視が開始して-sモードでブラウザのswfが更新されている様子。

※例にNicoDischargerのプロジェクトを拝借しています。

Rascut-config.xml内のcommandタグにRascut起動と引数を設定(xmlはUTF-8なのでFDから編集しても問題ない)してRascut-exec.exeをクリックするだけ。
配置は、Rascut_exec.exeと同じフォルダにRascut-config.xmlがあればどこでもいいと思います。
私は、以下のようにコンパイルしたいファイルの直下に置いてます。

↓ソリューションエクスプローラーの拡大画面

書いたほうが早い人もいると思いますが^^;一応置いときます。
アプリ(Zip)
http://andre-garden.com/rascut_exec/rascut_exec.zip

ソース(Zip)
http://andre-garden.com/rascut_exec/rascut_exec_src.zip

適当に作ってるのでわかる人だけ試してください。

※環境、Windows XP SP2、 Microsoft Visual Studio 2005、.NET Framework Version 2.0.50727 SP1下で動作確認

本来はFlashDevelopのプラグインでやりたい所ですが、ソースの森で迷走しそうなので、全く間に合わせ。
FlashDevelopのプラグイン開発のやり方とかわかり易いドキュメントとかあればどなたか教えてきたいところです。

うーん、ActionScript3.0触りたいだけなんですけど寄り道が多い。。。。

便利です。Rascut(ようやくActionScript3.0の入口)

MOONGIFT: ≫ CUIでニコニコ「ニコニコ動画保存 Nicovideo Downloader」:オープンソースを毎日紹介
をみて、Nicovideo Downloaderを使って何かやろうとしていたのですが、UIセンスなさ杉(過ぎ)な自分に萎えていたところ

NicoDischarger 0.1.1 - ExceptionErrorMessage

NicoDischargerはニコニコ動画から動画を取得して垂れ流すソフトウェアです。
ニコニコ動画が提供しているマイリストやランキング、RSSをプレイリストとして使用する事ができます。

使って感動ToT
すばらしいアプリを発見して、ぜひともActionScript3.0を触りたくなってしまいました。

さて、Flash9(?Flash CS3だっけ。よくわかりません^^)とかもちろんないけどどうやって試せばよいのやら・・・

Flexなんて元々Flashの達人しか使わないんだろーという偏見(笑)のあった私ですが盛り上がってしまったので探してみることに。

へーFlex Builder(製品概要)とかあるんだー

89,250円???・・・・ないな。手軽にってレベルじゃねーぞw

どうやらFlex 3 SDKというのがあって「Eclipse」とか「FlashDevelop」を使うとIDEでActionScript3の開発ができるらしいというのがわかりました。
ここで「Eclipse」を選択したのが運のツキだったのかも知れません。

※後になってわかったのですが、FlashDevelopは.NetでできてるのでWindowsでC#プログラマーだったらこっちだろうと思ったり思わなかったり・・・・

まずは、Adobe Flex 3 SDKのインストールから
http://labs.adobe.com/technologies/flex/sdk/flex3sdk.html

「I have read the Adobe Flex Beta and Early Build Access License, and
by downloading the software listed below I agree to the terms of the
agreement.」
にチェックをいれて「Download Flex 3 SDK 3 beta 3 for all platforms (ZIP, 76.2 MB)」からDL

Eclipse触ったことないですw

Eclipse Version: 3.3.1.1
Eclipse Downloads

日本語化(安定版1.2.1.を選択)
Pleiades (Eclipse プラグイン日本語化プラグイン)

参考「EclipseでFlex (でぃべろっぱーず・さいど)

.asファイルをAntでコンパイルまで終了。.mxmlという(.aspxみたいなw)ファイルがあることもわかってきた。

ここまできていちいちコンパイラを起動させないといけないことが発覚。

以下のエントリにfcshというコンパイルをちょっ早にしてくれるものがあるらしいことがわかり飛びつく。
ActionScript3 (mxmlc) でのコンパイルを100倍速にする方法 - 川o・-・)<2nd life

それでも相変わらずコンパイラを起動させる手間は変わらない。
常駐してコンパイル対象を監視するプログラムが必要なことがわかって、かるーく疲労感・・・・

「作るか・・・・」

EclipseがJavaのIDEなのに.Netで監視プログラムを作ろうってところがもうまちがっているのですが、とにかくできそうだったのではじめてみることに。

<長いので・・・・省略・・・・>

コンパイルファイルを監視するファイルの読み書きのロックが解消できずに頓挫していたところ(※続きは追記で)
Twitterから助け舟が・・・・

flex のコンパイルは rascut 便利ですよ。凄く早くなります。
詳しくはandreryuのTwitterを見ていただくとして、アッサリそちらに乗り換えてしまいました(※)

ご助言いただきありがとうございます^^/
Twitterのありがたさをまたまた体感しました。

※作りかけのものは、まぁプロセス管理とか非同期とか色々自分の勉強にはなったので気が向いたらまた再開ということで・・・

rascutとは
fcwrap 改め rascut - PBD - subtech
Rubyで動くActionScriptのコンパイル監視ツールです。(元fcwrap)
Ruby ActionScript UtiliTyの略とのこと。

めっちゃ便利!
下のデモを観て(画面下の緑のバーから再生ボタンをクリック)作りかけのものをほっぽりだす決心がつきましたw
http://rails2u.com/misc/fcwrap_demo/fcwrap.htm
これぞスクリプト言語の醍醐味って感じじゃないですか。

(参考fcwrap を使ったAS3オールドタイプ開発 - Shibuya.es 発表資料 - 川o・-・)<2nd life

rascutインストール
で、今度はRubyなわけですよ・・・・なにやってんだホント^^;

ActionScript やるなら入れとけ。rascut 導入と使い方。 - てっく煮ブログ
このとおりにやったらRubyもrascutもインストールできました。すばらしい!
FileObserver#dir_observeの修正はrascutがバージョンアップされていたので直す必要はなかったです。

でも、rascutfcsh(Flex 3 SDK対応版)が日本語出力なので英語に戻す設定は必要。(このあたりでつまづかなかったのは、監視プログラム作りかけてたおかげ。)
太郎日記’79J | ベリーシンプルに、rascutやFlashDevelopにFlex 3 SDKベータ2を対応させるメソッドつまり方法。
wintermelon.org :: flash
が参考になりました。

最後でちょっとつまづきました^^;
コンパイルができたんだけどコンパイル対象ファイルを監視してくれてない・・・・?

実は、監視する対象を設定しないとダメだったんですねーー^^;

rascut HelloWorld.as -I HelloWorld.as

-I オプションで監視先を設定(ファイルとディレクトリ指定が可能)

できました!(batファイルからrascutを起動させてHellowWorld.asを監視しブラウザに表示しています)

ようやくActionScript3.0の入口です。
とりあえず以下のところから勉強ですかね。

3月22日の技術勉強会 - ActionScript3 / Flex / Apollo 勉強会 - はてな技術発表会日記 - 機能変更、お知らせなど

他にいいサイトあったら教えてください^^/

<追記>
>コンパイルファイルを監視するファイルの読み書きのロックが解消できずに頓挫していたところ
原因は、
while (....) {
ファイル読み込み
}
してるため常時ロック状態になって参照できないのですが、参考がてらrascutのソース(file_observer.rb)を見てみると、

      
def update_check
・・・
@files.each do |file, mtime|
if !file.readable?
@files.delete file
elsif file.mtime > mtime
@files[file] = file.mtime
update_files << file
end
end
・・・
end
ファイルの更新時間で管理してるんですねー
何か大きくまちがってしまった気がしました^^;

ニコニコ動画拡張スクリプトの修正は個別ケースでした。(やってしまった^^;)

やってしまいました^^;
Andre's garden: ニコニコ動画拡張マイリストをHackしてみた

で修正してたスクリプトなんですけど、スクリプト作成者様からメールをいただいて驚愕!
私のケースは、個別ケースでした。

スクリプト作成者のcastor様ご指摘ありがとうございます。
お手数かけてしまって申し訳ないです。

結局、私のインストールしている他のユーザースクリプトとの干渉が原因でした。
(普通に使っている人はタイトルの取得は問題なく出来ます。)

smile downloader user JavaScriptというユーザースクリプト
http://nicopon.jp/

がm_titleを生成し、class属性のvideoを削除していました。(※)
だからタイトルをスルーして次の動画IDにヒットしてしまったわけですね。
※もちろん「smile downloader」はその必要性があって書き換えているわけです。

他の拡張機能が、現在の設定を書き換えていることに恥ずかしながら気がついていませんでした。

確かに色々、おかしいとは思ってたんですよ、あんなにみやすいコードを書く人がここに気がつかないわけないのになーとか、aタグであるところがinputタグだったり、兆候に気がつかなかったのはホントまぬけな話です。

元の記事も見た方が誤解されないよう追記しておきました。
Andre's garden: ニコニコ動画拡張マイリストをHackしてみた

勉強になりました。

ニコニコ動画拡張マイリストをHackしてみた(注意、個別ケース)

Andre's garden: ニコニコ動画拡張スクリプトの修正は個別ケースでした。(やってしまった^^;)で言及していますが。
この記事は個別環境での話(smile downloader user JavaScriptというユーザースクリプト利用の方のみ)です。
普通に利用している人には以下の話はあまり関係ないので参考程度にご覧下さい。

<本文>

hackなんてたいそうなタイトルをつけてみましたが
ちょこっといじっただけです(笑)
期待した人すいません^^
半分は、お役立ちスクリプトの紹介みたいなものです。

Greasemonkey Script : ニコニコ動画に拡張マイリストを追加するGreasemonkeyスクリプト - 棚からパルチャギ

プレミア会員でない人が、ニコニコ動画でお気に入り(マイリスト)に追加できる数は100です。
それをこの拡張は無限大(∞)にしてくれるというすてきなスクリプト(※)です。
※FirefoxでGreasemonkeyを利用している人限定です。

いや、そういう人がいるってだけで100以上も登録するわけ・・・・・
ないですよねー(なぜ、止まる?www)

なんにしても沢山登録できるのはよいこと「とりあえず試したがる」私としてはしばらく使ってみました。

するとあることに気がつきました。
ある動画に限ってタイトルがうまく表示されないようなのです。

実は前からGreasemonkeyスクリプトに興味があった私はこれはいい機会!と思ってソースを拝見してみました。

原因はどうやら、タイトル文字の取得方法にありそうです。
取得元に他の動画IDがまぎれこんだ時にそっちを持ってくるようだったので(先の動画は、作者注釈の「・・・・おっさん必見。→sm90918 その他の曲はコチラ→/mylist/2634073あたりが引っかかる」)ちょこちょこ直してみました。
修正したのはname属性「m_title」で検索して、titleを参照するようにしただけ。
これくらいの修正なら手軽でいいですね。(あぁ、楽をしたい・・・)

nicovideoadditionalmylis.user.js

function getVideoInfo() {
・・・・
//var a = document.evaluate('//a[@class=\'video\']', document, null,XPathResult.FIRST_ORDERED_NODE_TYPE, null);
var a = document.evaluate('//input[@name=\'m_title\']', document, null,XPathResult.FIRST_ORDERED_NODE_TYPE, null);//ここと
if (a.singleNodeValue) {
//t = Punycode.encode(a.singleNodeValue.innerHTML);
t = Punycode.encode(a.singleNodeValue.title);//ここ
//GM_log("t:" + t)
・・・・
}

XPathも実はほとんどはじめてだったのですが記述方法が直感的にわかりやすくて好きになれそうです。なによりコードが短いしわかりやすくて助かりました。
それにしてもGreasemonkeyは便利だ!はまりそうです。

仮にここに修正版をおいておきますがいずれ本家で対応してくれるかも?。。。と思いつつ
nicovideoadditionalmylis.user.js

追記
inputならvar a じゃなくて var i だろーとかいってみたりする。・・・w

JavaScript第5版読書会#2に参加して

Blogに書くまでが勉強会ということなので^^

まずは、Kanasanさん並びにスタッフの方々、Lightning Talkをしてださった方々ありがとうございました。
非常に有益なひと時でした。このような集まりが関西にあることをうれしく思います。

関連エントリ
「Kanasan.JS」
Kanasan.JS : JavaScript Workshop in Kansai | Google グループ
「他の方のブログ記事(これから拝見します)」
Kanasan.JS JavaScript第5版読書会#2 参加者のブログ記事一覧 - Kanasan.JS : JavaScript Workshop in Kansai | Google グループ

正直なところ情報量が多くて消化し切れていないのが現状です。
プログラミング話なので興味のない方は、以降は全力スルーで

<続きを読む>

Continue reading

参加しマース(JavaScript第5版読書会)

JavaScript 第5版
JavaScript 第5版David Flanagan 村上 列

オライリー・ジャパン 2007-08-14
売り上げランキング : 1734

おすすめ平均 star
starこれ一冊あれば全体像が把握できます

Amazonで詳しく見る
by G-Tools

せっかく買ったので早速、目次を以下のオライリーのサイトからコピーして
http://www.oreilly.co.jp/books/9784873113296/toc.html
章ごとにページ番号を振ってみました。(人力www)
なにせ、全704ページ。こうでもしないとまともに使わない気がしたもので^^;
というか他にいい方法が思いつかなかったです・・・・
ローカルにファイルでもっているだけですがブラウザに表示させてれば、キーワードで検索できる(Firefoxだから)ので索引代わりに使ってます。
ちらちら読み始めていますが、確かに詳しいです。かなり理解の助けになります。他の本はいいから先に買っとけばよかったと思いました。

[翻訳]JavaScript: 世界で最も誤解されたプログラミング言語の中で

私は沢山のJavaScriptの本を読んできましたが、お勧めできる書籍は2冊しかありません。

と言われるうちの1冊であるこの本を読んでだめだったらJavaScriptはあきらめるということで(っていうか、そのときはプログラマあきらめることになるんじゃ・・・笑)

でもってタイムリーなところに
Kanasan.JS JavaScript第5版読書会#2 のお知らせ - てっく煮ブログから
Kanasan.JS JavaScript第5版読書会#2 & 懇親会 - Kanasan.JS : JavaScript Workshop in Kansai | Google グループ
を拝見してしまいました。

祝日で大阪、開催。日程も場所も申し分なし。
行かない理由がありません。
懸念材料は私のへっぽこプログラミングのレベルくらい・・・ハハハ。

対象者は、「JavaScript初心者以上です。」の言葉を信じて・・・・いってきまーす^^/

新年からやっていることや気になるエントリ

新年からやっていること・・・

jQueryと戯れています。
jQueryは、JavaScriptでできた軽量ライブラリです。面倒なDOM操作やクロススブラウザの対応やらAjaxやらなんやらかんやらをやってくれて素敵なUI操作を可能にしてくれそうなものです。詳細は適当にこのあたり(jQuery 開発者向けメモ)を見てください。

Re:zapa氏 今更ですが、jQueryにはまりました*ホームページを作る人のネタ帳

これを見てから3日間。
ブログもあまりかけずこればっかりいじって遊んでました。
睡眠時間も1日2時間くらいになり、今日は書こうと思います。

非常に似てます。睡眠時間はちゃんととってますけど・・・
何か書けるほどではありませんが、1月中旬ごろにはjQueryを使った何かをお見せできると思います。(あぁ、書いちまった。まぁ、書かないとやらないからこれでいいのだ)

気になったエントリ
1.プログラミングから学んだこと | IDEA*IDEA
まったく正月から心温まる話(?)です。

「プログラミングは小学校の必修科目にすべき!」と個人的に思っていますが、

同感です。ここで、ぐいっとひきつけられました。
英語丸暗記(日本語できないのに英語覚えてもねぇ)より、いい頭の訓練だと思います。

お題だけ抜き出しましたが、1つ1つが納得しまくりです。

プログラミングは問題解決に役に立つ!
→毎日、問題ばかりです。
過去の自分は別人!(=人間は進化する!)

→劇的に進化したいと思いつつ。進歩くらいから・・・・
はまったらできるところまで戻ると良い

→何回もやりなおしがきくのがいいところ。「小学校で・・・」の話に戻りますが人生の早いうちからトライ&エラーを無数に経験しておくのは必要なことだと思います。
問題の切り出しがうまくなる

→あいかわらず、へたくそですけど^^;以前よりはましになったと思いたいです。
どんなに複雑な問題でも世界の誰かが必ず解いている

→ネットがなければ私はプログラミングする気なんて微塵もおきないでしょう。頭のいい人は世界に星の数ほどいて毎日、助けられています。

例えば、今日はこのサイトに助けられました。
anything from here jQuery() の挙動を解読する(3) jQuery.extend()及びjQuery.prototype.extend()──jQuery解読(7)
本人曰くエンジニアではないそうですが、こんなに丁寧かつ明解な説明はそうお目にかかれません。
こんなにしっかりした文章をみてしまうと文章がへたれな私は、プログラマとプロフィールに書いているのが恥ずかしくなります^^;→このエントリに触発されてついに「JavaScript 第5版」を購入。か、カネが!!

2.cpainvestor.com | 美容室での会話

「同じぐらいの料金を払うのなら、髭剃りをしてもらうより、20代の若い女性と会話できる方が単純に心地よい」とか思いながら、美容室を利用しています。
あれ?なぜこんなところにオレが・・・・冗談ですって。ハハハ。

ちなみに、今行ってるところはMY年齢プラス10才前後の方ですが満足しています。
エントリの内容は、美容師の「アーティストタイプと職人タイプについて」の考察で興味深いです。ぜひご一読を。
プログラマは職人タイプで生き残れるんでしょうか?・・・と、ふと職人寄りの私は感じたりします。

3.技術と品格 - www.textfile.org
エントリ内の引用から

私は情報に有害も有益もないという立場を採っている。これは、技術についても同じこと。
404 Blog Not Found:技術と品格
技術は中立という話を読んで、ある天才ギタリストを思い出しました。
個人的には、昔から音楽に関しては中立であると感じていたような気がします。

中学生の頃からから聞きはじめたそのギタリストは、当時では考えられない速弾きと独創的なメロディで1ジャンルを築き、今でもその影響はいたるところで感じることができます。
生成した瞬間から音楽は製作者の手を離れて別のものになります。(※)持ち歩いて聴いたり、何回聴いても製作者とは全く関係のない話です。
だから、その天才ギタリストが、「ボーカルを次々と解雇して傲慢だとか」「外見が太って見る影もない」といわれていても全くその音楽とは関係がないので気になりません。(誰だかわかりましたか?。笑)

※もちろん、観客との体験を重視するコンサート主体のアーティストだとまた別なのだと思いますが、アーティスト=(イコール)そのアーティストの音楽でないということには変わりないと思います。

Index of all entries

Home > プログラミング Archive

Search
Feeds

iKnow
utilities
あわせて読みたい
スカウター : Andre's garden
track feed
人気ブログランキング - Andre's garden
Counter

Return to page top