MozillaZine

[Ext] Unified Back-/Forward Button 0.6 [Aug 25]

Announce and Discuss the Latest Theme and Extension Releases.
dougeeebear

User avatar
 
Posts: 548
Joined: September 15th, 2005, 4:17 pm

Post Posted March 20th, 2006, 2:11 pm

zeniko wrote:I didn't know that dropmarkers couldn't have their own tooltip.

So then we both learned something today :)

Branstrom

User avatar
 
Posts: 97
Joined: March 16th, 2004, 9:45 am
Location: Sweden

Post Posted March 20th, 2006, 5:44 pm

zeniko wrote:
dougeeebear wrote:If possible, I would like it to say "Tab History" for the single button setup.
Is there a way to create such a tooltip for it with css?

None that I know of. If you absolutely want this, you'll have to modify the file unibafo.xml and add the attribute tooltiptext="Tab History" right after class="toolbarbutton-menubutton-dropmarker" (ugly hack :-().

Branstrom wrote:Can the buttons be layed out on top of each other, so the disabled state could be showed for either button?

Sure. Add <a href="data:text/css,%2F*%20Drop-down%20only%20button%20for%20Unified%20Back-%2FForward%20Button%20(default%20theme)%20*%2F%0A%0A%23unibafo%20%3E%20toolbarbutton%20%7B%0A%09display%3A%20none%20!important%3B%0A%7D%0A%23unibafo%20%3E%20dropmarker%20%7B%0A%09list-style-image%3A%20url(chrome%3A%2F%2Fbrowser%2Fskin%2FToolbar.png)%20!important%3B%0A%09-moz-image-region%3A%20rect(0px%2C%2048px%2C%2024px%2C%200px)%20!important%3B%0A%7D%0A%23unibafo%5Bdisabled1%3D%22true%22%5D%20%3E%20dropmarker%20%7B%0A%09-moz-image-region%3A%20rect(0px%2C%2048px%2C%2024px%2C%2024px)%20!important%3B%0A%7D%0A%23unibafo%5Bdisabled2%3D%22true%22%5D%20%3E%20dropmarker%20%7B%0A%09-moz-image-region%3A%20rect(0px%2C%2024px%2C%2024px%2C%200px)%20!important%3B%0A%7D%0A%23unibafo%3Ahover%20%3E%20dropmarker%20%7B%0A%09-moz-image-region%3A%20rect(24px%2C%2048px%2C%2048px%2C%200px)%20!important%3B%0A%7D%0A%23unibafo%5Bdisabled1%3D%22true%22%5D%3Ahover%20%3E%20dropmarker%20%7B%0A%09-moz-image-region%3A%20rect(24px%2C%2048px%2C%2048px%2C%2024px)%20!important%3B%0A%7D%0A%23unibafo%5Bdisabled2%3D%22true%22%5D%3Ahover%20%3E%20dropmarker%20%7B%0A%09-moz-image-region%3A%20rect(24px%2C%2024px%2C%2048px%2C%200px)%20!important%3B%0A%7D%0A%23unibafo%5Bdisabled%3D%22true%22%5D%20%3E%20dropmarker%20%7B%0A%09-moz-image-region%3A%20rect(48px%2C%2048px%2C%2072px%2C%200px)%20!important%3B%0A%7D%0A">these lines</a> to your userChrome.css and adapt them to your own image(s).

Branstrom wrote:But then the left click to show the menu would be gone... maybe you could hack that into the extension? Just as an option?

Why would I want to add such ugly hacks to my extensions? Anyway, the CSS I gave you above preserves the left-clicking hack you already use.


Exactly what sprung to mind, thanks for setting up the original CSS.

I saw the disabled1 and -2 before and thought I was going to do it myself, but you beat me to it.

