I open my Firefox extension window in a browser's tab. Is it possible to set a favicon for that tab?
The code from the Mozilla site does not work correctly - it produces the following error message: "Warning: XUL box for box element contained an inline link child, forcing all its children to be wrapped in a block". If this code is placed between 'window' tags it messes up all other controls on the window. If it is placed between 'box' tags, window controls are rendered fine, but still there is this error message. The problem was solved by adding the display property and setting it to "none".
The working code looks like this:
<window xmlns="mozilla.org/keymaster/gatekeeper/there.is.only.xul";
xmlns:html="w3.org/1999/xhtml">
<!-- Icon from chrome -->
<html:link rel="icon" href="chrome://myExtension/content/path/to/favicon.png"
style="display:none"/>
Create this Folder structure inside the chrome folder
\icons\default
if your window id is mainwindow create a file named mainwindow.ico or mainwindow.xpm
You can easily create an icon for a XUL window. By creating files yourwindow.ico or yourwindow.xpm where yourwindow is the ID of your XUL window. And place the files in your directory structure like this : chrome/icons/default
This will override the global icon files.
More Information about XUL window and icon can be found here : https://developer.mozilla.org/en/XUL/window
Related
Firefox perpetually displays a blue dot notification for pages where the title constantly changes. This is particularly annoying for pages like TradingView or GDAX, where the title changes constantly with price updates. On the other-hand, this is extremely useful for pages like Gmail. So I don't want to disable it across the board - just for specific domains.
I would normally just go back to Chrome, but Firefox 57 is so much faster on my MacBook.
How do I disable dynamic page titles or the blue notification dot in Firefox for specific domains?
I solved it like this for Stack Overflow's website:
Open about:config in Firefox
Search for the toolkit.legacyUserProfileCustomizations.stylesheets and set it to true
Open your Firefox profile folder (under Settings → Help → More troubleshooting information → Profile folder → Open folder)
Create a new folder chrome and within this folder a new file userChrome.css
Open the new file and paste the following content into it:
#-moz-document url(chrome://browser/content/browser.xhtml) {
.tabbrowser-tab[label*="Stack Overflow"] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
background-image: none !important;
}
}
Restart Firefox
The CSS selector [label*="Stack Overflow"] needs to match the title of a browser tab partially. If you omit it, the blue dot will be disabled globally for all tabs.
Credits go to these sources:
https://www.userchrome.org/how-create-userchrome-css.html
https://support.mozilla.org/en-US/questions/1270061
https://support.mozilla.org/en-US/questions/1181537
Write an extension or userscript that prevents the title from being modified, e.g. by replacing the setters on the title element and its text content node with noops.
Note that you will have to access the untrusted page context to do so, since extensions run in a a separate context.
I'm using Firefox 44.0 for Windows, and would like to use a html file hosted on the file system as the page that appears on a new tab page - it contains links and other resources that's useful for my workflow.
I'm using the "New Tab Override" plugin for FF which essentially restores the browser.newtab.url option. I get my local html file showing when I create a new tab page.
However, the problem is that the path to the file appears in the url bar so that whenever I start typing a url in the url bar (from when I want to go to a known location in the new tab), it's appended to the filepath, instead of replacing it.
Is there another way I can show a local file as a new tab whilst leaving the urlbar blank so I can type urls in when desired?
No sooner than I posted after thinking I'd set it up properly, by changing the newtab.url option from 'home page' to 'custom url' and then entering the path to the html file, the url is highlighted on a new tab open so typing a new url will overwrite the existing location. Sorted!
I've made a couple plugins for ckeditor and added icons for them. These icons show up when I embed the unbuilt code on a test page, but, when I build the editor, the minimized code thinks the icons at 'original/path/to/the/icon.png?t=D5AK' instead of 'original/path/to/the/icon.png'. This error does not occur when I copy an icon from another plugin in the src code. At the moment the only way I am adding the icon is through "icon: this.path + 'icons/icon.png'," in plugin.js. Is there somewhere I need to add a reference to the icon?
This is an intentional addition to resources' paths. It ensures that every two CKEditor releases have different paths to the same resource what disables cache. And this works perfectly unless you're trying to load CKEditor from local file system than from a web server.
I have written a NPAPI plugin that implements all the logic required and now I am writing an extension that is expected to use the functionality provided in the plugin. This architecture provides me an opportunity to write the same C++ code for both Mozilla Firefox and Google Chrome.
In Chrome I instantiate the object that is defined in the plugin by writing an <embed ...> construction to the separate document that is owned by my extension (it is provided automagically to my Chrome plugin). That just works. In C++ code I perform all the works required in the constructor of my plugin object.
I can't easily adapt my solution to use it in Firefox because the extension is not backed by any separate document and my extension doesn't have permissions to write to any of already rendered documents.
My main question in the most common form is how can I use the functionality provided by the plugin many times and passing an arguments list to my native function on user clicks the button or selects my entry in the drop-down menu (i.e. the method with arguments should be invoked after the specific event, not just at arbitrary time)?
"Supplementary" questions are:
How can I instantiate a plugin in Mozilla Firefox? Where can I get a document that will be "interpreted" by FF and such that the extension will be able to write to it?
I don't know how to do that myself, but here is an open source firefox extension that does it: https://github.com/kylehuff/webpg-firefox
Your Firefox extension needs to make use of a "browser overlay". There are many types of overlays, for various parts of the browser, and they are loaded (overlay'ed) within the specified document, as defined in the chrome.manifest file.
For example, the following applies an overlay to the "browser.xul" file (which is the main browser window)
overlay chrome://browser/content/browser.xul content/firefoxOverlay.xul
Now, within that overlay file you can load your plugin object and call the methods provided by the plugin.
Here is an example XUL file which does nothing more than load the NPAPI plugin of the content-type "application/x-example-plugin", and assign the plugin object to the variable "myPlugin"
<script type="text/javascript">
myPlugin = document.getElementById("myPlugin");
</script>
<?xml version="1.0" encoding="UTF-8"?>
<overlay id="myOverlay" xmlns:html="http://www.w3.org/1999/xhtml" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="text/javascript">
myPlugin = document.getElementById("myPlugin");
alert(myPlugin.someFunction());
</scrpit>
<window id="main-window">
<vbox collapsed="true">
<html:object id="myPlugin" type="application/x-example-plugin" height="1" width="1" style="visibility:hidden;"></html:object>
</vbox>
</window>
</overlay>
Some important things to note
The "xmlns:html=..." declaration is critical, because the plugin object is being loaded in an html:object, and that declaration tells the XUL parser how to render the object.
The id of the window ("main-window") is important, because that is how the XUL parser will overlay the item (within the "main" window)
The object id ("myPlugin", in this example) is how you will reference the plugin object in via the JavaScript later.
Because we are not showing content with our plugin, merely calling public methods provided by it, it is important to make the CSS visibility has "hidden", and the size to 1x1 pixels. Without doing this, you could end up with large blank spaces rendered in the browser UI. Additionally, it is important to use the CSS "visibility" property, not the "display" property. If you set the display property to "none", you will have issues with your plugin actually being initialized within the overlay.
In your extension install.rdf file, you must specify the "unpack" property as "true", i.e.: <em:unpack>true</em:unpack>
Once your overlay is loaded within the context of the browser XUL, and your plugin initialized within the main browser window, you can reference your plugin from within the scope of the main window by the variable you have assigned it to ("myPlugin" in this example).
I will not go into depth here on how to obtain the context of the main window (see the links below), but you once you have a reference you can invoke the exposed methods from within content scripts, sidebars, toolbars, etc.
Reference links -
XUL Overlays
Install manifests (chrome.manifest)
Working with windows in chrome code
Interaction between privileged and non-privileged pages
Source files for one of my Firefox extensions using an NPAPI plugin
The Preference Pane for my FireFox AddOn is an XUL document (XML User Interface Language). The file is called options.xul.
In browser.xul, I have created a toolbar with a button for Options. When the Options button is clicked, it should bring up the Preference Pane defined by the options.xul. But I do not know how to call the Preference Pane from oncommand.
Calling a Javascript function is straight forward. But how does one call the AddOn's Preference Pane? Below is an oncommand calling a javascript function but how does one call the Preferene Pane?
If someone could please post the alteration to the following in browser.xul:
<menupopup>
<menuitem label="Options" tooltiptext="Options" oncommand="example.LoadURL('http://www.google.com/')" />
</menupopup>
You can not open a pane as such. A preference pane is a part of a preference window. Your option.xul should look at least something like this
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<prefwindow xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<prefpane id="myOptions" label="My Options">
<preferences>
<preference id="pref-option1" name="myapp.myoption1" type="bool"/>
<preference id="pref-option2" name="myapp.myoption2" type="int"/>
</preferences>
<checkbox label="Option Checkbox" preference="pref-option1"/>
<textbox label="Duration:" preference="pref-option2"/>
</prefpane>
</prefwindow>
In the browser.xul your oncommand could open the preference window using :
oncommand = "window.openDialog('chrome://whatever_location/option.xul',' My Option Dialog','chrome,toolbar');"
(or whatever method in your javascript that you would like to do the openDialog)
Additional information about prefwindows and panes can be found on
https://developer.mozilla.org/en/XUL/prefwindow or
https://developer.mozilla.org/en/XUL/prefpane
I assume that by "Preference Pane" you actually mean the Option Dialog window for your add-on, not just a single <prefpane> within the <prefwindow>. I also assume that you have an options.xul which is fully functional for use as a options dialog using the normal option button from the add-on tab.
I found that somewhat different options than tazyDevel shows above were needed to have the options dialog open so that it appears as if it was opened from the add-ons tab. I am not sure if this is a difference from 2012 to 2014 (when I wrote the code below), or if it is just an implementation difference. If I recall correctly, when I wrote this, I checked to see how Firefox was launching the options dialog windows and copied the options that were being used there.
I use the following code to open the options dialog for one of my add-ons from a button in the add-on's main dialog window (in addition to having it available through the add-ons tab):
XUL (the button that opens the options dialog):
<button label="Options" id="optionsButtonId"
onclick="myExtension.optionsButton();"
tooltiptext="Open the options window."
hidden="false" />
JavaScript:
/**
* The Options button.
*/
optionsButton : function() {
window.openDialog('chrome://myExtension/content/options.xul', '',
'chrome,titlebar,toolbar,centerscreen,modal');
},
Depending on how your code is organized, you may need to manually apply some preferences and/or have preference observer(s) which propagate the changes to what needs to know about them.
myExtension is a placeholder for whatever you are using to call your extension. A single object variable containing functions is assumed, as is myExtension being what you use to identify your content in your chrome.manifest file.