if(!Array.prototype.filter){
    Array.prototype.filter=function(func){
	var arr=[];
	for(var i=0;i<this.length;i++)if(func(this[i]))arr.push(this[i]);
	return arr;
    }
}

function onload(json){
    document.title="R-Consensus:"+json.toulmin.title;
    $("#headertitle_main").text(json.toulmin.title)
    if(treeInfo){
	updateToNew(json);
    }else{
	//	    console.log(JSON.parse(JSON.stringify(json)));
	treeInfo=createJSONTreeInfo(json)
	//userList=getUserListFromJSONTree(treeInfo.root);
	showUserList([]);
	updateNode(treeInfo.root);
	updateTree();
    }
}

function loadUserList(){
    $.ajax({
	url:BASE_URL+"/users/all",
	success:function(o){userList=o.sort();showUserList([]);},
	type:"GET",cache:false,
	error:function(o){console.log("ERROR",o)}
    });
}

function init() {
    popupInit();
    jsPlumb.importDefaults({
	Connector : [ "Straight", { curviness:50 } ],
	PaintStyle : { strokeStyle:"gray", lineWidth:2 },
	EndpointStyle : {},
	Anchors: ["BottomCenter","TopCenter"]
    });
    var consensus_id=(location.search.match("[0-9]+")||[])[0];
    if(consensus_id){
	root_id=consensus_id;
	loadUserList();
	loadConsensus(consensus_id);
    }else{
	document.body.innerHTML="<div style='color:white;font-size:64px'>No ClaimID Specified.<br><a href='index.html' style='color:#88f'>back</a></div>";
    }
}

function displayBlock() {
    $("#loginPopup").css("display","block");    
}

function updateToNew(json){
    var t2=createJSONTreeInfo(json)
    updateJSONTreeDiff(treeInfo.root,t2.root);
    
    updateNode(treeInfo.root);
    treeInfo.newLayout=t2.layout;
    var cnt=0,time=500;
    var time0=new Date();
    var prevCnt=0;
    function tfunc(t){return 2*t-t*t}
    function animation(){
	var cnt=(new Date()-time0)/time;
	if(cnt<1){
	    if(prevCnt!=cnt){
		var pt=tfunc(prevCnt);
		var t=tfunc(cnt);
		animateTree((t-1)/(pt-t));
		prevCnt=cnt;
		
	    }
	    setTimeout(animation,10);
	}else{
	    animateTree(0);
	}
	updateNode(treeInfo.root);
	updateTree();
    }
    animation();
}

var ViewParam={
    offsetTop:100,
    offsetBottom:100,
    offsetLeft:100,
    offsetRight:100,
    nodeWidth:120,
    nodeHeight:60,
    intervalX:140,
    intervalY:120
};

function animateTree(t){
    function animateNodePosition(node,t){
	node.position.x=(node.position.x*t+node.newPosition.x)/(1+t);
	node.position.y=(node.position.y*t+node.newPosition.y)/(1+t);
	for(var i=0;i<node.mentions.length;i++){
	    animateNodePosition(node.mentions[i],t);
	}
	if(t==0){
	    if(node.newPosition.remove){
		jsPlumb.removeAllEndpoints(node.view);
		$(node.view).remove();
	    }
	    node.mentions=node.mentions.filter(function(n){return !n.newPosition.remove});
	}
    }
    animateNodePosition(treeInfo.root,t);
    treeInfo.layout.left=(treeInfo.layout.left*t+treeInfo.newLayout.left)/(1+t);
    treeInfo.layout.right=(treeInfo.layout.right*t+treeInfo.newLayout.right)/(1+t);
    treeInfo.layout.depth=(treeInfo.layout.depth*t+treeInfo.newLayout.depth)/(1+t);
}

function updateTree(){
    with(treeInfo.layout){
	$("#treeRoot").css({
	    left:ViewParam.offsetLeft+ViewParam.nodeWidth/2-ViewParam.intervalX*left,
	    top:ViewParam.offsetTop+ViewParam.nodeHeight/2});
	$("#treeMain").css({
	    width:ViewParam.intervalX*(right-left)+ViewParam.nodeWidth+ViewParam.offsetLeft+ViewParam.offsetRight,
	    height:ViewParam.intervalY*(depth-1)+ViewParam.nodeHeight+ViewParam.offsetTop+ViewParam.offsetBottom,
	    top:50});
    }
    jsPlumb.repaintEverything();
}

