// remap jQuery to $

(function($){	
	
	 jQuery('#slider').nivoSlider({
		 effect: 'random'
	 });
	 //alert($.cookie('risanje'));
	 var domena = "localhost"
	 if($.cookie('risanje') == null) {
		 $.cookie('risanje', '1',{ expires: 365, path: '/', domain: domena, secure: false });
	 }
	 
	 //facebox
	 $('img[rel*=facebox]').facebox();
	    $('#slider_splet').nivoSlider({
	    	 manualAdvance: true,
	    	 directionNav: false,
	    	 //controlNav: false,
	    	 controlNavThumbs: true,
	    	 controlNavThumbsFromRel: true, // Use image rel for thumbs
	         controlNavThumbsSearch: '.jpg', // Replace this with...
	         controlNavThumbsReplace: '-150x150.jpg' // ...this in thumb Image src
	    });
	    
	    $('#slider_single').nivoSlider({
	    	 manualAdvance: true,
	    	 directionNav: false,
	    	 controlNav: false
	    });
	   
	    
	   
	    $("div#menubar ul li").live("mouseenter", function() {
	    	li = $(this).find("a");
	    	if(!$(li).hasClass("hover")) {
	    		li.addClass("hover")
		    	li.text("| "+li.parent().attr("data-text"));
	    	} else {
	    		li.addClass("active");
	    		li.text(li.parent().attr("data-text")+" |");
	    	}
	    }).live("mouseleave", function() {
	    	li = $(this).find("a");
	    	if($(li).hasClass("hover") && !$(li).hasClass("active")) {
	    		li.removeClass("hover")
		    	li.text(li.parent().attr("data-text")+" |");
	    	} else {
	    		li.text("| "+li.parent().attr("data-text"));
	    	}
	    });
	    
	    if($("div#menubar ul li").hasClass("active")) {
			li = $("div#menubar ul li.active").find("a");
	    	if(!$(li).hasClass("hover")) {
	    		li.addClass("hover")
		    	li.text("| "+li.parent().attr("data-text"));
	    	}
		}
	    //kontakt
	    $("#kontakt-podatki").live("click", function() {
	    	$(this).fadeOut('slow', function() {
	    		$("#forma").fadeIn('slow');
	    	});
	    })
	    
	    $("#nazaj").live("click", function() {
	    	$("#forma").fadeOut('slow', function() {
	    		$("#kontakt-podatki").fadeIn('slow');
	    	});
	    });
	    $("#slider_splet").parent().css("height", "405");
	    
	   $("body").live("click", function(e) {
		   var mouseX = e.pageX;
		   var mouseY = e.pageY;
		   
		   if(mouseX >= $("#kontakt-podatki").offset().left  && mouseX <= $("#kontakt-podatki").offset().left + $("#kontakt-podatki").width() && mouseY >= $("#kontakt-podatki").offset().top && mouseY <= $("#kontakt-podatki").offset().top + $("#kontakt-podatki").height())
			   $("#kontakt-podatki").click();
	   }).mousemove(function(e) {
		   var mouseX = e.pageX;
		   var mouseY = e.pageY;
		   
		   if(mouseX >= $("#kontakt-podatki").offset().left  && mouseX <= $("#kontakt-podatki").offset().left + $("#kontakt-podatki").width() && mouseY >= $("#kontakt-podatki").offset().top && mouseY <= $("#kontakt-podatki").offset().top + $("#kontakt-podatki").height())
			   $(this).css('cursor','pointer');
		   else
			   $(this).css('cursor','auto');
	   });
	    
	   
	    
	   //if($("#x").val() != "")
	//	 prepareCanvas($("#x").val(), $("#y").val(), $("#push").val());
	 //  else
	   prepareCanvas();
	   
	   
	   
		   
	   //else
		//   $("img#ustavi").click();
	   
	   //alert($("#x").val());
	   
	    function prepareCanvas() {

		    	
		
		    	var canvasDiv = document.getElementById('canvasDiv');
		    	
		    	var canvasWidth = $(canvasDiv).width();
		    	var canvasHeight = $(canvasDiv).height()-4;
		    	
		    	canvas = document.createElement('canvas');
		    	canvas.setAttribute('width', canvasWidth);
		    	canvas.setAttribute('height', canvasHeight);
		    	canvas.setAttribute('id', 'canvas');
		    	//canvas.setAttribute('style', 'padding:0;margin:0;');
		    	canvasDiv.appendChild(canvas);
		    	if(typeof G_vmlCanvasManager != 'undefined') {
		    		canvas = G_vmlCanvasManager.initElement(canvas);
		    	}
		    	context = canvas.getContext("2d");
		    	

		    	var zacetek = true;
		    	
		    	
		    	
		    	
		    	
		
		    	/*$('#canvas').mouseup(function(e){
		    	  paint = false;
		    	});
		
		    	$('#canvas').mouseleave(function(e){
		    	  paint = false;
		    	});
		    	*/
		    	var clickX = new Array();
		    	var clickY = new Array();
		    	var pts = new Array();
		    	var clickDrag = new Array();
		    	var paint;
		    	
		    	
		    	
		    
		    	//alert($.cookie('risanje'));
		    	//2222222
		    	if($.cookie('risanje') == "1") {
		    		zacni();
		    		$("img#zacni").hide();
		    		$("img#ustavi").show();
		    	} else {
		    		ustavi();
		    		$("img#ustavi").hide();
		    		$("img#zacni").show();
		    	}
		    	
		    	function addClick(x, y, dragging)
		    	{
		    	//  clickX.push(x);
		    	//  clickY.push(y);
		    	//  clickDrag.push(dragging);
		    	  
		    	  pts.push(x);
		    	  pts.push(y);
		    	 
		    	}
		
		    	function redraw_old() {
		    	  canvas.width = canvas.width; // Clears the canvas
		    	  
		    	  context.strokeStyle = "#000000";
		    	  context.lineJoin = "round";
		    	  context.lineWidth = 5;
		    				
		    	  for(var i=0; i < clickX.length; i++)
		    	  {		
		    	    context.beginPath();
		    	    if(clickDrag[i] && i){
		    	      context.moveTo(clickX[i-1], clickY[i-1]);
		    	     }else{
		    	       context.moveTo(clickX[i]-1, clickY[i]);
		    	     }
		    	     context.lineTo(clickX[i], clickY[i]);
		    	     context.closePath();
		    	     context.stroke();
		    	  }
		    	}
		    	
		    	function redraw() {
		    		canvas.width = canvas.width;// Clears the canvas
		    		context.save();
			    	//context.strokeStyle = "#000000";
		    		context.strokeStyle = "rgba(35, 31, 32, 1)";
			    	context.lineJoin = "round";
			    	context.lineWidth = 4.5;
			    	  var n=pts.length;
			    	  var t = 0.3;
			    	  var cp=[]; 
			    	  
			           if(n < 8)
			        	   return;
			            
			    	  for(var i=0;i<n-4;i+=2){
			           	
			                cp=cp.concat(getControlPoints(pts[i],pts[i+1],pts[i+2],pts[i+3],pts[i+4],pts[i+5],t));
			                
			            }   
			    	  //console.log(cp);
			    	  for(var i=2; i < pts.length-5; i+=2)
			    	  {		
			    	    context.beginPath();
			    	    context.moveTo(pts[i],pts[i+1]);
			    	    context.bezierCurveTo(cp[2*i-2],cp[2*i-1],cp[2*i],cp[2*i+1],pts[i+2],pts[i+3]);
			    	     context.stroke();
			    	     context.closePath();
			    	     
			    	  }
			    	  
			    	  context.beginPath();
			    	  context.moveTo(pts[0],pts[1]);
			    	  context.quadraticCurveTo(cp[0],cp[1],pts[2],pts[3]);
			    	  context.stroke();
			    	  context.closePath();
			            
			            //var color=HSVtoRGB(240,0.8,0.8); // indigo
			           // var color = "#000000";
			            // if(!showDetails){color="#555555"}
			            //context.strokeStyle=hexToCanvasColor(color,0.75); 
			            context.beginPath();
			            context.moveTo(pts[n-2],pts[n-1]);
			           
			            context.quadraticCurveTo(cp[2*n-10],cp[2*n-9],pts[n-4],pts[n-3]);
			            context.stroke();
			            context.closePath();
			            
			            context.restore();
			    	}
		    	
		    	function nafilaj_zac_tocke(xK, yK) {
		    		//console.log(xK+","+yK);
		    		 var oldX = Math.round($(document).width()/2)+15;
		    		 var oldY = 60;
		    		 //var pts=[];
		    		 pts.push(oldX);
		    		 pts.push(oldY);
		    		 var konec = false;
		    		 var i = 0;
		    		 while(!konec) {
		    			i++;
		    			
		    			var x=Math.floor((Math.random()*401)-200);
		    			var y=Math.floor((Math.random()*401)-200);
		    			
		    			while(oldX+x < 0 || oldX+x > $(window).width())
		    				x=Math.floor((Math.random()*401)-200);
		    			
		    			while(oldY+y < 0 || oldY+y > $(window).height())
		    				y=Math.floor((Math.random()*401)-200);
		    			
		    			x += oldX;
		    			y += oldY;
		    			
		    			oldX = x;
		    			oldY = y;
		    			
		    			pts.push(x);
		    			pts.push(y);
		    			
		    			//if(xK-x < 3 && yK-y < 3)
		    			//	konec = true;
		    			
		    			if(i > 15) {
		    				//pts.push(xK);
				    		//pts.push(yK);
				    		break;
		    			}
		    				
		    		}
		    		
		    		redraw();
		    	}
		    	

		    	$(window).load(function() {
		    		if(zacetek)
		    			$("html").trigger('mousemove');
		    	});
		    	
		    	
		    	//$('#canvas').mousemove(function(e){
		    	$("html").bind('mousemove', function(e){
		    	 if(paint){
		    		if(zacetek) {
		    			nafilaj_zac_tocke(e.pageX - this.offsetLeft, e.pageY - this.offsetTop);
		    		}
		    		else {
		    			addClick(e.pageX - this.offsetLeft, e.pageY - this.offsetTop, true);
			    	    redraw();
		    		}
		    		
		    	  }
		    	 zacetek = false;
		    	}).bind('click',function(e) {
		    		if(!paint && $.cookie('risanje') == "1") {
		    			addClick(e.pageX - this.offsetLeft, e.pageY - this.offsetTop, false);
			    	    redraw();
			    	    paint = true;
			    	    $("img#zacni").fadeOut(function() {
			    			$("img#ustavi").fadeIn();
			    	    });
		    		}
		    			//zacni();
		    	});
		    	
		    	function ustavi() {
		    		paint = false;
		    		$.cookie('risanje', '0',{ expires: 365, path: '/', domain: domena, secure: false });
		    		$("img#ustavi").fadeOut(function() {
		    			$("img#zacni").fadeIn();
		    		});
		    	}
		    	
		    	function zacni() {
		    		paint = true;
		    		 $.cookie('risanje', '1',{ expires: 365, path: '/', domain: domena, secure: false });
		    	//	zacetek_X = $("#noga").offset().left + 5;
			    //	zacetek_y = $("#noga").offset().top - 20;
			    	//console.log(zacetek_X+", "+zacetek_y);
			    //	addClick(zacetek_X, zacetek_y, true);
			    //	redraw();
		    		 $("img#zacni").fadeOut(function() {
			    			$("img#ustavi").fadeIn();
			    	});
		    	}
		    	
		    	$(document).keyup(function(e) {
		    		 // if (e.keyCode == 13) { $('.save').click(); }     // enter
		    		  if (e.keyCode == 27) { //ustavi(); 
		    			  paint = false;   // esc
		    			  $("img#ustavi").fadeOut(function() {
				    			$("img#zacni").fadeIn();
				    		});
		    		  }
		    	});

		    	
		    	function shrani() {
		    		
		    	}
		    	
		    	function obnovi() {
		    		
		    	}
		    	
		    	
		    	
		    	$("img#pocisti").click(function() {
		    		pts = [];
		    		zacetek = true;
		    		redraw();
		    		return false;
		    	});
		    	
		    	$("img#ustavi").click(function() {
		    		ustavi();
		    		
		    		return false;
		    	})
		    	
		    	$("img#zacni").click(function() {
		    		zacni();
		    		if(pts.length == 0)
		    			zacetek = true;
		    		
		    		return false;
		    	});
		    	
		    	
		    	 //screenshot
			    $("img#share").click(function() {
	    			/*$("img#ustavi").fadeOut(function() {
	    				$("img#zacni").fadeIn();
			    	});*/
	    			naredi_sliko();
			    });
			    
			    
				var isCtrl = false; 
			   	$(document).keyup(function (e) { 
			   		if(e.which == 17 || e.which == 224) isCtrl=false; 
			   	}).keydown(function (e) {
			   			if(e.which == 17  || e.which == 224) isCtrl=true; 
			   			if(e.which == 70 && isCtrl == true) { //run code for CTRL+F -- ie, save! 
			   				//console.log("share");
			   				
			   				naredi_sliko();
			   				return false; 
			   			} 
			   	});
			   	
			   	function naredi_sliko() {
			   		//paint = false;
			        $('div#okvir').html2canvas({crta: canvas});
			        redraw();
			   	}
		    	
	    	}
	   /* var ulPadding = 0;
	    var lastLi = $("#web ul").find('li:last-child');
	    var div = $("#web");
	    var divWidth = div.width();

	    div.mousemove(function(e){

	        //As images are loaded ul width increases,
	        //so we recalculate it each time
	        var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding;

	        var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
	        div.scrollLeft(left);
	      });*/



	    function drawSpline(ctx,pts,t,closed){
	       // showDetails=document.getElementById('details').checked;
	        
	    	ctx.lineWidth=4;
	        ctx.save();
	        var cp=[];   // array of control points, as x0,y0,x1,y1,...
	        var n=pts.length;
	       
	        if(closed){
	            //   Append and prepend knots and control points to close the curve
	            pts.push(pts[0],pts[1],pts[2],pts[3]);
	            pts.unshift(pts[n-1]);
	            pts.unshift(pts[n-1]);
	            for(var i=0;i<n;i+=2){
	                cp=cp.concat(getControlPoints(pts[i],pts[i+1],pts[i+2],pts[i+3],pts[i+4],pts[i+5],t));
	            }
	            cp=cp.concat(cp[0],cp[1]);   
	            for(var i=2;i<n+2;i+=2){
	                //var color=HSVtoRGB(Math.floor(240*(i-2)/(n-2)),0.8,0.8);
	                var color = "#000000";
	                //if(!showDetails){color="#555555"}
	                ctx.strokeStyle=hexToCanvasColor(color,0.75);       
	                ctx.beginPath();
	                ctx.moveTo(pts[i],pts[i+1]);
	                ctx.bezierCurveTo(cp[2*i-2],cp[2*i-1],cp[2*i],cp[2*i+1],pts[i+2],pts[i+3]);
	                ctx.stroke();
	                ctx.closePath();
	              /*  if(showDetails){
	                   drawControlLine(ctx,pts[i],pts[i+1],cp[2*i-2],cp[2*i-1]);
	                   drawControlLine(ctx,pts[i+2],pts[i+3],cp[2*i],cp[2*i+1]);
	                }*/
	            }
	        }else{  
	            // Draw an open curve, not connected at the ends
	            for(var i=0;i<n-4;i+=2){
	                cp=cp.concat(getControlPoints(pts[i],pts[i+1],pts[i+2],pts[i+3],pts[i+4],pts[i+5],t));
	            }    
	            for(var i=2;i<pts.length-5;i+=2){
	              //  var color=HSVtoRGB(Math.floor(240*(i-2)/(n-2)),0.8,0.8);
	            	var color = "#000000";
	                //if(!showDetails){color="#555555"}
	                ctx.strokeStyle=hexToCanvasColor(color,0.75);       
	                ctx.beginPath();
	                ctx.moveTo(pts[i],pts[i+1]);
	                ctx.bezierCurveTo(cp[2*i-2],cp[2*i-1],cp[2*i],cp[2*i+1],pts[i+2],pts[i+3]);
	                ctx.stroke();
	                ctx.closePath();
	              /*  if(showDetails){
	                    drawControlLine(ctx,pts[i],pts[i+1],cp[2*i-2],cp[2*i-1]);
	                    drawControlLine(ctx,pts[i+2],pts[i+3],cp[2*i],cp[2*i+1]);
	                }*/
	            }
	            //  For open curves the first and last arcs are simple quadratics.
	            //var color=HSVtoRGB(40,0.4,0.4);  // brown
	            var color = "#000000";
	            //if(!showDetails){color="#555555"}
	            ctx.strokeStyle=hexToCanvasColor(color,0.75); 
	            ctx.beginPath();
	            ctx.moveTo(pts[0],pts[1]);
	            ctx.quadraticCurveTo(cp[0],cp[1],pts[2],pts[3]);
	            ctx.stroke();
	            ctx.closePath();
	            
	            //var color=HSVtoRGB(240,0.8,0.8); // indigo
	            var color = "#000000";
	            // if(!showDetails){color="#555555"}
	            ctx.strokeStyle=hexToCanvasColor(color,0.75); 
	            ctx.beginPath();
	            ctx.moveTo(pts[n-2],pts[n-1]);
	            ctx.quadraticCurveTo(cp[2*n-10],cp[2*n-9],pts[n-4],pts[n-3]);
	            ctx.stroke();
	            ctx.closePath();
	           /* if(showDetails){
	                drawControlLine(ctx,pts[2],pts[3],cp[0],cp[1]);
	                drawControlLine(ctx,pts[n-4],pts[n-3],cp[2*n-10],cp[2*n-9]);
	            }*/
	        }
	        ctx.restore();
	        
	       /* if(showDetails){   //   Draw the knot points.
	            for(var i=0;i<n;i+=2){
	                drawPoint(ctx,pts[i],pts[i+1],2.5,"#ffff00");
	            }
	        }*/
	    }
	    function hexToCanvasColor(hexColor,opacity){
	        // Convert #AA77CC to rbga() format for Firefox
	        opacity=opacity || "1.0";
	        hexColor=hexColor.replace("#","");
	        var r=parseInt(hexColor.substring(0,2),16);
	        var g=parseInt(hexColor.substring(2,4),16);
	        var b=parseInt(hexColor.substring(4,6),16);
	        return "rgba("+r+","+g+","+b+","+opacity+")";
	    }
	    function getControlPoints(x0,y0,x1,y1,x2,y2,t){
	        //  x0,y0,x1,y1 are the coordinates of the end (knot) pts of this segment
	        //  x2,y2 is the next knot -- not connected here but needed to calculate p2
	        //  p1 is the control point calculated here, from x1 back toward x0.
	        //  p2 is the next control point, calculated here and returned to become the 
	        //  next segment's p1.
	        //  t is the 'tension' which controls how far the control points spread.
	        
	        //  Scaling factors: distances from this knot to the previous and following knots.
	        var d01=Math.sqrt(Math.pow(x1-x0,2)+Math.pow(y1-y0,2));
	        var d12=Math.sqrt(Math.pow(x2-x1,2)+Math.pow(y2-y1,2));
	       
	        var fa=t*d01/(d01+d12);
	        var fb=t-fa;
	      
	        var p1x=x1+fa*(x0-x2);
	        var p1y=y1+fa*(y0-y2);

	        var p2x=x1-fb*(x0-x2);
	        var p2y=y1-fb*(y0-y2);  
	        
	        return [p1x,p1y,p2x,p2y];
	    }

	   
	   
})(window.jQuery);