読者です 読者をやめる 読者になる 読者になる

blogparts framework suzunariを作成しました。

ブログパーツ flash javascript jquery

ようやく会社のブラインドを閉める方法を発見しました。agoです。

弊社ではブログデコというブログパーツのポータルサイトを運営しており、かなりの数のブログパーツを作成しています。

このたび、そこで得られた様々なノウハウを集めて、ブログパーツフレームワークを公開しました。

元々社内でもある程度まとまったライブラリはあったのですが、コードを読まないと(もしくは作成者に聞かないと)不明な機能群と、使用しても一定のJSを記述する必要があるため公開するまでには至っていませんでした。 (社内からは1年以上前から「早めにまとめて公開を」という声があったんですが。。。)

そこで、必要な機能をまとめ直し、通常の全画面ジャック程度であればタグのみで実装可能なJSフレームワークを作成しました。

このフレームワークを使用することにより、各種ブラウザでのExternalInterfaceの各種問題や、wmodeによる重ね合わせの問題などを回避することができます。

また、最近増えてきた本文解析を行うブログパーツをサポートする機能も搭載しています。 (剣道ブログパーツにおい部ブログパーツでは本文中の単語を解析してFlashに座標を渡しています)

本文解析の具体的な実装としては以下のようになります。 (suzunari.js内の「suzunari(/ base URI string /).write();」を置き換えてください)

suzunari()
    .ready(function () {
        //置き換え用クラス名
        //(「this.settings.name_space」でscript tag毎にユニークな名前が取得できる)
        var cname = this.settings.name_space + '_word';
        //setTimeout(func, 0);内で置き換えを実行
        this.set_parse_all_text(
            /(hoge|huga|...)/, '<span class="'+cname+'">$1</span>'
        )
        //置き換え結果の最初要素までスクロール
        .select_scroll_word('.'+cname+':first')
        .set_scroll(3000, function (hit) {
            //(hit === select_scroll_wordで設定した要素)
            //文字幅、window内の位置をflashvarsに設定
            this.flashvars(this.get_element_size(hit));
        });
    })
    .write()
;

また、独自に拡張する場合でも、内部にjQueryを搭載しているため(jQueryになれている人であれば)容易に拡張することができます。 (名前空間の汚染を最小限にするため、jQueryをそのまま埋め込む手法をとっています)

フレームワーク自体はMIT、GPLのDual license、公開場所はCodeReposを使用させていただいているので、興味のある方はご自由に組み込み、修正を行ってください。

ドキュメント、テスト等まだまだ不足している点はありますが、これからもバージョンアップしていく予定なのでご利用いただけると喜びます。

詳しくはCodeReposのWikiをご覧ください

カヤックではjavascriptに詳しい方や、フリーソフトの公開経験のある技術者を募集しています!