Make "Find as you type" bar on top?

Dex4788 · Post by **Dex4788** » November 11th, 2004, 8:38 pm

Is there any configuration I can do to make this bar up top instead of the very bottom? The reason I ask is because I have my own taskbar (OSX looking dock) instead of the XP one, and it blocks the view of some of the options when I try to find something on a webpage.

Dex4788 · Post by **Dex4788** » November 11th, 2004, 9:06 pm

Bump.

Dex4788 · Post by **Dex4788** » November 11th, 2004, 10:28 pm

Someone has to know...

Guest · Post by **Guest** » November 11th, 2004, 10:42 pm

Well, I can well understand why you'd want to know, but I'm, quite honestly, scratching my head over this one. I've even done some searching and all I can say is...."I dunno".

Good Luck!

fnkmaster · Post by **fnkmaster** » November 11th, 2004, 11:24 pm

Okay, here you go. I just had to figure this one out for you, so you can thank me later.

I'm using default Windows directory names since it sounds like you are using Windows XP.

There appears to be no simple setting to do this, so you have to actually edit the browser.xul file directly. Here's the step-by-step to do this:

Unzip the file browser.jar in c:\Program Files\Mozilla Firefox\chrome to c:\browser (you can use Winzip or whatever - jar files are just zip files by a different name). Go to C:\browser\content\browser and open the file browser.xul in a text editor. Now find the word "FindToolbar" and you should see:

<toolbar id="FindToolbar" ....
....
</toolbar>

The "...." in the middle is about 15 lines of text. Now highlight this whole chunk and cut it. Now paste it on top of the <hbox>...</hbox> chunk that is immediately preceeding where it was before. Save the file.

Now go back to c:\browser and zip up the contents directory (right-click if you are using Winzip and add to zip file), I used no compression so it's consistent with the way the jar file was before. Now name that ZIP file you just made browser.jar.

Now go ahead and backup the browser.jar from your Mozilla Firefox\chrome directory just in case.

Then replace it with the new browser.jar file you just made. Voila! Findbar is on top!

You may have to tweak the CSS for findbar a bit if you aren't happy with the borders around it and the like. The CSS stuff should be in findbar.css in the classic.jar file in the chrome directory (unzip it and go to skin\classic\global and open findbar.css as above). You should be able to figure out how to tweak some CSS borders if you need to (to add a lower border or something, for example).

Hope this helps!

Dex4788 · Post by **Dex4788** » November 12th, 2004, 1:14 pm

Hmm, I tried doing that but everytime I started Firefox up again it just open up this small toolbar with the minimize, maximize, and exit buttons. When I tried maximizing it, nothing really came up. So I must've done something wrong. Fortunately I made a backup so my browser is still working fine.

I also need to say that I didn't do the unzipping method early on in your step by step because my jar files are already set to open with notepad. So all I really had to do was backup the browser file, and then edit that one with whatever I had to do.

So, would you mind sending me the full contents of the browser file (after the edits) so I don't have to worry about making a mistake? Perhaps in a email you could send it to me?

fnkmaster · Post by **fnkmaster** » November 13th, 2004, 11:09 am

No problemo, you can download it at http://hardgrok.org/browser.jar. Just make sure FF is closed down completely, and then copy it over the browser.jar file in your chrome directory. Restart FF. When you press CTRL-F the findbar should be on top.

This browser.jar is from 1.0 final, so don't try using it with any other version, it will probably puke.

Dex4788 · Post by **Dex4788** » November 13th, 2004, 12:20 pm

Oh, so what if Firefox comes out with 1.1 or 2.0? What should I do then?

Dex4788 · Post by **Dex4788** » November 13th, 2004, 12:38 pm

UPDATE: I tried it and I got the same results. I noticed that my original browser file was 1,002 kb while the one you sent me was around 352 kb. Maybe that had something to do with it I don't know. Maybe you can give the exact code line for the browser line after the edits in notepad? Here's what mines is right now:

