MozillaZine

Restoring the back-forward-dropmarker in 4.0.

Discuss application theming and theme development.
patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted October 25th, 2010, 1:10 am

This is quite a bit simpler than restoring the feed button. This will restore the dropmarker and it's basic functions.

Just drop this into your globalBindings.xml:

Code: Select all
  <binding id="restore-back-forward-dropmarker">
    <content>
      <children/>
      <xul:toolbarbutton
      id="back-forward-dropmarker"
      type="menu">
        <xul:menupopup
        onpopupshowing="return FillHistoryMenu(event.target);"
        oncommand="gotoHistoryIndex(event); event.stopPropagation();"
        onclick="checkForMiddleClick(this, event);"
        position="after_start"/>
      </xul:toolbarbutton>
    </content>
  </binding>


And call it from browser.css:

Code: Select all
/* restore the 3.x dropmarker in Firefox 4.0 */
#tab-view-deck #unified-back-forward-button {
-moz-binding: url("chrome://global/skin/globalBindings.xml#restore-back-forward-dropmarker");}


It will lack the tooltip saying "Recent Pages" and will not go into a disabled state when both the Back and Forward buttons are disabled, but other than that it's identical functionality.

Edit:

* If you want a slightly more complicated binding that allows the dropmarker to go into disabled mode:
viewtopic.php?p=10061537#p10061537

** If you are seeing double dropmarkers instead of one:
viewtopic.php?p=10063619#p10063619
Last edited by patrickjdempsey on October 27th, 2010, 3:01 pm, edited 2 times in total.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

stratareloaded
 
Posts: 7
Joined: October 6th, 2008, 11:57 am

Post Posted October 25th, 2010, 11:40 pm

That's awesome! Thank you!

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted October 26th, 2010, 12:41 am

You are welcome!
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

CatThief

User avatar
 
Posts: 1854
Joined: January 19th, 2004, 12:19 am
Location: Northeast USA

Post Posted October 26th, 2010, 5:08 pm

Brilliant! :D
Still passionate for Mozilla themes and extensions, just not actively developing them for public release anymore.

LoudNoise
New Member

User avatar
 
Posts: 40048
Joined: October 18th, 2007, 1:45 pm
Location: Next door to the west

Post Posted October 26th, 2010, 6:10 pm

I cannot to it tonight but if you folks want to make a Meta "Restoring..." thread with links to this stuff I will be more then happy to make it a locked sticky if that would help. You would just need to ask one of us to open it if something needed to be added.
Post wrangler
"Choose between the Food Select Feature or other Functions. If no food or function is chosen, Toast is the default."

CatThief

User avatar
 
Posts: 1854
Joined: January 19th, 2004, 12:19 am
Location: Northeast USA

Post Posted October 26th, 2010, 6:22 pm

patrickjdempsey wrote:will not go into a disabled state when both the Back and Forward buttons are disabled

Patrick, I didn't play around with it yet but wouldn't including something like this inside the binding work to display the disabled state?

Code: Select all
<xul:observes element="Browser:Back" attribute="disabled"/>
<xul:observes element="Browser:Forward" attribute="disabled"/>
Still passionate for Mozilla themes and extensions, just not actively developing them for public release anymore.

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted October 26th, 2010, 6:34 pm

@LoudNoise, I think we probably are going to need a meta thread dealing with all the little bits and pieces of Firefox 4.0 theming, not just restoring stuff. I was gonna wait till b7 lands, but we can go ahead and start one now. Frank Lion had started one before his hiatus but that was when it was still called 3.7.

@CatThief, I think the theme I've been testing in doesn't have a clear enough distinction between disabled and active states so I'll try later and see if we can get something better there. If you confirm that that bit of code works before I get a chance to play with it, just let me know and I'll add it in.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

CatThief

User avatar
 
Posts: 1854
Joined: January 19th, 2004, 12:19 am
Location: Northeast USA

Post Posted October 26th, 2010, 6:53 pm

Well it sorta works. Is there a way to define the two observers as one unit so that an action takes place when both conditions are true, not just one or the other?

What I mean would be similar to this in xul:

Code: Select all
document.getElementById('Browser:Back').hasAttribute('disabled') &amp;&amp;
document.getElementById('Browser:Forward').hasAttribute('disabled')

Note the "&&"
Still passionate for Mozilla themes and extensions, just not actively developing them for public release anymore.

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted October 26th, 2010, 7:08 pm

This is where my understanding of bindings and observers really breaks down. I think having two observers monitoring "disabled" means that whenever *either* one is disabled then the dropmarker will be as well. How about this? Instead of *really* making the dropmarker disabled we just make it *appear* disabled?

The following is from the 3.6 default theme with modifications:

Code: Select all
/* fake disabled dropmarker for Firefox 4.0 */
toolbar[iconsize="large"][mode="icons"] #back-button[disabled="true"]
+ #forward-button[disabled="true"] + #back-forward-dropmarker,
/* real disabled dropmarker for Firefox 3.x */
toolbar[iconsize="large"][mode="icons"] #back-forward-dropmarker[disabled="true"] {
  -moz-image-region: rect(71px 438px 99px 422px); }
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

CatThief

User avatar
 
