Archive for the 'つくる' Category

タブの履歴を右クリックして新規タブで開くFirefox add-onをつくった

Feb 20 2009 Published by Administrator under つくる

Open Tab-History In New Tab :: Firefox Add-ons
open-tab-history-tab-screenshot

Windowsだとマウスのミドルクリックでできるよ、とコメントされているしCtrlを押しながらクリックでも実現しちゃうのだが、どうしても右クリックで開きたかったのだ。

add-on開発はそれなりに敷居高いな、という印象。
開発時のTIPSはこっちに書きました。
Additional information: How to build a Firefox extension « zuzara

No responses yet

見出しや画像を順繰りに見ていける Bookmarklet

Feb 10 2009 Published by funaki under つくる

高速にスクロールすることができない iPhone 用に作ったのだが、ブックマークレットを実行するのが面倒で使えないなぁ、とお蔵入りになっていた。
Make Page Navigation

ソースはこんな感じ。

(function(){
    var M = {
        getElements: function() {
            var results = [];
            var elements = ['h1','h2', 'h3'];
            for (var j = 0; j < elements.length; j++) {
                var h = document.getElementsByTagName(elements[j]);
                var len = h.length;
                for (var i = 0; i < len; i++) {
                    h[i].id = (h[i].id && h[i].id != '' ? h[i].id : 'makenavi-' + elements[j] + '-' + i);
                    results.push(h[i].id);
                }
            }
            var img = document.getElementsByTagName('img');
            var imgLen = img.length;
            for (var i = 0; i < imgLen; i++) {
                if (img[i].width < 100 || img[i].height < 100) {
                    continue;
                }
                img[i].id = (img[i].id && img[i].id != '' ? img[i].id : 'makenavi-img-' + i);
                results.push(img[i].id);
            }
            return results;
        },
        show: function(results) {
            var len = results.length;
            if (len == 0) {
                alert('No headings and images.');
                return;
            }
            var old = document.getElementById('makenavi-box');
            if (old) {
                return;
            }
            var element = document.createElement("div");

            var str = "<div id='makenavi-box' style='filter: alpha(opacity=25); opacity:0.25; z-index: 999; position: absolute; top: " + (window.pageYOffset+30) + "px; left: " + (window.innerWidth-150) + "px; width: 100px; background-color: white; text-align: center; border: 15px solid #393;'>";
            var strResults = '';
            for (var i = 0; i < len; i++) {
                strResults += '"' + results[i] + '",';
            }
            strResults += '"' + results[0] + '"';
            var code = '(function(){var r=[' + strResults + '];var e=document.getElementById("makenavi-next");var n=r[0],c=location.hash.substr(location.hash.indexOf("#")+1);for(i=0;i<r.length;i++){if(c==r[i]){n=r[i+1];break;}}e.href="#"+n;var o=document.getElementById(n);var t=0;while(o){t+=o.offsetTop;o=o.offsetParent;}document.getElementById("makenavi-box").style.top=t+"px";'
                    + '})();';
            str += "<a style='color:black;font-size:40px;text-decoration:none;' id='makenavi-next' href='#" + results[0] + "' onClick='" + code + "'>Next</a>";
            str += "</div>";
            element.innerHTML = str;
            document.body.insertBefore(element, document.body.firstChild);
            window.addEventListener('scroll', function(){
                        document.getElementById('makenavi-box').style.top=(window.pageYOffset+30)+'px';
                    },false);
            window.addEventListener('resize', function(){
                        document.getElementById('makenavi-box').style.left=(window.innerWidth-150)+'px';
                    },false);
        },
        run: function() {
            this.show(this.getElements());
        },
    };
    M.run();
})(); 

No responses yet

ライブドアの認証API用PHPライブラリをつくった

May 19 2008 Published by funaki under つくる

http://coderepos.org/share/changeset/11985

いまさら感満載ですが、見当たらなかったのでつくりました。livedoorの認証API用PHPライブラリです。

svn checkout http://svn.coderepos.org/share/lang/php/Services_Livedoor_Auth/ lang/php/Services_Livedoor_Auth

でどうぞ。

PHP5専用です。json_encodeを使ったので5.2系以降か、extensionを入れてください。別のパーサに書き換えてももちろんOKです。公開するときはもっと汎用的にfunction_existsとかで振り分けた方がいいのかな。PEARやZend用につくるときの動作環境の指標は(PHPはこのバージョン以降で動くように作りなさい、とか)あるんだろうか。

基本的にははてな認証API用のライブラリを参考にしました。
http://svn.ishinao.net/webxp/Service_Hatena_Auth/trunk/library/Service/Hatena/Auth.php

One response so far

gtkmmでメモ帳っぽいものを作成@開発合宿

Nov 02 2007 Published by funaki under つくる

開発合宿に行ってきました。
伊豆。
開発合宿レポート(2007年10月) | IDEA*IDEA

ちょうど1年前に行ったのと同じメンバーです。
100shikilicious: 百式徹底解剖&開発合宿レポート
開発合宿レポート10月版 今回は御殿場で! | IDEA*IDEA

