changeset 29:38990a120dd6 draft

modified css and index.html
author Nobuyasu Oshiro <dimolto@cr.ie.u-ryukyu.ac.jp>
date Sat, 23 Mar 2013 03:52:34 +0900
parents 4b6d41c8b0cd
children ccfa3b5c943b
files css/viewer_form.css index.html
diffstat 2 files changed, 55 insertions(+), 7 deletions(-) [+]
line wrap: on
line diff
--- a/css/viewer_form.css	Sat Mar 23 00:22:50 2013 +0900
+++ b/css/viewer_form.css	Sat Mar 23 03:52:34 2013 +0900
@@ -64,6 +64,7 @@
     overflow:hidden;
     cursor:pointer;
 }
+
 div.graphNodeContent {
     position:absolute;
     z-index:21;
@@ -73,12 +74,12 @@
     top: 10px;
     overflow:hidden;
 }
-div.edgeInfoTable { 
+div.menuDisplayCss { 
     position:fixed;
     background:#fff;
-    width:230px;
-    height:230px;
-    border:solid 10px #333;
+    width:180px;
+    height:80px;
+    border:solid 5px #777;
     border-radius:5px;
     opacity:1;
     z-index:10;
@@ -88,13 +89,30 @@
     white-space: nowrap;
 */
 }
-div.edgeInfoTitle { 
 
+div.menu { 
+    position:absolute;
+    margin-top:2px;
+    margin-left:2px;
+    width:95%;
+    border-radius:5px;
+    text-align:center;
+    border: groove 3px #777;
 }
-div.edgeInfoDiv { 
+div.menuTitleCss { 
+    text-align:center;    
+    font-size:20px;
+    font-weight:900;
+}
+
+div.menuBody { 
+    width:100%;
+}
+
+div.menuContent { 
     position:relative;
     background:#ddd;
-    width:100%;
+    width:80%;
     border-radius:5px;
     margin:5px 2px;
     font-size:18px;
@@ -102,6 +120,7 @@
     overflow-x: hidden;
     border: solid 2px #03f;
 }
+
 span.button{
     background:#eee;
     background:-moz-linear-gradient(top,#fff,#ddf);
--- a/index.html	Sat Mar 23 00:22:50 2013 +0900
+++ b/index.html	Sat Mar 23 03:52:34 2013 +0900
@@ -56,6 +56,18 @@
 </div>
 
 
+<div id='menuDisplay' class='menuDisplayCss' style='left:0; top:20; z-index:20;'>
+    <div id="closeMenuDisplay" style='position:absolute; right:5px; top:-15px; z-index:10; color:white;' onclick="$('#menuDisplay').css('visibility','hidden');" onmouseover="$('#closeEdgeInfoDisplay').css('color','yellow');" onmouseout="$('#closeMenuDisplay').css('color','white')" >CLOSE</div>  
+    <div class='menu' id='stateMenu'>
+	<div class='menuTitleCss' id='menuTitle'>StateSelect</div>
+	<div class='menuTitleBodyCss' id='menuTitleBody'></div>
+    </div>
+    <div class='menu' id='traverseMenu' style='top:38px;'>
+	<div class='menuTitleCss' id='menuTitle'>TraverseSelect</div>
+	<div class='menuTitleBodyCss' id='menuTitleBody'></div>
+    </div>
+</div>
+
 <script type="text/javascript">
 var BASE_URL = "";
 
@@ -604,6 +616,23 @@
     testStart();
 })
 
+var BASE_MARGIN = parseInt($('.menu').css('margin-top').split('px')[0])*2 + 
+    parseInt($('.menuDisplayCss').css('border-top-width').split('px')[0])*2;
+function updateMenuDisplayHeight() {
+    function calcMenuDisplayHeight(menuD) {
+	var menuArray = $('.menu');
+	var height = 0;
+	for (var i=0; i<menuArray.length; i++) {
+	    height = height + menuArray[i].offsetHeight
+	}
+	return height;
+    }
+    var menuD =  $('#menuDisplay');
+    var height = calcMenuDisplayHeight(menuD) + BASE_MARGIN;
+    menuD.css('height', height + 'px');
+}
+
+
 
 edgeInfo1 = [
 	{