use Ox.Message
This commit is contained in:
parent
1e17102e4b
commit
b7f417c29d
6 changed files with 81 additions and 53 deletions
|
@ -23,6 +23,7 @@ limitations under the License.
|
|||
<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/source/Ox.UI/js/Core/Message.js"></script>
|
||||
<script type="text/javascript" src="/static/pdf.js/compatibility.js"></script>
|
||||
|
||||
<!-- This snippet is used in production, see Makefile -->
|
||||
|
|
|
@ -314,16 +314,17 @@ appPanel
|
|||
Ox.Theme(pandora.user.ui.theme);
|
||||
if (isEmbed) {
|
||||
pandora.$ui.embedPanel = pandora.ui.embedPanel().display();
|
||||
window.addEventListener('message', function(e) {
|
||||
var data = {};
|
||||
try {
|
||||
data = JSON.parse(e.data);
|
||||
} catch(e) {}
|
||||
Ox.$parent.onMessage({
|
||||
settheme: function(data) {
|
||||
if (Ox.contains(pandora.site.themes, data.theme)) {
|
||||
Ox.Theme(data.theme);
|
||||
} else if (pandora.isEmbedURL(data.url)) {
|
||||
}
|
||||
},
|
||||
seturl: function(data) {
|
||||
if (pandora.isEmbedURL(data.url)) {
|
||||
pandora.URL.push(data.url);
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
pandora.$ui.appPanel = pandora.ui.appPanel().display();
|
||||
|
|
|
@ -126,6 +126,9 @@ pandora.ui.embedPanel = function() {
|
|||
type: data.timeline
|
||||
});
|
||||
}
|
||||
})
|
||||
.bindEvent(function(data, event) {
|
||||
Ox.$parent.postMessage(event, {});
|
||||
});
|
||||
|
||||
$controls = Ox.Element();
|
||||
|
|
|
@ -230,13 +230,11 @@ pandora.ui.mainMenu = function() {
|
|||
var iframe, src;
|
||||
Ox.Theme(value);
|
||||
pandora.UI.set('theme', value);
|
||||
iframe = $('#embed')[0];
|
||||
iframe = Ox.UI.elements[$('#embed').data('oxid')];
|
||||
if (iframe) {
|
||||
src = $(iframe).attr('src');
|
||||
src = iframe.attr('src');
|
||||
if (src && Ox.parseURL(src).hostname == document.location.hostname) {
|
||||
iframe.contentWindow.postMessage(JSON.stringify({
|
||||
theme: value
|
||||
}), '*');
|
||||
iframe.postMessage('settheme', {theme: value});
|
||||
}
|
||||
}
|
||||
} else if (data.id == 'showsiteposters') {
|
||||
|
|
|
@ -321,17 +321,25 @@ pandora.ui.textHTML = function(text) {
|
|||
|
||||
pandora.ui.textPDF = function(text) {
|
||||
|
||||
var that = Ox.Element();
|
||||
var that = Ox.Element(),
|
||||
$iframe;
|
||||
if (text.uploaded) {
|
||||
$('<iframe>')
|
||||
$iframe = Ox.Element('<iframe>')
|
||||
.attr({
|
||||
height: '100%',
|
||||
frameborder: 0,
|
||||
height: '100%',
|
||||
src: '/texts/' + pandora.user.ui.text + '/text.pdf.html',
|
||||
width: '100%'
|
||||
})
|
||||
.onMessage(function(event, data) {
|
||||
if(event == 'edit') {
|
||||
Ox.Dialog({
|
||||
title: 'edit',
|
||||
content: Ox.Element().html('test')
|
||||
}).open()
|
||||
}
|
||||
})
|
||||
.appendTo(that);
|
||||
|
||||
} else {
|
||||
that.html('UPLOADED: ' + text.uploaded);
|
||||
}
|
||||
|
@ -361,7 +369,7 @@ pandora.ui.textEmbed = function() {
|
|||
.hide()
|
||||
.appendTo(that),
|
||||
|
||||
$iframe = $('<iframe>')
|
||||
$iframe = Ox.Element('<iframe>')
|
||||
.attr({
|
||||
height: '100%',
|
||||
id: 'embed',
|
||||
|
@ -397,9 +405,9 @@ pandora.ui.textEmbed = function() {
|
|||
&& parsed.url.protocol == parsed.src.protocol
|
||||
&& 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
|
||||
}), '*');
|
||||
});
|
||||
} else {
|
||||
$iframe.attr({src: url});
|
||||
}
|
||||
|
|
|
@ -1,15 +1,6 @@
|
|||
window.addEventListener('message', function(event) {
|
||||
if (event.origin != 'null' && event.data) {
|
||||
var data = JSON.parse(event.data);
|
||||
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);
|
||||
}
|
||||
Ox.Message.bind(function(event, data, oxid) {
|
||||
if (Ox.isUndefined(oxid)) {
|
||||
//process messages here
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -78,6 +69,9 @@ function getVideoOverlay(page) {
|
|||
e.stopPropagation();
|
||||
var videoId = 'video' + page + id,
|
||||
$iframe = Ox.$('<iframe>')
|
||||
.on('load', function() {
|
||||
Ox.Message.post($iframe, 'init', {id: $iframe.oxid});
|
||||
})
|
||||
.attr({
|
||||
id: videoId,
|
||||
src: getEmbedURL(videoId, video.src),
|
||||
|
@ -86,6 +80,17 @@ function getVideoOverlay(page) {
|
|||
frameborder: 0
|
||||
})
|
||||
.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();
|
||||
$editButton.hide();
|
||||
return false;
|
||||
|
@ -94,7 +99,17 @@ function getVideoOverlay(page) {
|
|||
var url;
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
if(window.parent) {
|
||||
Ox.$parent.postMessage('edit', {
|
||||
video: video
|
||||
? video
|
||||
: {
|
||||
id: id,
|
||||
page: page,
|
||||
src: ''
|
||||
}
|
||||
});
|
||||
} else {
|
||||
url = prompt(
|
||||
'Please enter a pan.do/ra video URL, like\n'
|
||||
+ 'https://0xdb.org/0315594/00:13:37,00:23:42 or\n'
|
||||
|
@ -115,6 +130,8 @@ function getVideoOverlay(page) {
|
|||
saveVideoOverlay();
|
||||
url !== '' ? enableVideoUI() : disableVideoUI()
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
function enableVideoUI() {
|
||||
|
|
Loading…
Reference in a new issue