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).

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":