Posts: 1854
Joined: January 19th, 2004, 12:19 am
Location: Northeast USA

Post Posted October 26th, 2010, 7:49 pm

patrickjdempsey wrote:How about this? Instead of *really* making the dropmarker disabled we just make it *appear* disabled?

The following is from the 3.6 default theme with modifications:

Code: Select all
/* fake disabled dropmarker for Firefox 4.0 */
toolbar[iconsize="large"][mode="icons"] #back-button[disabled="true"]
+ #forward-button[disabled="true"] + #back-forward-dropmarker,
/* real disabled dropmarker for Firefox 3.x */
toolbar[iconsize="large"][mode="icons"] #back-forward-dropmarker[disabled="true"] {
  -moz-image-region: rect(71px 438px 99px 422px); }


Using the "+" selector should work, but yet I can't seem to get the image to change. :-k I even tried changing things around like this:

Code: Select all
#tab-view-deck #unified-back-forward-button > #back-button[disabled="true"] + #forward-button[disabled="true"] + #back-forward-dropmarker > .toolbarbutton-menu-dropmarker {
  list-style-image: url("chrome://global/skin/arrow/arrow-dn-dis.png") !important;
}
Still passionate for Mozilla themes and extensions, just not actively developing them for public release anymore.

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted October 26th, 2010, 8:13 pm

What happens if you use the tilde instead of the plus? That's a little less picky and should get the job done. Also, this style should work for both 3.6 and 4.0 without the need of keeping the old dropmarker[disabled] stuff, since it basically does the same thing.

Code: Select all
#back-button[disabled="true"] ~ #forward-button[disabled="true"] ~ #back-forward-dropmarker { background-color: red !important;}
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

couldabeen

User avatar
 
Posts: 6729
Joined: September 9th, 2003, 11:24 am
Location: I'm Right Here

Post Posted October 26th, 2010, 8:18 pm

OK, my 4.x profile doesn't have the extensions string that the globalBindings.xml, and browser.css files are included in. Do I copy it from one of the 3.x versions, or put those scripts bits somewhere else?

This is the search results string for the globalBindings.xml file >>>{D46E8522-6E86-44b1-A622-58C0668AD78E}\chrome\global
browser.css is in the same string with a 'browser' ending after the /chrome.
Free Your Mind, And Your A$$ Will Follow - Funkadelic, 1970

CatThief

User avatar
 
Posts: 1854
Joined: January 19th, 2004, 12:19 am
Location: Northeast USA

Post Posted October 26th, 2010, 8:31 pm

patrickjdempsey wrote:What happens if you use the tilde instead of the plus?

Still no change. If you got this working on your end there must be something in my theme code somewhere else that is taking control. I'll have to poke around. Darn, this might take a while.
Still passionate for Mozilla themes and extensions, just not actively developing them for public release anymore.

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted October 26th, 2010, 10:33 pm

couldabeen, this is specifically for theme authors building full themes. I'm not sure if there is a way to apply bindings locally through userChrome.css as I've never tried.

Well, unfortunately the Addons Manager appears to be completely broken on the latest nightly (with a CLEAN profile). I cannot install themes or extensions locally or from AMO.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted October 26th, 2010, 11:43 pm

Hmmm... my Addons Manager is working now. I don't know what's going on with that thing but it's been very tempermental lately, sometimes it works flawlessly, sometimes it doesn't work at all, sometimes I have to restart every time I use it. Moan.

Anyway, I guess anonymous content won't respond to sibling selectors the way explicit content does. Weird stuff. I even tried creating two hidden boxes in the binding and had them observing the disabled state of the Back and Forward respectively, but I couldn't get the back-forward-dropmarker to respond to sibling selectors. So I think it's safe to say that I don't think we are going to be able to have a disabled state for this button at all. But really, the disabled state only applies to it's appearance, functionally it is disabled when there is no history to view.

Edit: AHA! It's not very pretty but since we can't use sibling selectors we need to use parent > child selectors:

Code: Select all
  <binding id="restore-back-forward-dropmarker">
    <content>
     <children/>
      <xul:box id="dropmarker-observer1">
      <xul:observes element="back-button" attribute="disabled"/>
        <xul:box id="dropmarker-observer2">
        <xul:observes element="forward-button" attribute="disabled"/>
          <xul:toolbarbutton
          id="back-forward-dropmarker"
          type="menu">
            <xul:menupopup
            onpopupshowing="return FillHistoryMenu(event.target);"
            oncommand="gotoHistoryIndex(event); event.stopPropagation();"
            onclick="checkForMiddleClick(this, event);"
            position="after_start"/>
          </xul:toolbarbutton>
        </xul:box>
      </xul:box> 
    </content>
  </binding>


Code: Select all
toolbar[iconsize="large"][mode="icons"] #dropmarker-observer1[disabled="true"]
#dropmarker-observer2[disabled="true"] #back-forward-dropmarker {
 background-color: red !important;}


Crazy stuff. Like I said, it's not pretty and it breaks the old formatting, but since the bound element can't respond to sibling selectors anyway, it doesn't matter.
Last edited by patrickjdempsey on October 27th, 2010, 3:05 pm, edited 1 time in total.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

Return to Theme Development


Who is online

Users browsing this forum: No registered users and 1 guest