75 lines
2.1 KiB
JavaScript
75 lines
2.1 KiB
JavaScript
|
|
||
|
|
|
||
|
|
/*
|
||
|
|
@param {Object} options
|
||
|
|
@param {String} options.id -- id of embed
|
||
|
|
@param {String} options.url - URL of pan.do/ra embed
|
||
|
|
@param {DOMNode} options.container -- DOM element in which to put embed
|
||
|
|
@param {Number} options.width - width of iframe
|
||
|
|
@param {Number} options.height - height of iframe
|
||
|
|
|
||
|
|
*/
|
||
|
|
var PandoraEmbed = function(options) {
|
||
|
|
var that = this;
|
||
|
|
this.id = options.id || 'padmaembed';
|
||
|
|
this.isInitted = false;
|
||
|
|
this.boundFns = {};
|
||
|
|
var width = options.width || 640;
|
||
|
|
var height = options.height || 360;
|
||
|
|
var container = options.container || document;
|
||
|
|
if (!options.url) {
|
||
|
|
alert('no embed url specified');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
var $iframe = this.iframe = document.createElement('iframe');
|
||
|
|
$iframe.width = width;
|
||
|
|
$iframe.height = height;
|
||
|
|
$iframe.src = options.url;
|
||
|
|
$iframe.addEventListener('load', function() {
|
||
|
|
var timeout;
|
||
|
|
function init() {
|
||
|
|
if (that.isInitted) {
|
||
|
|
clearTimeout(timeout);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
that.postMessage('init', {
|
||
|
|
oxid: that.id
|
||
|
|
});
|
||
|
|
timeout = setTimeout(init, 250);
|
||
|
|
}
|
||
|
|
init();
|
||
|
|
});
|
||
|
|
|
||
|
|
window.addEventListener('message', that.listener.bind(this), false);
|
||
|
|
container.appendChild($iframe);
|
||
|
|
return this;
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
PandoraEmbed.prototype.listener = function(event) {
|
||
|
|
var data = JSON.parse(event.data);
|
||
|
|
if (data.target !== this.id) return; // this message is not for us
|
||
|
|
if (data.event === 'init') this.isInitted = true;
|
||
|
|
this.trigger(data.event, data);
|
||
|
|
};
|
||
|
|
|
||
|
|
PandoraEmbed.prototype.on = function(event, fn) {
|
||
|
|
if (!this.boundFns.hasOwnProperty(event)) this.boundFns[event] = [];
|
||
|
|
this.boundFns[event].push(fn);
|
||
|
|
return this;
|
||
|
|
}
|
||
|
|
|
||
|
|
PandoraEmbed.prototype.postMessage = function(event, data) {
|
||
|
|
this.iframe.contentWindow.postMessage(JSON.stringify({
|
||
|
|
data: data,
|
||
|
|
event: event
|
||
|
|
}), '*');
|
||
|
|
}
|
||
|
|
|
||
|
|
PandoraEmbed.prototype.trigger = function(event, data) {
|
||
|
|
if (this.boundFns.hasOwnProperty(event)) {
|
||
|
|
this.boundFns[event].forEach(function(fn) {
|
||
|
|
fn(data);
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|