/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
(function() {
  ff.QualitySelect = function(farbfinder, options)
  {
    this._initialize (farbfinder, options);
  }

  ff.QualitySelect = jQuery.extend(ff.QualitySelect, {
    QUALITY_LKW : 'bv',
    QUALITY_UNI : 'sc',
    QUALITY_DOUBLE : 'bc',
    QUALITY_WASSERLACK: 'hb',
    QUALITY_NACRE:  'nacre'
  });

  ff.QualitySelect = jQuery.extend(ff.QualitySelect, {
    ANDERE_ABFUELLUNG : 1,
    SPRUEHDOSE : 2,
    LACKSTIFT : 3
  });

  ff.QualitySelect.prototype = jQuery.extend(ff.QualitySelect.prototype, {
    _initialize: function(farbfinder, options) {
      this._farbfinder = farbfinder;
      this._options = jQuery.extend({
        container : '#container_schritt_4',
        back_button: '#step_4_back_button',
        select_list_quality: '#select_list_quality',
        url: ff.SERVICE_URL + '/jsonService/selectQuality',
        headline: '#container_schritt_4_headline'
      }, options);
      this._id = null;
      this._url = this._options.url;
      this._container = jQuery(this._options.container);
      this._backButton = jQuery(this._options.back_button);
      this._selectListQuality = jQuery(this._options.select_list_quality);
      this._headline = jQuery(this._options.headline);
      this._headlineHtml = this._headline[0].innerHTML;
    },
    startup: function()
    {
      var self = this;
      this._backButton.bind('click keypress', function(ev)
      {
        jQuery(self).trigger('stepBack');
      });
    },
    setId: function(id)
    {
      this._id = id;
      this._fetchJsonData();
    },
    _fetchJsonData: function()
    {
      var self = this;
      jQuery.getJSON(this._url + '?callback=?', {id: this._id}, function()
      {
        self._updateHtml.call(self, arguments[0]);
        jQuery(self).trigger('onFetchComplete', arguments[0]);
      });
    },
    _updateHtml: function(data)
    {
      var self = this;
      var quality_selections = data.quality_selections;

      this._selectListQuality.empty();
      
      // NUR EINE AUSWAHLMÖGLICHKEIT: WEITER ZUM NÄCHSTEN SCHRITT
      if(quality_selections.length > 0)
      {
        jQuery.each(quality_selections, function(i, quality_selection)
        {
          self._selectListQuality.append(
            jQuery('<li class="'+quality_selection.toLowerCase()+'" rel="'+quality_selection.toLowerCase()+'"><a href="javascript:void(0)">' + FF_CONFIG.CALLOUTS.QUALITAET[quality_selection.toUpperCase()] + '</a></li>')
            .bind('click keypress', function(ev)
            {
              self.setHeadline('Qualit&auml;t: ' + FF_CONFIG.CALLOUTS.TITLES.QUALITAET[quality_selection.toUpperCase()]);
              jQuery(self).trigger('qualitySelected', jQuery.extend(data, {
                quality: quality_selection.toLowerCase()
              }));
          }));
        });
      }
      if(quality_selections.length == 1)
      {
        self.setHeadline('Qualit&auml;t: ' + FF_CONFIG.CALLOUTS.TITLES.QUALITAET[quality_selections[0].toUpperCase()]);
        jQuery(self).trigger('qualitySelected', jQuery.extend(data, {
          'quality' : quality_selections[0]
        }));
      }
    },
    resetHeadline: function()
    {
      this._headline.html(this._headlineHtml);
    },
    setHeadline: function(headline)
    {
      this._headline.html(headline);
    }
  });
})();