From c37f2cb15b90d7315e9580fee1ae7f6e0694052c Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 28 Jun 2012 16:50:46 -0700 Subject: Preventing video playback on open This stops all videos from playing on open file. The same fix needs to be applied when an users sets autoplay in the PI. --- js/document/mediators/template.js | 10 ---------- js/document/views/design.js | 25 ++++++++++++++++++++++--- 2 files changed, 22 insertions(+), 13 deletions(-) diff --git a/js/document/mediators/template.js b/js/document/mediators/template.js index f43b1a2c..015a50ff 100755 --- a/js/document/mediators/template.js +++ b/js/document/mediators/template.js @@ -220,14 +220,6 @@ exports.TemplateDocumentMediator = Montage.create(Component, { linktags = template.file.content.document.getElementsByTagName('link'), njtemplatetags = template.file.content.document.querySelectorAll('[data-ninja-template]'); - ////////////////////////////////////////////////// - //TODO: Remove, temp hack, this is to be fixed by Montage - var basetags = template.file.content.document.getElementsByTagName('base'); - for (var g in basetags) { - if (basetags[g].getAttribute && basetags[g].href && basetags[g].href.indexOf('chrome-extension://') !== -1) toremovetags.push(basetags[g]); - } - ////////////////////////////////////////////////// - //Adding to tags to be removed form template for (var f in njtemplatetags) { if (njtemplatetags[f].getAttribute) toremovetags.push(njtemplatetags[f]); @@ -284,8 +276,6 @@ exports.TemplateDocumentMediator = Montage.create(Component, { - - //TODO: Make proper CSS method diff --git a/js/document/views/design.js b/js/document/views/design.js index 6a60e1f9..fea607ef 100755 --- a/js/document/views/design.js +++ b/js/document/views/design.js @@ -285,7 +285,8 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { userStyles, stags = this.document.getElementsByTagName('style'), ltags = this.document.getElementsByTagName('link'), i, orgNodes, - scripttags = this.document.getElementsByTagName('script'); + scripttags = this.document.getElementsByTagName('script'), + videotags = this.document.getElementsByTagName('video'); //Temporarily checking for disabled special case (we must enabled for Ninja to access styles) this.ninjaDisableAttribute(stags); this.ninjaDisableAttribute(ltags); @@ -308,10 +309,28 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { } } } - + //Checking for video tags + if (videotags.length > 0) { + //Looping through all video tags + for (i = 0; i < videotags.length; i++) { + //Stopping all videos from playing + if (videotags[i].getAttribute && videotags[i].getAttribute('autoplay') !== null) { + //Stopping the video on open + videotags[i].addEventListener('canplay', function(e) { + //TODO: Figure out why the video must be seeked to the end before pausing + var time = Math.ceil(this.duration); + //Trying to display the last frame (doing minus 2 seconds if long video) + if (time > 2) this.currentTime = time - 2; + else if (time > 1) this.currentTime = time - 1; + else this.currentTime = time || 0; + //Pauing video + this.pause(); + }, false); + } + } + } // Assign the modelGenerator reference from the template to our own modelGenerator this.document.modelGenerator = ElementModel.modelGenerator; - //Checking for script tags then parsing check for montage and webgl if (scripttags.length > 0) { //Checking and initializing webGL -- cgit v1.2.3 From a859432f0cc5746e2855c16565a75391ea657772 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 28 Jun 2012 18:17:22 -0700 Subject: Fixing video autoplay bug in PI Adding functionality to prevent autoplay on videos while in author-time. Fixes chrome preview issues. --- .../tools-properties/tag-properties.reel/tag-properties.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.js b/js/components/tools-properties/tag-properties.reel/tag-properties.js index ab745049..f14183e0 100755 --- a/js/components/tools-properties/tag-properties.reel/tag-properties.js +++ b/js/components/tools-properties/tag-properties.reel/tag-properties.js @@ -54,6 +54,7 @@ var TagProperties = exports.TagProperties = Montage.create(ToolProperties, { this.divElement.addEventListener("click", this, false); this.imageElement.addEventListener("click", this, false); this.videoElement.addEventListener("click", this, false); + this.videoElement.addEventListener("canplay", this, false); this.canvasElement.addEventListener("click", this, false); this.customElement.addEventListener("click", this, false); } @@ -99,6 +100,19 @@ var TagProperties = exports.TagProperties = Montage.create(ToolProperties, { } } }, + + handleCanplay: { + value: function (e) { + //TODO: Figure out why the video must be seeked to the end before pausing + var time = Math.ceil(this.duration); + //Trying to display the last frame (doing minus 2 seconds if long video) + if (time > 2) this.currentTime = time - 2; + else if (time > 1) this.currentTime = time - 1; + else this.currentTime = time || 0; + //Pauing video + this.pause(); + } + }, _selectedElement: { value: "div", enumerable: false -- cgit v1.2.3 From 4bfc0b9221734c75f305dbeefe8e49a9d73b766b Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 28 Jun 2012 18:39:07 -0700 Subject: Relocating code I added the fix in the wrong location before, this is more proper, still needs to be moved to where the video element is created or added to the DOM (in this spot the event is added every time src is changed). --- .../tools-properties/tag-properties.reel/tag-properties.js | 14 -------------- js/controllers/elements/video-controller.js | 13 +++++++++++++ 2 files changed, 13 insertions(+), 14 deletions(-) diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.js b/js/components/tools-properties/tag-properties.reel/tag-properties.js index f14183e0..ab745049 100755 --- a/js/components/tools-properties/tag-properties.reel/tag-properties.js +++ b/js/components/tools-properties/tag-properties.reel/tag-properties.js @@ -54,7 +54,6 @@ var TagProperties = exports.TagProperties = Montage.create(ToolProperties, { this.divElement.addEventListener("click", this, false); this.imageElement.addEventListener("click", this, false); this.videoElement.addEventListener("click", this, false); - this.videoElement.addEventListener("canplay", this, false); this.canvasElement.addEventListener("click", this, false); this.customElement.addEventListener("click", this, false); } @@ -100,19 +99,6 @@ var TagProperties = exports.TagProperties = Montage.create(ToolProperties, { } } }, - - handleCanplay: { - value: function (e) { - //TODO: Figure out why the video must be seeked to the end before pausing - var time = Math.ceil(this.duration); - //Trying to display the last frame (doing minus 2 seconds if long video) - if (time > 2) this.currentTime = time - 2; - else if (time > 1) this.currentTime = time - 1; - else this.currentTime = time || 0; - //Pauing video - this.pause(); - } - }, _selectedElement: { value: "div", enumerable: false diff --git a/js/controllers/elements/video-controller.js b/js/controllers/elements/video-controller.js index c36752f5..44ba5aa1 100755 --- a/js/controllers/elements/video-controller.js +++ b/js/controllers/elements/video-controller.js @@ -28,6 +28,19 @@ exports.VideoController = Montage.create(ElementController, { value: function(el, p, value) { switch(p) { case "src": + + //TODO: Move this to the location where the element is created + el.addEventListener('canplay', function(e) { + //TODO: Figure out why the video must be seeked to the end before pausing + var time = Math.ceil(this.duration); + //Trying to display the last frame (doing minus 2 seconds if long video) + if (time > 2) this.currentTime = time - 2; + else if (time > 1) this.currentTime = time - 1; + else this.currentTime = time || 0; + //Pauing video + this.pause(); + }, false); + el.setAttribute(p, value); break; case "poster": -- cgit v1.2.3