<link href="http://developerextensions.com/components/com_extensiondemo/views/extensiondemo/tmpl/sencha2/ux/timerpluscount/css/ext.ux.timer.css" rel="stylesheet" type="text/css" />
<script src="http://developerextensions.com/components/com_extensiondemo/views/extensiondemo/tmpl/sencha2/ux/timerpluscount/ext.ux.timer.js" type="text/javascript"></script>

	
Ext.application({
    launch:function(){
        Ext.Viewport.add({
            xtype: 'container',
            scrollable:'vertical',
            layout:{
                type:'vbox',
                align:'center',
                pack:'center'
            },
            items:[{
                xtype:'timer',
                name:'timer1',
                timeUpSoundUrl:'app/timerSound.mp3',
                topHtml:'Default Timer'
            },{
                xtype:'timer',
                name:'timer2',
                timeUpSoundUrl:'app/timerSound.mp3',
                timerOnly:true,
                time:200,
                markerTime:600,
                topHtml:'Only Timer with initial time settings'
            },{
                xtype:'timer',
                name:'timer3',
                timeUpSoundUrl:'app/timerSound.mp3',
                fullSeconds:3600,
                markerTime:900,
                time:600,
                enableState:true,
                clearState:false,
                isTimeNCountSeprateCmp:false,
                timeColor:'#f00',
                topHtml:'Timer with state enabled, custom values'
            }]
        });
    }
});