diff --git a/item/views.py b/item/views.py index bea0309..3c53b68 100644 --- a/item/views.py +++ b/item/views.py @@ -13,7 +13,7 @@ from django import forms from django.db.models import F from ox.django.http import HttpFileResponse -from ox.django.shortcuts import render_to_json_response +from ox.django.shortcuts import render_to_json_response, json_response import models class ChunkForm(forms.Form): diff --git a/static/videoOverlay.js b/static/videoOverlay.js index 40755b3..9f7be5c 100644 --- a/static/videoOverlay.js +++ b/static/videoOverlay.js @@ -1,3 +1,20 @@ +window.addEventListener('message', function(event) { + if(event.origin != 'null' && event.data) { + var data = JSON.parse(event.data); + if(data.event == 'close') { + var e = document.getElementById(data.id); + Array.prototype.forEach.call(e.parentElement.getElementsByClassName('button'), function(e) { + e.style.display = 'block'; + }); + e.parentElement.removeChild(e); + } + } +}); + +function getEmbedUrl(id, videoUrl) { + return ''; +} + function getVideoOverlay(page) { return (editable || videoOverlay[page]) ? { beginLayout: function() { @@ -22,7 +39,16 @@ function getVideoOverlay(page) { div.onclick = function(event) { event.preventDefault(); event.stopPropagation(); - div.innerHTML = videoOverlay[page][id]; + var iframe = document.createElement('iframe'); + iframe.width = '100%'; + iframe.height = '100%'; + iframe.frameborder = 0; + iframe.id = 'video' + page + id; + iframe.src = getEmbedUrl(iframe.id, videoOverlay[page][id]); + div.appendChild(iframe); + Array.prototype.forEach.call(div.getElementsByClassName('button'), function(e) { + e.style.display = 'none'; + }); return false; }; var img = document.createElement('img'); @@ -41,7 +67,19 @@ function getVideoOverlay(page) { img.onclick = function(event) { event.preventDefault(); event.stopPropagation(); + if(!videoOverlay[page]) { + videoOverlay[page] = {} + } + if(! videoOverlay[page][id]) { + videoOverlay[page][id] = ''; + } console.log('EDIT'); + var message = 'Please enter a pan.do/ra video URL, like\nhttp://pad.ma/A/editor/00:00:00,00:01:00,00:02:00'; + var url = prompt(message, videoOverlay[page][id]); + if (url !== null) { + videoOverlay[page][id] = url; + saveVideoOverlay(); + } return false; } div.appendChild(img); @@ -51,3 +89,35 @@ function getVideoOverlay(page) { } } : null; } + +function saveVideoOverlay() { + var request = new XMLHttpRequest(), + id = document.location.pathname.substring(1), + formData = new FormData(); + request.addEventListener('load', function (evt) { + console.log(evt); + }); + formData.append('data', JSON.stringify({ + 'id': id, + 'overlay': videoOverlay + })); + request.open('POST', '/save'); + request.setRequestHeader("X-CSRFToken", getCookie('csrftoken')); + request.send(formData); + + function getCookie(name) { + var cookieValue = null; + if (document.cookie && document.cookie != '') { + var cookies = document.cookie.split(';'); + for (var i = 0; i < cookies.length; i++) { + var cookie = cookies[i].trim(); + // Does this cookie string begin with the name we want? + if (cookie.substring(0, name.length + 1) == (name + '=')) { + cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); + break; + } + } + } + return cookieValue; + } +} diff --git a/videopdf/urls.py b/videopdf/urls.py index 3611f40..4e779e4 100644 --- a/videopdf/urls.py +++ b/videopdf/urls.py @@ -30,6 +30,7 @@ if settings.DEBUG: urlpatterns += patterns('item.views', (r'^$', 'index'), (r'^add$', 'add'), + (r'^save$', 'save'), (r'^([A-Z0-9].*)/$', 'item'), (r'^([A-Z0-9].*)/chunk$', 'chunk'), (r'^([A-Z0-9].*)/(.+.pdf)$', 'pdf'),