今回はお遊び系でgtkmmをいじってみました。
できたのはこんな感じ。
screenshot-memoo.png

Gnomeにはtomboyというメモツールがあるのですが、もっと紙copi風がよかったので自分用に作ってみました。
目玉の機能として、書いた内容をそのままPukiWikiに流し込もうと思っていたもののまだできておらず、

  • 自動保存
  • Ctrl+Nで新しいメモができてリストに加わる
  • 1行目がファイル名兼タイトル

とHTMLのフォーム並に低機能。。必要になったらUndoとか機能は増やしていく、かも。もう少ししたらSourceforgeか何かにあげます。

今回、ディスプレイは持っていきましたがさすがに普段使っているデスクトップを持ち込むわけにはいかず、WindowsのノートPCで開発。gtkは普通にWindowsでもコンパイル&動作しました。Windowsの方はMinGW、Linuxならg++。VMwareでUbuntuを入れればこちらでも動作確認可能。

gtkmmはgtkのC++ラッパー。VC++とそう変わらない雰囲気でさくさくGUI書けます。ちょっと一覧性に欠けますが、本家のリファレンスが一番読みやすいでしょうか。

ここもわかりやすい。
gtkmm 入門

写真等々追々。

11月10日追記:
kaihatsugasshuku_1.jpg
朝早く目覚めたときにちょっと散歩していたのですが、どんぐりがこんこんと上から降ってくる坂がありました。
kaihatsugasshuku_3.jpg
kaihatsugasshuku_2.jpg
ビフォー&アフター。赤松さんに教えてもらってホワイトバランスを「曇り」モードで撮った方が自然な赤味がさしてきれいになることがわかりました。
でもこの写真はちょっとピントがいまいち?

田口さんは一眼でばりばり撮ってましたが、これは半年前に買ったRicohのCaplio R6。
製品情報 / Caplio R6 | Ricoh Japan

No responses yet

FlyA.jp リリース

Oct 05 2007 Published by funaki under つくる

FlyA

開発に携わっているサイトがリリースしました。フライアって呼んでいます。
プロ級の音楽映像を作成できる「FlyA」公開 – CNET Venture View

開発スタッフの隣に座っている人のブログ。
うたうたいのFlyA生活 – livedoor Blog(ブログ)

一言で言うと音楽のシーケンサーをウェブで実現しました。
このアプリを使って面白い音楽や映像を作ってもらえたらなぁ、と思ってます。
ご意見ご感想等、ありましたらぜひコメントください。

僕自身は音楽に疎いのでこの企画に参加するまで「シーケンサー」とか「ループ音源」なるものを知らなかったのですが、一緒に開発したシンクイメージのメンバーは音楽系のすごい人ばかり。ちょっと違った感覚の人たちと仕事できて面白かったです。

No responses yet

YWitter: Yahoo!WidgetによるTwitterクライアントをつくった

May 01 2007 Published by funaki under つくる

Yahoo!ウィジェットでついったークライアントをつくってみました。
ywitter.png
http://www.zuzara.com/pub/ywitter/YWitter.widget

もちろんYahoo!ウィジェットエンジンが必要です。WindowsVistaとXPで動作確認しました。

で、Y!APIコンテストに応募。
ネタ的には、前の記事のコメントでも指摘されたとおり二番煎じになっていることは確か。
Twiggee – Yahoo! Widgets 版 Twitter クライアント作ってみた (nakatani @ cybozu labs)

