var RatingBox = {
  iAlbumID:null,
  fRate:null,
  fUserRate:null,  
  bUserIsVerified:false,
  bUserHasRated:false,
  oRating: null,
  oLoader:null,
  oTemplate: new Template('<div class="#{classname}"><label>#{label}</label><div class="rate_#{display}"></div><span>#{rate}</span></div>'),
  initialize: function(oOptions)
  {
    var _this = this;
    this.iAlbumID = oOptions.iAlbumID;
    this.fRate = oOptions.fRate;
    this.fUserRate = oOptions.fUserRate;
    this.bUserHasRated = oOptions.bUserHasRated;
    this.bUserIsVerified = oOptions.bUserIsVerified;
     //  <img style="display:none;" src="/images/ajax-loader-16x16.gif" alt="Deine Wertung wird gespeichert." />
    this.oLoader = new Element('img', {
      'style': 'display:none',
      'src'  : '/images/ajax-loader-16x16.gif',
      'alt'  : 'Deine Wertung wird gespeichert.'
    });
    this.showRating();
  },
  clearRating: function()
  {
    this.setRating(0);
  },
  saveRating: function(iRating)
  {
    if (iRating > 0 && iRating < 10)
    {
      iRating = 10;
    }
    this.oLoader.show();
    
    var _this = this;

    StdAjax.Request('rating.save', {
      oForm:{
        subject: 'album', 
        subjectID: this.iAlbumID, 
        rating: iRating
      },
      onSuccess: function(oRes, oData)
      {
        _this.bUserHasRated = true;
        // _this.fUserRate = iRating / 10;
        //         _this.fRate = parseFloat(oData.rating != null ? oData.rating : rating / 10);
        //         _this.showRating(); 
        _this.sayThanks();     
      },
      onError: function(res, errors)
      {
        //alert('fehler beim speichern');
      },
      onComplete: function()
      {
        _this.oLoader.hide();
      }
    });
  },
  setRating: function(iRating)
  {
    if (iRating > 0 && iRating < 10)
    {
      iRating = 10;
    }
    this.oRating.className = 'rate_' + iRating;
    
    $$('span.dorate')[0].update(iRating / 10);
  },
  sayThanks: function()
  {
    this.update('<div><label>Deine Wertung:</label><span>Vielen Dank fürs Abstimmen!</span></div>');
  },
  showRating: function()
  {
    var _this = this;
    
    var sContent = '';
    if (this.fRate > 0)
    {
      sContent += this.oTemplate.evaluate({
        classname: 'userrate',
        label: 'Leserwertung', 
        display: this.fRound(this.fRate) * 10,
        rate: this.fRate ? this.fRate : ' - '
      });
    } 
    else
    {
      sContent += '<div class="userrate"><label>Leserwertung:</label><span> &lt; 5 Wertungen.</span></div>';
    }
    
    if (this.bUserIsVerified)
    {
      sContent += this.oTemplate.evaluate({
         classname: 'ownrate',
         label: 'Deine Wertung', 
         display: this.fRound(this.fUserRate) * 10,
         rate: this.fUserRate ? this.fUserRate : ' - '
      });
    }
    
    this.update(sContent);
    var oRate     = $$('div.userrate')[0];
    if (this.bUserIsVerified)
    {
      var oUserRate = $$('div.ownrate')[0];
      oUserRate.hide();
    }
    
  
   
    var oDoRate = null;
    if (this.bUserIsVerified && ! this.bUserHasRated)
    {
      this.getSlider();
      var oDoRate   = $$('div.dorate')[0];
      oDoRate.hide();
    }
    
    
    this.observe('mouseover', function(e) {
      if (! this.bUserIsVerified)
      {
        return;
      }
      
      if (! this.bUserHasRated)
      {
       oDoRate.show();
      }
      else if (this.bUserHasRated)
      {
        oUserRate.show();
      }

      oRate.hide();

    });

    this.observe('mouseout', function(e) {
      if (oUserRate) oUserRate.hide();
      if (oDoRate) oDoRate.hide();
      oRate.show();
    });

   this.show();
  },
  getSlider: function()
  { 
    var _this = this;
    
    var oDiv = new Element('div', {'class': 'dorate'});

    oDiv.appendChild( new Element('label').update('Deine Wertung'));
    
    this.oRating = new Element('div', {'class':'rate_0'});

    for (i=5; i<=100; i += 5)
    {
      var oElem = new Element('a', { rel: i});
      oElem.appendChild(new Element('button', { title:''}));
      oElem.observe('mouseout',   function(e) { _this.clearRating()});
      oElem.observe('mouseover',  function(e) { _this.setRating(this.rel)});
      oElem.observe('click',      function(e) { _this.saveRating(this.rel); });
      this.oRating.appendChild(oElem);
    }
    
    oDiv.appendChild(this.oRating);
    oDiv.appendChild(new Element('span', {'class':'dorate'}).update(' - '));
    oDiv.appendChild(this.oLoader);
      
 
  
    this.appendChild(oDiv);
    
  },
  showUserRating: function()
  {
    this.update(this.oTemplate.evaluate({
       label: 'Deine Wertung', 
       display: this.fRound(this.fUserRate) * 10,
       rate: this.fUserRate
    }));
  },
  fRound: function(fNum)
  {
    return Math.round(fNum * 2, 1) / 2;
  }
};