Adding Live tiles - Build Windows 8 Apps with HTML5 and JavaScript - page 331

// Combine together small and large templates
var node = xmlLarge.importNode(xmlSmall.getElementsByTagName("binding").
item(0), true);
xmlLarge.getElementsByTagName("visual").item(0).appendChild(node);
The net effect of this code is appending the small template to the large template. Now you're
ready to create the notification object from the template and register it with the system. You
therefore add the following code:
// Create the notification object
var tileNotification = new Windows.UI.Notifications.TileNotification(xmlLarge);
Windows.UI.Notifications
.TileUpdateManager.createTileUpdaterForApplication().
update(tileNotification);
In summary, you are now all set as far as the creation of the tiles is concerned. The remaining point
is connecting the application with the tiles.
Connecting tiles and application
The application's tiles are updated whenever the application hits some code that updates the
notification object. The frequency of these updates, and the content displayed, depend on the
application. As far as the TodoList application is concerned, the notification object is created upon
startup and updated every time a new task is edited, deleted, or created. This ensures that fresh data
is always displayed to the user as a reminder even when the application is not running.
Given the structure of the TodoList application, the best place to invoke the liveTilesManager.enable
function is from within the populateTaskList function that you find defined within todolist.js . You locate
the function and modify it, as shown below:
TodoList.populateTaskList = function () {
var promise = new WinJS.Promise(function (complete) {
var tasks = new Array();
var localFolder = Windows.Storage.ApplicationData.current.roamingFolder;
localFolder.getFilesAsync()
.then(function (files) {
var io = Windows.Storage.FileIO;
files.forEach(function (file) {
io.readTextAsync(file)
.then(function (json) {
var task = TodoList.deserializeTask(json);
tasks.push(task);
})
.then(function () {
var tasksList = new WinJS.Binding.List(tasks);