Ext.onReady(function(){
var menu = new Ext.menu.Menu();
    menu.addText("All Vertical Blinds");
    var item = menu.add(
        { text: 'Vinyl Vertical Blinds',href:'http://www.verticalblinds.com/vinyl-vertical-blinds/'},
        { text: 'Fabric Vertical Blinds',href:'http://www.verticalblinds.com/fabric-vertical-blinds/designer'},
        { text: 'Faux Wood Vertical Blinds',href:'http://www.verticalblinds.com/faux-wood-vertical-blinds/'},
        { text: 'Perforated Vertical Blinds',href:'http://www.verticalblinds.com/perforated-vertical-blinds/'}
        
    );
    var menu_listener_source = Ext.get("vb-all-menu");
    var menu_listener = menu_listener_source.on("mouseover",function(node, e){
        menu.showAt(menu_listener_source.getXY());
    });
    var delay_hide=false;
    function delayed_menu_hide(hide){
        delay_hide=hide;
        if(delay_hide==false)return;
        (function(){
            if(delay_hide)menu.hide(true);
        }).defer(250);
    };
    var width_w = Ext.get("width_w");
    var width_i = Ext.get("width_i");
    var height_w = Ext.get("height_w");
    var height_i = Ext.get("height_i");
    function updateprice()
    {
        var priceV = Ext.Ajax.request({
            url:'http://www.verticalblinds.com/csvparser',
            success: function(Xresponse,Xoptions)
                {
                    var itemprice = Ext.util.JSON.decode(Xresponse.responseText).price;
                    Ext.DomHelper.overwrite('vinyl_price','$'+itemprice);
                },
            params: {
                width: width_w.getValue(),
                height: height_w.getValue(),
                width_inc: width_i.getValue(),
                height_inc: height_i.getValue(),
                group: 'GroupB'
            }
        });
        var priceV = Ext.Ajax.request({
            url:'http://www.verticalblinds.com/csvparser',
            success: function(Xresponse,Xoptions)
                {
                    var itemprice = Ext.util.JSON.decode(Xresponse.responseText).price;
                    Ext.DomHelper.overwrite('fabric_price','$'+itemprice);
                },
            params: {
                width: width_w.getValue(),
                height: height_w.getValue(),
                width_inc: width_i.getValue(),
                height_inc: height_i.getValue(),
                group: 'group1'
            }
        });
        var priceV = Ext.Ajax.request({
            url:'http://www.verticalblinds.com/csvparser',
            success: function(Xresponse,Xoptions)
                {
                    var itemprice = Ext.util.JSON.decode(Xresponse.responseText).price;
                    Ext.DomHelper.overwrite('fauxwood_price','$'+itemprice);
                },
            params: {
                width: width_w.getValue(),
                height: height_w.getValue(),
                width_inc: width_i.getValue(),
                height_inc: height_i.getValue(),
                group: 'group2'
            }
        });
        var priceV = Ext.Ajax.request({
            url:'http://www.verticalblinds.com/csvparser',
            success: function(Xresponse,Xoptions)
                {
                    var itemprice = Ext.util.JSON.decode(Xresponse.responseText).price;
                    Ext.DomHelper.overwrite('perforated_price','$'+itemprice);
                },
            params: {
                width: width_w.getValue(),
                height: height_w.getValue(),
                width_inc: width_i.getValue(),
                height_inc: height_i.getValue(),
                group: 'group2'
            }
        });
       
    };
    width_w.addListener("click",updateprice);
    width_i.addListener("click",updateprice); 
    height_w.addListener("click",updateprice); 
    height_i.addListener("click",updateprice); 
    menu.on("mouseout", function(){delayed_menu_hide(true);});
    menu.on("mouseover", function(){delayed_menu_hide(false);});
    updateprice();  
});