var tehaiStr = "tehai";
var hiddenStr = "hidden";
var imgStr = "img";
var maxTehai = 4;

setDragObj();

function setDragObj(){

	 new Draggable( 'img1-1', {revert:true} );
	 new Draggable( 'img1-2', {revert:true} );
	 new Draggable( 'img1-3', {revert:true} );
	 new Draggable( 'img1-4', {revert:true} );
	 new Draggable( 'img1-5', {revert:true} );
	 new Draggable( 'img1-6', {revert:true} );
	 new Draggable( 'img1-7', {revert:true} );
	 new Draggable( 'img1-8', {revert:true} );
	 new Draggable( 'img1-9', {revert:true} );
	 new Draggable( 'img2-1', {revert:true} );
	 new Draggable( 'img2-2', {revert:true} );
	 new Draggable( 'img2-3', {revert:true} );
	 new Draggable( 'img2-4', {revert:true} );
	 new Draggable( 'img2-5', {revert:true} );
	 new Draggable( 'img2-6', {revert:true} );
	 new Draggable( 'img2-7', {revert:true} );
	 new Draggable( 'img2-8', {revert:true} );
	 new Draggable( 'img2-9', {revert:true} );
	 new Draggable( 'img3-1', {revert:true} );
	 new Draggable( 'img3-2', {revert:true} );
	 new Draggable( 'img3-3', {revert:true} );
	 new Draggable( 'img3-4', {revert:true} );
	 new Draggable( 'img3-5', {revert:true} );
	 new Draggable( 'img3-6', {revert:true} );
	 new Draggable( 'img3-7', {revert:true} );
	 new Draggable( 'img3-8', {revert:true} );
	 new Draggable( 'img3-9', {revert:true} );
	 new Draggable( 'img4-1', {revert:true} );
	 new Draggable( 'img4-2', {revert:true} );
	 new Draggable( 'img4-3', {revert:true} );
	 new Draggable( 'img4-4', {revert:true} );
	 new Draggable( 'img4-5', {revert:true} );
	 new Draggable( 'img4-6', {revert:true} );
	 new Draggable( 'img4-7', {revert:true} );
	 
	Droppables.add( 'tehai1', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
		  	$("tehai1hidden").value = element.id;
		    $("tehai1").innerHTML = "<img src='"+element.src+"' id='tehai1img' />";
		   // new Draggable( 'tehai1img', {revert:false,constraint:'horizontal'} );
	    }
	  }
	} );
	
	Droppables.add( 'tehai2', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
		    $("tehai2hidden").value = element.id;
		    $("tehai2").innerHTML = "<img src='"+element.src+"' id='tehai2img' />";
		    //new Draggable( 'tehai2img', {revert:false} );
	  	}
	  }
	} );
	Droppables.add( 'tehai3', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
		    $("tehai3hidden").value = element.id;
		    $("tehai3").innerHTML = "<img src='"+element.src+"' id='tehai3img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai4', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
		    $("tehai4hidden").value = element.id;
		    $("tehai4").innerHTML = "<img src='"+element.src+"' id='tehai4img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai5', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
		    $("tehai5hidden").value = element.id;
		    $("tehai5").innerHTML = "<img src='"+element.src+"' id='tehai5img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai6', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai6hidden").value = element.id;
	    	$("tehai6").innerHTML = "<img src='"+element.src+"' id='tehai6img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai7', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai7hidden").value = element.id;
	    	$("tehai7").innerHTML = "<img src='"+element.src+"' id='tehai7img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai8', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai8hidden").value = element.id;
	    	$("tehai8").innerHTML = "<img src='"+element.src+"' id='tehai8img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai9', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai9hidden").value = element.id;
	    	$("tehai9").innerHTML = "<img src='"+element.src+"' id='tehai9img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai10', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai10hidden").value = element.id;
	    	$("tehai10").innerHTML = "<img src='"+element.src+"' id='tehai10img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai11', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai11hidden").value = element.id;
	    	$("tehai11").innerHTML = "<img src='"+element.src+"' id='tehai11img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai12', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai12hidden").value = element.id;
	    	$("tehai12").innerHTML = "<img src='"+element.src+"' id='tehai12img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai13', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai13hidden").value = element.id;
	    	$("tehai13").innerHTML = "<img src='"+element.src+"' id='tehai13img' />";
	  	}
	  }
	} );
	Droppables.add( 'tehai14', {
	  onDrop : function( element )  {
	  	if(tehaiCount(element.id) < maxTehai){
	    	$("tehai14hidden").value = element.id;
	    	$("tehai14").innerHTML = "<img src='"+element.src+"' id='tehai14img' />";
	  	}
	  }
	} );
	Droppables.add( 'dora', {
	  onDrop : function( element )  {
		  var doraHyojiId = getDoraHyoji(element.id);
		  if(tehaiCount(doraHyojiId) < maxTehai){
		    $("dorahidden").value = element.id;
		    $("dora").innerHTML = "<img src='"+element.src+"' id='doraimg' />";
		  }
	  }
	} );
	
	tehaiSet();
}

