My extension creates a Panel that displays the currently selected preferences for the extension.
I want to populate the Panel with a button, where clicking on it triggers a dialog allowing the user to choose a directory to save files in.
This functionality was possible with XUL based extensions, but it doesn't work with SDK based extensions as the window object is not accessible.
Is there a workaround for this issue?
In the extension code, I create the Panel using:
var confirmDialog = require("sdk/panel").Panel({
width: 250,
height: 250,
contentURL: data.url("confirmDialog.html"),
});
confirmDialog.port.on("selectDir", function () {
chromeManager.selectDir();
});
The content of confirmDialog.html specifies the Panel's content:
<div id="pathToFile"></div>
<button onclick="Panel.selectDir();">
</button>
The confirmDialog.js file sends a message to the extension code:
var Panel = {
selectDir: function() {
addon.port.emit("selectDir", '');
}
};
chromeManager.js is part of the extension code, so it has access to the SDK API.
exports.selectDir = function() {
var nsIFilePicker = Ci.nsIFilePicker,
fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
fp.init(window, nsIFilePicker.modeGetFolder);
var ret = fp.show();
if (ret == nsIFilePicker.returnOK || ret == nsIFilePicker.returnReplace) {
document.getElementById('pathToFile').value = fp.file.path;
}
}
However, when running this code, I encounter
ReferenceError: window is not definedwindow object accessible here or an alternative approach to achieve this functionality?