use Ox.Message

This commit is contained in:
j 2013-02-24 07:48:25 +00:00
parent 1e17102e4b
commit b7f417c29d
6 changed files with 81 additions and 53 deletions

View file

@ -23,6 +23,7 @@ limitations under the License.
<link rel="stylesheet" href="/static/pdf.js/viewer.css"/> <link rel="stylesheet" href="/static/pdf.js/viewer.css"/>
<script type="text/javascript" src="/static/oxjs/build/Ox.js"></script> <script type="text/javascript" src="/static/oxjs/build/Ox.js"></script>
<script type="text/javascript" src="/static/oxjs/source/Ox.UI/js/Core/Message.js"></script>
<script type="text/javascript" src="/static/pdf.js/compatibility.js"></script> <script type="text/javascript" src="/static/pdf.js/compatibility.js"></script>
<!-- This snippet is used in production, see Makefile --> <!-- This snippet is used in production, see Makefile -->

View file

@ -314,15 +314,16 @@ appPanel
Ox.Theme(pandora.user.ui.theme); Ox.Theme(pandora.user.ui.theme);
if (isEmbed) { if (isEmbed) {
pandora.$ui.embedPanel = pandora.ui.embedPanel().display(); pandora.$ui.embedPanel = pandora.ui.embedPanel().display();
window.addEventListener('message', function(e) { Ox.$parent.onMessage({
var data = {}; settheme: function(data) {
try { if (Ox.contains(pandora.site.themes, data.theme)) {
data = JSON.parse(e.data); Ox.Theme(data.theme);
} catch(e) {} }
if (Ox.contains(pandora.site.themes, data.theme)) { },
Ox.Theme(data.theme); seturl: function(data) {
} else if (pandora.isEmbedURL(data.url)) { if (pandora.isEmbedURL(data.url)) {
pandora.URL.push(data.url); pandora.URL.push(data.url);
}
} }
}); });
} else { } else {

View file

@ -126,6 +126,9 @@ pandora.ui.embedPanel = function() {
type: data.timeline type: data.timeline
}); });
} }
})
.bindEvent(function(data, event) {
Ox.$parent.postMessage(event, {});
}); });
$controls = Ox.Element(); $controls = Ox.Element();

View file

