|
51
|
1 <meta http-equiv="content-type" content="text/html;charset=utf-8" />
|
|
53
|
2 <title>R-Consensus</title>
|
|
51
|
3 <link rel='stylesheet' href="form.css">
|
|
|
4 <script src='form.js'></script>
|
|
|
5 <script type="text/javascript" src="js/lib/jquery-1.8.1-min.js"></script>
|
|
|
6 <script type="text/javascript" src="js/lib/jquery-ui-1.8.23-min.js"></script>
|
|
|
7 <script type="text/javascript" src="js/lib/jquery.ui.touch-punch.min.js"></script>
|
|
|
8 <script type="text/javascript" src="js/lib/jsBezier-0.4-min.js"></script>
|
|
|
9 <script type="text/javascript" src="js/1.3.15/jsPlumb-util-1.3.15-RC1.js"></script>
|
|
|
10 <script type="text/javascript" src="js/1.3.15/jsPlumb-dom-adapter-1.3.15-RC1.js"></script>
|
|
|
11 <script type="text/javascript" src="js/1.3.15/jsPlumb-1.3.15-RC1.js"></script>
|
|
|
12 <script type="text/javascript" src="js/1.3.15/jsPlumb-defaults-1.3.15-RC1.js"></script>
|
|
|
13 <script type="text/javascript" src="js/1.3.15/jsPlumb-renderers-svg-1.3.15-RC1.js"></script>
|
|
|
14 <script type="text/javascript" src="js/1.3.15/jsPlumb-renderers-canvas-1.3.15-RC1.js"></script>
|
|
|
15 <script type="text/javascript" src="js/1.3.15/jsPlumb-renderers-vml-1.3.15-RC1.js"></script>
|
|
|
16 <script type="text/javascript" src="js/1.3.15/jquery.jsPlumb-1.3.15-RC1.js"></script>
|
|
|
17 <script type="text/javascript" src='treeArrangement.js'></script>
|
|
|
18 <script type="text/javascript">
|
|
|
19 var LOAD_INTERVAL=5;
|
|
|
20 var BASE_URL="";
|
|
|
21 if(!Array.prototype.filter){
|
|
|
22 Array.prototype.filter=function(func){
|
|
|
23 var arr=[];
|
|
|
24 for(var i=0;i<this.length;i++)if(func(this[i]))arr.push(this[i]);
|
|
|
25 return arr;
|
|
|
26 }
|
|
|
27 }
|
|
|
28
|
|
53
|
29 var userName;
|
|
|
30
|
|
51
|
31 var treeInfo;
|
|
|
32 var userList=[];
|
|
|
33 var root_id;
|
|
|
34 function loadConsensus(id){
|
|
|
35 function onload(json){
|
|
53
|
36 document.title="R-Consensus : "+json.toulmin.title;
|
|
51
|
37 $("#header_title").text("R-Consensus : "+json.toulmin.title)
|
|
|
38 if(treeInfo){
|
|
|
39 updateToNew(json);
|
|
|
40 }else{
|
|
|
41 console.log(JSON.parse(JSON.stringify(json)));
|
|
|
42 treeInfo=createJSONTreeInfo(json)
|
|
|
43 //userList=getUserListFromJSONTree(treeInfo.root);
|
|
|
44 showUserList([]);
|
|
|
45 updateNode(treeInfo.root);
|
|
|
46 updateTree();
|
|
|
47 }
|
|
|
48 }
|
|
|
49 $.ajax({
|
|
|
50 url:BASE_URL+"/consensus/browse/"+id,
|
|
|
51 success:function(o){onload(o)},
|
|
|
52 type:"GET",cache:false,
|
|
|
53 error:function(o){console.log("ERROR",o)}
|
|
|
54 });
|
|
|
55 }
|
|
|
56 function loadUserList(){
|
|
|
57 $.ajax({
|
|
|
58 url:BASE_URL+"/users/all",
|
|
53
|
59 success:function(o){userList=o.sort();showUserList([]);},
|
|
51
|
60 type:"GET",cache:false,
|
|
|
61 error:function(o){console.log("ERROR",o)}
|
|
|
62 });
|
|
|
63 }
|
|
|
64
|
|
|
65
|
|
|
66 $(function(){
|
|
53
|
67 userName=localStorage.userName;
|
|
|
68 if(userName)start();
|
|
|
69 else $("#loginPopup").css("display","block");
|
|
|
70 })
|
|
|
71 function login(uname){
|
|
|
72 userName=localStorage.userName=uname;
|
|
|
73 start();
|
|
|
74 }
|
|
|
75 function start(){
|
|
|
76 $.ajax({
|
|
|
77 url:BASE_URL+"/users/create/"+userName,
|
|
|
78 success:function(o){console.log(o)},
|
|
|
79 type:"PUT",cache:false,
|
|
|
80 error:function(o){console.log(o)}
|
|
|
81 });
|
|
|
82
|
|
51
|
83 popupInit();
|
|
|
84 jsPlumb.importDefaults({
|
|
|
85 Connector : [ "Straight", { curviness:50 } ],
|
|
|
86 PaintStyle : { strokeStyle:"gray", lineWidth:2 },
|
|
|
87 EndpointStyle : {},
|
|
|
88 Anchors: ["BottomCenter","TopCenter"]
|
|
|
89 });
|
|
|
90 var consensus_id=(location.search.match("[0-9]+")||[])[0];
|
|
|
91 if(consensus_id){
|
|
|
92 root_id=consensus_id;
|
|
|
93 loadUserList()
|
|
|
94 loadConsensus(consensus_id);
|
|
|
95 setInterval(function(){loadUserList();loadConsensus(consensus_id)},LOAD_INTERVAL*1000);
|
|
|
96 }else{
|
|
|
97 document.body.innerHTML="<div style='color:white;font-size:64px'>No ClaimID Specified.<br><a href='index.html' style='color:#88f'>back</a></div>";
|
|
|
98 }
|
|
53
|
99 }
|
|
51
|
100
|
|
|
101 function updateToNew(json){
|
|
|
102 var t2=createJSONTreeInfo(json)
|
|
|
103 updateJSONTreeDiff(treeInfo.root,t2.root);
|
|
|
104
|
|
|
105 updateNode(treeInfo.root);
|
|
|
106 treeInfo.newLayout=t2.layout;
|
|
|
107 var cnt=0,time=500;
|
|
|
108 var time0=new Date();
|
|
|
109 var prevCnt=0;
|
|
|
110 function tfunc(t){return 2*t-t*t}
|
|
|
111 function animation(){
|
|
|
112 var cnt=(new Date()-time0)/time;
|
|
|
113 if(cnt<1){
|
|
|
114 if(prevCnt!=cnt){
|
|
|
115 var pt=tfunc(prevCnt);
|
|
|
116 var t=tfunc(cnt);
|
|
|
117 animateTree((t-1)/(pt-t));
|
|
|
118 prevCnt=cnt;
|
|
|
119
|
|
|
120 }
|
|
|
121 setTimeout(animation,10);
|
|
|
122 }else{
|
|
|
123 animateTree(0);
|
|
|
124 }
|
|
|
125 updateNode(treeInfo.root);
|
|
|
126 updateTree();
|
|
|
127 }
|
|
|
128 animation();
|
|
|
129 }
|
|
|
130
|
|
|
131 var ViewParam={
|
|
|
132 offsetTop:100,
|
|
|
133 offsetBottom:100,
|
|
|
134 offsetLeft:100,
|
|
|
135 offsetRight:100,
|
|
|
136 nodeWidth:120,
|
|
|
137 nodeHeight:60,
|
|
|
138 intervalX:140,
|
|
|
139 intervalY:120
|
|
|
140 };
|
|
|
141
|
|
|
142 function animateTree(t){
|
|
|
143 function animateNodePosition(node,t){
|
|
|
144 node.position.x=(node.position.x*t+node.newPosition.x)/(1+t);
|
|
|
145 node.position.y=(node.position.y*t+node.newPosition.y)/(1+t);
|
|
|
146 for(var i=0;i<node.mentions.length;i++){
|
|
|
147 animateNodePosition(node.mentions[i],t);
|
|
|
148 }
|
|
|
149 if(t==0){
|
|
|
150 if(node.newPosition.remove){
|
|
|
151 jsPlumb.removeAllEndpoints(node.view);
|
|
|
152 $(node.view).remove();
|
|
|
153 }
|
|
|
154 node.mentions=node.mentions.filter(function(n){return !n.newPosition.remove});
|
|
|
155 }
|
|
|
156 }
|
|
|
157 animateNodePosition(treeInfo.root,t);
|
|
|
158 treeInfo.layout.left=(treeInfo.layout.left*t+treeInfo.newLayout.left)/(1+t);
|
|
|
159 treeInfo.layout.right=(treeInfo.layout.right*t+treeInfo.newLayout.right)/(1+t);
|
|
|
160 treeInfo.layout.depth=(treeInfo.layout.depth*t+treeInfo.newLayout.depth)/(1+t);
|
|
|
161 }
|
|
|
162
|
|
|
163 function updateTree(){
|
|
|
164 with(treeInfo.layout){
|
|
|
165 $("#treeRoot").css({
|
|
|
166 left:ViewParam.offsetLeft+ViewParam.nodeWidth/2-ViewParam.intervalX*left,
|
|
|
167 top:ViewParam.offsetTop+ViewParam.nodeHeight/2});
|
|
|
168 $("#treeMain").css({
|
|
|
169 width:ViewParam.intervalX*(right-left)+ViewParam.nodeWidth+ViewParam.offsetLeft+ViewParam.offsetRight,
|
|
|
170 height:ViewParam.intervalY*(depth-1)+ViewParam.nodeHeight+ViewParam.offsetTop+ViewParam.offsetBottom,
|
|
|
171 top:50});
|
|
|
172 }
|
|
|
173 jsPlumb.repaintEverything();
|
|
|
174 }
|
|
|
175
|
|
|
176
|
|
|
177 var relationJPMap={
|
|
|
178 suggestion:"提案",
|
|
|
179 refutation:"反論",
|
|
|
180 question:"質問"
|
|
|
181 };
|
|
|
182 function updateNode(node){
|
|
|
183 if(updateClaimElement(node)){
|
|
|
184 var fc=$("#treeRoot")[0].firstChild;
|
|
|
185 if(fc)$("#treeRoot")[0].insertBefore(node.view[0],fc);
|
|
|
186 else $("#treeRoot").append(node.view);
|
|
|
187 }
|
|
|
188 node.view.css({
|
|
|
189 left:node.position.x*ViewParam.intervalX-ViewParam.nodeWidth/2,
|
|
|
190 top:node.position.y*ViewParam.intervalY-ViewParam.nodeHeight/2
|
|
|
191 });
|
|
|
192 var childs=node.mentions;
|
|
|
193 for(var i=0;i<childs.length;i++){
|
|
|
194 var child=childs[i];
|
|
|
195 var created=!child.view;
|
|
|
196 updateNode(child);
|
|
|
197 if(created){
|
|
|
198 var c=jsPlumb.connect({source:node.view[0],target:child.view[0]});
|
|
|
199 c.setLabel({label:"<span style='color:white'>"+(relationJPMap[child.relation]||child.relation)+"</span>",cssStyle:"color:white"});
|
|
|
200 }
|
|
|
201 }
|
|
|
202 }
|
|
|
203
|
|
|
204 var focusedUser=null;
|
|
|
205 function setFocusedShadowEverything(){
|
|
|
206 function recFocusShadow(node){
|
|
|
207 setFocusedShadow(node);
|
|
|
208 for(var i=0;i<node.mentions.length;i++){
|
|
|
209 recFocusShadow(node.mentions[i]);
|
|
|
210 }
|
|
|
211 }
|
|
|
212 recFocusShadow(treeInfo.root);
|
|
|
213 }
|
|
|
214 function setFocusedShadow(node){
|
|
|
215 var name=focusedUser||userName;
|
|
|
216 var color;
|
|
|
217 console.log(node.info.author)
|
|
|
218 if(node.info.author==name)color="#afa";
|
|
|
219 else{
|
|
|
220 var users=node.info.users,status;
|
|
|
221 for(var i=0;i<users.length;i++){
|
|
|
222 var u=users[i];
|
|
|
223 if(u.id==name){status=u.status;break;}
|
|
|
224 }
|
|
|
225 color=({agreed:"#aaf",denied:"#faa",pend:"white",unknown:"white"})[status];
|
|
|
226 }
|
|
|
227 node.view.css("box-shadow",color?color+" 0 0 30px":"none");
|
|
|
228 }
|
|
|
229 function updateClaimElement(node){
|
|
|
230 var created=false;
|
|
|
231 if(!node.view){
|
|
|
232 created=true
|
|
|
233 node.view=$("<div class='claimNode'/>");
|
|
|
234 node.view.click(function(){showClaim(node);});
|
|
|
235 node.view.hover(
|
|
|
236 function(){div.css("box-shadow","white 0 0 50px");showUserList(node.info.users,node.info.author)},
|
|
|
237 function(){try{setFocusedShadow(node);}catch(e){console.log(e);}showUserList([])}
|
|
|
238 )
|
|
|
239 }
|
|
|
240 setFocusedShadow(node);
|
|
|
241 var div=node.view;
|
|
|
242 div.text(node.info.toulmin.title);
|
|
|
243 var statusBackground={pass:"#aaf",unknown:"#fff",failed:"#faa",fail:"#faa"};
|
|
|
244 var statusBorder={pass:"#66a",unknown:"#aaa",failed:"#a66",fail:"#a66"};
|
|
|
245 div.css("background",statusBackground[node.info.status]||"white");
|
|
|
246 div.css("border-color",statusBorder[node.info.status]||"white");
|
|
|
247 return created;
|
|
|
248 }
|
|
|
249
|
|
|
250
|
|
|
251 function showUserList(users,author){
|
|
|
252 var statusMap={};
|
|
|
253 var userListElement=$(".userList");
|
|
|
254 userListElement.text('')
|
|
|
255 if(author)statusMap['#'+author]='author';
|
|
|
256 for(var i=0;i<users.length;i++){
|
|
|
257 statusMap['#'+users[i].id]=users[i].status;
|
|
|
258 }
|
|
|
259 for(var i=0;i<userList.length;i++){
|
|
|
260 var u=userList[i];
|
|
|
261 var ue=createUserElement(u==userName?"あなた("+u+")":u,statusMap['#'+u]);
|
|
|
262 if(u==userName){
|
|
|
263 ue.css({fontWeight:"bold"})
|
|
|
264 }
|
|
|
265 ue.appendTo(userListElement);
|
|
|
266 with({name:u,element:ue}){
|
|
|
267 ue.hover(
|
|
|
268 function(){
|
|
|
269 element.css("opacity",1);
|
|
|
270 focusedUser=name;setFocusedShadowEverything()
|
|
|
271 },
|
|
|
272 function(){
|
|
|
273 element.css("opacity",0.5);
|
|
|
274 focusedUser=userName;setFocusedShadowEverything()
|
|
|
275 }
|
|
|
276 )
|
|
|
277 }
|
|
|
278
|
|
|
279 }
|
|
|
280 $(".userList").css("opacity","1");
|
|
|
281 }
|
|
|
282 function hideUserList(){
|
|
|
283 $(".userStatus").css("background","none");
|
|
|
284 $(".userItem").css("opacity","1");
|
|
|
285 $(".userList").css("opacity","0.2");
|
|
|
286 }
|
|
|
287 </script>
|
|
|
288 <style>
|
|
|
289 div.claimNode{
|
|
|
290 z-index:20;
|
|
|
291 position:absolute;width:92px;height:40px;font-size:12px;padding:4px;background:white;
|
|
|
292 border:2px solid silver;
|
|
|
293 overflow:hidden;
|
|
|
294 border-radius:5px;
|
|
|
295 cursor:pointer;
|
|
|
296 }
|
|
|
297 body{background-color:black;}
|
|
|
298
|
|
|
299 div.userList{
|
|
|
300 position:fixed;
|
|
|
301 z-index:30;
|
|
|
302 right:0;top:0;
|
|
|
303 width:160px;
|
|
|
304 }
|
|
|
305 div.header{
|
|
|
306 position:absolute;
|
|
|
307 left:0;top:0;
|
|
|
308 z-index:5;
|
|
|
309 height:50px;
|
|
|
310 width:100%;
|
|
|
311 background:#223;
|
|
53
|
312 background:-moz-linear-gradient(top,#002,#223);
|
|
51
|
313 background:-webkit-gradient(linear,left top,left bottom,from(#002),to(#223));
|
|
|
314 color:silver;
|
|
|
315 font-size:40px;
|
|
|
316 }
|
|
|
317
|
|
|
318
|
|
|
319 </style>
|
|
|
320 <script>
|
|
|
321 function resetMentionForm(){
|
|
|
322 var keys=['title','contents','w','d','b','q','r'];
|
|
|
323 for(var i=0;i<keys.length;i++)$("#mentionform_"+keys[i]).val("");
|
|
|
324 $("#mention_option")[0].className="option";
|
|
|
325 }
|
|
|
326 var formClaim;
|
|
|
327 var claimUserMap,mentionUserMap;
|
|
|
328 function showClaim(claim){
|
|
|
329 formClaim=claim;
|
|
|
330 var info=claim.info;
|
|
|
331 var keys=['title','contents','w','d','b','q','r'];
|
|
|
332 for(var i=0;i<keys.length;i++)$("#claimform_"+keys[i]).val(info.toulmin[keys[i]]);
|
|
|
333
|
|
|
334 var status="";
|
|
|
335 for(var i=0;i<info.users.length;i++)if(info.users[i].id==userName)status=info.users[i].status;
|
|
|
336 var op=({denied:1,pend:2,agreed:3})[status];
|
|
|
337
|
|
|
338 $("#claim_status").text(info.status)
|
|
|
339 $("#claim_status").css("color",({pass:"blue",failed:"red",fail:"red",unknown:"black"})[info.status]);
|
|
|
340 $("#agree_option")[0].className="option"+(op?" option"+op:"");
|
|
|
341 $("#agree_option").css("display",status?"block":"none");
|
|
|
342
|
|
|
343 $("#claim_button").css("display",(userName==info.author)?"block":"none");
|
|
|
344 $("#claimvote_option").css("display",status?"block":"none");
|
|
|
345
|
|
|
346 $("#claimbody")[0].className="claim_contents";
|
|
|
347 $("#mentionbody")[0].className="mention_contents";
|
|
|
348
|
|
|
349 $("#claim_author").text(info.author);
|
|
|
350 $("#mention_author").text(userName);
|
|
|
351 $("#claimvote_option")[0].className="option option"+(claim.agreeType=="majority"?2:1);
|
|
|
352 $("#mentionvote_option")[0].className="option option1";
|
|
|
353 var stateMap={};
|
|
|
354 for(var i=0;i<info.users.length;i++)stateMap['#'+info.users[i].id]=info.users[i].status;
|
|
|
355 claimUserMap=new HashSet(info.users.map(function(u){return u.id}));
|
|
|
356 mentionUserMap=new HashSet();
|
|
|
357 $("#claim_users").text("");
|
|
|
358 $("#mention_users").text("");
|
|
|
359 if(userName!=info.author)mentionUserMap.add(info.author);
|
|
|
360 for(var i=0;i<userList.length;i++){
|
|
|
361 var name=userList[i];
|
|
|
362 if(name!=info.author){
|
|
|
363 var status=stateMap['#'+name];
|
|
|
364 createUserSelectItem(name,status,claimUserMap).appendTo($("#claim_users"));
|
|
|
365 }if(name!=userName){
|
|
|
366 createUserSelectItem(name,name==info.author?"unknown":"",mentionUserMap).appendTo($("#mention_users"));
|
|
|
367 }
|
|
|
368 }
|
|
|
369 resetMentionForm();
|
|
|
370 popupShowMain()
|
|
|
371 }
|
|
|
372
|
|
|
373
|
|
|
374 function claimSave(){
|
|
|
375 var claim=formClaim;
|
|
|
376 var info=claim.info;
|
|
|
377 var id=claim.id||root_id;
|
|
|
378 var agreeType=[null,"unanimously","majority"][($('#claimvote_option')[0].className.match("[0-9]+")||"0")[0]];
|
|
|
379 var title=$('#claimform_title').val();
|
|
|
380 var contents=$('#claimform_contents').val();
|
|
|
381 var d=$('#claimform_d').val();
|
|
|
382 var w=$('#claimform_w').val();
|
|
|
383 var b=$('#claimform_b').val();
|
|
|
384 var q=$('#claimform_q').val();
|
|
|
385 var r=$('#claimform_r').val();
|
|
|
386 var users=claimUserMap.toArray();
|
|
|
387 var errors=[];
|
|
|
388 if(!title)errors.push("タイトル");
|
|
|
389 if(!agreeType)errors.push("採決方法");
|
|
|
390 if(users.length==0)errors.push("同意を取るユーザ");
|
|
|
391 if(errors.length){
|
|
|
392 alert("未入力項目："+errors.join(", "));
|
|
|
393 }else{
|
|
|
394 $.ajax({
|
|
|
395 url:BASE_URL+"/claims/edit/"+id,
|
|
|
396 success:function(o){loadConsensus(root_id)},
|
|
|
397 type:"POST",cache:false,
|
|
|
398 contentType:"application/json",
|
|
|
399 data:JSON.stringify({type:agreeType,toulmin:{title:title,contents:contents,q:q,d:d,w:w,b:b,r:r},author:userName,users:users}),
|
|
|
400 error:function(o){console.log("ERROR",o)}
|
|
|
401 });
|
|
|
402 popupHideAll();
|
|
|
403 }
|
|
|
404 }
|
|
|
405 function claimAgree(status){
|
|
|
406 var claim=formClaim;
|
|
|
407 var info=claim.info;
|
|
|
408 var id=claim.id||root_id;
|
|
|
409 $.ajax({
|
|
|
410 url:BASE_URL+"/claims/answer/"+id+"/"+userName+"/"+status,
|
|
|
411 success:function(o){loadConsensus(root_id)},
|
|
|
412 type:"POST",cache:false,
|
|
|
413 error:function(o){console.log("ERROR",o)}
|
|
|
414 });
|
|
|
415 popupHideAll();
|
|
|
416 }
|
|
|
417 function mentionSave(){
|
|
|
418 var claim=formClaim;
|
|
|
419 var info=claim.info;
|
|
|
420 var id=claim.id||root_id;
|
|
|
421 var mentionType=[null,"refutation","question","suggestion"][($('#mention_option')[0].className.match("[0-9]+")||"0")[0]];
|
|
|
422 var agreeType=[null,"unanimously","majority"][($('#mentionvote_option')[0].className.match("[0-9]+")||"0")[0]];
|
|
|
423 var title=$('#mentionform_title').val();
|
|
|
424 var contents=$('#mentionform_contents').val();
|
|
|
425 var d=$('#mentionform_d').val();
|
|
|
426 var w=$('#mentionform_w').val();
|
|
|
427 var b=$('#mentionform_b').val();
|
|
|
428 var q=$('#mentionform_q').val();
|
|
|
429 var r=$('#mentionform_r').val();
|
|
|
430 var users=mentionUserMap.toArray();
|
|
|
431 var author=userName;
|
|
|
432 var errors=[];
|
|
|
433 if(!title)errors.push("タイトル");
|
|
|
434 if(!agreeType)errors.push("採決方法");
|
|
|
435 if(!mentionType)errors.push("反論質問提案");
|
|
|
436 if(users.length==0)errors.push("同意を取るユーザ");
|
|
|
437 if(errors.length){
|
|
|
438 alert("未入力項目："+errors.join(", "));
|
|
|
439 }else{
|
|
|
440 $.ajax({
|
|
|
441 url:BASE_URL+"/claims/"+mentionType+"/"+id+"/create",
|
|
|
442 success:function(o){loadConsensus(root_id)},
|
|
|
443 type:"POST",cache:false,contentType:"application/json",
|
|
|
444 data:JSON.stringify({type:agreeType,toulmin:{title:title,contents:contents,q:q,d:d,w:w,b:b,r:r},author:author,users:users}),
|
|
|
445 error:function(o){console.log("ERROR",o)}
|
|
|
446 });
|
|
|
447 popupHideAll();
|
|
|
448 }
|
|
|
449 }
|
|
|
450
|
|
|
451 </script>
|
|
|
452 <div class='header'>
|
|
|
453 <nobr id='header_title'>R-Consensus : loading</nobr>
|
|
|
454 </div>
|
|
|
455
|
|
|
456 <div style="position:relative;left:0;top:0;" id='treeMain'>
|
|
|
457 <div style="position:absolute;width:0;height:0;left:100;" id='treeRoot'>
|
|
|
458 </div>
|
|
|
459 </div>
|
|
|
460
|
|
|
461 <div class='userList'></div>
|
|
|
462
|
|
|
463
|
|
|
464 <div id='popup_base' style='display:none;z-index:100'>
|
|
|
465 <div id='popup_background'></div>
|
|
|
466 <div class='popup_center'>
|
|
|
467 <div class='claiminfo' id='claiminfo'>
|
|
|
468 <div class='claim_title'><input placeholder="title" id='claimform_title'></div>
|
|
|
469 <div id='claimbody' class='claim_contents'>
|
|
|
470 <div class='claim_menu'>
|
|
|
471 <div class='menu_item menu_contents' onclick="$('#claimbody')[0].className='claim_contents'">Contents</div>
|
|
|
472 <div class='menu_item menu_toulmin' onclick="$('#claimbody')[0].className='claim_toulmin'">Toulmin</div>
|
|
|
473 <div class='menu_item menu_users' onclick="$('#claimbody')[0].className='claim_users'">Users</div>
|
|
|
474 <div id='claim_status'></div>
|
|
|
475 </div>
|
|
|
476 <div class='claim_main main_contents'>
|
|
|
477 <textarea placeholder='contents' id='claimform_contents'></textarea>
|
|
|
478 </div>
|
|
|
479 <div class='claim_main main_toulmin'>
|
|
|
480 <div class='item_toulmin'><span>データ</span><input id='claimform_d'></div>
|
|
|
481 <div class='item_toulmin'><span>論拠 </span><input id='claimform_w'></div>
|
|
|
482 <div class='item_toulmin'><span>裏付け</span><input id='claimform_b'></div>
|
|
|
483 <div class='item_toulmin'><span>限定詞</span><input id='claimform_q'></div>
|
|
|
484 <div class='item_toulmin'><span>反駁 </span><input id='claimform_r'></div>
|
|
|
485 </div>
|
|
|
486 <div class='claim_main main_users'>
|
|
|
487 <span class='author_label'>作者:</span>
|
|
|
488 <span class='author_name' id='claim_author'></span>
|
|
|
489 <div class='option option1' id='claimvote_option'>
|
|
|
490 <span class='option option1 vote1' onclick="$('#claimvote_option')[0].className='option option1'">全会一致</span>
|
|
|
491 <span class='option option2 vote2' onclick="$('#claimvote_option')[0].className='option option2'">多数決</span>
|
|
|
492 </div>
|
|
|
493 <div id='claim_users'></div>
|
|
|
494 </div>
|
|
|
495 </div>
|
|
|
496 <div class='claim_footer'>
|
|
|
497 <span onclick='popupShowSubMain()' class='button mention_button'>mention</span>
|
|
|
498 <div class='option' id='agree_option'>
|
|
|
499 <span class='option option1 agree1' onclick="$('#agree_option')[0].className='option option1';claimAgree('denied');">否認</span>
|
|
|
500 <span class='option option2 agree2' onclick="$('#agree_option')[0].className='option option2';claimAgree('pend');">保留</span>
|
|
|
501 <span class='option option3 agree3' onclick="$('#agree_option')[0].className='option option3';claimAgree('agreed');">合意</span>
|
|
|
502 </div>
|
|
|
503 <div id='claim_button'>
|
|
|
504 <span class='button cancel' onclick="popupHideAll()">cancel</span>
|
|
|
505 <span class='button save' onclick="claimSave()">save</span>
|
|
|
506 </div>
|
|
|
507 </div>
|
|
|
508 <div class='cover' id='claim_cover'></div>
|
|
|
509 </div>
|
|
|
510
|
|
|
511
|
|
|
512 <div class='mentioninfo' id='mentioninfo'>
|
|
|
513 <div class='claim_title'><input placeholder="title" id='mentionform_title'></div>
|
|
|
514 <div id='mentionbody' class='mention_contents'>
|
|
|
515 <div class='claim_menu'>
|
|
|
516 <div class='menu_item menu_contents' onclick="$('#mentionbody')[0].className='mention_contents'">Contents</div>
|
|
|
517 <div class='menu_item menu_toulmin' onclick="$('#mentionbody')[0].className='mention_toulmin'">Toulmin</div>
|
|
|
518 <div class='menu_item menu_users' onclick="$('#mentionbody')[0].className='mention_users'">Users</div>
|
|
|
519 </div>
|
|
|
520 <div class='mention_main main_contents'>
|
|
|
521 <textarea placeholder='contents' id='mentionform_contents'></textarea>
|
|
|
522 </div>
|
|
|
523 <div class='mention_main main_toulmin'>
|
|
|
524 <div class='item_toulmin'><span>データ</span><input id='mentionform_d'></div>
|
|
|
525 <div class='item_toulmin'><span>論拠 </span><input id='mentionform_w'></div>
|
|
|
526 <div class='item_toulmin'><span>裏付け</span><input id='mentionform_b'></div>
|
|
|
527 <div class='item_toulmin'><span>限定詞</span><input id='mentionform_q'></div>
|
|
|
528 <div class='item_toulmin'><span>反駁 </span><input id='mentionform_r'></div>
|
|
|
529 </div>
|
|
|
530 <div class='mention_main main_users'>
|
|
|
531 <span class='author_label'>作者:</span>
|
|
|
532 <span class='author_name' id='mention_author'></span>
|
|
|
533 <div class='option option1' id='mentionvote_option'>
|
|
|
534 <span class='option option1 vote1' onclick="$('#mentionvote_option')[0].className='option option1'">全会一致</span>
|
|
|
535 <span class='option option2 vote2' onclick="$('#mentionvote_option')[0].className='option option2'">多数決</span>
|
|
|
536 </div>
|
|
|
537 <div id='mention_users'></div>
|
|
|
538 </div>
|
|
|
539 </div>
|
|
|
540 <div class='claim_footer'>
|
|
|
541 <div class='option' id='mention_option'>
|
|
|
542 <span class='option option1 mention1' onclick="$('#mention_option')[0].className='option option1'">反論</span>
|
|
|
543 <span class='option option2 mention2' onclick="$('#mention_option')[0].className='option option2'">質問</span>
|
|
|
544 <span class='option option3 mention3' onclick="$('#mention_option')[0].className='option option3'">提案</span>
|
|
|
545 </div>
|
|
|
546 <span class='button cancel' onclick="popupShowMain()">cancel</span>
|
|
|
547 <span class='button save' onclick="mentionSave()">save</span>
|
|
|
548 </div>
|
|
|
549 <div class='cover' id='mention_cover'></div>
|
|
|
550 </div>
|
|
|
551 </div>
|
|
53
|
552 </div>
|
|
|
553
|
|
|
554
|
|
|
555
|
|
|
556
|
|
|
557 <div id="loginPopup" style='position:fixed;left:0;top:0;width:100%;height:100%;z-index:10;display:none;'>
|
|
|
558 <div style='position:absolute;left:0;top:0;width:100%;height:100%;background:black;opacity:0.5'></div>
|
|
|
559 <div style='position:absolute;left:50%;top:50%;'>
|
|
|
560 <div style='position:absolute;left:-160px;top:-80px;width:320px;height:120px;background:white'>
|
|
|
561 <form onsubmit="try{a=$('#loginUserName');if(a.val()){login(a.val());$('#loginPopup').remove();}}catch(e){console.log(e)}return false">
|
|
|
562 <div style='position:absolute;left:20px;top:15px;font-size:24px;width:280;text-align:center;'>
|
|
|
563 R-Consensus Login
|
|
|
564 </div>
|
|
|
565 <input type=text placeholder='username' style='position:absolute;left:20px;top:70px;width:180px;font-size:16px;height:24px;' id='loginUserName'>
|
|
|
566 <span style='position:absolute;left:220px;top:70px;width:80px;font-size:16px;height:24px;line-height:24px;' class='button' value='login' onclick="try{a=$('#loginUserName');if(a.val()){login(a.val());$('#loginPopup').remove();}}catch(e){console.log(e)}return false">login</span>
|
|
|
567 </form>
|
|
|
568 </div>
|
|
|
569 </div>
|
|
|
570 </div>
|
