2ch Viewer ブックマークレット

function getTextContent(node) {
    return node.innerText || node.textContent;
}

// To one-byte characters
function z2h_word(str) {
    return str.replace(/([Ａ-Ｚａ-ｚ０-９＿])/g,
        function ($0) {
            return String.fromCharCode($0.charCodeAt(0) - 65248);
        });
}



// Fix ancher
function markAncher(n) {
    // Mark tagets recursively
    if (0 != n.childNodes.length) {
        for (var j = 0; j < n.childNodes.length; j++) {
            if ('SCRIPT' != n.childNodes[j].tagName && 'A' != n.childNodes[j].tagName) {
                // 'SCRIPT' tag is not target.(Opera treat them.)
                markAncher(n.childNodes[j]);
            }
        }
    } else if (3 == n.nodeType) {
        // Target are anchers in text nodes.
        n.nodeValue = n.nodeValue.replace(/(?:>|＞)(?:>|＞)?([\d１-９])/g, '\x1a>>$1');
    }
}

function fixAncher(w, noteList) {
    for (var i = 0; i < noteList.length; i++) {
        markAncher(noteList[i]);
    }
    w.document.body.innerHTML = w.document.body.innerHTML.replace(/\x1a&gt;&gt;([\d０-９]{1,4}(?:-[\d０-９]{1,4})?)/g,
        function ($0, $1) {
            $1 = z2h_word($1);  // To one-byte characters
            return '<a href="' + location.href.replace(/[^\/]*$/, "") + $1 + '">&gt;&gt;' + $1 + '</a>';
        });
}



// Ancher popup
var iframe;
function getThread(ancStart, ancEnd) {
    // Exists current page?
    if (1 == startOffset || startOffset < ancStart || (1 == ancStart && 1 == ancEnd)) {
        var rslt = "";
        for (var i = ancStart; i <= ancEnd; i++) {
            var tagNum = (1 == i) ? 0 : i - startOffset;
            rslt += dt[tagNum].innerHTML + '<br>' + dd[tagNum].innerHTML;
        }
        return rslt.replace(/<br><br>\s*?$/i, '');
    } else {
        if (!iframe) {
            iframe = document.createElement('iframe');
            iframe.style.display = 'none';
            setEventHandler(iframe, 'load', function() { updatePopup(iframe); });
            document.body.appendChild(iframe);
        }

        iframe.src = location.href.replace(/[^\/]*$/, "") + ancStart + "-" + ancEnd;

        return "now loding...";
    }
}

var popup_counter = 0;
function updatePopup(iframe){
    var ifDoc = iframe.contentWindow.document;
    var ifDT = ifDoc.getElementsByTagName('dt');
    var ifDD = ifDoc.getElementsByTagName('dd');

    // Fix
    fixAncher(iframe.contentWindow, ifDD);
    if (url2link) { url2link(iframe.contentWindow); }

    // Update contents.
    var content = "";
    for (var i = 1; i < ifDT.length; i++) {
        content += ifDT[i].innerHTML + "<br>" + ifDD[i].innerHTML;
    }
    target = document.getElementById('popup_' + popup_counter);
    target.innerHTML = content.replace(/<br><br>\s*?$/i, '');

    // Set event handler.
    if (imagePopup_sethandler) { imagePopup_sethandler(target); }
    ancherPopup_sethandler(target);
}

function createPopup(obj, ancStart, ancEnd) {
    popup_counter += 1;

    var div = document.createElement('div');
    div.id = 'popup_' + popup_counter;
    div.className = 'popup';
    div.innerHTML = getThread(ancStart, ancEnd);

    // Hide inner div recursively.
    var inDiv = div.getElementsByTagName('div');
    for (var i = 0; i < inDiv.length; i++){
        inDiv[i].style.display = 'none';
    }

    obj.parentNode.insertBefore(div, obj.nextSibling);

    // Set event handler.
    if (imagePopup_sethandler) { imagePopup_sethandler(div); }
    ancherPopup_sethandler(div);
}

// Event handler for ancher popup.
function Popup(event, stop) {
    var target = event.target || event.srcElement;
    if (target.tagName.toLowerCase() != 'a') return;
    if (getTextContent(target).indexOf('>>') != 0) return;

    if (typeof(target.nextSibling.tagName) != 'undefined' && 'div' == target.nextSibling.tagName.toLowerCase()) {
        // Switch visibility of already exists popup.
        if (target.nextSibling.style.display == 'none'){
            target.nextSibling.style.display = 'block';
        } else {
            target.nextSibling.style.display = 'none';
        }
    } else {
        // Create popup? (check range of anchor)
        rslt = getTextContent(target).match(/\d+/g);
        var ancStart = parseInt(rslt[0]);
        var ancEnd = (rslt[1]) ? parseInt(rslt[1]) : ancStart;

        // Out of range?
        if (ancStart < 1 || startOffset + dt.length <= ancEnd) { return; }

        // Ancher size
        if (ancEnd - ancStart < 0 || 5 <= ancEnd - ancStart) { return; }

        createPopup(target, ancStart, ancEnd);
    }

    if (stop) {
        if (event.preventDefault) { event.preventDefault(); }
        if (event.stopPropagation) { event.stopPropagation(); }
        event.returnValue = false;
    }
}



// SETUP

// Define style
var css = document.createElement('style');
css.setAttribute("type", "text/css");
cssStr =
    'div.popup {'+
        'padding: 2px;'+
        'margin: 2px 0px 2px 10px;'+
        'border: 1px inset #ccb;'+
        'background-color: #ffe;'+
        'font-size: 12px;'+
    '}';
if (css.styleSheet) {
    css.styleSheet.cssText = cssStr;
} else {
    css.appendChild(document.createTextNode(cssStr));
}
document.body.appendChild(css);

// Thread list
var dt = document.getElementsByTagName('dt');
var dd = document.getElementsByTagName('dd');

fixAncher(window, dd);

var startOffset = parseInt(/\d+/.exec(getTextContent(dt[1]))) - 1;

// Set event handlers.
function ancherPopup_sethandler(node) {
    var a = node.getElementsByTagName('a');
    for (var i = 0; i < a.length; i++) {
        if (typeof(a[i].innerHTML) == 'string' && a[i].innerHTML.match(/&gt;&gt;([0-9]{1,4})(-[0-9]{1,4})?/)) {
            // Ancher popup (toggle)
            setEventHandler(a[i], 'click', function(e) { Popup(e, true); });
            setEventHandler(a[i], 'mouseover', function(e) { Popup(e, false); });
        }
    }
}

ancherPopup_sethandler(document);