Calling toggleSidebar in Firefox's browser.js - firefox-addon

I've seen numerous references to browser.js while trying to create a Firefox sidebar. I don't have a good understanding of what this file is though. It has a method toggleSidebar in it. Can I call that method from a web page? Can I call it from a browser extension? Do I need to include browser.js in my extension somehow first? Can I call it from the add-on SDK or is it only available from the old style XUL extensions?

I don't have a good understanding of what this file is though.
It is the code driving the Firefox browser window, lots of code actually.
Can I call that method from a web page?
No. You can use window.sidebar.addPanel() to add a sidebar however.
Can I call it from a browser extension?
Yes.
Do I need to include browser.js in my extension somehow first?
No, it is already included in the browser window.
Can I call it from the add-on SDK or is it only available from the old style XUL extensions?
You can use it from the Add-on SDK as well but you will need to access the browser window directly - either via one of the low-level modules or chrome authority.

Related

New Google one-tap sign-up from extensions

It looks like calling the googleyolo javascript object doesn't work with chrome extensions, probably because it's using an iframe with redirect under the hood, that extensions do not like.
Am I right in thinking chrome extensions are not supported? If yes, does anyone know if there is a plan to support them?
That’s correct. Currently the API expects the calling page to not run inside an extension. We may change this in the future. However you can accomplish what you want to do via a chrome tab launch to a well known page which the extension can inject content scripts into, and notify via chrome cross tab messaging after sign in.

Creating a chrome:// page for my Firefox add-on

I am building a simple Firefox add-on using the Add-on SDK, and I need it to display some information when first ran.
I don't want to rely on an external URL for this, so I figured that my best option is to use the chrome:// scheme.
I have two questions
How to create said page?
Is it possible to pass a value to it (something along the lines of welcome.html?key=abc)?
You need to register a content or resource url scheme in chrome.manifest. You will be able to use window.location object there as usual.

Combine JQM, MVC and PhoneGap together

I have a site which uses microsoft mvc 3 on the server side, jQuery Mobile on the client side and I want to combine it with PhoneGap and produce executes for Android and iOS.
Is it possible?
How?
Thanks
Yes, it is possible.
If you must use Phonegap, there are a couple of things to do:
First, you must create a project corresponding to each platform , following these instructions. Once you do that, you basically copy all the client side code (js, html, css) to the www folder of your project. This is one of the reasons, the app could load faster, since it's reading its resources from the local filesystem, and not receiving them from an http connection each time.
Second, you must find a way to provide your server side data to your app. If you are already using REST services or RPC methods to populate your website, then that's done, but if not, you must start by building them, and then calling them from your client (through ajax calls from jQUery most likely), and then rendering them through javascript (you can use the multiple templating libraries out there or just plain javascript, I recommend the latter only if the UI updates are minimal).
As you can see, the second part requires quite a little bit more work. Especially if you haven't built web services before.
The other option ,which does not require phonega/cordova is to use an embedded webview. Then you wouldn't have to do anything. It would work similarly to a browser (Loading the remote URL of your site), with the added advantage of being inside and android/ios app, and you could add other views or communicate with the embedded webview using native code. If you are planning to load html files from the filesystem and not from your server, you would have to do the same thing you have to do with phonegap.
It happened to me, if you have a web app depending on server code I would go with a WebView based app, and not a Cordova app.
It's really simple to create those webviews apps for Android or IPhone.
Here you have an example for building a webview based app on android
Here you have an example for building a webview based app on IOS
Hope it helps.
If you want to reuse your site you'll need a webview that browses it.
Phonegap wouldn't be needed if you use this approach, but the application will not be as responsive as a native app, and the IPhone moderators may reject your app for that reason (it happened to me).
Another approach would be that you recreate your site as a pure Javascript application and only communicate with your servers to execute some REST Services. In this case Apache Cordova makes sense.

What is the Firefox/Javascript chrome module - documentation?

Every time i Google i get the Chrome browser - grr! But I'm trying to understand this:
use another mechanism via the chrome module. See OS.File and/or the MDN File I/O snippets.
Where can i find documentation for this Firefox+Javascript module?
How to Append to a file in a Firefox add-on?
Updated my answer in that other question. I was talking about the SDK chrome module, which is just a way to access Components and with that the XPCOM services and components, so basically what every "old school" XUL add-on gets.

Do firefox addons have something similar to "background page" concept?

I worked with Chrome extensions which have so called background page - an html page that is loaded in background once per browser window. You can store there some javascript variables, can access extension's own localstorage, can communicate back and force with content scripts (scripts injected to pages).
Is there anything similar in Firefox and how do I use it for the tasks listed above?
If you are using the (relatively) new Add-On SDK, then the main javascript file residing in your lib directory is equivalent of a Chrome extension's background page - a persistent script that runs in the background and spawns/creates/inserts panels, widgets and content scripts.
Regarding your specific asks:
1. localStorage: Add-Ons in Firefox cannot access localStorage directly. However, you can use simple-storage for storing data similar to localStorage.
2. Communication with content-script: Add-ons can communicate with content scripts using port or postMessage.
From the point of view of a traditional Firefox extension, the browser itself is just another window containing a document, although this is a XUL document rather than an HTML document. So you can store per-window variables, although you have to be careful not to overwrite other extension variables, which usually means declaring a top-level object and adding all your variables as properties of that object.
Sharing variables between windows used to be a little harder but fortunately JavaScript modules solve that problem in simple cases (primitive types).
Extensions can communicate with content scripts although there are some wrappers in place to prevent you from accidentally doing something silly.

Resources