http://qs321.pair.com?node_id=582545


in reply to Nodelets on the left?

Until (if ever) such a feature is added to PerlMonks, you can use JavaScript to manipulate the DOM objects to attain the desired effect. Add the code following to your Free Nodelet. Make sure your Free Nodelet is being displayed. 

<script type="text/javascript">
// ========================================
// Move nodelets to the left side.

function move_nodelets() {
   for each (var td in document.getElementsByTagName('td')) {
      if (td.className != 'nodelets')
         continue;

      var tr   = td.parentNode;
      var main = tr.firstChild;

      tr.insertBefore(td, main);
   }
}

move_nodelets();
</script>

[download]

Tested successfully in FireFox 1.5.0.7.
Tested unsuccessfully in IE 6.0.2900.2180.xpsp_sp2_gdr.050301-1519, although I'm sure it could be made to work by someone more knowledgable.

Update: Clarified Until => Until (if ever).
Update: Title change.
Update: An updated version of this code found in Re^9: Free Nodelet Hack: Nodelets on the left. The core logic has been simplified and it has extra logic to delay execution to a safe time (allowing it to work in IE).

Replies are listed 'Best First'.
Re^2: Nodelets on the left?
by Corion (Patriarch) on Nov 07, 2006 at 09:05 UTC

    Instead of the loop, I prefer XPath queries to extract elements from the DOM:

        var query = "//td[@class='nodelets']";
    var nodesSnapshot = document.evaluate(query, document, null, XPath
+Result.ORDERED_NODE_SNAPSHOT_TYPE, null );
    for ( var i=0 ; i < nodesSnapshot.snapshotLength; i++ ) {
        var elt = nodesSnapshot.snapshotItem(i);
        // handle elt
    };

    [download]
[reply]
[d/l]
Re: Free Nodelet Hack: Nodelets on the left
by Aristotle (Chancellor) on Nov 08, 2006 at 12:57 UTC

    No need for a loop there, just retrieve the element you want directly.

    <script type="text/javascript">
( function() {
    var td = document.getElementById( 'nodelet_container' ).parentNode
+;
    var tr = td.parentNode;
    tr.insertBefore( td, tr.firstChild );
} )();
</script>

    [download]

    Makeshifts last the longest.

[reply]
[d/l]
      Looks like IE6 is blowing up on the insertBefore -- I get a pop-up message saying the page cannot be displayed (either that or we have some software that thinks the script is doing something dangerous). Anyone have any ideas how to get this to work with IE? Or why ikegami's works (node 582545) but this one fails? I tried googling for answers and various code tweaks but I never really made any progress. :-(

      Update:Ooops! By "work" I meant why does his not blow up in Interent Explorer? In other words, what's different about his insertBefore? You're right -- it doesn't move the nodelets. Sorry for the confusion!!!

[reply]

        According to the note in ikegami’s node, his code shouldn’t work in IE6 either. Does it work if you change it to the following?

        tr.insertBefore( tr.removeChild( td ), tr.firstChild );

        [download]

        Makeshifts last the longest.

[reply]
[d/l]
Re: Free Nodelet Hack: Nodelets on the left
by jdporter (Paladin) on Nov 07, 2006 at 21:37 UTC

    That's really nice! FWIW, I approve. ;-)

    Those interested in scripting/styling their PerlMonks experience may also be interested in the various other Free Nodelet Hacks.

    In the context of this thread, I point out (at the risk of flogging my own work) Free Nodelet Hack: Hide/Display Nodelet Bar On Demand. I've verified that it works just fine in conjunction with ikegami's code above.

    We're building the house of the future together.
[reply]
Re^2: Nodelets on the left?
by Argel (Prior) on Nov 07, 2006 at 02:05 UTC
    Thanks!! That's really nice!!! I still hope we get a real option, but until that happens this is a great work around!
[reply]

      It's not just a workaround, it's a solution.

      Considering how powerful CSS styling is for configuring one's view of PerlMonks, I really don't see why pmdev should implement changes such as this. (The same could be said for Node ids by node titles, but someone went and implemented it without really giving much thought to the wider ramifications.) If anything, pmdev should probably be looking at ways of enhancing PerlMonks' stylability and scriptability.

      We're building the house of the future together.
[reply]

        I applied that patch and I bothered to consider tha ramifications. Please outline how you would have accomplished the behaviour of that patch without changing PM internal code.

        ---
        $world=~s/war/peace/g

[reply]
        It's not just a workaround, it's a solution.

        Errr, given that I mentioned "different browsers" and no one has posted code that works with Internet Explorer yet perhaps you could explain to me how this is a solution? It's a great workaround (thanks again ikegami) but it shouldn't be the last word on this subject.

        Update: We do have some IE code now thanks to pKai in Re^4: Free Nodelet Hack: Nodelets on the left. However, the freenodelet has to be the last nodelet so this is still a workaround.

        Update2: Looks like we do have code that works with both browsers now.

[reply]

In Section Perl Monks Discussion