What is the syntax for calling functions defined using WinJS.UI.Pages.define from the associated html?

Question

Since there is a distinct possibility that I'm doing something wrong, I'd like to describe what I'm attempting to accomplish, in case there is a better way of doing it.

Platform: Windows 8 app using Navigation Template for HTML5/WinJS.

I have a few PageControls that query for data and use d3.js to visualize the resultsets.

I have another PageControl(dashboard) that uses a WinJS.UI.ListView to provide links to those pages/graphs. Currently, I'm using some static images in the ListView. What I'm trying to do is access the graph pages and present a "smaller" version of the graph on the selection screen.

Some of the things I've tried: - iFrames do not appear to scroll (and the results look pretty ugly). - I haven't been able to figure out how to do a screen shot programatically (this would be the best option, because I could then use the same technique when sharing the graph using the sharing contract). - I've tried doing a Page.render, but it only seems to work if I have the call to my draw() function somewhere within the html page. In other words, it doesn't appear the the ready() function is being called as part of render. So, I've moved the drawing code into the html (which I really do not like), and that seems to work OK. What I'd like to do is to move the draw function back to the Page.define and call it from a one line script in the html (unless there is a better way), but I haven't been able to get the correct syntax figured out.

I'd appreciate any pointers on the syntax or advice on better ways to accomplish the task in general.

bmceldowney bmceldowney · Accepted Answer · 2013-04-16T20:43:29

I would suggest just putting the drawing code in a separate .js file that you can reference from anywhere in your app. Set it up like the following:

WinJS.Namespace.define('My.App.Namespace', {
    drawingFunction: function () {
        //code goes here
    }
});

Save that to a file called drawing.js and include it in your default.html. Then you can call My.App.Namespace.drawingFunction() from either html or javascript.

What is the syntax for calling functions defined using WinJS.UI.Pages.define from the associated html?

1 Answers