/**************************************************************
*
* Progress Circle 1.0
*
**************************************************************/

( function( $ ){
	var ProgressCircle = function( element, options ){

		var settings          = $.extend( {}, $.fn.progressCircle.defaults, options );
		var thicknessConstant = 0.02;
		var nRadian           = 0;


		var border      = ( settings.thickness * thicknessConstant ) + 'em';
		var offset      = ( 1 - thicknessConstant * settings.thickness * 2 ) + 'em';
		var container_id=settings.container_id;
		var container_class_name=settings.container_class_name;
		var color1 = settings.color1;
		var color2 = settings.color2;
		var color3 = settings.color3;
		var circle      = $( element );
		var is_negative=0;
		var is_over_100=0;
		var is_below_minus_100=0;
		
		computePercent();
		setThickness();
		
		//logD('container_id: '+container_id);
		var progContainer = $('#'+container_id);
		//var progCirc    = circle.find( '.prog-circle' );
		var progCirc    = progContainer.find( '.prog-circle' );
		//logD('progCirc: '+progCirc);
		var circleDiv   = progCirc.find( '.bar' );
		//logD('circleDiv: '+circleDiv);
		var circleSpan  = progCirc.children( '.percenttext' );
		var circleFill  = progCirc.find( '.fill' );
		//logD('circleFill: '+circleFill);
		var circleSlice = progCirc.find( '.slice' );
		//logD('adding class : fill'+container_class_name);
		circleDiv.addClass('fill'+container_class_name);
		circleFill.addClass('fill'+container_class_name);

		if ( settings.nPercent == 0 ) {
			circleSlice.hide();
		} else {
			resetCircle();
			transformCircle( nRadians, circleDiv, circleFill );
		}
		setBorderThickness();
		updatePercentage();
		setCircleSize();

		function computePercent () {
			if(settings.nPercent < 0)
			{
				color1='#ff7158';color2='#ff7158';color3='#ff7158';
				if(settings.nPercent<-100)
				{
					is_below_minus_100=settings.nPercent;
					settings.nPercent=-100;
				}
				is_negative=1;
				settings.nPercent=-settings.nPercent;
				container_class_name='progressred';
				$('#'+container_id).removeClass('progressblue').removeClass('progressred').addClass('progressred');
			}else{
				color1='#31b0d5';color2='#31b0d5';color3='#31b0d5';
				is_negative=0;
				container_class_name='progressblue';
				$('#'+container_id).removeClass('progressblue').removeClass('progressred').addClass('progressblue');
			}
			if(settings.nPercent > 100)
			{
				is_over_100=settings.nPercent;
				settings.nPercent=100;
			}
			settings.nPercent > 100 || settings.nPercent < 0 ? settings.nPercent = 0 : settings.nPercent;
			nRadians = ( 360 * settings.nPercent ) / 100;
		}

		function setThickness () {
			if ( settings.thickness > 10 ) {
				settings.thickness = 10;
			} else if ( settings.thickness < 1 ) {
				settings.thickness = 1;
			} else {
				settings.thickness = Math.round( settings.thickness );
			}
		}

		function setCircleSize ( ) {
			progCirc.css( 'font-size', settings.circleSize + 'px' );
		}

		function transformCircle ( nRadians, cDiv,cFill ) {
				var rotate = "rotate(" + (is_negative==1?'':'')+Math.round(nRadians) + "deg)";
			    //console.log('rotate: '+rotate);
			    cDiv.css({
			      "-webkit-transform" : rotate,
			      "-moz-transform"    : rotate,
			      "-ms-transform"     : rotate,
			      "-o-transform"      : rotate,
			      "transform"         : rotate,
			    });
			    //if( nRadians > 180 ) {
			    
			    if(nRadians > 180 ) {
			    	/*
			    	cDiv.css({
			    		"background": color2
			    	});
			    	*/
					circleFill.show();
				    //transformCircle( 180, cFill);//circleFill );
				    transformCircle( 180, circleFill );
				    circleSlice.addClass( ' clipauto ');
				}
		}

		function setBorderThickness () {
			progCirc.find(' .slice > div ').css({
				'border-width' : border,
				'width'        : offset,
				'height'       : offset
			})
			if( settings.barOverride ) {
				progCirc.find(' .slice > div.bar ').css({
					'width'        : '1em',
					'height'       : '1em'
				})
			}
			progCirc.find('.after').css({
				'top'    : border,
				'left'   : border,
				'width'  : offset,
				'height' : offset
			})
		}

		function resetCircle () {
			circleSlice.show();
			circleSpan.text( '' );
			circleSlice.removeClass( 'clipauto' )
			transformCircle( 20, circleDiv );
			transformCircle( 20, circleFill );
			return this;
		}

		function updatePercentage()
		{
			settings.showPercentText && circleSpan.html( (is_negative==1?'-':'')+(is_over_100>0 || is_below_minus_100<0 ? '<small>&gt;</small>100':settings.nPercent) /*+ '%'*/ );
		}
	};

	$.fn.progressCircle = function( options ) {
		return this.each( function( key, value ){
      var element = $( this );
      if ( element.data( 'progressCircle' ) ) {
      	var progressCircle = new ProgressCircle( this, options );
      	return element.data( 'progressCircle' );
      }
    	$( this ).append( '<div class="prog-circle">' +
	                 			'	<div class="percenttext"> </div>' +
	                 			'	<div class="slice">' +
	                 			'		<div class="bar"> </div>' +
	                 			'		<div class="fill"> </div>' +
	                 			'	</div>' +
	                 			'	<div class="after"> </div>' +
	                 			'</div>');
      var progressCircle = new ProgressCircle( this, options );
      element.data( 'progressCircle', progressCircle );
  	});
	};

	$.fn.progressCircle.defaults = {
		nPercent        : 50,
		showPercentText : true,
		circleSize      : 100,
		thickness       : 3,
		container_id	:'',
		container_class_name	:'',
		color1			: '#333333',
		color2			: '#cccccc',
		color3			:'#000000',
		barOverride     : true
	};

})( jQuery );