Upload the contents of some file to the Firefox SDK main.js

Question

So, I am developing a Firefox addon that adds some HTML to the DOM on any web page.

The idea here is that I use a file with a name template.htmlas a template, which is located in a folder datainside the addon folder. Then I would like to use the contents of this file template.htmlinside the variable so that I can add it to the DOM.

myAddon / data / template.html:

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

myAddon / Library / 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 found the "Panel" in the SDK, but I do not want to display the HTML file as a panel.

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

, HTML , , ?

Answer 1

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//main.js

var template = self.options.template;