<a href="data:text/css,%23unibafo%20%3E%20toolbarbutton%20%7B%0D%0A%09display%3A%20none%20!important%3B%20%7D%0D%0A%23unibafo%20%3E%20dropmarker%2C%20toolbarbutton%23reload-button%2C%20toolbarbutton%23stop-button%20%7B%0D%0A%09list-style-image%3A%20url(toolbar.png)%20!important%3B%20%7D%0D%0A%0D%0A%23unibafo%20%3E%20dropmarker%20%7B%0D%0A%09margin-left%3A%201px%3B%0D%0A%09-moz-image-region%3A%20rect(0px%2C%2024px%2C%2024px%2C%200px)%20!important%3B%20%7D%0D%0A%0D%0A%23unibafo%5Bdisabled1%3D%22true%22%5D%20%3E%20dropmarker%20%7B%0D%0A%09-moz-image-region%3A%20rect(48px%2C%2048px%2C%2072px%2C%2024px)%20!important%3B%20%7D%0D%0A%0D%0A%23unibafo%5Bdisabled2%3D%22true%22%5D%20%3E%20dropmarker%20%7B%0D%0A%09-moz-image-region%3A%20rect(0px%2C%2048px%2C%2024px%2C%2024px)%20!important%3B%20%7D%0D%0A%0D%0A%23unibafo%3Ahover%20%3E%20dropmarker%20%7B%0D%0A%09-moz-image-region%3A%20rect(24px%2C%2024px%2C%2048px%2C%200px)%20!important%3B%20%7D%0D%0A%0D%0A%23unibafo%5Bdisabled1%3D%22true%22%5D%3Ahover%20%3E%20dropmarker%20%7B%0D%0A%09-moz-image-region%3A%20rect(72px%2C%2048px%2C%2096px%2C%2024px)%20!important%3B%20%7D%0D%0A%0D%0A%23unibafo%5Bdisabled2%3D%22true%22%5D%3Ahover%20%3E%20dropmarker%20%7B%0D%0A%09-moz-image-region%3A%20rect(24px%2C%2048px%2C%2048px%2C%2024px)%20!important%3B%20%7D%0D%0A%0D%0A%23unibafo%5Bdisabled%3D%22true%22%5D%20%3E%20dropmarker%2C%0D%0A%23unibafo%5Bdisabled%3D%22true%22%5D%3Ahover%20%3E%20dropmarker%20%7B%0D%0A%09-moz-image-region%3A%20rect(48px%2C%2024px%2C%2072px%2C%200px)%20!important%3B%20%7D">Here's the final CSS</a> (with a tweak to avoid having the disabled2 hover image for the disabled button... weird...) and the image to use with it:

Image

And this is what it looks like. Just like what I mocked up before.

dougeeebear

User avatar
 
Posts: 548
Joined: September 15th, 2005, 4:17 pm

Post Posted March 21st, 2006, 5:58 am

zeniko,
I am trying to understand how the fast forward/rewind entries actually function.
To me, the history list makes more sense with extensions.unibafo.max_quicknav set to 0.
Could you please explain further how fast forward/rewind works?
And since both entries display the same symbols, which is which?
Thanks.

old zeniko
 
Posts: 0
Joined: December 31st, 1969, 5:00 pm

Post Posted March 21st, 2006, 6:20 am

dougeeebear wrote:I am trying to understand how the fast forward/rewind entries actually function.

If there are too many entries in the menu (i.e. more than extensions.unibafo.max_length), the first and last two (resp. extensions.unibafo.max_quicknav) entries are replaced with fast rewind/forward entries.

A fast rewind/forward entry is the entry for the first page when you entered a new domain - e.g. if you navigate from www.google.com to forums.mozillazine.org and then navigate around in the forums, the first forums.... entry will be displayed. Like this, you can quickly skip all pages from one domain and go back (in the example) to your Google search or forward to wherever you moved from the forums.

All fast rewind/forward entries are in italics and are prepended with a chevron (the symbol you also see when e.g. a toolbar is too wide). Both fast rewind and fast forward entries use the same chevron, since many themes feature only the left-to-right one. You can however tell the difference between fast rewind and fast forward by the position of the entry in the list (above the current page = fast rewind, below = fast forward - in the same way as clicking an entry above the current one goes back in history and clicking one below goes forward).

dougeeebear

User avatar
 
Posts: 548
Joined: September 15th, 2005, 4:17 pm

Post Posted March 21st, 2006, 6:39 am

Thanks for that explanation, zeniko.
It makes more sense now.

dougeeebear

User avatar
 
Posts: 548
Joined: September 15th, 2005, 4:17 pm

Post Posted March 21st, 2006, 7:49 am

