I want to create extension that replaces the blank page with my content
(static links plus data via ajax/iframe requests)
How should I start, where I can found usefull documentation? How can I
separate tab state when tab is blank or when tab is showing some website.
Is such code enough for minimal example
<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" id="speeddialOverlay">
<window id="main-window">
<vbox id="speeddial-multikey-wrapper">
<iframe src="http://www.somesite.com"></iframe>
</vbox>
</window>
</overlay>
Related
I am trying my hand at developing Firefox addons. I have developed the basic javascript code for the extension. Now I want a menu item in the Tools Menu and a toolbar button. I can't get these two elements to appear, however(The button should appear in the Customize menu, IMO, and the menu item in the Tools Menu). What am I doing wrong?
Here is the chrome.manifest file:
content droptunesshuffle chrome/content/
content droptunesshuffle chrome/content/ contentaccessible=yes
overlay chrome://browser/content/browser.xul chrome://droptunesshuffle/content/browser.xul
locale droptunesshuffle en-US locale/en-US/
skin droptunesshuffle classic/1.0 skin/
style chrome://global/content/customizeToolbar.xul chrome://droptunesshuffle/skin/skin.css
Here is the browser.xul overlay file:
<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="chrome://global/skin/" ?>
<?xml-stylesheet href="chrome://droptunesshuffle/skin/skin.css" type="text/css"?>
<!DOCTYPE overlay SYSTEM "chrome://droptunesshuffle/locale/en-US/translations.dtd">
<overlay id="sample" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/x-javascript src="chrome://droptunesshuffle/content/shuffle.js" />
<menupopup id="menu_ToolsPopup">
<menuitem label="Droptunes Shuffle "key="link-target-finder-run-key" oncommand="droptunesshuffle.run()"/>
</menupopup>
<keyset>
<key id="droptunes-shuffle-run-key" modifiers="shift" key="S" oncommand="droptunesshuffle.run()"/>
</keyset>
<toolbarpalette id="BrowserToolbarPalette">
<toolbarbutton id="droptunes-shuffle-toolbar-button" class=”toolbarbutton-1 chromeclass-toolbar-additional” image="chrome://droptunesshuffle/skin/icon.png" label="Droptunes Shuffle" tooltiptext="&droptunesshuffle;" oncommand="droptunesshuffle.run()"/>
</toolbarpalette>
</overlay>
The skin.css file:
#droptunes-shuffle-toolbar-button{
list-style-image: url("chrome://droptunesshuffle/skin/icon.png");
}
This is a bootstrap addon. Run the code and it will add a context menu to all windows.
https://gist.github.com/Noitidart/8776519
Now just change adding context menu to add to the menu item context that already exists.
In my gist here, change the context menu id to 'menu_ToolsPopup' this will add the menu item to the tools menu.
To add a toolbar button do the same thing to create a menuitem but now create a 'toolbarbutton' element and append it to id 'nav-bar'.
I am trying to develop a firefox extension that adds a panel allowing the user to interact with the DOM of any webpage. I'd like to reuse web components that I've already built. The web components are built using libraries like jquery, angular, d3, and a bunch of others, most of which don't play nice with XUL. To deal with that, I'm including a browser element that contains a web page with my components.
<overlay id="testOverlay"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<hbox id="browser">
<splitter></splitter>
<vbox flex="1">
<browser
src="chrome://testApp/content/index.html"
type="content"
flex="1"/>
</vbox>
</hbox>
</overlay>
This works, and shows my index.html in a panel to the side as expected. However, I cannot figure out how to debug any scripts that are included on the index.html page. The documentation for debugging extensions seems very sparse.
So the question I have is: how can I point the firefox debugger at the browser element in the pane that I've created.
Follow the instructions here for enabling the browser (as opposed to content) debugger: https://developer.mozilla.org/en-US/docs/Debugging_JavaScript#JavaScript_Debugger
Once your scripts are loaded in the browser, they should become visible in the debugger's sources pane (but not before that).
If you still can't get that to work, I would love a test case and detailed steps to reproduce, so I could try and diagnose the problem :)
I have created a XUL dialog, whenever i open this dialog it opens with Firefox navigation bar. Is it possible to open the XUL applications without firefox navigation bar? Screenshot is attached. Iam using Javascript's window.open command. i.e
window.open("http://localhost/test.xul", "test", "chrome, width=130,height=60, menubar=no");
Here is the XUL code
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
<dialog id="donothing" title="Dialog example"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
buttons="accept,cancel"
buttonlabelcancel="Cancel"
buttonlabelaccept="Save"
ondialogaccept="return doOK();"
ondialogcancel="return doCancel();">
<dialogheader title="Options" description="My preferences"/>
<groupbox>
<caption label="Colour"/>
<radiogroup>
<radio label="Red"/>
<radio label="Green" selected="true"/>
<radio label="Blue"/>
</radiogroup>
<label value="Nickname"/>
<textbox/>
</groupbox>
</dialog>
Try adding "location=no" to the window.open:
window.open("http://localhost/test.xul", "test", "chrome, width=130,height=60, menubar=no, location=no");
See window.open for reference.
i'm trying to make an own firefox toolbar and I have problem with overlay.
So i already setup my environment (i can see my extension in FF extensions manager), now I'm trying to add new overlay.
chrome.manifest
content sandbox chrome/content/
overlay chrome://browser/content/browser.xul chrome://sandbox/content/overlay.xul
overlay.xul
<?xml version="1.0"?>
<overlay
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<toolbox id="browser-toolbox">
<toolbar id="findfile_toolbar">
<label control="findfile_filename" value="Search for files named:"/>
<textbox id="findfile_filename"/>
<label control="findfile_dir" value="Directory:"/>
<textbox id="findfile_dir"/>
<button label="Browse..."/>
</toolbar>
</toolbox>
</overlay>
When i restart my FF i don't see result, where is the problem?
I think the problem might be that your toolbox element ID is "browser-toolbox" not navigator-toolbox. In Firefox, if you want to add a toolbar to the UI, you need to use "navigator-toolbox" as the toolbox ID.
You can read more about toolbar development at the Born Geek toolbar tutorial.
I am trying to update a custom firefox extension that I created for some tasks at work. Basically it is a sidebar that pulls up one of our webpages in an iframe for various purposes. When moving to Firefox 3 the iframe won't appear at all.
Below is an example of the XUL files that contains extension specific code including iframe, currently with just an attempt to load google but it it won't work with anything. I can't find any mention online of changes in FF3 that would cause this. Any suggestions would be appreciated.
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://customsidebar/skin/customsidebar.css" type="text/css"?>
<overlay id="customsidebar-Main" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/x-javascript" src="chrome://customsidebar/content/customsidebar.js"/>
<vbox flex="1">
<toolbar>
<vbox>
<hbox id="customsidebar_TopToolbarRow">
<toolbarbutton label="Refresh" id="customsidebar_Refresh" oncommand="customsidebar_Refresh()" />
</hbox>
<hbox>
<label control="customsidebar_StatusBox" value="Log"/>
<textbox id="customsidebar_StatusBox" multiline="true" rows="1" wrap="off" />
</hbox>
</vbox>
</toolbar>
<iframe id="customsidebar_Iframe" src="http://www.google.com" />
</vbox>
</overlay>
Here is the overlay XUL file
<?xml version="1.0"?>
<overlay id="CustomSidebar-Overlay"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<menupopup id="viewSidebarMenu">
<menuitem observes="viewCustomSidebar" />
</menupopup>
<broadcasterset id="mainBroadcasterSet">
<broadcaster id="viewCustomSidebar"
autoCheck="false"
label="CustomSidebar"
type="checkbox" group="sidebar"
sidebarurl="chrome://customersidebar/content/customersidebarMain.xul"
sidebartitle="CustomSidebar"
oncommand="toggleSidebar('viewCustomSidebar');"/>
</broadcasterset>
</overlay>
Set flex="1" on the iframe
The XUL code for sidebar is not an overlay, it's a document loaded inside an iframe (look at the Firefox main window in the DOM inspector). So the root element should be <page>, not <overlay>. This, combined with the flex="1", should make the page display.
You usually want to put type="content" or type="content-primary" on the iframe. Definitely so if you load untrusted pages in it.
I would try setting flex="1" on the iframe. If that's not working, perhaps try it with the browser element instead of iframe.