'Function is not defined' when trying to call a function inside a contentScript

Question

Addon code, creates a Panel.
onShow(), a list of files are read from local filesystem and populated into Panel.
When <img> next to a filename is clicked, I'm trying to call Namespace.load(), to send a message to my addon code, but i get Namespace is not defined.

Any ideas why?

Data.js

var data = require("sdk/self").data;
exports.get = function(content) {
    return data.url(content);
};

main.js

var Data = require("./Data");
var panel = Panel.Panel({
  width: 450,
  height: 300,
  contentURL: Data.get("html/view.html"),
  contentScriptFile: Data.get("js/controller.js"),
});

Error ..

JavaScript error: resource://jid1-xqhae0e9m07ekq-at-jetpack/addon-firefox/data/html/view.html, line 1: Namespace is not defined

controller.js (contentScript) ..

var Namespace = {
  load: function(filename) {
    self.port.emit("load", filename);
  }
};

self.port.on("uiData", function (uiData) {
  var parsed = JSON.parse(uiData),
    content = '';

  for (var i = 0; i < parsed.files.length; i++) {

    content = '<tr>';
    content += '<td>' + parsed.files[i] + '</td>';
    content += '<td><img onclick="Namespace.load(' + parsed.files[i] + ');" src="../images/load-24.png"></img>';
    content += '</td></tr>';

    document.getElementById('resultFiles').innerHTML += content;
  }

  document.getElementById("directory").value = parsed.directory;
});

Answer 1

Used Components.utils.exportFunction since there were changes to execute environment in FF30 for content scripts, described here.

var Namespace = {
  load: function(filename) {
    self.port.emit("load", filename);
  }
};

exportFunction(Namespace.load, unsafeWindow, {defineAs: "load"});

self.port.on("uiData", function (uiData) {
  var parsed = JSON.parse(uiData),
    content = '';

  for (var i = 0; i < parsed.files.length; i++) {

    content = '<tr>';
    content += '<td>' + parsed.files[i] + '</td>';
    content += '<td><img onclick="window.load(\'' + parsed.files[i] + '\');" src="../images/load-24.png"></img>';
    content += '</td></tr>';

    document.getElementById('resultFiles').innerHTML += content;
  }

  document.getElementById("directory").value = parsed.directory;
});