I'm trying to use a couple icons in my chrome directory to reflect rewind/fast forward status of their lines respectively.
Code: Select all
#unibafo menuitem[quicknav="true"] {
   font-style: italic;
   list-style-image: url("rewind.png") !important;
}

#unibafo[chromedir="rtl"] menuitem[quicknav="true"] {
   list-style-image: url("fast-forward.png") !important;
}


But they are both using the rewind icon.
Is there no way I can have rewind and fast forward use different icons for their respective lines?

old zeniko
 
Posts: 0
Joined: December 31st, 1969, 5:00 pm

Post Posted March 21st, 2006, 11:48 am

Since there's no way of making a difference between back and forward entries, it's just logical that you can't distinguish fast rewind/forward entries, either... Still, you can achieve what you want with the following CSS:
Code: Select all
#unibafo menuitem[quicknav="true"]:first-child { /* first fast rewind entry */ }
#unibafo menuitem[quicknav="true"]:first-child + menuitem[quicknav="true"] {
  /* second fast rewind entry */
}
#unibafo menuitem[quicknav="true"]:first-child + menuitem[quicknav="true"] + menuitem[quicknav="true"] {
  /* third fast rewind entry */
}
/* and so on (adding each time `+ menuitem[quicknav="true"]´) until you have extensions.unibafo.max_quicknav entries */

Now you can first style the fast forward entries, and then overwrite these styles (partly) with the differences of the fast rewind entries...

dougeeebear

User avatar
 
Posts: 548
Joined: September 15th, 2005, 4:17 pm

Post Posted March 21st, 2006, 12:21 pm

zeniko wrote:Since there's no way of making a difference between back and forward entries, it's just logical that you can't distinguish fast rewind/forward entries, either... Still, you can achieve what you want with the following CSS:
...

Neat.. thanks.

riowong

User avatar
 
Posts: 587
Joined: May 4th, 2005, 1:33 am

Post Posted March 22nd, 2006, 3:55 am

When I've just upgraded to version 0.4, I found that there's a wide gap in between the two buttons. In the previous version, the gap was not existed which could save spaces from toolbar. I've also added the codes of Fitt's Back Button described above to userChrome.css, but the gap is still existed.

What can I do to shrink the gap in between them? Thx.

old zeniko
 
Posts: 0
Joined: December 31st, 1969, 5:00 pm

Post Posted March 22nd, 2006, 1:28 pm

riowong wrote:When I've just upgraded to version 0.4, I found that there's a wide gap in between the two buttons.

Could you please post a screenshot of the issue (and inform me about what version of Firefox and what theme you're using)?

riowong

User avatar
 
Posts: 587
Joined: May 4th, 2005, 1:33 am

Post Posted March 22nd, 2006, 8:15 pm

Yes. I'm using FF 1.5.0.1, and both themes from Noia Lite and Extreme.

Image

old zeniko
 
Posts: 0
Joined: December 31st, 1969, 5:00 pm

Post Posted March 22nd, 2006, 11:50 pm

I've added one further rule to the Noia specific code in the first post. Should the buttons get too close now, please add the > where indicated to see whether that makes it better and tell me.

riowong

User avatar
 
Posts: 587
Joined: May 4th, 2005, 1:33 am

Post Posted March 23rd, 2006, 12:40 am

sorry, I don't get what should I change from the codes that I've added. The codes that I copied from the first page are:

/* Fitt's Back Button - bigger target on the icon-only toolbar */
toolbar[mode="icons"] #unibafo > #back-button {
-moz-box-orient: horizontal !important;
}
toolbar[mode="icons"] #unibafo > #back-button > label {
display: -moz-box !important;
margin: 1px 5px 2px 6px !important;
-moz-margin-start: 6px !important;
-moz-margin-end: 5px !important;
}

old zeniko
 
Posts: 0
Joined: December 31st, 1969, 5:00 pm

Post Posted March 23rd, 2006, 12:46 am

Under Theme Specific Code you'll find a line "Noia (Extreme) and derivates" - that's what I meant.

riowong

User avatar
 
Posts: 587
Joined: May 4th, 2005, 1:33 am

Post Posted March 23rd, 2006, 12:51 am

Oh ya, they stick together now! Thx! :)

Return to Extension/Theme Releases


Who is online

Users browsing this forum: No registered users and 1 guest