// ==UserScript==
// @name          hb_comment_view
// @namespace     http://d.hatena.ne.jp/kusigahama/
// @include       http://b.hatena.ne.jp/*
// ==/UserScript==

(function() {
    var X;
    var Y;

	function X(context, xp_exp){
		return document.evaluate(xp_exp, context, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
	}
	function X_EACH(context, xp_exp, f) {
		var r = X(context, xp_exp);
		for (var i=0, max=r.snapshotLength ; i<max ; ++i) f( r.snapshotItem(i) );
	}


	var fc = document.body.firstChild;
	var s = document.createElement('script');
	s.setAttribute('type', 'text/javascript');
	s.setAttribute('src', 'http://b.hatena.ne.jp/js/BookmarkCommentViewerAllInOne.1.2.js' );
	s.setAttribute('charset', 'utf-8');
	document.body.insertBefore(s, fc);


	X_EACH(document, '//a', function(a){
	//X_EACH(document, '//dd[@class="users"]//a', function(a){
		var m = a.innerHTML.match(/user/);
		if (!m) return;
		var m = a.href.match(/^http:\/\/b\.hatena\.ne\.jp\/entry\/(.*)$/);
		if (!m) return;
		var uri = unescape(m[1]);

		var img = document.createElement('img');
		img.setAttribute('class', 'hatena-bcomment-view-icon');
		img.setAttribute('src', 'http://r.hatena.ne.jp/images/popup.gif');
        // position:absolute の挙動の違いのため， top, left の値を決める。
        img.addEventListener('mouseover', function(e) {
            // 横位置は適当過ぎる
            X = e.clientX;
            Y = e.clientY + 5 + document.body.scrollTop;
            // mouseover するたびに style が追加されていくという欠点
            GM_addStyle(' .hatena-bcomment-view { background-color:#fff; border-top:1px solid #CCC; border-left:1px solid #CCC; border-right: solid 1px #999; border-bottom: solid 1px #999; position: absolute !important; top:'+ Y +'px !important; left:' + X + 'px !important;  display: none; word-break : break-all ; word-wrap : break-word ; width: 400px; text-align:left; margin:0 !important; padding:0 !important; font-weight:normal !important; font-size:90%; z-index:100; color:#000 !important; } .hatena-bcomment-title { margin:0 !important; padding:3px 5px !important; text-indent:0 !important; } .hatena-bcomment-title img { vertical-align: middle !important; margin: 2px 2px 2px 4px !important; } .hatena-bcomment-view ul { width: auto; overflow: auto; overflow-y:auto; border-top: 1px solid #5279E7; background-color: #edf1fd; list-style-type: none; padding: 5px 8px !important; margin: 0px !important; line-height: 150%; } .hatena-bcomment-view ul li{ text-indent:0 !important; margin:0 !important; padding:0 0 2px 0 !important; font-size:90%; background:transparent !important; } .hatena-bcomment-view ul li span.hatena-bcomment-tag a{ color:#6365CE; font-family:"Arial",sans-serif; margin:0 3px; } .hatena-bcomment-view ul li img{ vertical-align:middle !important; margin:0 2px !important; } .hatena-bcomment-view ul li span.hatena-bcomment-date { } .hatena-bcomment-view-icon { cursor: pointer; }');
        },false);
        img.addEventListener('mouseout', function(e) {
            X = 0;
            Y = 0;
        },false);
		img.setAttribute('onclick', "iconImageClickHandler(this, '" + uri + "', event);");
		img.setAttribute('height', '13');
		img.setAttribute('width', '13');

		var t = ( a.parentNode.tagName.match(/^(EM|STRONG)$/) ) ? a.parentNode : a;
		t.nextSibling ? 
			t.parentNode.insertBefore(img, t.nextSibling) :
			t.parentNode.appendChild(img);
	});
 
    if (typeof(GM_addStyle) != 'function') {
        function GM_addStyle(css) {
            var head = document.getElementsByTagName('head');
            if (!!head) {
                var style = document.createElement('style');
                style.type = 'text/css';
                style.innerHTML = css;
                head[0].appendChild(style);
            }
        }
    }

})();