CODEWITHSUNDEEP
javascriptfirefoxfirefox-addonfirefox-addon-sdk
Koen
Koen

Reputation: 422

Get content of some file in Firefox SDK main.js

So I'm developing a Firefox addon that adds a bit of HTML to the DOM of any webpage.

The idea here is that I'm using a file called template.html as a template, that is located in the data folder inside the addon folder. Next, I would like to use the contents of that template.html file inside a variable, so that I can append it to the DOM.

myAddon/data/template.html:

<div>{{test}}</div>

myAddon/lib/main.js:

var template = ... // This is where I want to fetch the contents of template.html.

pageMod.PageMod({
    include: "*", // Apply script at any page
    contentScriptFile: [data.url("jquery-1.11.2.min.js"), data.url("main.js")], // Include jQuery and myAddon/data/main.js
    onAttach: function(worker){ // when these files are attached, send the content of the html-file to the script.
        worker.port.emit("sendTemplate", template);
    }
});

myAddon/data/main.js

self.port.on("sendTemplate", function(template){
    // var template should be <div>{{test}}</div>
}

I've found "Panel" in the SDK, but I do not want to show the HTML-file as a panel.

Secondly, I've tried to just send the resource URL of template.html and then to $.get(templateURL) in myAddon/data/main.js, but that did not work because Firefox does not allow a resource://-file to be $.get()'d.

How can I make sure that the content of an HTML-file that is saved into the addon's data folder is fetched as a string and put into a variable?

Upvotes: 4

Views: 204

Answers (1)

erikvold
erikvold

Reputation: 16508

myAddon/lib/main.js:

var template = require("sdk/self").data.load("template.html"); // This is where I want to fetch the contents of template.html.

pageMod.PageMod({
    include: "*", // Apply script at any page
    contentScriptFile: [data.url("jquery-1.11.2.min.js"), data.url("main.js")], // Include jQuery and myAddon/data/main.js
    contentScriptOptions: {
      template: template
    }
});

myAddon/data/main.js

var template = self.options.template;

Upvotes: 5

Related Questions