Mercurial > hg > Members > nobuyasu > TwitterBootstrap

changeset 14:595ea7792a42 draft default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
add ishida's files and scenario.json
author Nobuyasu Oshiro <dimolto@cr.ie.u-ryukyu.ac.jp>
date Mon, 24 Sep 2012 15:01:42 +0900
parents 8b4447c379e5
children
files viewer/ishida/DimViewer.html viewer/ishida/DimViewerV2.html viewer/json/scenario.json
diffstat 3 files changed, 645 insertions(+), 0 deletions(-) [+]
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/viewer/ishida/DimViewer.html	Mon Sep 24 15:01:42 2012 +0900
@@ -0,0 +1,216 @@
+<script>
+
+
+function PopNode(title,content){
+	var element=document.createElement("div");
+	this.element=element;
+	element.className='node'
+	element.innerHTML="<div class='nodePoint'></div><div class='popup'><center></center><pre></pre></div>"
+	element.lastChild.firstChild.textContent=title;
+	element.firstChild.textContent=title;
+	element.lastChild.lastChild.textContent=content;
+	var showhideInfo=this.showhideInfo={cnt:0,speed:0};
+	var obj=this;
+	element.firstChild.onclick=function(){
+		obj.onMarkClick();
+	}
+	var func=function(){
+		showhideInfo.cnt+=showhideInfo.speed;
+		if(showhideInfo.cnt<=0&&showhideInfo.speed<0){
+			showhideInfo.speed=0;
+			showhideInfo.cnt=0;
+			element.lastChild.style.opacity=0;
+			element.lastChild.style.display="none";
+		}else if(showhideInfo.cnt>=10&&showhideInfo.speed>0){
+			showhideInfo.speed=0;
+			showhideInfo.cnt=10;
+			element.lastChild.style.display="block";
+			element.lastChild.style.opacity=1;
+		}else{
+			element.lastChild.style.display="block";
+			element.lastChild.style.opacity=Math.min(showhideInfo.cnt/10,1);
+			setTimeout(func,10);
+		}
+	}
+	this.showhideFunc=func;
+	element.onmouseover=function(){
+		obj.show();
+	}
+	element.onmouseout=function(e){
+		var e=e.relatedTarget;
+		while(e){
+			if(e==element)return;
+			e=e.parentNode;
+		}
+		obj.hide();
+	}
+	this.setLocation(0,0);
+}
+PopNode.prototype.showhide=function(d){
+	if(this.showhideInfo.speed)this.showhideInfo.speed=d;
+	else{
+		this.showhideInfo.speed=d;
+		this.showhideFunc();
+	}
+}
+PopNode.prototype.hide=function(){this.showhide(-1);};
+PopNode.prototype.show=function(){this.showhide(1);};
+PopNode.prototype.onMarkClick=function(){};
+PopNode.prototype.setLocation=function(x,y){
+	this.x=x;this.y=y;
+	this.element.style.left=x;
+	this.element.style.top=y;
+}
+PopNode.prototype.appendTo=function(parent){parent.appendChild(this.element)};
+PopNode.prototype.remove=function(){if(this.element.parentNode)this.element.parentNode.removeChild(this.element)}
+
+
+
+function genRandString(){
+	var s="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
+	var str="";
+	for(var len=12*Math.random();len>=0;len--)str+=s[Math.floor(s.length*Math.random())];
+	return str;
+}
+function genRandLine(){
+	var arr=[];
+	for(var len=6*Math.random();len>=0;len--)arr.push(genRandString());
+	return arr.join(" ");
+}
+var rootNode;
+function MyNode(level,childlength,parent){
+	var obj=this;
+	this.parent=parent;
+	this.childs=[];
+	if(level){
+		for(var i=0;i<childlength;i++)this.childs[i]=new MyNode(level-1,childlength,this);
+	}
+	var title=genRandString();
+	var content=genRandLine()+"\n"+genRandLine();
+	var pnode=this.pnode=new PopNode(title,content);
+	this.childshown=false;
+	this.pnode.onMarkClick=function(){
+		if(obj.childshown){obj.closeChilds();
+			redrawLine();
+			return;
+		}
+
+		if(obj.parent){
+			console.log("closeGrand")
+			obj.parent.closeGrandChilds(obj);
+		}
+
+		var len=obj.childs.length;
+		for(var i=0;i<len;i++){
+			var p=obj.childs[i].pnode;
+			p.appendTo(document.body);
+			var x2=pnode.x-(i-(len-1)/2)*100,y2=pnode.y+200;
+			p.setLocation(x2,y2);
+		}
+		obj.childshown=!obj.childshown;
+		redrawLine();
+	}
+}
+MyNode.prototype.closeGrandChilds=function(except){
+	for(var i=0;i<this.childs.length;i++){
+		if(this.childs[i]!=except)this.childs[i].closeChilds();
+	}
+}
+MyNode.prototype.closeChilds=function(except){
+	for(var i=0;i<this.childs.length;i++){
+		if(this.childs[i]!=except){
+			this.childs[i].closeChilds();
+			this.childs[i].pnode.remove();
+		}
+	}
+	this.childshown=false;
+}
+MyNode.prototype.drawLineRecursive=function(){
+	for(var i=0;i<this.childs.length;i++){
+		var child=this.childs[i];
+		if(child.pnode.element.parentNode){
+			drawArrow(this.pnode.x+40,this.pnode.y+30,child.pnode.x+40,child.pnode.y+30);
+			child.drawLineRecursive();
+		}
+	}
+}
+function redrawLine(){
+	clearCanvas();
+	rootNode.drawLineRecursive();
+}
+
+
+onload=function(){
+	var mn=new MyNode(5,6);
+	mn.pnode.setLocation(512-40,100);
+	mn.pnode.appendTo(document.body);
+	rootNode=mn;
+	return;
+
+
+
+	var popnode=new PopNode("title","content")
+	popnode.appendTo(document.body);
+	popnode.setLocation(200,100);
+	popnode.onMarkClick=function(){
+		var pop2=new PopNode("title2","content2");
+		pop2.appendTo(document.body);
+		pop2.setLocation(200,300);
+	}
+}
+
+var g,canvas;
+function clearCanvas(){
+	if(!g){
+		canvas=document.getElementsByTagName("canvas")[0];
+		g=canvas.getContext("2d");
+	}
+	g.clearRect(0,0,canvas.width,canvas.height);
+}
+function drawArrow(x,y,x2,y2){
+	if(!g){
+		canvas=document.getElementsByTagName("canvas")[0];
+		g=canvas.getContext("2d");
+	}
+	g.beginPath();
+	g.moveTo(x,y);
+	g.lineTo(x2,y2);
+	g.stroke();
+}
+
+
+
+
+</script>
+<style>
+div.node{
+	position:absolute;
+}
+div.nodePoint{
+	z-index:0;
+	position:absolute;left:0;top:0;
+	background:red;width:80px;height:50px;border-radius:25px;
+	font-size:32px;line-height:50px;overflow:hidden;text-align:center;
+	cursor:pointer;
+}
+div.popup{
+	z-index:10;
+	display:none;
+	position:absolute;left:-60px;top:40px;
+	width:200px;height:160px;border-radius:8px;background:white;border:4px solid silver;
+}
+div.popup center{
+	position:absolute;left:10px;top:10px;
+	background:#eef;
+	width:180px;height:40px;line-height:40px;font-size:32px;
+	overflow:hidden;
+} 
+div.popup pre{
+	margin:0;padding:0;
+	position:absolute;
+	left:10px;top:60px;width:180px;height:90px;
+	overflow:scroll;
+}
+</style>
+<body style='margin:0;padding:0;width:100%;height:100%;overflow:hidden;'>
+<canvas style='position:absolute;left:0;top:0;' width=1024 height=1024>
\ No newline at end of file
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/viewer/ishida/DimViewerV2.html	Mon Sep 24 15:01:42 2012 +0900
@@ -0,0 +1,317 @@
+<script>
+
+
+function PopNode(title,content,color){
+	var element=document.createElement("div");
+	this.element=element;
+	element.className='node'
+	element.innerHTML="<div class='nodeFocus'></div><div class='nodePoint'></div><div class='popup'><center></center><pre></pre></div>"
+	var point=element.childNodes[1];
+	point.style.backgroundColor=color;
+	element.lastChild.firstChild.textContent=title;
+	point.textContent=title;
+	element.lastChild.lastChild.textContent=content;
+	var showhideInfo=this.showhideInfo={cnt:0,speed:0};
+	var obj=this;
+	point.onclick=function(){
+		obj.onMarkClick();
+	}
+	var func=function(){
+		showhideInfo.cnt+=showhideInfo.speed;
+		if(showhideInfo.cnt<=0&&showhideInfo.speed<0){
+			showhideInfo.speed=0;
+			showhideInfo.cnt=0;
+			element.lastChild.style.opacity=0;
+			element.lastChild.style.display="none";
+		}else if(showhideInfo.cnt>=10&&showhideInfo.speed>0){
+			showhideInfo.speed=0;
+			showhideInfo.cnt=10;
+			element.lastChild.style.display="block";
+			element.lastChild.style.opacity=1;
+		}else{
+			element.lastChild.style.display="block";
+			element.lastChild.style.opacity=Math.min(showhideInfo.cnt/10,1);
+			setTimeout(func,10);
+		}
+	}
+	this.showhideFunc=func;
+	element.onmouseover=function(){
+		obj.show();
+	}
+	element.onmouseout=function(e){
+		var e=e.relatedTarget;
+		while(e){
+			if(e==element)return;
+			e=e.parentNode;
+		}
+		obj.hide();
+	}
+	this.setLocation(0,0);
+}
+PopNode.prototype.showhide=function(d){
+	if(this.showhideInfo.speed)this.showhideInfo.speed=d;
+	else{
+		this.showhideInfo.speed=d;
+		this.showhideFunc();
+	}
+}
+PopNode.prototype.hide=function(){this.showhide(-1);};
+PopNode.prototype.show=function(){this.showhide(1);};
+PopNode.prototype.onMarkClick=function(){};
+PopNode.prototype.setLocation=function(x,y){
+	this.x=x;this.y=y;
+	this.element.style.left=x;
+	this.element.style.top=y;
+}
+PopNode.prototype.appendTo=function(parent){parent.appendChild(this.element)};
+PopNode.prototype.remove=function(){if(this.element.parentNode)this.element.parentNode.removeChild(this.element)}
+PopNode.prototype.setTarget=function(flag){
+	var e=this.element;
+	if(flag)e.firstChild.style.display='block';//'0 0 100px black'
+	else e.firstChild.style.display='none';
+}
+
+
+function genRandString(){
+	var s="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
+	var str="";
+	for(var len=12*Math.random();len>=0;len--)str+=s[Math.floor(s.length*Math.random())];
+	return str;
+}
+function genRandLine(){
+	var arr=[];
+	for(var len=6*Math.random();len>=0;len--)arr.push(genRandString());
+	return arr.join(" ");
+}
+var rootNode;
+var targetNode;
+function MyNode(level,childlength,parent){
+	var obj=this;
+	if(parent)this.parent=parent;
+	this.childs=[];
+	var len=Math.random()*childlength;
+	if(level)for(var i=0;i<len;i++)this.childs[i]=new MyNode(level-1,childlength,this);
+	
+	
+	var title=genRandString();
+	var content=genRandLine()+"\n"+genRandLine();
+	
+	this.agreeInfo={ok:[],ng:[],pend:[]};
+	for(var i=0;i<userList.length;i++){
+		var uname=userList[i].name;
+		var rnd=(1234*title.charCodeAt(title.length-1-i%title.length)*Math.cos(9876*i)+9876*title.charCodeAt(i%title.length)*Math.sin(1234*i));
+		rnd-=Math.floor(rnd);
+		while(rnd<0)rnd++;
+		while(rnd>1)rnd--;
+		if(rnd<0.5)continue;
+		else if(rnd<0.55)this.agreeInfo.pend.push(uname);
+		else if(rnd<0.998)this.agreeInfo.ok.push(uname);
+		else this.agreeInfo.ng.push(uname);
+	}
+	this.calcAgreeInfo();
+	this.color={ng:'red',ok:'blue',pend:'black'}[this.agreeInfo.status];
+	var bgcolor={ng:'red',ok:'blue',pend:'gray'}[this.agreeInfo.status];
+	var pnode=this.pnode=new PopNode(title,content,bgcolor);
+	this.childshown=false;
+	this.pnode.onMarkClick=function(){
+		if(targetNode)targetNode.setTarget(false);
+		(targetNode=obj).setTarget(true);
+		
+		if(obj.parent)obj.parent.closeGrandChilds(obj);
+//		obj.closeGrandChilds();
+		var len=obj.childs.length;
+		for(var i=0;i<len;i++){
+			var p=obj.childs[i].pnode;
+			p.appendTo(pnode.element.parentNode);
+			var x2=pnode.x-(i-(len-1)/2)*100,y2=pnode.y+200;
+			p.setLocation(x2,y2);
+		}
+		obj.childshown=!obj.childshown;
+		redrawLine();
+		updateUserColor(obj.agreeInfo);
+	}
+}
+MyNode.prototype.closeGrandChilds=function(except){
+	for(var i=0;i<this.childs.length;i++){
+		if(this.childs[i]!=except)this.childs[i].closeChilds();
+	}
+}
+MyNode.prototype.closeChilds=function(except){
+	for(var i=0;i<this.childs.length;i++){
+		if(this.childs[i]!=except){
+			this.childs[i].closeChilds();
+			this.childs[i].pnode.remove();
+		}
+	}
+	this.childshown=false;
+}
+MyNode.prototype.setTarget=function(flag){
+	this.pnode.setTarget(flag);
+}
+MyNode.prototype.drawLineRecursive=function(){
+	for(var i=0;i<this.childs.length;i++){
+		var child=this.childs[i];
+		if(child.pnode.element.parentNode){
+			drawArrow(this.pnode.x+40,this.pnode.y+30,child.pnode.x+40,child.pnode.y+30,child.color);
+			child.drawLineRecursive();
+		}
+	}
+}
+MyNode.prototype.calcAgreeInfo=function(){
+	if(this.agreeInfo.status)return this.agreeInfo.status;
+	var agreePend=false;
+	var agreeNG=false;
+	for(var i=0;i<this.childs.length;i++){
+		var result=this.childs[i].calcAgreeInfo();
+		if(result=='ok')agreePend=true;
+		if(result=='ng')agreeNG=true;
+	}
+	if(this.agreeInfo.ng.length)agreeNG=true;
+	if(this.agreeInfo.pend.length)agreePend=true;
+	this.agreeInfo.status=agreeNG?'ng':agreePend?'pend':'ok';
+	return this.agreeInfo.status;
+}
+
+function redrawLine(){
+	clearCanvas();
+	rootNode.drawLineRecursive();
+}
+
+
+var userList=[];
+
+function UserItem(name){
+	this.name=name;
+	var element=document.createElement("div");
+	this.element=element;
+	element.textContent=name;
+	element.className="userItem-none";
+}
+function updateUserColor(info){
+console.log(info)
+	var arrok=info.ok,arrng=info.ng,arrpend=info.pend;
+	var map={};
+	for(var i=0;i<arrok.length;i++)map[arrok[i]]='ok';
+	for(var i=0;i<arrng.length;i++)map[arrng[i]]='ng';
+	for(var i=0;i<arrpend.length;i++)map[arrpend[i]]='pend';
+	for(var i=0;i<userList.length;i++){
+		var u=userList[i];
+		u.setType(map[u.name]||'none');
+	}
+}
+
+UserItem.prototype.appendTo=function(parent){parent.appendChild(this.element)}
+UserItem.prototype.setType=function(mode){this.element.className="userItem-"+mode}
+
+onload=function(){
+	var listdiv=document.getElementById("userList");
+	for(var i=0;i<10;i++){
+		var u=new UserItem(i+genRandString());
+		u.appendTo(listdiv);
+		userList.push(u);
+	}
+	
+	var mn=new MyNode(3,6);
+	mn.pnode.setLocation(512-40,100);
+	mn.pnode.appendTo(document.getElementById("graphMain"));
+	rootNode=mn;
+}
+
+var g,canvas;
+function clearCanvas(){
+	if(!g){
+		canvas=document.getElementsByTagName("canvas")[0];
+		g=canvas.getContext("2d");
+	}
+	g.clearRect(0,0,canvas.width,canvas.height);
+}
+function drawArrow(x1,y1,x2,y2,color){
+	if(!g){
+		canvas=document.getElementsByTagName("canvas")[0];
+		g=canvas.getContext("2d");
+	}
+	g.beginPath();
+	g.moveTo(x1,y1);
+	g.lineTo(x2,y2);
+	g.strokeStyle=color
+	g.stroke();
+}
+
+
+
+
+</script>
+<style>
+#graph{position:absolute;left:0;top:0;}
+#graphmain{position:absolute;left:0;top:0;}
+
+div.node{
+	position:absolute;
+}
+div.nodeFocus{
+	z-index:0;
+	position:absolute;left:-10;top:-10;
+	width:80px;height:50px;border-radius:18px;
+	border:10px solid black;
+	display:none;
+}
+
+div.nodePoint{
+	z-index:0;
+	position:absolute;left:0;top:0;
+	background:gray;
+	width:80px;height:50px;border-radius:8px;
+	font-size:32px;line-height:50px;overflow:hidden;text-align:center;
+	cursor:pointer;
+}
+div.popup{
+	z-index:10;
+	display:none;
+	position:absolute;left:-60px;top:40px;
+	width:200px;height:160px;border-radius:8px;background:white;border:4px solid silver;
+}
+div.popup center{
+	position:absolute;left:10px;top:10px;
+	background:#eef;
+	width:180px;height:40px;line-height:40px;font-size:32px;
+	overflow:hidden;
+} 
+div.popup pre{
+	margin:0;padding:0;
+	position:absolute;
+	left:10px;top:60px;width:180px;height:90px;
+	overflow:scroll;
+}
+#userList{
+	position:fixed;right:0;top:0;width:200px;height:100%;overflow-x:hidden;overflow-y:scroll;
+}
+
+div.userItem-none,div.userItem-pend,div.userItem-ok,div.userItem-ng{
+	border-radius:4px;
+	font-size:32px;
+	line-height:40px;
+	margin:4px 0;
+}
+div.userItem-none{
+	background:-webkit-gradient(linear,left top,left bottom,from(#eee),to(#ddf));
+	color:#aaa;
+}
+div.userItem-ok{
+	background:-webkit-gradient(linear,left top,left bottom,from(#88f),to(#88a));
+}
+div.userItem-pend{
+	background:-webkit-gradient(linear,left top,left bottom,from(#aaa),to(#888));
+}
+div.userItem-ng{
+	background:-webkit-gradient(linear,left top,left bottom,from(#f88),to(#a88));
+}
+
+
+</style>
+<body style='margin:0;padding:0;width:100%;height:100%;overflow:hidden;'>
+<div id='graph'>
+<canvas style='position:absolute;left:0;top:0;' width=1024 height=1024></canvas>
+<div id='graphMain'></div>
+</div>
+<div id='userList'></div>
+
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/viewer/json/scenario.json	Mon Sep 24 15:01:42 2012 +0900
@@ -0,0 +1,112 @@
+{
+    "root":"4",
+    "Nodes":[
+	{
+	    "id":"1",
+	    "data":{
+		"name":"user1"
+	    }
+	},
+	{
+	    "id":"2",
+	    "data":{
+		"name":"user2"
+	    }
+	},
+	{
+	    "id":"3",
+	    "data":{
+		"name":"user3"
+	    }
+	},
+	{
+	    "id":"4",
+	    "data":{
+		"content":"グラフの関係を使った計算がしやすい。",
+		"title":"GraphDBは使いやすい",
+		"nodeType":"claim"
+	    }
+	},
+	{
+	    "id":"5",
+	    "data":{
+		"content":"RDBには今までの経験がある。",
+		"title":"RDBの方が良い",
+		"nodeType":"claim"
+	    }
+	},
+	{
+	    "id":"6",
+	    "data":{
+		"content":"スケールするGraphDBの方が良い",
+		"title":"RDBはスケールしない。",
+		"nodeType":"claim"
+	    }
+	}
+    ],
+    "Relationships":[
+	{
+	    "start":"4",
+	    "data":{
+	    },
+	    "type":"Author",
+	    "end":"1"
+	},
+	{
+	    "start":"4",
+	    "data":{
+
+	    },
+	    "type":"AgreementRequest",
+	    "end":"2"
+	},
+	{
+	    "start":"4",
+	    "data":{
+
+	    },
+	    "type":"AgreementRequest",
+	    "end":"3"
+	},
+	{
+	    "start":"5",
+	    "data":{
+
+	    },
+	    "type":"Refutation",
+	    "end":"4"
+	},
+	{
+	    "start":"5",
+	    "data":{
+
+	    },
+	    "type":"Author",
+	    "end":"2"
+	},
+	{
+	    "start":"5",
+	    "data":{
+
+	    },
+	    "type":"AgreementRequest",
+	    "end":"1"
+	},
+	{
+	    "start":"6",
+	    "data":{
+
+	    },
+	    "type":"Author",
+	    "end":"1"
+	},
+	{
+	    "start":"6",
+	    "data":{
+
+	    },
+	    "type":"AgreementRequest",
+	    "end":"2"
+	}
+    ]
+}