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 From 1b6202d3cd517480aebafdfe97e9b89600d715ce Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 28 Jun 2012 22:46:07 -0700 Subject: video autopsy fix: moving the event handler on creation Signed-off-by: Valerio Virgillito --- js/controllers/elements/video-controller.js | 13 ------------- js/tools/TagTool.js | 24 +++++++++++++++++++++++- 2 files changed, 23 insertions(+), 14 deletions(-) diff --git a/js/controllers/elements/video-controller.js b/js/controllers/elements/video-controller.js index 44ba5aa1..c36752f5 100755 --- a/js/controllers/elements/video-controller.js +++ b/js/controllers/elements/video-controller.js @@ -28,19 +28,6 @@ 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": diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js index 31918f92..27665ee6 100755 --- a/js/tools/TagTool.js +++ b/js/tools/TagTool.js @@ -86,11 +86,15 @@ exports.TagTool = Montage.create(DrawingTool, { // Create the element if(this.options.selectedElement === "custom") { element = document.application.njUtils.make(this.options.customName.value, null, this.application.ninja.currentDocument); - } else { element = document.application.njUtils.make(this.options.selectedElement, null, this.application.ninja.currentDocument); } + // Adding a canplay event to videos to pause them and prevent autoplay on stage + if(this.options.selectedElement === "video") { + element.addEventListener("canplay", this, false); + } + // Create the styles styles = document.application.njUtils.stylesFromDraw(element, ~~drawData.width, ~~drawData.height, drawData); @@ -109,6 +113,24 @@ exports.TagTool = Montage.create(DrawingTool, { // Add the element and styles this.application.ninja.elementMediator.addElements(element, styles); } + }, + + handleCanplay: { + value: function(event) { + //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 + event.target.pause(); + } } + }); -- cgit v1.2.3 From 54f95bf52f660f5d8bcb3180c203ffd6ce9b8557 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 28 Jun 2012 23:27:38 -0700 Subject: Fixing reference to object --- js/tools/TagTool.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js index 27665ee6..80e6150d 100755 --- a/js/tools/TagTool.js +++ b/js/tools/TagTool.js @@ -118,14 +118,14 @@ exports.TagTool = Montage.create(DrawingTool, { handleCanplay: { value: function(event) { //TODO: Figure out why the video must be seeked to the end before pausing - var time = Math.ceil(this.duration); + var time = Math.ceil(event.target.duration); //Trying to display the last frame (doing minus 2 seconds if long video) if (time > 2) { - this.currentTime = time - 2; + event.target.currentTime = time - 2; } else if (time > 1) { - this.currentTime = time - 1; + event.target.currentTime = time - 1; } else { - this.currentTime = time || 0; + event.target.currentTime = time || 0; } //Pauing video event.target.pause(); -- cgit v1.2.3 From 44903a3b55b4343f26de7cc4c60a2723e3131793 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 29 Jun 2012 09:09:56 -0700 Subject: Styles Controller Patch to ignore unfound rules from getMatchedCSSRules --- js/controllers/styles-controller.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 0f847653..2282794c 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -629,7 +629,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { if(!rule) { ///// This should never be hit if providing cssText from existing rule (like those ///// returned from getMatchedCSSRules() - console.warn('StylesController::_getRuleWithCSSText - No rule found with given cssText.'); + //console.warn('StylesController::_getRuleWithCSSText - No rule found with given cssText.'); } return rule; @@ -653,6 +653,8 @@ var stylesController = exports.StylesController = Montage.create(Component, { }, this); rules = mappedRules.filter(function(rule) { + if(!rule) { return false; } + //// useStageStyleSheet flag indicates whether to only return rules from the stylesheet, //// or only use rules for other stylesheets -- cgit v1.2.3 From ae9a947b7019a57d399823142775c6b61ee69546 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 29 Jun 2012 11:49:11 -0700 Subject: Styles controller - adding check for attached element in getMatchedCSSRules --- js/controllers/styles-controller.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 2282794c..64efdb19 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -629,7 +629,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { if(!rule) { ///// This should never be hit if providing cssText from existing rule (like those ///// returned from getMatchedCSSRules() - //console.warn('StylesController::_getRuleWithCSSText - No rule found with given cssText.'); + console.warn('StylesController::_getRuleWithCSSText - No rule found with given cssText.'); } return rule; @@ -647,6 +647,10 @@ var stylesController = exports.StylesController = Montage.create(Component, { doc = element.ownerDocument, win = doc.defaultView; + if(!element.parentNode) { + console.warn('StylesController::getMatchingRules - Un-attached element queried'); + } + try { mappedRules = nj.toArray(win.getMatchedCSSRules(element)).map(function(rule) { return this._getRuleWithCSSText(rule.cssText, doc); @@ -675,7 +679,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { }, this); } catch(ERROR) { - console.warn('StylesController::getMatchingRules - Un-attached element queried.'); + console.warn('StylesController::getMatchingRules - getMatchedCSSRules Exception.'); } ///// Function for sorting by specificity values function sorter(ruleA, ruleB) { -- cgit v1.2.3 From 4db51449c829f34c1875e7c5ec91343c511da729 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 29 Jun 2012 11:51:46 -0700 Subject: Styles Controller - getMatchingRules - Add forgotten return statement --- js/controllers/styles-controller.js | 1 + 1 file changed, 1 insertion(+) diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 64efdb19..aca86ec5 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -649,6 +649,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { if(!element.parentNode) { console.warn('StylesController::getMatchingRules - Un-attached element queried'); + return []; } try { -- cgit v1.2.3 From 06ac6fcdde5b1f9a00e4c966ce165af0a4c3c1da Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 29 Jun 2012 12:25:50 -0700 Subject: Null check on results from getMatchedCSSRules --- js/controllers/styles-controller.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index aca86ec5..39deeaa8 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -643,6 +643,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { getMatchingRules : { //TODO: Remove omitPseudos from here and usages value: function(element, omitPseudos, useStageStyleSheet) { var rules, + matchedRules, mappedRules, doc = element.ownerDocument, win = doc.defaultView; @@ -653,7 +654,14 @@ var stylesController = exports.StylesController = Montage.create(Component, { } try { - mappedRules = nj.toArray(win.getMatchedCSSRules(element)).map(function(rule) { + matchedRules = win.getMatchedCSSRules(element); + + if(!matchedRules) { + console.warn('StylesController::getMatchingRules - matched rules are null'); + return []; + } + + mappedRules = nj.toArray(matchedRules).map(function(rule) { return this._getRuleWithCSSText(rule.cssText, doc); }, this); -- cgit v1.2.3 From 8a9ac2255b9161102be21fca23ba892665fe75ab Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Fri, 29 Jun 2012 14:26:13 -0700 Subject: fixing some Signed-off-by: Valerio Virgillito --- js/document/views/design.js | 25 +++++++++++-------------- 1 file changed, 11 insertions(+), 14 deletions(-) diff --git a/js/document/views/design.js b/js/document/views/design.js index fea607ef..b7c50a7c 100755 --- a/js/document/views/design.js +++ b/js/document/views/design.js @@ -313,20 +313,17 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { 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); - } + //Stopping all videos from playing 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 -- cgit v1.2.3 From 25890906f10e4530f0245632d028a646ece563c1 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 29 Jun 2012 14:31:19 -0700 Subject: Another null check on results from getMatchedCSSRules --- js/controllers/styles-controller.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 39deeaa8..b50f43cc 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -629,7 +629,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { if(!rule) { ///// This should never be hit if providing cssText from existing rule (like those ///// returned from getMatchedCSSRules() - console.warn('StylesController::_getRuleWithCSSText - No rule found with given cssText.'); + //console.warn('StylesController::_getRuleWithCSSText - No rule found with given cssText.'); } return rule; @@ -649,7 +649,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { win = doc.defaultView; if(!element.parentNode) { - console.warn('StylesController::getMatchingRules - Un-attached element queried'); + //console.warn('StylesController::getMatchingRules - Un-attached element queried'); return []; } @@ -657,7 +657,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { matchedRules = win.getMatchedCSSRules(element); if(!matchedRules) { - console.warn('StylesController::getMatchingRules - matched rules are null'); + //console.warn('StylesController::getMatchingRules - matched rules are null'); return []; } @@ -688,7 +688,8 @@ var stylesController = exports.StylesController = Montage.create(Component, { }, this); } catch(ERROR) { - console.warn('StylesController::getMatchingRules - getMatchedCSSRules Exception.'); + //console.warn('StylesController::getMatchingRules - getMatchedCSSRules Exception.'); + return []; } ///// Function for sorting by specificity values function sorter(ruleA, ruleB) { -- cgit v1.2.3 From 12de4e49a309e210c13eb40b2ffa158ef2eb54a7 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Fri, 29 Jun 2012 16:42:31 -0700 Subject: updating to version 7.0 Signed-off-by: Valerio Virgillito --- manifest.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/manifest.json b/manifest.json index f1703b99..874f0c2f 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "name": "Ninja", "description": "Ninja HTML5 Authoring Tool - Alpha Release", - "version": "0.6.0.0", + "version": "0.7.0.0", "app": { "launch": { "local_path": "index.html" -- cgit v1.2.3