Developing an extension in Firefox and seems my mistakes are stemming from the fact that I don't understand the differences between what the below mean.
Would be great if someone could point, when exactly to use them.
Can someone who has worked with Firefox explain it please. I've added what I understand and they might very well be completely incorrect -
window
document = XUL elements + ( Web page of the current open tab)
document.content
content.document = The content of the web page of the tab open. Does not include the xul elements.
top.window.content
I'll collect the the correct explanation for the answers and put them in the question as an edit.
In an extension, document is the XUL document for the browser's UI. window is the window for that document (the object used as the script global for the chrome JS, etc). content.document is the document object for the web page in the currently selected tab. content is the window object for the web page in the currently selected tab.
Related
Is there a way to keep Firebug on a single page, so that when I switch pages it remains on the page I want it set to?
For example, I'm working on a project and I get an error that I want to search for on Stack Overflow, but when I navigate here, the console changes to reflect this site. I'd like to stop that from happening.
There is no option to "pin" a page's data in Firebug (as of version 2.x). As far as I know this also doesn't work in any of the browser built-in dev tools.
Though the simple solution for your problem is to open the other page in a separate tab or window. Doing so keeps all the data of the page saved when you switch back to the tab containing your project's page.
Note that Firebug's activation model is based on URLs following the same origin policy. I.e. if you open it for your project's page, it will always get opened for your projects page, even on other tabs, but not for any other site.
I've found it useful to split the tab of interest off into a new window and to activate Firebug on that window. That way I can continue using my original tab collection/window without it changing as I link-hop.
is it possible to open a xul page (chrome://myext/content/page.xul) with a blank address page?
I want to have a xul page in a new tab to collect some information to my extension, but i wanted to hide the chrome address.
in chrome, some extension pages are shown without an address, like follows:
Evernote Clearly:
Contextinator:
Is it possible on firefox to open the chrome://myext/content/page.xul without showing this address on the address bar?
In firefox, this is usually done by hiding browser chrome.
If you're using addon-sdk, this can be accomplished by including the addon-page like so:
require("sdk/addon-page");
When not using addon-sdk (ie, XUL based extension), then you might need to look into hideChromeForLocation() and inContentWhitelist members of XULBrowser. Hiding browser chrome is explained here and the source code for the members can be found in browser.js: hideChromeForLocation, inContentWhitelist.
Note: XULBrowserWindow itself is a property of window.
var {XULBrowserWindow}=window;
An example of a location with hidden chrome is the Addon Manager (about:addons), which hides the navigation bar when viewing that particular location.
The Situation
I need to automate the copying of a HTML link to the current page that
is viewed in the current Firefox Tab into other WYSIWYG editors. This
is not the same as copying just the plain-text of the URL, nor is it
the same as pasting just the plain-text of the web pages title. This
is also not the same thing as navigating to some other web page that
has the HTML link to the page of interest, selecting the text with the
mouse cursor, and typing CTRL-C to copy it into the current operating
systems clipboard (both Linux and Windows, should not make any
difference). Only the update to the clipboard is to be automated; the
pasting from the clipboard into the target application will be done
manually.
The desired use case is as follows:
The user browses to any web page from within Firefox.
The user types some user-specified key sequence that is not
in conflict with standard Firefox built-in key bindings.
Firefox will then do only part of what Copy Link Bookmarklet
does: Instead of opening up a new separate window/tab and
constructing and rendering the HTML for the link, and then
requiring the user to waste motion in selecting and copying the
link into the clipboard, the extension will then format the HTML
itself and copy that into the clipboard directly.
The user then selects any of the targets described below and
types CTRL-V to paste the formatted text.
The user then sees the link as a link in that target area, and does
not see anything literal like http://...
For example, if the webpage browsed to was http://www.google.com, and
the user clicked the user-defined key sequence, and if the user pasted
it into some Google Document, what they would see in that document is
not http://www.google.com nor would they see Google, but instead
would see what you would see when you read this in StackOverflow in a
web browser: Google
Now, there are Firefox extensions and bookmarklets that come close,
but they all involve no net reduction in mouse motion and/or key press
overhead, which is the most time-wasting aspect of this frequently
occuring use case. My searches for an existing extension turned
up nothing that exactly meets my needs (see Research section
below). Therefore, I think I may need to roll my own extension (or
modify an existing one), unless someone can point me to an existing
extension that provides this functionality.
The extension I have in mind should work in Firefox version 11 or
greater running on either Linux or any version of Windows. Only
Firefox and a suitable Firefox extension should be needed, and not any
other special software.
Targets of the paste should be:
GMail compose text areas
Google Documents
Microsoft Word documents
Microsoft Outlook compose text areas.
Any other WYSIWYG editor such as the Blogger post editor.
Notepad (in which case it is the web page title that is pasted only
and not the URL, or both the web page title and URL as separate
plaintext; either way).
About user-specified key bindings: If there was an extension already
that did the above but without providing the ability to bind a
keybinding to it, then I would expect to be able to use the keyconfig
extension extension to handle that aspect. Actually, that might
even be preferable; I don't know yet.
Research
Below are approaches I investigated that came close to what I want,
but did not exactly meet the need:
Hacking on Copy Link Bookmarklet won't work because, from what I can tell, there is no way to update the OS's clipboard from a bookmarklet, hence why I think that a Firefox extension is required.
In a Firefox extension, how can I copy rich text / links to the clipboard?
3 FireFox Addons to Easier Copy Links and Anchor Texts -- None of the extensions listed do what I want because they force you to use the right mouse button and navigate down one or two levels of context menu, which is wasted motion.
Copy Link Text (CoLT) -- CoLT also supports copying a hyperlink and it’s associated text as a rich-text formatted link, however it does not include a default keybinding. It looks like someone else is attempting to tie keyconfig to CoLT, which might be an option as a solution.
Copy URL Plus -- Looks like it has the copy-to-clipboard logic, but doesn't look like it has been maintained since Firefox 1.x timeframe.
I am answering my own question:
The CTRL-SHIFT-F11 binding will silently stop working if both keysnail and keyconfig are installed into the same Firefox browser. The fix for me was to simply uninstall keysnail as I don't use it.
I did not actually need to write my own Firefox extension, but I did
need to scrape out a bit of code that copies the richtext link from
the Copy Link Text (CoLT) extension and apply it directly as a
binding into the keyconfig extension as follows:
Install the keyconfig extension.
Restart Firefox.
After Firefox loads up, type CTRL-SHIFT-F12 to bring up the keyconfig configuration menu.
On the bottom of the page, click on the Add a new key button.
In the Name field, type in some suitable name such as Copy Rich Text Link to Current Page.
Type in the following chunk of Javascript code (This code I carved
out of the objCoLT.CopyBoth function inside the content/colt.js
file inside the Copy Link Text (CoLT) extension):
var url = content.document.location.href;
var text = content.document.title;
// Use the users selection instead of the title if text is selected:
var selection = document.commandDispatcher.focusedWindow.getSelection().toString();
if (selection != "")
{
text = selection;
}
var richText = "" + text + "";
var xfer = Components.classes["#mozilla.org/widget/transferable;1"].createInstance(Components.interfaces.nsITransferable);
xfer.addDataFlavor("text/html");
var htmlString = Components.classes["#mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
htmlString.data = richText;
xfer.setTransferData("text/html", htmlString, richText.length * 2);
var clipboard = Components.classes["#mozilla.org/widget/clipboard;1"].getService(Components.interfaces.nsIClipboard);
clipboard.setData(xfer, null, Components.interfaces.nsIClipboard.kGlobalClipboard);
Click Ok.
Back in the main Keyconfig dialog, <disabled> should be shown in the text field to the left of the Apply button.
Click in that text field, and type the keybinding you want to associate with it, such as CTRL-SHIFT-F11.
Click the Apply button.
Click the Close button to close the Keyconfig configuration dialog box.
To test this out, proceed as follows:
In Firefox, navigate to some arbitrary page.
Type in CTRL-SHIFT-F11 (or whatever keybinding you chose above).
Notice that no dialog boxes popup; that is intentional.
Open up Google Documents, and Create a new document.
Click in the new document, and type CTRL-V.
You should see the HTML/rich-text form of the link pasted in.
Click on the link and then click on the URL to the left of Change.
The browser should open up the original page corresponding to that URL.
I have been able to copy URL as HTML with the following bookmark:
javascript: navigator.clipboard.write([new ClipboardItem({ ["text/html"]: new Blob([`${document.title}`], { type: "text/html" }) })]);
Unfortunately in firefox the Clipboard write API still requires to set thedom.events.asyncClipboard.clipboardItem to true in about:config.
Several extensions exist that offer copying of title and URL but few seem to support Rich Text creation. The key is that the copied text needs to be formatted in html with a href and it needs to be copied as a text/html type.
The extension I went with in the end is CopyTabTitleUrl. (GitHub) It supports both requirements and also has a keybind feature along with a toolbar button that can also function as a single-click copy.
Set the Format option to:
${title}
Then Activate Extended Mode and make sure to check the "Copy in text/html format" option in Other. After that, using the format copy, the result can be correctly pasted into Office applications. And Stack Exchange evidently as the links above were created by the add-on.
Note that the Edge implementation of URL copying seems to be somewhat different still. With a default plaintext paste, Edge will just paste in the URL while this approach will of course paste unformatted HTML. But it's close enough.
I'm working on a site in Joomla! and on the homepage, at the top of the article, it comes up with a h1 of the website name. The pagesource says (Note it's not the article title.)
Any idea how to get rid of it?
Thanks,
Steph
You can set this h1 tag not to display via the Parameters - System section of your Menu Item Manager screen in administrator ... this page has a nice depiction of the steps.
It's so simple
Just do the following :
Login to the Joomla Administrator Interface
Go to the Menu Manager
Select your Menu
Select your Menu Item (Home Menu)
On the right hand, Click Parameters (System)—> and in the *Show Page Title—->*Just Select No.
That's all.
This is not the desired solution, since many people, (including myself) actually need to be able to Set/Override the page title (That Appears in the Browser’s Title bar), and setting Page Title to no here will also remove the functionality to Configure the Browser title (which is important for SEO among other things).
Anyway, I have searched and not been able to find a fully correct solution via CMS or PHP Code. The closest solution which is not fully perfect, but unlikely to cause significant (if any) negative effect on your site is through Javascript (Example is JQuery).
jQuery(document).ready( function($) {
$(‘.componentheading’).empty();
});
This can also be done is JS with no JQuery. When I find a better method of doing this I’ll let you know.This should actually be done by removing output from a template file.I don’t know which one yet. When I do, I’ll post it…
When setting the page title not to show in the menu item as stated in other answers, this will not stop the text entered in the page title box being used as the browser title, it will just stop it being shown in the page.
Using javascript to remove it is not a good idea.
1. It will only work for browsers with javascript enabled
2. Search engine spiders will still see it. As the component heading for articles is 'articles' by default it will see all your pages with the same h1 tag.
Just turn it off in the menu item and enter your browser title in the text box above.
I am creating a Firefox extension that is somewhat similar to Firebug. There is a panel (or vbox) at the bottom of the browser that allows users to specify colors to certain Html elements. When they click the OK button, I would like these colors to get updated on the current web page.
I have my JavaScript working when I click the button (i am just throwing an alert), however when I change that JavaScript to change the css or styles of an element (by either using document.getElementById or jquery), nothing changes.
Is there something with Firefox extensions that I am missing? Any help is appreciated.
Let me know if you have any questions. Thanks
https://developer.mozilla.org/en/Extension_Frequently_Asked_Questions#Accessing_the_document_of_a_webpage_doesn%27t_work
You want content.document.getElementById() and similarly for every other construct you use.