I'm trying to implement a Scribd viewer in a Facebook app's canvas and let it adapt to user's viewport height.
My code call the FB.init function as the very first element of body
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'my-fb-app-id',
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
FB.Canvas.getPageInfo(function(info){
var viewportHeight = info.clientHeight - info.scrollTop - info.offsetTop;
FB.Canvas.setSize ({height: viewportHeight});
});
};
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/it_IT/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
This way I adjust iFrame height. Now I've to use the viewportHeight variable outside callback in order to adjust scribd reader's height. Scrbid reader code:
<script type='text/javascript' src='http://www.scribd.com/javascripts/scribd_api.js'></script>
<div id='embedded_doc'><a href='http://www.scribd.com'>Scribd</a></div>
<script type='text/javascript'>
var scribd_doc = scribd.Document.getDoc(<? echo $doc_id; ?>, '<? echo $access_key; ?>' );
var onDocReady = function(e){
//scribd_doc.api.setPage(3);
}
scribd_doc.addParam( 'jsapi_version', 2 );
scribd_doc.addEventListener( 'docReady', onDocReady );
scribd_doc.addParam('height', viewportHeight );";
scribd_doc.write( 'embedded_doc' );
</script>
But it seems that varaibles inside the callback function of FB.canvas.getInfo() cannot be seen outside. Already tried with cookie but I figured out that browsers doesn't allow to store cookies from within an iFrame.
How would I solve it (if is possible)?
window.fbAsyncInit = function() {
FB.init({
appId : 'my-fb-app-id',
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
FB.Canvas.getPageInfo(function(info){
var viewportHeight = info.clientHeight - info.scrollTop - info.offsetTop;
FB.Canvas.setSize ({height: viewportHeight});
prepScribdDoc(viewportHeight);
});
};
var onDocReady = function(e){
//scribd_doc.api.setPage(3);
alert('Red eye');
}
var prepScribdDoc = function(viewportHeight) {
var scribd_doc = scribd.Document.getDoc(<? echo $doc_id; ?>, '<? echo $access_key; ?>' );
scribd_doc.addParam( 'jsapi_version', 2 );
scribd_doc.addEventListener( 'docReady', onDocReady );
scribd_doc.addParam('height', viewportHeight );";
scribd_doc.write( 'embedded_doc' );
}