A script to show the full BB post on BBS

Edit: Most recent code will be updated to this post. Credits to @bucaneer for refining the first bookmarklet to only select a link from the first post with titled"Permalink"

To preview BoingBoing posts inline with a bbs topic, create a new bookmark in your bookmark toolbar, and add the following code to the location field where you normally put a link. Go to a BoingBoing comment thread and click on the bookmark you just made. All this does is finds the first link in a thread and opens it up in an iframe inline with the page.

http://jsfiddle.net/gwwar/p8zohfcr/

So it should look a bit like this in action:


@noahdjango also requested a way to preview boing-boing posts before clicking on topics. This should only trigger a preview if a link is a boingboing link and you havenā€™t read it yet. Also, only apply the bookmarklet once on a full page load.

It might be a little sluggish since itā€™s doing 2 page loads (iframe to the thread, then a redirect to the main page). If you want to dismiss the preview, click anywhere else on the page or hover on a new boingboing link that is unread.

http://jsfiddle.net/gwwar/8raL204r/

Enjoy.

9 Likes

Truly you are a god among men. Iā€™ve uploaded a Greasemonkey version of the script here, hope thatā€™s alright? (Probably should have asked before acting, but thereā€™s always hasty apologetic retraction to look forward to.)

2 Likes

I have no problem with uploading it. I just wanted to make sure people knew it wasnā€™t malicious.

Right. I also tweaked it a bit to only work on links within the first post called ā€œPermalinkā€:

javascript:(function(){
    var iframe, link;
    link = document.querySelector("#post_1 .topic-body .cooked a");
    if (link.firstChild.textContent == "Permalink") {
        iframe = document.createElement('iframe');
        iframe.setAttribute("src", link.getAttribute("href"));
        iframe.setAttribute("frameBorder", 0);
        iframe.setAttribute("width", "100%");
        iframe.setAttribute("height", "600px");
        iframe.setAttribute("style", "border:1px solid #CCC;");
        document.querySelector(".topic-body .cooked").appendChild(iframe);
    }
}());```
5 Likes

THIS IS AWESOME! :banana: :banana: :banana: :banana: :banana: :banana: :banana:

:banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana:

:banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana:

:banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana: :banana:

Oh, god, if you/ @bucaneer/someone could make a script like this so the links on bbs.boingboing.net would show up when you mouseover, I would probably never go to the main page ever again!

You mean for all outbound links in a post? I can take a stab after work, though I think on click to toggle would be more useable.

eh, maybe what I envision isnā€™t realistic. i hate seeing a headline in BBS, not being able to tell if Iā€™m interested or not, clicking through to the forum, then clicking through to the permalink (or now, clicking your awesome bookmarklet) just to skim a sentence/see the pic and realize Iā€™m not interested, and then back out to BBS again.

If I could mouseover or rightclick/cmd click from the BBS and see the permalink in an iframe (i donā€™t actually know that word, Iā€™m just parroting what you called it earlier so I hope thatā€™s right), that would be what @Donald_Petersen and I asked for here several months ago.

I get that the link on the BBS topics page only goes to the forum, not the postā€™s permalink; so unless you can ā€œgo two deep,ā€ I understand it may be wishful thinking.

anyway, cheers for responding :^)

1 Like

Here you go. I whipped this up pretty quick, so let me know if there are bugs. This should only trigger a preview if a link is a boingboing link and you havenā€™t read it yet. Also, only apply the bookmarklet once on a full page load.

It might be a little sluggish since itā€™s doing 2 page loads (iframe to the thread, then a redirect to the main page). If you want to dismiss the preview, click anywhere else on the page or hover on a new boingboing link that is unread.

javascript:(function($){
    $(function(){
        var lastLink = null;
        $("body").on("mouseover", "#topic-list td.main-link a", function(event){
            var $link = $(this), $category, iframe, offset, linkVal = $link.attr("href");
            $category = $link.closest("tr").find("td.category");
            if($category.find("a").attr("href") === "/category/boing-boing" && (lastLink !== linkVal || $("iframe.hover-bb-preview").length===0)  && $link.closest("td.main-link").find("a i.icon-asterisk").length>0) {
                $("iframe.hover-bb-preview").remove();
                offset = $category.offset();
                iframe = $("<iframe/>", {src: $link.attr("href"), "class":"hover-bb-preview", frameBorder:0, width:"500px", height:"300px"});
                iframe.css({
                    border: "1px solid #CCC",
                    position: "absolute",
                    left: offset.left,
                    top: offset.top
                });
                iframe.load(function(){
                    var contents = iframe.contents();
                    contents.get(0).location.href = contents.find("#post_1 .cooked a").attr("href");
                });
                $("body").append(iframe);
                lastLink = linkVal;
            }
        }).on("click", function(){
            $("iframe.hover-bb-preview").remove();
        });
    });
}(jQuery));

5 Likes

Whoa, dude! Iā€™m dumfounded. I donā€™t know what to say other than an emphatic thank you! iā€™m seriously overwhelmed
ļ½ļ¼ˆļ¼Žļ¼æļ¼Žļ¼‰ļ½ć‚¢ćƒŖć‚¬ćƒˆ

ļ¼¼ļ¼ˆā˜…Ā“āˆ’ļ½€ļ¼‰äŗŗļ¼ˆĀ“ā–½ļ½€ā˜…ļ¼‰ļ¼

Iā€™m actually a dudette, but weā€™re pretty rare in the tech industry anyway. Enjoy the bookmarklet!

9 Likes

Holy crap, was that elegant! Itā€™s exactly what we wanted!

Many, many thanks to you. If only more people could so thoroughly recognize an issue, understand how to address it, and so promptly and apparently effortlessly fix it, the world would be a significantly merrier place.

Not to take away from Jeffā€™s and Samā€™s work hereabouts, mind, but this made me soooo happy!

2 Likes

Oh, sorry. I do tend to absentmindedly apply ā€œdudeā€ to either gender IRLā€“which is offensive enoughā€“but I admit I assumed :neckbeard: , durr.

No bugs that I can tell ā€“ it works great! The frame was a little small for me so I looked at the code and luckily that was the only bit that I could actually follow, so after trying some others I settled on 655x555 pixels. Figuring this out made me feel like

A small victory, but Iā€™ll take it.

1 Like

A very nice touch! I followed your example, and it helps my aging eyes. Thanks to you both!

1 Like

Brilliant! Thank you!!

1 Like

Oh no worries I tend to do that too. Just watch out if you post on Jezebel. I got chewed out once for using the word ā€œfemaleā€.

Glad to see youā€™re enjoying it.

1 Like

I dunno, ā€œdudeā€ has become a sort of all purpose interjection in this part of the world (LA,CA,USA). Like a soft version of ā€œfuck.ā€

It does still confuse. The youngsters are way out ahead on this, obviously.

1 Like

Rob Schneider, on the many meanings of ā€œDudeā€:

2 Likes

Now, ā€œDudeā€ - thatā€™s a name no one would self-apply where I come from.

3 Likes

ā€œWhat the fuck are you talking about?ā€

2 Likes

Dude was used as a universal word, where I grew up.

1 Like