var relationJPMap={
    suggestion:"提案",
    refutation:"反論",
    question:"質問"
};

function updateNode(node){
    if(updateClaimElement(node)){
	var fc=$("#treeRoot")[0].firstChild;
	if(fc)$("#treeRoot")[0].insertBefore(node.view[0],fc);
	else $("#treeRoot").append(node.view);
    }
    node.view.css({
	left:node.position.x*ViewParam.intervalX-ViewParam.nodeWidth/2,
	top:node.position.y*ViewParam.intervalY-ViewParam.nodeHeight/2
    });	
    var childs=node.mentions;
    for(var i=0;i<childs.length;i++){
	var child=childs[i];
	var created=!child.view;
	updateNode(child);
	if(created){
	    var c=jsPlumb.connect({source:node.view[0],target:child.view[0]});
	    c.setLabel({label:"<span style='color:white'>"+(relationJPMap[child.relation]||child.relation)+"</span>",cssStyle:"color:white"});
	}
    }
}

var focusedUser=null;
function setFocusedShadowEverything(){
    function recFocusShadow(node){
	setFocusedShadow(node);
	for(var i=0;i<node.mentions.length;i++){
	    recFocusShadow(node.mentions[i]);
	}
    }
    recFocusShadow(treeInfo.root);
}
function setFocusedShadow(node){
    var name=focusedUser||userName;
    var color;
    if(node.info.author==name)color="#afa";
    else{
	var users=node.info.users,status;
	for(var i=0;i<users.length;i++){
	    var u=users[i];
	    if(u.id==name){status=u.status;break;}
	}
	color=({agreed:"#aaf",denied:"#faa",pend:"white",unknown:"white"})[status];
    }
    node.view.css("box-shadow",color?color+" 0 0 30px":"none");
}

function appendStatusElement(viewDiv, status){
    var statusView = $("<div class='nodeStatus'/>");
    statusView.text(status);
    statusView.css({
	left:0,
	top:-5
    });
    viewDiv[0].appendChild(statusView[0]);
}
function updateClaimElement(node){
    var created=false;
    if(!node.view){
	created=true
	node.view=$("<div class='claimNode'/>");
	node.view.click(function(){showClaim(node);});
	node.view.hover(
	    function(){div.css("box-shadow","white 0 0 50px");showUserList(node.info.users,node.info.author)},
	    function(){try{setFocusedShadow(node);}catch(e){console.log(e);}showUserList([])}
	)
    }
    setFocusedShadow(node);
    var div=node.view;
    div.text(node.info.toulmin.title);
    appendStatusElement(node.view, node.info.status);
    var statusBackground={passed:"#aaf",unknown:"#fff",failed:"#faa",fail:"#faa"};
    var statusBorder={passed:"#66a",unknown:"#aaa",failed:"#a66",fail:"#a66"};
    div.css("background",statusBackground[node.info.status]||"white");
    div.css("border-color",statusBorder[node.info.status]||"white");
    return created;
}


function showUserList(users,author){
    var statusMap={};
    var userListElement=$(".userList");
    userListElement.text('')
    if(author)statusMap['#'+author]='author';
    for(var i=0;i<users.length;i++){
	statusMap['#'+users[i].id]=users[i].status;
    }
    for(var i=0;i<userList.length;i++){
	var u=userList[i];
	var ue=createUserElement(u==userName?"あなた("+u+")":u,statusMap['#'+u]);
	if(u==userName){
	    ue.css({fontWeight:"bold"})
	}
	ue.appendTo(userListElement);
	with({name:u,element:ue}){
	    ue.hover(
		function(){
		    element.css("opacity",1);
		    focusedUser=name;setFocusedShadowEverything()
		},
		function(){
		    element.css("opacity",0.5);
		    focusedUser=userName;setFocusedShadowEverything()
		}
	    )
	}
	
    }
    $(".userList").css("opacity","1");
}
function hideUserList(){
    $(".userStatus").css("background","none");
    $(".userItem").css("opacity","1");
    $(".userList").css("opacity","0.2");
}