Postion toolbarbutton in nav-bar with mozilla SDK - firefox

I recently use the SDK of mozilla to developp an add-on. But when I tested it, I found that the add-on icon is in the add-on bar.
I wanna to move it on the nav-bar at the installation. How can I do that ?

If you use this toolbarbutton module then you can move the button by setting the toolbarID.
I don't think it's possible to move a widget at the moment.

To resolve the problem. I use a part of the code in toolbarbutton.
You just need replace in toolbarbutton.js the line 73
($("navigator-toolbox") || $("mail-toolbox")).palette.appendChild(tbb);
by this code window.document.getElementById('nav-bar').appendChild(tbb).
Now the toolbarbutton is placed on the right of the nav-bar.
Here you can find the code example used.

Related

Creating custom builds of Mozilla Firefox

I am trying to build my own version of Firefox with slight UI changes and by adding some addons(extensions) to the build.
I have downloaded the source code from repo. Where would I start to achieve this?
Which all codes hold the UI structuring? Where do I put my addon xpi files?
PS: I tried to read the Mozilla documentation. Its either kinda outdated or I am not really getting it? A detailed insight would be much appreciated.
Addons
To do this, simply place the extensions in the distribution/extensions
directory in the application's distribution directory.
Here are the extension
https://dxr.mozilla.org/aviary101branch/source/browser/extensions
Flags In firefox
https://dxr.mozilla.org/aviary101branch/source/browser/config/mozconfig
Do more with themes
https://dxr.mozilla.org/aviary101branch/source/themes/modern
https://dxr.mozilla.org/aviary101branch/source/browser/themes
For Editing you may need XUL
https://www.xul.fr/tutorial/
Components
Go here and customize every component you need
https://dxr.mozilla.org/aviary101branch/source/browser/components

Firefox WebExtension options button not working

I'm updating an old extension, passing from the old XUL code to html/css "chrome" code.
I have an issue with the "options_ui" tag in my .json file... if i load the extension using the current firefox version (46.0.1) i can't see the "options" button of the extension (as shown in about:addons).
But if i load it using the current developer version (48.0a2) it shows and works as espected.
Any suggestion of how can i fix this?, there must be a way to show the options button without using XUL code.
This is the section of options_ui in my json file:
"options_ui": {
"page": "html/options.htm" },
I have the same problem, here's what I found https://blog.mozilla.org/addons/2016/04/29/webextensions-in-firefox-48/ .
Seems that Firefox WebExtensions will be fully functional from v.48, that's why the Options button is so far only visible in the developer version of Firefox.

How to create a ui button for SeaMonkey

I'm trying to get my extension (using Firefox Addon SDK 1.17) to work on SeaMonkey (2.30). After modifying install.rdf to allow my extension to be installed, I can see SeaMonkey accepted the extension. However -- my extension's button isn't visible anywhere in the UI. I am using sdk/ui/button/toggle. I have also tried require("sdk/ui").ActionButton but that doesn't seem to do anything either.
What do I need to do to make sure my extension can render a button into SeaMonkey's toolbar?
Looks like the answer is that SeaMonkey does not officially support the Addon SDK yet. Support is planned for SeaMonkey 2.33
There are a couple of options:
patch the sdk to allow support on seamonkey.
copy the button code from the sdk into your add-on, mark it as supporting seamonkey, and use that, possibly uploading the code to npm as a third party module.

Three.js Example code, from StackOverflow, not working

I copied and pasted the Three.js code given here into an HTML file and downloaded the three.js package from the website, and configured the <script> tag to point to the location of the file three.min.js.
Nonetheless, when I open the HTML file, it displays a blank white screen.
What am I missing?
well I tryed the exact same thing and I'm seeing the wireframe cube rotating on screen. A few things to try.
1) drop the three.min.js right in the root folder and copy/paste the example code again without any alterations.
2) did you get the three.min.js from the zip package under the build directory? Or did you navigate the git repo and copy/paste it? If copy/paste was used be sure to click the "Raw" button to get the code without the wrapper HTML.
3) try the latest Firefox or Chrome browsers first. If it works there but not in say Safari, there are a few steps you need to take to enable WebGL in Safari first.
4) your video card may be blacklisted due to driver incompatibilities.
If none of these help, then post up the code, where you got the Three.js package, what browser and video card your using and I'll see what else I can do to help :)
I had the same problem. Windows hides the file extensions by default. I change it in folder options and it worked.

Building restartless Firefox extension with Addon SDK

I am using the latest version from Firefox Addon SDK (https://github.com/mozilla/addon-sdk) to build my extension. Additionally I am using Erik Vold's toolbarbutton package (https://github.com/erikvold/toolbarbutton-jplib) to display the extension button in the top toolbar. When running cfx xpi and installing the extension it tells me everything went fine (no restart or whatsoever required) but the toolbar button only shows up when I am actually restarting the browser.
How can I make it really restartless?
Use the moveTo function to force insert the toolbar button on install. I believe it's a bug in the code but I haven't asked Erik about it.
Something like this will work:
var ToolbarButton = require('toolbarbutton').ToolbarButton;
var tbb = ToolbarButton(options);
tbb.moveTo(options);

Resources