I have been working on window8 metro style app using html and javascript. My program work fine when there is no resizing or even resizing from full to snapped view or from snapped view to fill and in reverse. However, the problem arises when i try to change
back and forth from full view >> snapped view >> full view. it seems that the current page try to do unload as many times as i change back to full view.
This is my startPage.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>startPage</title>
<!-- WinJS references -->
<link href="//Microsoft.WinJS.1.0/css/ui-dark.css" rel="stylesheet" />
<script src="//Microsoft.WinJS.1.0/js/base.js"></script>
<script src="//Microsoft.WinJS.1.0/js/ui.js"></script>
<link href="startPage.css" rel="stylesheet" />
<script src="startPage.js"></script>
</head>
<body>
<canvas id="canvas_startpage" width="1280" height="720"></canvas>
<audio id ="audio_startpage">
<source src="/BGM_Effect/Open_T2H.mp3"/>
</audio>
</body>
</html>
this is my javascript (the definition part)
WinJS.UI.Pages.define("/pages/startPage/startPage.html", {
// This function is called whenever a user navigates to this page. It
// populates the page elements with the app's data.
ready: function (element, options) {
// TODO: Initialize the page here.
setDefaultValue();
scale = findScale();
setCanvas();
createStage();
createBitMapBackground();
createSettingButtons();
prepareStage();
playBGM();
startGame();
var viewStates = Windows.UI.ViewManagement.ApplicationViewState;
var startViewState = Windows.UI.ViewManagement.ApplicationView.value;
if (startViewState == viewStates.snapped) {
BGM = document.getElementById('audio_startpage');
BGM.pause();
}
//snappViewPauseMusic(startViewState);
moveContentHostElement(backgroundHeight);
},
updateLayout: function (element, viewState, lastViewState) {
/// <param name="element" domElement="true" />
/// <param name="viewState" value="Windows.UI.ViewManagement.ApplicationViewState" />
/// <param name="lastViewState" value="Windows.UI.ViewManagement.ApplicationViewState" />
// TODO: Respond to changes in viewState.
canvas.width = 1280;
canvas.height = 720;
scale = findScale();
setCanvas();
createStage();
createBitMapBackground();
createSettingButtons();
playBGM()
prepareStage();
var viewStates = Windows.UI.ViewManagement.ApplicationViewState;
if (viewState == viewStates.snapped) {
BGM = document.getElementById('audio_startpage');
BGM.pause();
}
//snappViewPauseMusic(viewState);
moveContentHostElement(backgroundHeight);
},
unload: function () {
// TODO: Respond to navigations away from this page.
//console.log("out of startPage");
count++;
console.log(count);
returnContentHostElement();
WinJS.UI.Fragments.clearCache("/pages/startPage/startPage.html");
Ticker.removeAllListeners();
//stage_startpage.tickOnUpdate = false;
//Ticker.removeAllListeners();
stage_startpage.tickOnUpdate = false;
}
});
I know the number of time by using count. What did i do wrong here ?
