hi,
i've been searching for some code to add a carousel to an overlay.
finally i found something (http://www.senchafiddle.com/#aXSPT)
the problem now is, when i display the overlay, it works fine, but the background isn't disabled.
this is how i show the overlay:
Code:
var overlay = Ext.create('LeaveRequest.view.TeamCalendarDetails');
Ext.Viewport.add(overlay);
overlay.show();
and this gets created:
Code:
Ext.define('LeaveRequest.view.TeamCalendarDetails', {
extend : 'Ext.Carousel',
config : {
style : 'background-color: #FFFFFF;border: solid #003366;',
scrollable : false,
hideOnMaskTap : true,
modal : true,
centered : true,
width : Ext.os.deviceType == 'Phone' ? 240 : 320,
height : Ext.os.deviceType == 'Phone' ? 240 : 380
},
initialize : function() {
this.callParent(arguments);
this.addItems();
},
addItems : function() {
var data = Ext.getStore('requestdetailstore').getData().all;
html = '...' ;
this.add({
xtype : 'panel',
scrollable : 'vertical',
styleHtmlContent : true,
items : [{
html : html
}, {
xtype : 'button',
text : 'close',
scope : this,
handler : this.closeOverlay
}]
});
}
},
closeOverlay : function() {
this.destroy();
}
});
i need the overlay, and the carousel, because the content is dependant of a store.
each record of the store gets displayed within the carousel.
any ideas?