Q: 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
Posted on Apr 13, 2013 3:53 PM