$(function() {

    $(".action-toggle-display-mode").click(function() {

        var a$ = $(this);

        var id = a$.attr("item-id");

        var mode = $("#mode-"+id).attr("class");

        if (mode=="teaser-mode") {
            mode = "text-mode";
        } else {
            mode = "teaser-mode";
        }

        $("#mode-"+id).attr("class", mode);

        return true;
    })

    var sharelinkcanvas$ = $("#share-links");
    var permalinkcanvas$ = $("#permalink-canvas");

    $("[action='share-link']").click(function() {
        var a$ = $(this);
        var href = a$.attr("href");
        href += "&_="+new Date().getTime();
        href = encodeURIComponent(href);
        var title = a$.attr("title")||"Souterrain Transmissions";
            title = encodeURIComponent(title);
        $("a.share-link", sharelinkcanvas$).each(function() {
            var ahref = $(this).attr("href");
            ahref = ahref.replace("#URL#", href);
            ahref = ahref.replace("#TITLE#", title);
            $(this).attr("href", ahref);
        })
        enablePulldownMenu(a$, sharelinkcanvas$)
        return false;
    })

    $("[action='perma-link']").click(function() {
        return true;
        /* var a$ = $(this);
        var href = encodeURIComponent(a$.attr("href"));
        var title = a$.attr("title")||"";
        $(".permalink", permalinkcanvas$).each(function() {
            var html = $(this).html();
            html = html.replace("#URL#", href);
            html = html.replace("#TITLE#", title);
            $(this).html(html);
        })
        enablePulldownMenu(a$, permalinkcanvas$);
        return false; */
    })

    $(".action-pulldown").click(function() {

        var a$ = $(this);

        var canvasid = a$.attr("canvas");

        if (!canvasid) {
            canvasid = $("#pulldown-canvas");
        }

        var canvas$ = $(canvasid);

        try {
            enablePulldownMenu(a$, canvas$);
        } catch (e) {
            alert("error "+e);
        }

        return false;

    })
    
})

function enablePulldownMenu(a$, canvas$) {

    window.a$ = a$;

    var aoff = a$.offset();

    var widtha$ = a$.width();

    window.canvas$ = canvas$;

    var width = canvas$.width();
    var height = canvas$.height();

    $(".title", canvas$).empty();

    var top0ml = $("#top0").css("margin-left");
    var top0off = $("#top0").offset();

    debug ("top0 "+top0off.left+":"+top0off.top+", "+top0ml);

    debug("aoff "+aoff.left+":"+aoff.top+", width="+width);

    var b$ = $('<div class="pulldown"><div class="title"><b><span class="label">'+a$.html()+'</span></b></div></div>');

    var titleMl = aoff.left-(828-width+top0off.left+100);

    debug ("title.ml="+titleMl);
    
    b$.css("margin-left", titleMl);

    $(".title", canvas$).append(b$);

    $(".pulldown .title .label", canvas$).css("width", (widtha$+3)+"px");

    // b$.appendTo(a$);

    var top = aoff.top-2-$(window).scrollTop();
    var left = 205;


    var opts = {
        top: top,
        left: 820-width+top0off.left+100,
        width: width,
        height: height,
        border: "none"
    };

    pulldownOverlay(canvas$, opts);

}

function pulldown1() {

    var mode$ = $("#head-pulldown");

    var stat = mode$.attr("class");

    if (stat=="pulldown-hidden") {
        stat = "";
    } else {
        stat = "pulldown-hidden";
    }

    mode$.attr("class", stat);

    return false;

}