<hbox flex="1" id="browser">
<vbox id="sidebar-box" hidden="true" class="chromeclass-extrachrome">
<sidebarheader align="center">
<label id="sidebar-title" persist="value" flex="1" crop="end"/>
<image id="sidebar-throbber"/>
<toolbarbutton class="tabs-closebutton" tooltiptext="&sidebarCloseButton.tooltip;" oncommand="toggleSidebar();"/>
</sidebarheader>
<browser id="sidebar" flex="1" autoscroll="false"
style="min-width: 150px; width: 200px; max-width: 400px;"/>
</vbox>

<splitter id="sidebar-splitter" class="chromeclass-extrachrome" hidden="true"/>
<vbox id="appcontent" flex="1">
<tabbrowser id="content" disablehistory="true"
flex="1" contenttooltip="aHTMLTooltip"
contentcontextmenu="contentAreaContextMenu"
onnewtab="BrowserOpenTab();"
onkeyup="onBrowserKeyUp(event);"
autocompletepopup="PopupAutoComplete"
ondragdrop="nsDragAndDrop.drop(event, contentAreaDNDObserver);"
onclick="return contentAreaClick(event, false);"/>
</vbox>
</hbox>

<toolbar id="FindToolbar" hidden="true" align="center" fullscreentoolbar="true">
<toolbarbutton id="find-closebutton" tooltiptext="&findCloseButton.tooltip;"
oncommand="closeFindBar();"/>

<label value="&find.label;"/>
<hbox id="find-field-container">
<textbox id="find-field" oninput="find(this.value);" onfocus="onFindBarFocus();"
onkeypress="onFindBarKeyPress(event);" onblur="onFindBarBlur();"/>
</hbox>
<toolbarbutton id="find-next" label="&findNext.label;" tooltiptext="&findNext.tooltip;"
command="cmd_findAgain" disabled="true"/>
<toolbarbutton id="find-previous" label="&findPrevious.label;" tooltiptext="&findPrevious.tooltip;"
command="cmd_findPrevious" disabled="true"/>
<toolbarbutton id="highlight" label="&highlight.label;" tooltiptext="&highlight.tooltip;"
oncommand="toggleHighlight(!this.checked);
if (gFindMode != FIND_NORMAL) setFindCloseTimeout();"
type="checkbox" disabled="true"/>
<checkbox id="find-case-sensitive" oncommand="toggleCaseSensitivity(this.checked);"
label="&caseSensitiveCheckbox.label;" accesskey="&caseSensitiveCheckbox.accesskey;"/>
<image id="find-status-icon"/>
<label id="find-status"/>
</toolbar>

Can you give me the same code as above AFTER you do the changes? I'll just put that in the notepad and save it, maybe that'll work.

fnkmaster · Post by **fnkmaster** » November 13th, 2004, 1:00 pm

First of all: the browser.jar I put up there should be 1072kb (as to why it's slightly larger than the original browser.jar I'm not certain, I just used WinZip to zip it with no compression).

I cannot imagine how you could be getting the same result with the browser.jar file I put up there, I just tested it again on another machine and it works fine for me. Make sure you have closed FF first, and delete the browser.jar file to make sure FF is not locking that file. Then copy in my browser.jar, it ought to work for you.

As for opening your browser.jar file in notepad directly, I seriously recommend against it, as you are likely to mess up the ZIP header stuff when you save it back. Which is probably why your browser.jar stopped working after you edited it. Unzip it and rezip it afterwards, like I recommended before.

As for the code segment, here's what it should look like after moving that chunk of code:

<toolbar id="FindToolbar" hidden="true" align="center" fullscreentoolbar="true">
<toolbarbutton id="find-closebutton" tooltiptext="&findCloseButton.tooltip;"
oncommand="closeFindBar();"/>

