Ext.ns('Ext.Ims');
Ext.Ims.CommentRatings = Ext.extend(Ext.util.Observable, {
	
	// Our class constructor
    constructor : function(container, config) {
		this.addEvents(
			'beforerate',
			'rate'
		);
        
        this.rateUrl = '/comment/rate';
        
        this.itemId = itemId;
        this.typeId = 0;
        
		Ext.apply(this, config);
        
        Ext.Ims.CommentRatings.superclass.constructor.call(this);
        
        this.elementTemplate = new Ext.Template('<a class="c-points-count"><em>{total_val}</em> {pts_text}</a>',
        		'<a class="c-points-count" style="display: none;"><em>+{rate_positive}</em> / <span>-{rate_negative}</span></a>');
        
        this.el = Ext.get(container);
        this.init();
    },

	init: function()
	{
    	this.el.select('a.votebtn img').each(function(img) {
    		if(img.hasClass('c-disabled') === false) {
    			img.parent('a').on('click', this.rate, this);
    		}
    	},this);
    	
    	this._initPointsCounters(this.el);
	},
	
	_initPointsCounters : function(el)
	{
		el.select('a.c-points-count').on('click', this.togglePoints, this);	
		this.pointscount = this.el.select('a.c-points-count');
		this.pointscount.setVisibilityMode(Ext.Element.DISPLAY);
	},
	
	togglePoints: function()
	{
		this.pointscount.toggle();
	},
    
    rate: function(e)
    {
		var el = e.getTarget();
		
		if(el.tagName != "IMG") { el = Ext.fly(el).child('img', true); }
		
		var elparts = el.id.split('-');
		if(this.fireEvent('beforerate', this, elparts[1], elparts[0])) {
			Ext.Ajax.request({
				url : this.rateUrl,
				params : {
					'comment' : elparts[1],
					'rating'  : elparts[0],
                    'format'  : 'json'
				},
				method: 'post',
				scope: this,
				callback: this.ratedone 
			})
		}
    },
	
	ratedone : function(opt, success, resp)
	{
    	var data = Ext.decode(resp.responseText);
    	if(success) {
    		el = Ext.fly('c' + opt.params.comment ).child('div.c-points');
    		el.select('a.votebtn').each(function(a){
    			a.removeAllListeners();
    			img = a.child('img');
    			img.addClass('c-disabled');
    			img.dom.src = img.dom.src.replace('.png', '-dis.png');
    		}, this)
    		
    		data.pts_text = "points";
    		if(data.total_val == -1 || data.total_val == 1) {
    			data.pts_text = "point";
    		}
    		
    		el.select('a.c-points-count').remove();
    		el.insertHtml('afterBegin', this.elementTemplate.apply(data));
    		
    		this._initPointsCounters(el);
    		
    		this.fireEvent('rate', this);
    		
    	} else {
    		// somethere there stating there was an error
    		alert("Your Comment Rating Could Not Be Save, Please Try Again");
    	}
	}
});

Ext.Ims.CommentForm = Ext.extend(Ext.util.Observable, {
	
	// Our class constructor
    constructor : function(container, config) {
		this.addEvents(
			'beforecomment',
			'comment'
		);
        
        this.itemId = itemId;
        this.typeId = 0;
        this.saveUrl = '/comment/save';
        
		Ext.apply(this, config);
        Ext.Ims.CommentForm.superclass.constructor.call(this);

        this.el = Ext.get(container);
        this.form = this.el.child("form");
        this.init();
    },
    
    init : function()
    {
    	this.form.on('submit', this._processForm, this, {stopEvent: true});
    },
    
    _processForm : function(evt) {
    	
    	var p = { item : this.itemId, type : this.typeId };
    	if(Ext.fly('c_name')) { 
    		p.c_name = Ext.fly('c_name').getValue();
    		p.c_email = Ext.fly('c_email').getValue();
    		p.recaptcha_challenge_field = Ext.fly('recaptcha_challenge_field').getValue();
    		p.recaptcha_response_field = Ext.fly('recaptcha_response_field').getValue();
		}
    	p.c_comment = Ext.fly('c_comment').getValue();
    	
    	this.form.select('.c-error').removeClass('c-error');
    	this.form.select('span.c-error-text').remove();
    	
    	Ext.Ajax.request({
    		url : this.saveUrl,
    		params : p,
    		method: 'post',
    		callback: this._postProcessForm,
    		scope: this
    	});
    },
    
    _postProcessForm : function(opt, success, resp) {
    	var data = Ext.decode(resp.responseText);
    	if(success) {
    		this.el.select('input[type=text]').each(function(){
    			this.dom.value = '';
    		});
    		this.el.select('textarea').each(function(){
    			this.dom.value = '';
    		});
    		
    		if(data.comment) {
    			var ulEl = this.el.parent('ul');
    			ulEl.insertHtml('afterBegin', data.comment);
    			ulEl.select('li.first').removeClass('first');
    			ulEl.select('li:first-child').addClass('first').highlight('fffdea', {duration: 2, endColor: 'FFFFFF'});
    			ulEl.select('li.c-empty').remove();
	    		Ext.fly('comments').child('h2').update((comments+1) + " Comments");
	    		
	    		if(this.commentRatings) {
	    			this.commentRatings._initPointsCounters(ulEl.select('li:first-child'));
	    		}
    		} else {
    			alert("Your Comment has been submitted for approval. Once it has been approved it will display on this page");
    		}
    		
    		if(Ext.fly('recaptcha_response_field')) {
				Ext.fly('recaptcha_response_field').dom.value = '';
				Recaptcha.reload();
			}
    	} else {
    		
    		for(var i in data) {
    			if(typeof data[i] != "function") {
    				if(i != "comment_captcha") {
    					for(var z in data[i]) {
    						if(typeof data[i][z] != "function") {
    							Ext.fly(i).insertHtml('beforeBegin', '<span class="c-error-text">' + data[i][z] + '</span>')
    						}
    					}
    					Ext.fly(i).addClass('c-error');
    				} else {
						Ext.fly('recaptcha_response_field').addClass('c-error');
    				}
    			}
    			
    			// always reload the captcha field;
    			if(Ext.fly('recaptcha_response_field')) {
    				Ext.fly('recaptcha_response_field').dom.value = '';
    				Recaptcha.reload();
    			}
    		}
    	}
    }
});