diff --git a/static/js/directives/odfcanvas.js b/static/js/directives/odfcanvas.js index ba96d944..449d5e41 100644 --- a/static/js/directives/odfcanvas.js +++ b/static/js/directives/odfcanvas.js @@ -31,14 +31,16 @@ define(['require', 'underscore', 'jquery', 'text!partials/odfcanvas_sandbox.html var controller = ['$scope', '$element', '$attrs', function($scope, $element, $attrs) { var container = $($element); - var odfCanvas; - var template = sandboxTemplate; template = template.replace(/__PARENT_ORIGIN__/g, $window.location.protocol + "//" + $window.location.host); template = template.replace(/__WEBODF_SANDBOX_JS_URL__/g, restURL.createAbsoluteUrl(require.toUrl('sandboxes/webodf') + ".js")); template = template.replace(/__WEBODF_URL__/g, restURL.createAbsoluteUrl(require.toUrl('webodf') + ".js")); - var sandboxApi = sandbox.createSandbox($("iframe", container)[0], template); + var sandboxApi = sandbox.createSandbox(container, template, "allow-scripts", null, { + allowfullscreen: true, + mozallowfullscreen: true, + webkitallowfullscreen: true + }); sandboxApi.e.on("message", function(event, message) { var msg = message.data; @@ -231,7 +233,7 @@ define(['require', 'underscore', 'jquery', 'text!partials/odfcanvas_sandbox.html return { restrict: 'E', replace: true, - template: '
', + template: '
', controller: controller }; diff --git a/static/js/directives/pdfcanvas.js b/static/js/directives/pdfcanvas.js index e4327664..fd6c8e86 100644 --- a/static/js/directives/pdfcanvas.js +++ b/static/js/directives/pdfcanvas.js @@ -29,16 +29,18 @@ define(['require', 'underscore', 'jquery', 'text!partials/pdfcanvas_sandbox.html var controller = ['$scope', '$element', '$attrs', function($scope, $element, $attrs) { var container = $($element); - var pdfCanvas; - var template = sandboxTemplate; template = template.replace(/__PARENT_ORIGIN__/g, $window.location.protocol + "//" + $window.location.host); template = template.replace(/__PDFJS_SANDBOX_JS_URL__/g, restURL.createAbsoluteUrl(require.toUrl('sandboxes/pdf') + ".js")); template = template.replace(/__PDFJS_URL__/g, restURL.createAbsoluteUrl(require.toUrl('pdf') + ".js")); template = template.replace(/__PDFJS_WORKER_URL__/g, restURL.createAbsoluteUrl(require.toUrl('pdf.worker') + ".js")); template = template.replace(/__PDFJS_COMPATIBILITY_URL__/g, restURL.createAbsoluteUrl(require.toUrl('libs/pdf/compatibility') + ".js")); - var sandboxApi = sandbox.createSandbox($("iframe", container)[0], template); + var sandboxApi = sandbox.createSandbox(container, template, "allow-scripts", null, { + allowfullscreen: true, + mozallowfullscreen: true, + webkitallowfullscreen: true + }); sandboxApi.e.on("message", function(event, message) { var msg = message.data; @@ -289,7 +291,7 @@ define(['require', 'underscore', 'jquery', 'text!partials/pdfcanvas_sandbox.html return { restrict: 'E', replace: true, - template: '
', + template: '
', controller: controller }; diff --git a/static/js/directives/youtubevideo.js b/static/js/directives/youtubevideo.js index 98806f1a..46e85758 100644 --- a/static/js/directives/youtubevideo.js +++ b/static/js/directives/youtubevideo.js @@ -112,12 +112,11 @@ define(['require', 'jquery', 'underscore', 'moment', 'text!partials/youtubevideo sandboxApi = null; } if (!sandboxApi) { - var sandboxFrame = $(".youtubeplayer", $element)[0]; var template = sandboxTemplate; template = template.replace(/__PARENT_ORIGIN__/g, $window.location.protocol + "//" + $window.location.host); template = template.replace(/__YOUTUBE_SANDBOX_JS_URL__/g, restURL.createAbsoluteUrl(require.toUrl('sandboxes/youtube') + ".js")); - sandboxApi = sandbox.createSandbox(sandboxFrame, template); + sandboxApi = sandbox.createSandbox($(".youtubeplayercontainer", $element)[0], template, "allow-scripts allow-same-origin", "youtubeplayer"); sandboxApi.e.on("message", function(event, message) { var msg = message.data; diff --git a/static/js/services/sandbox.js b/static/js/services/sandbox.js index f3046c93..774efffc 100644 --- a/static/js/services/sandbox.js +++ b/static/js/services/sandbox.js @@ -24,11 +24,37 @@ define(["jquery", "underscore"], function($, _) { return ["$window", function($window) { - var Sandbox = function(iframe, template) { - this.iframe = iframe; + var Sandbox = function(container, template, sandbox, className, attrs) { var blob = new $window.Blob([template], {type: "text/html;charset=utf-8"}); this.url = $window.URL.createObjectURL(blob); - this.iframe.src = this.url; + var iframe; + var $container = $(container); + if ($container.is("iframe")) { + // Container is iframe. + if (className) { + $container.addClass(className); + } + if (attrs) { + $container.attr(attrs); + } + iframe = $container[0]; + iframe.src = this.url; + this.created = false; + } else { + // Create iframe. + iframe = $window.document.createElement("iframe"); + iframe.sandbox = sandbox; + if (className) { + iframe.className = className; + } + if (attrs) { + $(iframe).attr(attrs); + } + iframe.src = this.url; + $container.append(iframe); + this.created = true; + } + this.iframe = iframe; this.target = this.iframe.contentWindow; this.e = $({}); this.handler = _.bind(this.onPostMessageReceived, this); @@ -47,6 +73,9 @@ define(["jquery", "underscore"], function($, _) { $window.URL.revokeObjectURL(this.url); this.url = null; } + if (this.created) { + $(this.iframe).remove(); + } }; Sandbox.prototype.onPostMessageReceived = function(event) { @@ -83,8 +112,11 @@ define(["jquery", "underscore"], function($, _) { }; return { - createSandbox: function(iframe, template) { - return new Sandbox(iframe, template); + createSandbox: function(iframe, template, sandbox, className, attrs) { + if (!sandbox) { + sandbox = ""; + } + return new Sandbox(iframe, template, sandbox, className, attrs); } }; diff --git a/static/partials/youtubevideo.html b/static/partials/youtubevideo.html index 0cd01e76..0542f3bb 100644 --- a/static/partials/youtubevideo.html +++ b/static/partials/youtubevideo.html @@ -30,9 +30,7 @@
-
- -
+
{{_('Currently playing')}}
{{ currentVideoUrl }}