Neil's Place

March 2, 2011

Fun with Toolbars

Filed under: Mozilla — enndeakin @ 3:58 pm

I started to work on a prototype for being able to dock panels onto a window, which might be used for the console panel. This would allow one to drag a panel around and snap it into a window so that it was no longer a separate piece of UI.

While looking for a good means to test what I’d implemented, I realized that the simplest was to allow the toolbar to be pulled out of the window.

Or, when dragged near the bottom of the window, the toolbar snaps onto the bottom:



  1. Isn’t this what made the Office UI a disaster? I can’t count the number of times I’ve had users lose their menu bar or main toolbar in office. This could be good for developer tools, but watch out applying it to the main toolbars 🙂

    Comment by Kroc Camen — March 2, 2011 @ 6:22 pm

    • These days, toolbars are locked by default

      Comment by asf — March 3, 2011 @ 8:11 pm

  2. This looks amazing!

    Comment by Ehsan Akhgari — March 2, 2011 @ 7:17 pm

  3. Interesting idea. I did the same once, but came only half way due to time-problems.

    How does your docking and undocking work? Are you moving DOM nodes between the panel and the rest of the XUL window?
    Problem is that when moving DOM nodes CSS and thus XBL-bindings will be reattached. XBL-constructors will be called on every move leading to unexpected results and anonymous nodes will be recreated. Though I’ve heard some of this will change in XBL2.


    Comment by André — March 3, 2011 @ 6:38 am

  4. Looks great! I can’t wait to use this in Firebug UI 🙂

    Comment by Jan Odvarko — March 3, 2011 @ 11:29 am

  5. Very nice! You know I’m cheering for you in this line of exploration 🙂

    Comment by Kevin Dangoor — March 3, 2011 @ 11:48 am

  6. Very cool Neil, keep it up!

    Comment by cuz84d — March 3, 2011 @ 8:49 pm

  7. Looks great; is there some way to track this work?

    I also share André’s concerns; so far (assuming no backwards compat) the best idea was to stick everything into s and call swapDocShells to move things around. Certainly not the perfect solution, but there doesn’t seem to be anything better due to how the DOM works…

    Comment by Mook — March 5, 2011 @ 1:36 pm

RSS feed for comments on this post. TrackBack URI

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

Create a free website or blog at

%d bloggers like this: