	function playSound(x) {
		var getID = x.getAttribute("id");
		stopsound();
		var getAudio = document.getElementById('a'+getID);
			getAudio.currentTime = 0;
			getAudio.play();
	}
	
	function stopsound()
	{
		var getAudios1 = document.getElementById('as1');
		getAudios1.pause();
		getAudios1.currentTime = 0;
		var getAudios2 = document.getElementById('as2');
		getAudios2.pause();
		getAudios2.currentTime = 0;
		var getAudios3 = document.getElementById('as3');
		getAudios3.pause();
		getAudios3.currentTime = 0;
		var getAudios4 = document.getElementById('as4');
		getAudios4.pause();
		getAudios4.currentTime = 0;
	}

$(document).ready(function(){
	window.onload = init;
	
	// var btnClr = document.getElementById('btnclr1');
	//var btnValider = document.getElementById('btn2');
	
	var isReponses = false;
	var counter = 0;	//	Counter is used to count number of clicks in Validator
	
	function init() {
		
		//btnClr.onclick = clear;
		//btnValider.onclick = checkAns;
	}
	
	function reset_ans() {
		$(".droppable").each(function(){
			$(this).empty();
		});
		//	To Stop Audio
		stopsound();
		$(".quebox").each(function(){
				$(this).css({"display":"block"});
		});
		$(".ansbox").each(function(){
			$(this).css({"display":"none"});
		});
		init();
	}
	
	function clear() {
		stopsound();
		//	Clear all Drag Element
		$(".droppable").each(function(){
			$(this).empty();
		});
		//	To Stop Audio
		var corAudio = document.getElementById('as4');
		corAudio.pause();
		corAudio.currentTime = 0;
		$(".quebox").each(function(){
				$(this).css({"display":"block"});
		});
		$(".ansbox").each(function(){
			$(this).css({"display":"none"});
		});
		init();
	}
	
	function checkAns() {
		stopsound();
		counter = counter + 1;
		var isRight = true;
		$(".quebox").each(function(){
			if($(this).find("span").text() != ""){
				var ans = $(this).find("span").text();
				var uans = $(this).find("div").children("span").eq(0).attr("id");
				if(ans == uans){
					$(this).find("div").children("span").eq(0).children('span').eq(0).css({"-moz-box-shadow":"4px 5px 15px green","-webkit-box-shadow":"4px 5px 15px green", "-o-box-shadow":"4px 5px 15px green", "box-shadow":"4px 5px 15px green", "border":"2px solid green"});
				}else{
					isRight = false;
					$(this).find("div").children("span").eq(0).children('span').eq(0).css({"-moz-box-shadow":"4px 5px 15px red","-webkit-box-shadow":"4px 5px 15px red", "-o-box-shadow":"4px 5px 15px red", "box-shadow":"4px 5px 15px red", "border":"2px solid red"});
				}
			}
		});
		
		
	}
	
	function answer() {
		stopsound();
		if(!isReponses){
			$(".quebox").each(function(){
				$(this).css({"display":"none"});
			});
			$(".ansbox").each(function(){
				$(this).css({"display":"block"});
			});
			isReponses = true;
		}else{
			$(".quebox").each(function(){
				$(this).css({"display":"block"});
			});
			$(".ansbox").each(function(){
				$(this).css({"display":"none"});
			});
			isReponses = false;
		}
		
	}
	
	$('.draggable').draggable({
	  
	  drag: function(event, ui) {
		ui.position.left = ui.position.left-1;
		ui.position.top = ui.position.top-1;
	  },
	  revert: "invalid",
	  stack: ".draggable",
	  helper: 'clone'
	});
	
	$('.droppable').droppable({
	  accept: ".draggable",
	  drop: function(event, ui) {
		var droppable = $(this);
		var draggable = ui.draggable;
		var id = draggable.context.attributes.id.value;
		if(droppable.context.childElementCount != -1){
			// Move draggable into droppable
			$(droppable).html("");
			$('<span class="ans" id="a_'+id+'"><span>'+ui.draggable.context.innerHTML+'</span></span>').appendTo(droppable);
			enableValidatorBtn();
		}
	  }
	});
	
	function enableValidatorBtn(){
		var isValid = true;
		$(".quebox > .droppable").each(function(){
			if(this.childElementCount <= 0){
				isValid = false;
				return false;
			}
		});
		
		
			checkAns();
		
	}
	
});