var mooGrade = new Class({
    Implements: [Events, Options],
 
    options:    {
       'mooDefaultAjaxPath' : './mooGrade.php',
            'mooStartValue' : null, //poczatkowa wartosc
              'mooGradeOff' : null, //wyłączone
             'mooUploadDiv' : null
    },
    getPrec: function(){
         this.levelPrec = (this.level/this.scaleTop * 100).round(0);
         return this.levelPrec;
    },
    initialize: function(element,options){
        this.setOptions(options);

        if (!$(element)){
            alert('Brak Elementu: ' + element);
            return false;
        } else
            this.container = $(element);

        this.level;
        this.levelPrec;
        this.scaleTop = this.container.getSize().x - 3;

        this.layer0 = new Element('div',{
                'class' : 'mooGradeLayer0',
               'styles' : {
                'width' : this.container.getSize().x - (2 * this.container.getStyle('border-left-width').toInt()),
               'height' : this.container.getSize().y - (2 * this.container.getStyle('border-top-width').toInt()),
                 'left' : 0,
                  'top' : 0,
              'z-index' : 1
               }
        }).injectInside(this.container);


        this.layer1 = new Element('div',{
                'class' : 'mooGradeLayer1',
               'styles' : {
                'width' : this.container.getSize().x - (2 * this.container.getStyle('border-left-width').toInt()),
               'height' : this.container.getSize().y - (2 * this.container.getStyle('border-top-width').toInt()),
                 'left' : 0,
                  'top' : 0,
              'z-index' : 2
               }
        }).injectInside(this.container);

        if(this.options.mooStartValue) {
         this.levelPoint = (this.scaleTop/100);
         this.layer0.setStyle('width', (this.options.mooStartValue * this.levelPoint)); 
        }
        if(!this.options.mooGradeOff)
        this.layer1.addEvents({
            'mousemove' : function(e) {
                     var width = e.client.x - this.layer1.getPosition().x;
                     this.getPrec();
                     this.layer0.setStyle('width', width);
                     this.level = width;

               }.bind(this),
           'mouseleave' : function(e) {
                      this.layer0.setStyle('width', (this.options.mooStartValue ? (this.options.mooStartValue * this.levelPoint) : 0 ));
               }.bind(this),
                'click' : function(e) {
                   new Request({
                       method: 'get',
                          url: this.options.mooDefaultAjaxPath,
                         data: '&level=' + this.level + '&levelPrec=' + this.levelPrec,
                    onSuccess: function(responseText, responseXML) {

                              if($(this.options.mooUploadDiv))
                                  $(this.options.mooUploadDiv).set('html',responseText);
                              this.mooGradeOff = true;
                              this.layer1.removeEvents();
                       }.bind(this)
                   }).send();

                  
               }.bind(this)
        });

    }
});