I asked this question about how to capture visibility changes in a metro app: How to tell if JS Windows8 metro app is visible or not

And it seems like there two answers: 1) checkpoint will be called about 10 seconds after the app loses focuses because the app will be suspended

2) the page visibility events will work.

However, when I do the following in my default.js I don't see either of these things happening:

var onVisibilityChange = function (args) {
  console.log("Visibility changed. (this will never appear");
};
app.addEventListener("visibilitychange", onVisibilityChange);

// ...

app.oncheckpoint = function (args) {
  console.log("APP onCheckpoint (this also never appears");
};

Does anybody have an example of capturing when the app starts/stops being visible that works?

I asked this question about how to capture visibility changes in a metro app: How to tell if JS Windows8 metro app is visible or not

And it seems like there two answers: 1) checkpoint will be called about 10 seconds after the app loses focuses because the app will be suspended

2) the page visibility events will work.

However, when I do the following in my default.js I don't see either of these things happening:

var onVisibilityChange = function (args) {
  console.log("Visibility changed. (this will never appear");
};
app.addEventListener("visibilitychange", onVisibilityChange);

// ...

app.oncheckpoint = function (args) {
  console.log("APP onCheckpoint (this also never appears");
};

Does anybody have an example of capturing when the app starts/stops being visible that works?

• javascript
• windows-8
• microsoft-metro

3 Answers 3

For visibility, you need to use the document:

document.addEventListener("visibilitychange", function() {
    console.log("Visible: " + !document.hidden);
})

For Checkpoint, your code is correct but note:

• Suspend/Resume does not happen automatically with the debugger attached. You need to use the toolbar in Visual studio for controlling the suspend state.
• Your console.log won't show up till the app is resumed (unclear why, probably some cache), hower you can verify it's executed before being suspended by setting a breakpoint on that line, and using the VS toolbar button

One solution is:

var onVisibilityChange = function (args) {
  var state = document["visibilityState"];
  if (state == "visible")
  {
    console.log("COMING IN");
  }
  else if (state == "hidden") {
    console.log("AWAY");
  }
};
document.addEventListener("visibilitychange", onVisibilityChange, false);

I remend to use this library: http://dueljs.studentivan.ru/