add dialog to edit tpdf inline video player urls, hide right panel for now

static/js/pandora/embedPanel.js

@@ -137,7 +137,9 @@ pandora.ui.embedPanel = function() {
                     }
                 })
                 .bindEvent(function(data, event) {
-                    Ox.$parent.postMessage(event, {});
+                    if (Ox.contains(['close', 'paused'], event)) {
+                        Ox.$parent.postMessage(event, data);
+                    }
                 });
 
             $controls = Ox.Element();

static/js/pandora/textPanel.js

@@ -105,8 +105,9 @@ pandora.ui.textPanel = function() {
                     },
                     {
                         element: pandora.$ui.textEmbed = pandora.ui.textEmbed(),
-                        size: pandora.user.ui.embedSize,
+                        //fixme: at some point pdf will also have a sidebar
-                        resizable: true,
+                        size: text.type == 'html' ? pandora.user.ui.embedSize : 0,
+                        resizable: text.type == 'html',
                         resize: [192, 256, 320, 384, 448, 512]
                     }
                 ],
@@ -338,10 +339,29 @@ pandora.ui.textPDF = function(text) {
             })
             .onMessage(function(event, data) {
                 if(event == 'edit') {
-                    Ox.Dialog({
+                    console.log('existing url?', data);
-                        title: 'edit',
+                    pandora.ui.insertEmbedDialog(data.src, function(url) {
-                        content: Ox.Element().html('test')
+                        data.src = url;
-                    }).open()
+                        var embed = text.embeds.filter(function(embed) {
+                            return embed.id == data.id
+                                && embed.type == data.type
+                                && embed.page == data.page;
+                        })[0];
+                        if(embed) {
+                            embed.src = url;
+
+                        } else {
+                            text.embeds.push(data);
+                            //fixme sort embeds by page/id
+                        }
+                        console.log('saving', text.embeds);
+                        pandora.api.editText({
+                            id: text.id,
+                            embeds: text.embeds
+                        }, function(result) {
+                            $iframe.postMessage('update', data);
+                        });
+                    }).open();
                 }
             })
             .appendTo(that);

static/pdf.js/embeds.js

@@ -1,44 +1,3 @@
-Ox.Message.bind(function(event, data, oxid) {
-    if (Ox.isUndefined(oxid)) {
-        //process messages here
-    }
-});
-Ox.$parent = {
-    postMessage: function(event, message) {
-        Ox.Message.post(event, message);
-        return this;
-    },
-    onMessage: function() {
-        var callback;
-        if (Ox.isObject(arguments[0])) {
-            Ox.forEach(arguments[0], function(callback, event) {
-                Ox.Message.bind(function(evt, data, oxid) {
-                    if (Ox.isUndefined(oxid) && event == evt) {
-                        callback(data);
-                    }
-                });
-            });
-        } else {
-            callback = arguments[0];
-            Ox.Message.bind(function(event, data, oxid) {
-                Ox.isUndefined(oxid) && callback(event, data);
-            });
-        }
-        return this;
-    }
-};
-
-function getEmbedURL(id, videoURL) {
-    var parsed = Ox.parseURL(videoURL),
-        parts = parsed.pathname.split('/'),
-        item = parts[1],
-        points = parts[parts.length - 1].split(','),
-        outPoint = points.pop(),
-        inPoint = points.pop();
-    return parsed.protocol + '//' + parsed.host + '/' + item + '/embed?view=player&id=' + id
-        + '&in=' + inPoint + '&out=' + outPoint
-        + '&paused=false&showCloseButton=true';
-}
 function getVideoOverlay(page) {
     var links = embeds.filter(function(embed) {
         return embed.page == page && embed.type =='inline';
@@ -87,34 +46,49 @@ function getVideoOverlay(page) {
                     enableVideoUI();
                 }
                 this.div.appendChild($interface[0]);
+                Ox.Message.bind(function(event, data, oxid) {
+                    if (event == 'update') {
+                        if(Ox.isUndefined(oxid)
+                            && video
+                            && data.id == video.id
+                            && data.page == video.page) {
+                            video.src = data.src;
+                            video.src !== '' ? enableVideoUI() : disableVideoUI();
+                        }
+                    }
+                });
             }
             function play(e) {
                 e.preventDefault();
                 e.stopPropagation();
-                var videoId = 'video' + page + id,
+                var videoId = 'video' + page + id + Ox.uid(),
                     $iframe = Ox.$('<iframe>')
-                        .on('load', function() {
-                            Ox.Message.post($iframe, 'init', {id: $iframe.oxid});
-                        })
                         .attr({
                             id: videoId,
-                            src: getEmbedURL(videoId, video.src),
+                            src: video.src + '&showCloseButton=true&fullscreen=false',
                             width: '100%',
                             height: '100%',
                             frameborder: 0
                         })
-                        .appendTo($interface);
+                        .appendTo($interface),
-                Ox.Message.bind(function(event, data, oxid) {
+                    closed = false;
-                    if ($iframe.oxid == oxid) {
-                        if(event == 'close') {
-                            $iframe.remove();
-                        }
-                    }
-                });
                 $iframe.postMessage = function(event, data) {
                     Ox.Message.post($iframe, event, data);
                     return $iframe;
                 };
+                Ox.Message.bind(function(event, data, oxid) {
+                    if(!closed && event == 'loaded') {
+                        $iframe.postMessage('init', {id: videoId});
+                    } else if(event == 'close') {
+                        if(!closed && !Ox.isUndefined(oxid) && videoId == oxid) {
+                            closed = true;
+                            $iframe.remove();
+                            delete $iframe;
+                            $playButton.show();
+                            $editButton.show();
+                        }
+                    }
+                });
                 $playButton.hide();
                 $editButton.hide();
                 return false;
@@ -123,39 +97,13 @@ function getVideoOverlay(page) {
                 var url;
                 e.preventDefault();
                 e.stopPropagation();
-                if(window.parent) {
+                video = video || {
-                    Ox.$parent.postMessage('edit', {
-                        video: video
-                            ? video
-                            : {
                     id: id,
                     page: page,
-                                src: ''
+                    src: '',
-                            }
+                    type: 'inline'
-                    });
-                } 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'
-                        + 'http://pad.ma/A/editor/00:00:00,00:01:00,00:02:00'
-                        + (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);
+                Ox.$parent.postMessage('edit', video);
-                        }
-                        video.src = url
-                        saveVideoOverlay();
-                        url !== '' ? enableVideoUI() : disableVideoUI()
-                    }
-                }
-
                 return false;
             }
             function enableVideoUI() {
@@ -177,7 +125,3 @@ function getVideoOverlay(page) {
         }
     } : null;
 }
-
-function saveVideoOverlay() {
-    console.log('save not implemented, bubble to pan.do/ra?');
-}