//var TE$ = jQuery.noConflict(true); // load jquery in mainborder layout
if (!window.WIDGET) (function() {

  WIDGET = {
    initialised : false,
    widgetType : 'side',
    country : 'za',   // uses code instead of id
    category_code : null,
    category : null,
    citySlug : null,
    cats :null,

    //glueHacks
    pages : {activities :'Activities', accommodation:'Accommodations'},
    selected: {accommodation: null, activities: null},
  
    changeCat : function(type){
      self.selected[type] = TE$('#'+type+'Categories option:selected').val();
      self.updateUrl(type);
    },

    changeCity : function(type){
      self.selected[type] = TE$('#'+type+'Cities option:selected').val();
      TE$('#'+type+'Categories').attr('disabled', true);     
      TE$.getJSON('/widgets/sidebar_pagefinder/json.php?object=changed_cats&type='+type+'&cntry='+self.country+'&city='+self.selected[type]+'&callback=?',
      function(data){
        self.updateCats(type, data.cats);
        self.updateUrl(type);
      });
    },

  
    updateCats : function(type, data){
      if(!data[type]){
        self.changeCity(type);
      }else{        
        TE$('#'+type+'Categories').empty();
        var o;
        TE$.each(data[type], function(opt, optdata) {
          if(optdata.slug == self.selected[type]){          
            o = '<option value="' + optdata.slug + '" selected="true">' + optdata.name + '</option>';
          }else{
            o = '<option value="' + optdata.slug + '">' + optdata.name + '</option>';
          }
          TE$('#'+type+'Categories').append(o);
          TE$('#'+type+'Categories').attr('disabled', false);          
        })
        self.updateUrl(type);
      }
    },
    
    updateCities :function(type, data) {
      TE$('#'+type+'Cities').empty();
      var o;
      TE$.each(data[type], function(key, city) {
        if(city.slug == self.citySlug){
          o = '<option value="' + city.slug + '" selected="true">' + city.name + '</option>';
        }else{
          o = '<option value="' + city.slug + '">' + city.name + '</option>';
        }
        TE$('#'+type+'Cities').append(o);
      });
      TE$('#'+type+'Cities').attr('disabled', false);    
    },
    
    updateUrl :function(type) {
      var page = self.pages[type];
      var city = TE$('#'+type+'Cities option:selected').val();
      var cat = TE$('#'+type+'Categories option:selected').val();
      var url = '/'+page+'/'+self.country+'/'+city+'/'+cat;
      TE$('#'+type+'Go').attr('href', url);
    },

    updateTransportLink :function(){
      var cat = TE$('#transportCategories option:selected').val();
      var url = '/'+cat+'/'+self.countrySlug;
      TE$('#transportGo').attr('href', url);      
    },
    

    setupEvents : function() {
      TE$('#transportCategories').bind('change', self.updateTransportLink);
      
      TE$('.widgetCities').bind('change', function(e){
        self.changeCity(TE$(this).attr('wtype'))        
      });

      TE$('.widgetCats').bind('change', function(e){
        self.changeCat(TE$(this).attr('wtype'))        
      });
    },

    showLoading:function(){
      TE$('#TEwidgetGo')
      .attr('style', 'background-position: 0 -18px;')
      .removeAttr('href');
    },
    
    doneLoading:function(){
      TE$('#TEwidgetGo')
      .attr('href', self.url)
      .attr('style', 'background-position: 0 0;');
      if(!self.isTransportCat){ 
        TE$('#TEwidgetCities').attr('disabled', false);
      }
    },

    init : function() {
      TE$.getJSON('/widgets/sidebar_pagefinder/json.php?object=start&cntry='+self.country+'&city='+self.citySlug+'&callback=?',
      function(data){
//        self.cats = data.cats;
//        self.cities = data.cities;
        //todo finder
        self.updateCities('activities', data.cities);
        self.updateCats('activities',data.cats);
        // accom finder
        self.updateCities('accommodation', data.cities);
        self.updateCats('accommodation', data.cats);
        // onchange events
        self.setupEvents();
      });
    }
    

  }
  var self = WIDGET;
})();

TE$(document).ready(function() {
  WIDGET.country = countryCode;
  WIDGET.countrySlug = countryUrlCode;
  WIDGET.citySlug = cityUrlCode;
  WIDGET.selected.activities = categoryUrlCode;
  WIDGET.selected.accommodation= categoryUrlCode;
  WIDGET.updateTransportLink();
  WIDGET.init();
});