CrossRider: What library method scope can be used in a popup?

StackOverflow https://stackoverflow.com/questions/20632273

  •  18-09-2022
  •  | 
  •  

Question

I have saved data in the appAPI.db.async database. And now I want to display it in the popup page. Here's what I have in the popup page:

function crossriderMain($) {
    var db_keys = appAPI.db.async.getKeys();
    db_keys.forEach(
        function(key)
        {
            $("ul#id").append("<li>" + appAPI.db.async.get(key).url + "</li>");
        });
}

</script>

</head>
<body>

<ul id="history">History</ul>

</body>
</html>

which doesn't give the intended result. What I want to know is what's available for me when inside a popup page?.

Also, as an aside question: how do I open a browser tab from an HTML page in my resources directory, instead of a popup that won't take the whole screen space, in the browserAction.onClick handler?

Something like that in background.js:

appAPI.browserAction.onClick(
        function()
        {
            appAPI.tabs.create("/Resources/templates/history.html");
        }
    );

Thanks (:->)

Was it helpful?

Solution

Answer to question 1

appAPI.db.async is asynchronous by design and hence you must use a callback to receive and use the values from the database. Additionally, it is not necessary to get the keys first and then their associated data; you can simply achieve your goal in one step using appAPI.db.async.getList.

Hence, using your example the code should be:

function crossriderMain($) {
  appAPI.db.async.getList(function(arrayOfItems) {
    for (var i=0; i<arrayOfItems.length; i++) {
      $("ul#id").append("<li>" + arrayOfItems[i].value + "</li>");
    }
  });
}

Answer to question 2

To create a new tab that opens a resource page, use the appAPI.openURL method.

Hence, using your example the code should be:

appAPI.ready(function($) {
  // When using a button, first set the icon!
  appAPI.browserAction.setResourceIcon('images/icon.png');
  appAPI.browserAction.onClick(function() {
    appAPI.openURL({
      resourcePath: "templates/history.html",
      where: "tab",
    });
  });
});

[Disclaimer: I am a Crossrider employee]

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top