Need advice on code: Video not showing up

Hi All

I am trying to get a video to show up in a nestedList leaf.

I an not sure what I am missing here. Its fine when I put the URL in the nestedList detailCard config.

I would like to display a different URL for the other list items.

Thanks

Jim

Ext.define('TuT.view.NestedList',{ extend:'Ext.NestedList',

xtype:'nestedList',

requires:['Ext.Video'],

config:{

title:'NestedList',

iconCls:'star',

fullscreen: true,

scrollable:true,

styleHtmlContent:true,

styleHtmlCls:'homepage',

displayField: 'text',

store: 'TreeStore',

detailCard:{

xtype:'video',

styleHtmlContent: true,

scrollable: true,

url: '{Video}'

},

}

});

Ext.define('TuT.store.TreeStore', { extend: 'Ext.data.TreeStore',

config: {

model: 'TuT.model.ListItem',

defaultRootProperty:'items',

root: {

items: [

{

text: 'Drinks',

items: [

{

text: 'Water',

items: [

{ text: 'Still', leaf: true },

{ text: 'Sparkling', video: 'http://ift.tt/1vbmzOC History.mp4', leaf: true },

{ text: 'JB', video: 'http://ift.tt/1tGolMm' , leaf:true}

]

},

{ text: 'Soda', leaf: true }

]

},

{

text: 'Snacks',

items: [

{ text: 'Nuts', leaf: true },

{ text: 'Pretzels', leaf: true },

{ text: 'Wasabi Peas', leaf: true}

]

}

]

}

}

});

Ext.define('TuT.model.ListItem', {

extend: 'Ext.data.Model',

config:{

fields:['text','video']

}

})

Ext.define('TuT.controller.NestedList', {

extend: 'Ext.app.Controller',

config: {

refs: {

nestedList: 'nestedList'

},

control: {

'nestedList':{

leafitemtap: function(nestedList, list, index, target, record) {

var detailCard = nestedList.getDetailCard();

detailCard.setData(record.getData());

},

}

});

Need advice on code: Video not showing up