<label value="&find.label;"/>
<hbox id="find-field-container">
<textbox id="find-field" oninput="find(this.value);" onfocus="onFindBarFocus();"
onkeypress="onFindBarKeyPress(event);" onblur="onFindBarBlur();"/>
</hbox>
<toolbarbutton id="find-next" label="&findNext.label;" tooltiptext="&findNext.tooltip;"
command="cmd_findAgain" disabled="true"/>
<toolbarbutton id="find-previous" label="&findPrevious.label;" tooltiptext="&findPrevious.tooltip;"
command="cmd_findPrevious" disabled="true"/>
<toolbarbutton id="highlight" label="&highlight.label;" tooltiptext="&highlight.tooltip;"
oncommand="toggleHighlight(!this.checked);
if (gFindMode != FIND_NORMAL) setFindCloseTimeout();"
type="checkbox" disabled="true"/>
<checkbox id="find-case-sensitive" oncommand="toggleCaseSensitivity(this.checked);"
label="&caseSensitiveCheckbox.label;" accesskey="&caseSensitiveCheckbox.accesskey;"/>
<image id="find-status-icon"/>
<label id="find-status"/>
</toolbar>

<hbox flex="1" id="browser">
<vbox id="sidebar-box" hidden="true" class="chromeclass-extrachrome">
<sidebarheader align="center">
<label id="sidebar-title" persist="value" flex="1" crop="end"/>
<image id="sidebar-throbber"/>
<toolbarbutton class="tabs-closebutton" tooltiptext="&sidebarCloseButton.tooltip;" oncommand="toggleSidebar();"/>
</sidebarheader>
<browser id="sidebar" flex="1" autoscroll="false"
style="min-width: 150px; width: 200px; max-width: 400px;"/>
</vbox>

<splitter id="sidebar-splitter" class="chromeclass-extrachrome" hidden="true"/>
<vbox id="appcontent" flex="1">
<tabbrowser id="content" disablehistory="true"
flex="1" contenttooltip="aHTMLTooltip"
contentcontextmenu="contentAreaContextMenu"
onnewtab="BrowserOpenTab();"
onkeyup="onBrowserKeyUp(event);"
autocompletepopup="PopupAutoComplete"
ondragdrop="nsDragAndDrop.drop(event, contentAreaDNDObserver);"
onclick="return contentAreaClick(event, false);"/>
</vbox>
</hbox>

Dex4788 · Post by **Dex4788** » November 13th, 2004, 4:06 pm

Ah, I finally got it to work. Thanks. As for editing the appearance of that toolbar...is it possible to look like the toolbars above it? Here's a cap:

I'd like the find toolbar to look like the top 2 as it well...stands out. Thanks again for all the help.

fnkmaster · Post by **fnkmaster** » November 13th, 2004, 4:39 pm

The look of the findbar is controlled by your theme. I don't recognize the theme you are using, but some themes do a better job at making the findbar consistent than others. The default theme is pretty good about this, but some others may not be. Look for findbar.css in your theme's global directory. The #FindToolbar element is the main style applied to the toolbar, and you can probably just tweak some of the borders to make things look better, maybe get rid of some of the weird image background stuff. In my case, with Qute, I can just change two or three lines of findbar.css and get something that matches pretty well. But you'll have to experiment a bit, most likely.

Dex4788 · Post by **Dex4788** » November 13th, 2004, 4:57 pm

Ok, thanks. So how about when the next Firefox version comes out? Am I stuck with 1.0 because of editing the browser file?

fnkmaster · Post by **fnkmaster** » November 14th, 2004, 12:38 am

Well you should be able to do the same thing with the new browser.jar file in the next major release. Don't worry, 1.0 will be here for quite a few months.

If you wanted to do this the clean way (which would be more upgrade proof, though not infallible), you could put it in an extension, a "Findbar on Top" extension. Packaging an extension to do this would require a bit of work, but wouldn't be terribly hard. I don't know if it's really worth it when it just takes a few minutes to edit the one XUL file in browser.jar, unless there was more demand for this from more people.

Post by **James** » November 14th, 2004, 1:52 am

I managed to get the code so far to work quite nicely on the Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.7.5) Gecko/20041106 Firefox/1.0 branch nightly that I tested(sacrificed) on.

The Firefox theme is "Longone" by lynchknot found at www.lynchknot.com (with a userChrome.css mod for HD-carbonfiber look). There is now "Longfiber" on site.

Edit: The windows browser.jar from above does work on linux, but I get Options instead of Preferences and other things like Copy Image.