// 手配を数える
function tehaiCount(id){
	var count = 0;
	for(var i = 1;i < 15;i++){
		var idStr = tehaiStr + i + hiddenStr;
		if($F(idStr) == id){
			count++;
		}
	}
	
	//if($F('dorahidden') == id){
		//count++;
	//}
	
	if(getDoraHyoji($F('dorahidden')) == id){
		count++;
	}
	
	return count;
}

// ドラ表示牌を取得します
function getDoraHyoji(doraValue){
	
	var dora = doraValue;
	
	if(dora == ""){
		return "";
	} 
	
	dora = strCrop(dora);
	// 字牌の場合
	if(dora.charAt(0) == 4){
		
		dorahyoji = dora.charAt(1);
		
		if(dorahyoji == 1){
			dorahyoji = 4;
		} else if(dorahyoji == 5){
			dorahyoji = 7;
		} else {
			dorahyoji = dorahyoji - 1;
		}
		
	} else {
		// 数牌の場合
		dorahyoji = dora.charAt(1);
		if(dorahyoji == 1){
			dorahyoji = 9;
		} else {
			dorahyoji = dorahyoji - 1;
		}
	}
	dora = dora.charAt(0) + dorahyoji;
	dora = strImgpurasu(dora);
	
	return dora;
}

// クリアボタンの動作。hiddenのvalueとli内のimgを消去
function tehaiClear(){

	for(var i = 1;i < 15;i++){
		var idStr = tehaiStr + i + hiddenStr;
		if($F(idStr) != ""){
			Element.remove($(tehaiStr + i+imgStr));
			Element.update($(tehaiStr + i),i);
		}
		$(idStr).value = ""
	}

	if($F('dorahidden') != ""){
			Element.remove($("dora" + imgStr));
			Element.update($("dora"),"");
			$('dorahidden').value = ""
	}
}

function tehaiSort(){
	var valueArray = new Array(13);
	// 現在のidを取り出す
	for(var i=0;i < 13;i++){
		valueArray[i] = strCrop($F(tehaiStr + (i + 1)+hiddenStr));
	}
	// ソートする
	var array = valueArray.sortBy(function(value, index){
  		return value;
	});
	
	for(var i=0;i < 13;i++){
		var imgIdstr = strImgpurasu(array[i]);
		$(tehaiStr + (i + 1)+hiddenStr).value = imgIdstr;
		if(imgIdstr != ""){
			// imgObjを取得
			var imgObj = $(tehaiStr + (i+1) +imgStr);

			// nullじゃなかったらsrcだけ変更
			if(imgObj != null){
				$(tehaiStr + (i+1) +imgStr).src = $(imgIdstr).src;
			} else {
				// nullの場合は新規に作成
				$(tehaiStr+(i+1)).innerHTML = "<img src='"+$(imgIdstr).src+"' id='"+tehaiStr+(i+1)+imgStr+"' />";
			}
		} else {
			// imgObjを取得
			var imgObj = $(tehaiStr + (i+1) +imgStr);
			// nullじゃなかったらイメージがあるので消す
			if(imgObj != null){
				Element.remove($(tehaiStr + (i+1) +imgStr));
				Element.update($(tehaiStr + (i+1)),(i+1));
			}
		}
	}
	
}

// img1-1の形から数字だけを2個抜き出す(ソート用)
function strCrop(str){
	
	if(str.length < 6 || str == ""){
		return "99";
	}

	var cropStr = str.charAt(3) + str.charAt(5);
	return cropStr;
}
// 2桁の数字xyからimgx-yの文字列にする
function strImgpurasu(str){

	if(str == 99){
		return "";
	}

	return "img"+str.charAt(0)+"-"+str.charAt(1);
}

// hiddenに値がある場合、手配を復元
function tehaiSet(){
	for(var i = 1;i < 15;i++){
		var idStr = tehaiStr + i + hiddenStr;
		if($F(idStr) != ""){
			$(tehaiStr+i).innerHTML = "<img src='"+$($F(idStr)).src+"' id='"+tehaiStr+i+imgStr+"' />";
		}

	}

	if($F('dorahidden') != ""){
		$('dora').innerHTML = "<img src='"+$($F('dorahidden')).src+"' id='doraimg' />";
	}
}


// エラーチェック
function errorCheck(){

	var errorMsg = "";
	
	for(var i = 1;i < 15;i++){
		var idStr = tehaiStr + i + hiddenStr;
		if($F(idStr) == ""){
			errorMsg = "手牌が未完成です。<br />";
			break;
		}
	}
	
	if($F('dorahidden') == ""){
		errorMsg += "ドラが未選択です。<br />";
	}
	
	if($('user_name').value.length > 20){
		errorMsg += "名前は20文字以内でお願いします。<br />";
	}
	
	if($('comment_js').value.length > 100){
		errorMsg += "状況は100文字以内でお願いします<br />";
	}

	if(errorMsg == ""){
		return true;
	}else {
		Element.addClassName($('error'), "error")
		Element.update($('error'),errorMsg);
		return false;
	}
}