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

まめ畑

ゆるゆると書いていきます

見ているページをTwitterにPOSTするJetpack Feature作ってみた

Jetpack javascript Twitter

2009/5/24アップデートしました


Jetpack Featureがなかなか面白いのでいじっています。
既にブックマークレットなどでありますが、今見ているページをTwitterにPOSTするJetpack Featureを作ってみました。
とりあえず「見てるNow!」という名前にしてみました。


インストールはこちらから: mame-lab.com: The Leading Mame Lab Site on the Net

インストールすると、ステータスバーにこんな感じのが出ます。


後は、POSTしたいページで、ここをクリックするだけです。
sessionStorageを使用してIDとPASSを保存するのでブラウザを終了すると保存してある情報は消えます。
なので、ブラウザを起動して初めてPOSTする際にIDとPASを入力するプロンプトが出ます。
ステータスバーの表示に日本語を使用すると、イベントやスタイルが正常に適用されないようです。


ソースはこんな感じです

(function(){

	function getPageInfo(){
		var url = jetpack.tabs.focused.url;
		var title = jetpack.tabs.focused.contentWindow.document.title;
		var status = title + " " + url;
		return status;
	}

	function postToTwitter(){
		var cWindow =  jetpack.tabs.focused.contentWindow;
		var sStorage = jetpack.sessionStorage;
		if(!sStorage.twitterId && !sStorage.twitterPass){
			sStorage.twitterId = cWindow.prompt("Input Your Twitter ID");
			sStorage.twitterPass = cWindow.prompt("Input Your Twitter PASS");
		}
		var tId = sStorage.twitterId;
		var tPass = sStorage.twitterPass

		var status = "\u898B\u3066\u308B\u004E\u006F\u0077\u0021\u0020";
		var comment = cWindow.prompt("Input Short Comment");
		comment = (comment != null) ? comment : "";
		status = status + encodeURIComponent(comment+ " " + getPageInfo());
		var status = "status=" + status;

		$.ajax({
			type: "POST",
			url: "http://twitter.com/statuses/update.xml",
			username: tId,
			password: tPass,
			processData: false,
			data: status,
			success: function(msg){
				jetpack.notifications.show({
				title: "Update!",
				body: "Update Success",
				icon: "http://assets1.twitter.com/images/favicon.ico"
				});
			},
			error: function(xtr, status, thrown){
				jetpack.notifications.show({
				title: "Error!",
				body: status,
				icon: "http://assets1.twitter.com/images/favicon.ico"
				});
			}
		});
	}

	jetpack.statusBar.append({
		html: <>
			<img src="http://assets1.twitter.com/images/favicon.ico"/>
			<span id="message">Miteru Now!!</span>
		</>,
		onReady: function(doc){
			$(doc).click(function(e){
				if(e.button == 2) return;
				postToTwitter();
			});
			$("#message", doc).css({
				position: "absolute",
				fontSize: "10pt",
				fontWeight: "bold",
				paddingLeft: "3px",
				cursor: "pointer"
			});
		},
		width: 110
	});
})();