作り始める前にY!公式のギャラリーでしか類似のウィジェットがないことを確認しなかったのがまずかったのですが、まぁ、いいんじゃないでしょうか。いや、中谷氏ももしコンテストに応募されていたらじゃんけんで後出しする感じなので申し訳ないですが。。ソース参考にしてしまいましたし(^^;

今回がんばったところは、
アニメーション
新着メッセージがひゅぅっとフェードインして表示されます。上向きに出るか下向きかを設定できます。ウィジェットにメソッドが用意されているのでごくごく短いコードで作れましたけど。

ウィジェット系そのもののプログラミングが初めてでしたが予想以上に簡単!JavaScriptでさくさく組めます。リファレンスがPDFで読みづらいですがちゃんとそろっています。ただ、prototype.jsのようなHTML上で使うライブラリは動かないのでscript.aculo.usのEffectはちょっと改変したぐらいでは動きませんでした。

ソースは、拡張子をzipに変えて解凍すれば見れます。が、美しくないです。
ホリデープログラミング入門の方で、来週辺り解説しようと思っています。

認識している問題点と今後修正するとしたら

  • sleepすると全体のハンドルがフリーズするっぽいので要検討
  • X-Twitterが認識されていない?
  • Aboutがまだない
  • 英語版

2日間更新しまくって、twitterも面白いと言えば面白い気がしました。

あと友人がtwitter検索を作っていた。
twitter : Twitter.FM

3 responses so far

はてブ成分解析をべつやくメソッドでつくってみた

Apr 13 2007 Published by funaki under つくる

はてブ成分解析

はてブのホッテントリを眺めていると、ときどきなんかこう、思うところがあったりしませんか。その気持ちをべつやくメソッドでぶつけてみました。

One response so far

HANAABI!!:wacaal APIで情報の花火を打ち上げてみた

Mar 11 2007 Published by funaki under つくる

HANAABI!!

wacaal APIで拾ってきたSAGOOLの検索クエリー1つ1つを火花にして打ち上げてみました。
春先のまだ肌寒いこの季節、散っていくクエリーたちに何か哀愁を感じずにはいられません。
音量はいつもより大きめでお願いします。
なお、調子に乗って花火を打ち上げ過ぎるとブラウザが低温火傷しかねないのでご注意ください。

えー、ネーミングはかなりいいんじゃないかと思っていますが、全体的には脳汁が切れた感じです。

コンテストの締め切りまではあと18時間ばかり。
サン・マイクロシステムズ – Mash up Award 2nd

2 responses so far

APIのレスポンスお試し用ツール

Mar 11 2007 Published by funaki under つくる

ブラウザのアドレスに直接入力すると全角がSJISとしてurlencodeされてしまうので(WinVista+Firefox)自分用スクリプトを書いてみた。今まではbinにurlencode.phpというシェル用スクリプトを置いて、変換したのをブラウザにコピペしていた。

<?php
$_encodes = array('UTF-8', 'EUC-JP', 'Shift_JIS');
if (isset($_GET['url'])) {
    $url = urldecode($_GET['url']);
    $p = @parse_url($url);
    if ($p === false) {
        die("parse failed.");
    }
    $api = $p['scheme'] . '://' . $p['host'] . (isset($p['port']) ? ':' . $p['port'] : '') . $p['path'];
    if (isset($p['query'])) {
        parse_str($p['query'], $param);
        $api .= '?';
        $encode = in_array($_GET['encode'], $_encodes) ? $_GET['encode'] : 'UTF-8';
        foreach ($param as $key => $value) {
            $api .= $key . '=' . urlencode(mb_convert_encoding($value, $encode, 'UTF-8')) . '&';
        }
    }
    header("Location: $api");
    exit;
}
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>api test</title>
</head>
<body>
<div>api url, oe</div>
<form action="" method="GET" target="_blank">
<input type="text" name="url" style="width: 60em;" />
<select name="encode">
<?php foreach ($_encodes as $e) : ?>
<option value="<?=$e?>" /><?=$e?>
<?php endforeach; ?>
</select>
<input type="submit" value="submit" />
</form>
<div style="text-align: right; font-size: 70%; color: #999;">developed by <a href="http://blog.zuzara.com/">funaki</a></div>
</body>
</html>

One response so far

検索エンジン経由のアクセス時はGoogle Ajax Searchでサイト内検索した結果を表示

Feb 15 2007 Published by funaki under つくる

調べれば誰かやっていそうな小ネタですが。

検索エンジンからアクセスしてきたときに、そのときの検索語でサイト内検索しておいて結果を表示すると便利っぽいのでやってみた。このブログのサイト内検索に使っている、GoogleAjaxSearchにちょっとコードを追加。

function load()
{
    var searchControl = new GSearchControl();

    var blogSearch = new GwebSearch();
..snip..
    searchControl.draw(document.getElementById("searchcontrol"));
    var query = '<?=my_get_referer_query()?>';
    if (query != '') {
        searchControl.execute(query);
    }
}

JavaScriptで完結させたいところですが、文字コードの変換は面倒なのでリファラーから検索語を拾う箇所はPHPで。

function my_get_referer_query()
{
    $referer = isset($_SERVER['HTTP_REFERER']) ? $_SERVER['HTTP_REFERER'] : '';
    if ($referer == '') {
        return '';
    }
    $p = @parse_url($referer);
    if ($p === false || !isset($p['host']) || !isset($p['query']) || $p['host'] == $_SERVER['HTTP_HOST']) {
        return;
    }
    if (strpos($p['host'], 'google.') !== false || strpos($p['host'], 'msn.') !== false) {
        $key = 'q';
    } else if (strpos($p['host'], 'yahoo.') !== false) {
        $key = 'p';
    } else if (strpos($p['host'], 'goo.') !== false) {
        $key = 'MT';
    } else if (strpos($p['host'], 'excite.') !== false) {
        $key = 'search';
    } else if (strpos($p['host'], 'nifty.') !== false) {
        $key = 'Text';
    } else if (strpos($p['host'], 'infoseek.') !== false) {
        $key = 'qt';
    } else if (strpos($p['host'], 'aol.com') !== false) {
        $key = 'query';
    } else {
        $key = 'q';
    }
    parse_str($p['query'], $param);
    $query = isset($param[$key]) ? $param[$key] : '';
    return htmlspecialchars(mb_convert_encoding(urldecode($query), 'UTF-8', 'auto'), ENT_QUOTES);
}

レイアウト的にサイト内検索の位置が一番下なのがいまいち。。検索エンジン経由のときは横にあった方が見やすいかも。

One response so far

Next »