﻿var SniperSystemsCheckbox = Class.create({
    initialize: function(el) {
        this.checkbox = el;
        this.checkbox.instance = this;
        this.onImage = '/images/checkbox_on.gif';
        this.offImage = '/images/checkbox_off.gif';
        var imageSrc = this.getImage(this.checkbox.checked);
        this.image = new Element('img', { src: imageSrc, className: 'checkbox' })
            .observe('click', this.imageClickHandler.bindAsEventListener(this));
        var label = el.next('label');
        this.checkbox.replacementCheckbox = this; //circular reference warning
        if (label) {
            this.label = label;
            this.label.observe('click', this.labelClickHandler.bindAsEventListener(this));
        }
        el.insert({ after: this.image }).hide();
        this.checkboxObserver = new Form.Element.Observer(el, 0.1, this.observerHandler.bindAsEventListener(this));
    },
    labelClickHandler: function(e) {
        this.checkboxToggle.bind(this)();
        e.stop();
    },
    imageClickHandler: function(e) {
        this.checkboxToggle.bind(this)();
    },
    checkboxToggle: function() {
        this.checkbox.checked = !this.checkbox.checked;
        this.image.src = this.getImage(this.checkbox.checked);
        this.checkbox.fire('checkboxReplacement:stateChanged');
    },
    observerHandler: function(el, value) {
        el.up().down('img').src = el.checked ? this.onImage : this.offImage;
    },
    getImage: function(checked) {
        return this.checkbox.checked ? this.onImage : this.offImage;
    },
    dispose: function(el) {
        this.image.stopObserving('click');
        this.image.remove();
        this.image = null;
        this.checkboxObserver.stop();
        this.checkbox.instance = null;
        if (this.label) {
            this.label.stopObserving('click');
            this.label = null;
        }
        this.checkbox.replacementCheckbox = null;
        this.checkboxObserver = null;
        this.checkbox = null;
    }
});

Event.observe(window,'load',function(e){
    $$('input[type=checkbox]').each(function(checkbox){
       new SniperSystemsCheckbox(checkbox);
    });
});    

        