PDA

View Full Version : Dynamically Loading URL into ext.video URL property



mcorderoy
29 Sep 2011, 8:13 AM
I have a local data store that contains 24 different video clip URLs.
How can I dynamically set the url property of a Video Container?
The navigation within the apps works fine, enabling the different records to be selected, but the video only works if I hardcode the URL (no good!) or use a Template. However, the myvideo.pause() method does not work for the template / tpl structure, so if a user navigates away from the video page the clip keeps playing.

I've seen reference to ext.override on the forum but have been able to get it to work!


var myvideo = new Ext.Video({
id : 'myvideo',
layout : 'auto',
width : '1024',
height : '576',
url: ???
});


Thanks

NickT
29 Sep 2011, 1:08 PM
you can change the src attribute of the dom element like this. also, you may try the autoPause and autoResume in terms of addressing your pausing of the stream when you deactivate the visible panel with the video...


{ fullscreen: true,
items: [
{
id:'videofield',
xtype : 'video',
width : 175,
height : 98,
url : "m1.mov",
autoPause: true,
autoResume: true
},
{
xtype:'button',
text:'change movie',
handler: function(btn) {
var v = Ext.getCmp('videofield');
if (v) {
v.pause();
v.el.dom.childNodes[0].setAttribute('src', "m2.mov");
}
}
}
]
}

mcorderoy
29 Sep 2011, 2:15 PM
NickT, thanks.
I took your idea and it is now working.
For the record...
In my controller that loads the page I added the following


var vidcontainer = Ext.getCmp('myvideo');
if (vidcontainer) {
vidcontainer.el.dom.childNodes[0].setAttribute('src',VideoURL);
}
myvideo.doComponentLayout();

where myvideo is the id of the ext.video component, and VideoURL is a string containing the new URL for the desired clip.

Once again thanks, been banging my head against a brick wall for too long on this one!