// ==UserScript==
// @name                Forum user links
// @version             3.1
// @date                2009-05-01
// @author              Ian Malpass ( ian AT etsyhacks DOT com )
// @namespace           etsy.com
// @description         For each post in a fourm, adds links to the poster's profle, convos you've had with them, and a link to start a new convo
// @include             http://www.etsy.com/forums_thread.php?*
// ==/UserScript==

/*
This script adds some extra links to each forum post, to speed up replying off-forum
*/

// Build a couple of regexps that we're going to need
var isForumLink = /post-(\d+)/;
var extractUserId = /user_id=(\d+)/;
var minis = {};

var nnc;
var inputs = document.getElementsByTagName( 'input' );
for ( var i = inputs.length - 1; i >= 0; i-- ) {
    if ( inputs[ i ].name == '_nnc' ) {
        nnc = inputs[ i ].value;
        break;
    }
}

var seller_id_node;
var fav_form;
if ( nnc != null ) {
    fav_form = document.createElement( 'form' );
    fav_form.action = '/add_favorite_shop.php';
    fav_form.method = 'POST';
    fav_form.innerHTML = '<input type="hidden" name="_nnc" value="' + nnc + '" /><input type="hidden" name="user_id" value="" />';
    document.body.appendChild( fav_form );
    seller_id_node = fav_form.getElementsByTagName( 'input' )[ 1 ];
}

// Each forum post has an anchor tag, which happens to be in the table 
// cell we want to decorate. So, we go through all the anchors finding
// ones that are forum post identifiers.
var anchors = document.getElementsByTagName( 'a' );
for ( var a = 0; a < anchors.length; a++ ) {
    var anchor = anchors[ a ];
    if ( ! anchor.name ) continue;
    var match = isForumLink.exec( anchor.name );
    if ( ! match ) continue;
    var postId = match[ 1 ];
    // Get the user ID and name from the shop link
    a += 2;
    while ( anchors[ a ] != null && ( anchors[ a ].href == null || anchors[ a ].href.indexOf( 'shop.php' ) == -1 ) ) a++;
    var match = extractUserId.exec( anchors[ a ].href );
    var userId = match[ 1 ];
    var userName = anchors[ a ].innerHTML;
    // Build the HTML
    html = document.createElement( 'div' );
    html.style.marginTop = "5px";
    html.innerHTML += '<a style="color: #0192B5 !important" href="/profile.php?user_id=' + userId + '">profile</a> | ';
    if ( nnc != null ) {
        html.innerHTML  += '<a style="color: #0192B5 !important" href="/add_favorite_shop.php?user_id=' + userId + '">add to favorites</a> | ';
    }
    html.innerHTML  += '<a style="color: #0192B5 !important" href="/convo_new.php?to_username=' + userName + '">send convo</a> | ';
    html.innerHTML  += '<a style="color: #0192B5 !important" href="/convo_drop_search.php?drop_user_name=' + userName + '&drop_tag=&submit=Go">list convos</a></div> | ';
    if ( nnc != null ) {
        var fav_link = html.getElementsByTagName( 'a' )[ 1 ];
        fav_link.addEventListener( "click", genAddToFav( userId ), true );
    }
    // add a node to show/hide the user's Etsy Mini
    var mini = document.createElement( 'a' );
    mini.style.color = '#0192B5';
    mini.innerHTML = 'view mini';
    mini.style.cursor = 'pointer';
    html.appendChild( mini );
    mini.addEventListener( "click", genMiniToggle( userId, html ), true );

    // Add it to the parent cell and move on
    a++;
    while ( anchors[ a ].href.indexOf( 'forum_report.php?post_id=' + postId ) == -1 ) {
        a++;
    }
    anchors[ a ].parentNode.appendChild( html );
}

function genAddToFav ( userId ) {
    return function ( event ) {
        event.preventDefault();
        seller_id_node.value = userId;
        fav_form.submit();
        //alert( fav_form.innerHTML );
    }
}
function genMiniToggle( userId, node ) {
    return function ( event ) {
        if ( minis[ userId ] == null ) {
            // the mini hasn't been initialised yet
            var url = 'http://www.etsy.com/etsy_mini_both.php?item_source=shop&item_size=thumbnail&item_rows=1&item_columns=4&user_id=' + userId;
            // create it in a div
            var div = document.createElement( 'div' );
            div.innerHTML = '<iframe ALLOWTRANSPARENCY="true" style="width: 378px; height: 93px;" src="' + url + '" scrolling="no" frameborder="0"></iframe>';
            // style the div
            div.style.border = '1px solid #eaeaea';
            div.style.marginTop = '4px';
            div.style.background = '#ffffff';
            div.style.width = '378px';
            // add the div to the node we were passed so it appears on the screen under the links
            node.appendChild( div );
            // stash a ref to the div so we can toggle it later
            minis[ userId ] = div;
        } else if ( minis[ userId ].style.display == '' ) {
            // toggle off
            minis[ userId ].style.display = 'none';
        } else {
            // toggle back on again
            minis[ userId ].style.display = '';
        }
    }
}