Custom widget: widget.notifyContentIsReady() does not fire as expected
I'm new to iBooks Author but thought I followed these instructions (http://support.apple.com/kb/HT5068?viewlocale=en_US&locale=en_US) to open an HTML widget without the white flicker faithfully. But the widget.notifyContentIsReady() javascript command isn't firing as I expected. Am I missing something obvious here? Here are the details of my test custom widget project...
To my widget's Info.plist, I added:
<key>IBNotifiesOnReady</key>
<true/>
To my main html file, I added the reference to the Apple file:
<script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>
To my main HTML file I also added the call to:
widget.notifyContentIsReady()
Below is the HTML code/Javascript in total. I expected this code would cause the Widget to keep showing the Default.png file for about 5 seconds until widget.notifyContentIsReady() is called. But it doesn't. Instead, the Default.png disappears almost immediately and then five seconds later the test message gets swapped out.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge" />
<meta name="viewport" content="user-scalable=yes, width=1024" />
<title>testing</title>
<script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>
<script type="text/javascript">
window.onload = function ()
 {
var div = document.getElementById("IBPreload");
div.parentNode.removeChild(div);
var slowdown = setTimeout(imready,3000);
}
function imready(){
var div = document.getElementById("message");
div.innerHTML="hi from inside this iPad!";
widget.notifyContentIsReady();
}
</script>
<style>
body {
background: #ffffff;
margin: 0px;
}
#item {
position:relative;
overflow:hidden;
width:1024px;
height:768px;
}
</style>
</head>
<body>
<div id="IBPreload">
<img src="Default.png">
</div>
<div style ="margin:auto;width=1024;">
<div id="message" style="position:absolute; top:0px; left:0px; ">Wow!</div>
</div>
</body>
</html>
Maybe I've been staring at this too long. Is my understanding of widget.notifyContentIsReady correct? Shouldn't iBooks wait to render the HTML until I've called widget.notifyContentIsReady? Any ideas? Help.
iBooks Author-OTHER