@ -230,13 +230,11 @@ pandora.ui.mainMenu = function() {
var iframe, src; var iframe, src;
Ox.Theme(value); Ox.Theme(value);
pandora.UI.set('theme', value); pandora.UI.set('theme', value);
iframe = $('#embed')[0]; iframe = Ox.UI.elements[$('#embed').data('oxid')];
if (iframe) { if (iframe) {
src = $(iframe).attr('src'); src = iframe.attr('src');
if (src && Ox.parseURL(src).hostname == document.location.hostname) { if (src && Ox.parseURL(src).hostname == document.location.hostname) {
iframe.contentWindow.postMessage(JSON.stringify({ iframe.postMessage('settheme', {theme: value});
theme: value
}), '*');
} }
} }
} else if (data.id == 'showsiteposters') { } else if (data.id == 'showsiteposters') {

View file

@ -321,17 +321,25 @@ pandora.ui.textHTML = function(text) {
pandora.ui.textPDF = function(text) { pandora.ui.textPDF = function(text) {
var that = Ox.Element(); var that = Ox.Element(),
$iframe;
if (text.uploaded) { if (text.uploaded) {
$('<iframe>') $iframe = Ox.Element('<iframe>')
.attr({ .attr({
height: '100%',
frameborder: 0, frameborder: 0,
height: '100%',
src: '/texts/' + pandora.user.ui.text + '/text.pdf.html', src: '/texts/' + pandora.user.ui.text + '/text.pdf.html',
width: '100%' width: '100%'
}) })
.appendTo(that); .onMessage(function(event, data) {
if(event == 'edit') {
Ox.Dialog({
title: 'edit',
content: Ox.Element().html('test')
}).open()
}
})
.appendTo(that);
} else { } else {
that.html('UPLOADED: ' + text.uploaded); that.html('UPLOADED: ' + text.uploaded);
} }
@ -361,7 +369,7 @@ pandora.ui.textEmbed = function() {
.hide() .hide()
.appendTo(that), .appendTo(that),
$iframe = $('<iframe>') $iframe = Ox.Element('<iframe>')
.attr({ .attr({
height: '100%', height: '100%',
id: 'embed', id: 'embed',
@ -397,9 +405,9 @@ pandora.ui.textEmbed = function() {
&& parsed.url.protocol == parsed.src.protocol && parsed.url.protocol == parsed.src.protocol
&& parsed.url.hostname == parsed.src.hostname && parsed.url.hostname == parsed.src.hostname
) { ) {
$iframe[0].contentWindow.postMessage(JSON.stringify({ $iframe.postMessage('seturl', {
url: parsed.url.pathname + parsed.url.search + parsed.url.hash url: parsed.url.pathname + parsed.url.search + parsed.url.hash
}), '*'); });
} else { } else {
$iframe.attr({src: url}); $iframe.attr({src: url});
} }

View file

@ -1,15 +1,6 @@
window.addEventListener('message', function(event) { Ox.Message.bind(function(event, data, oxid) {
if (event.origin != 'null' && event.data) { if (Ox.isUndefined(oxid)) {
var data = JSON.parse(event.data); //process messages here
if (data.event == 'close') {
var element = document.getElementById(data.id);
Array.prototype.forEach.call(element.parentElement.getElementsByClassName('button'), function(element) {
if (editable || element.className == 'button playButton') {
element.style.display = 'block';
}
});
e.parentElement.removeChild(e);
}
} }
}); });
@ -78,6 +69,9 @@ function getVideoOverlay(page) {
e.stopPropagation(); e.stopPropagation();
var videoId = 'video' + page + id, var videoId = 'video' + page + id,
$iframe = Ox.$('<iframe>') $iframe = Ox.$('<iframe>')
.on('load', function() {
Ox.Message.post($iframe, 'init', {id: $iframe.oxid});
})
.attr({ .attr({
id: videoId, id: videoId,
src: getEmbedURL(videoId, video.src), src: getEmbedURL(videoId, video.src),
@ -86,6 +80,17 @@ function getVideoOverlay(page) {
frameborder: 0 frameborder: 0
}) })
.appendTo($interface); .appendTo($interface);
Ox.Message.bind(function(event, data, oxid) {
if ($iframe.oxid == oxid) {
if(event == 'close') {
$iframe.remove();
}
}
});
$iframe.postMessage = function(event, data) {
Ox.Message.post($iframe, event, data);
return $iframe;
};
$playButton.hide(); $playButton.hide();
$editButton.hide(); $editButton.hide();
return false; return false;
@ -94,27 +99,39 @@ function getVideoOverlay(page) {
var url; var url;
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
if(window.parent) {
url = prompt( Ox.$parent.postMessage('edit', {
'Please enter a pan.do/ra video URL, like\n' video: video
+ 'https://0xdb.org/0315594/00:13:37,00:23:42 or\n' ? video
+ 'http://pad.ma/A/editor/00:00:00,00:01:00,00:02:00' : {
+ (video ? '\n\nTo remove the video, just remove the URL.' : ''), id: id,
video ? video.src : '' page: page,
); src: ''
if (url !== null) { }
if(!video) { });
video = { } else {
page: page, url = prompt(
id: id, 'Please enter a pan.do/ra video URL, like\n'
src: '' + 'https://0xdb.org/0315594/00:13:37,00:23:42 or\n'
}; + 'http://pad.ma/A/editor/00:00:00,00:01:00,00:02:00'
embeds.push(video); + (video ? '\n\nTo remove the video, just remove the URL.' : ''),
video ? video.src : ''
);
if (url !== null) {
if(!video) {
video = {
page: page,
id: id,
src: ''
};
embeds.push(video);
}
video.src = url
saveVideoOverlay();
url !== '' ? enableVideoUI() : disableVideoUI()
} }
video.src = url
saveVideoOverlay();
url !== '' ? enableVideoUI() : disableVideoUI()
} }
return false; return false;
} }
function enableVideoUI() { function enableVideoUI() {