changeset 30:ccfa3b5c943b draft

create traverseMenuBodyRemove
author Nobuyasu Oshiro <dimolto@cr.ie.u-ryukyu.ac.jp>
date Sat, 23 Mar 2013 05:06:25 +0900
parents 38990a120dd6
children 50f03d7d5982
files css/viewer_form.css index.html
diffstat 2 files changed, 59 insertions(+), 9 deletions(-) [+]
line wrap: on
line diff
--- a/css/viewer_form.css	Sat Mar 23 03:52:34 2013 +0900
+++ b/css/viewer_form.css	Sat Mar 23 05:06:25 2013 +0900
@@ -78,7 +78,7 @@
     position:fixed;
     background:#fff;
     width:180px;
-    height:80px;
+    height:72px;
     border:solid 5px #777;
     border-radius:5px;
     opacity:1;
@@ -114,7 +114,11 @@
     background:#ddd;
     width:80%;
     border-radius:5px;
-    margin:5px 2px;
+    right:3px;
+    margin-left:auto;auto
+    margin-right:3px;
+    margin-top:5px;
+    margin-bottom:5px;
     font-size:18px;
     opacity:0.5;
     overflow-x: hidden;
--- a/index.html	Sat Mar 23 03:52:34 2013 +0900
+++ b/index.html	Sat Mar 23 05:06:25 2013 +0900
@@ -59,12 +59,14 @@
 <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 class='menuTitleCss' id='stateMenuTitle'>StateSelect</div>
+	<div class='menuTitleBodyCss' id='stateMenuBody'>
+</div>
     </div>
-    <div class='menu' id='traverseMenu' style='top:38px;'>
-	<div class='menuTitleCss' id='menuTitle'>TraverseSelect</div>
-	<div class='menuTitleBodyCss' id='menuTitleBody'></div>
+    <div class='menu' id='traverseMenu' style='top:34px;'>
+	<div class='menuTitleCss' id='traverseMenuTitle'>TraverseSelect</div>
+	<div class='menuTitleBodyCss'id='traverseMenuBody'>
+	</div>
     </div>
 </div>
 
@@ -616,10 +618,43 @@
     testStart();
 })
 
+
+
+
+function addMenuBody(menuBodyDiv, menuContentDiv) {
+    menuBodyDiv.insertBefore(menuContentDiv);
+}
+
+function removeTraverseMenuBody() {
+    $('#traverseMenuBody').children().remove();    
+}
+
+function removeStateMenuBody() {
+    $('#stateMenuBody').children().remove();    
+}
+
+function createStateSelectMenu() {
+    removeStateMenuBody();
+    var stateMenu = $('#stateMenu');
+    var accepted = $('<div class="menuContent" >accept</div>');
+    var rejected = $('<div class="menuContent" >reject</div>');
+    var retract = $('<div class="menuContent" >retract</div>');
+    var body = $('#stateMenuBody');
+    var fc = body[0].firstChild;
+    if (fc) {
+	body[0].insertBefore(accepted[0], fc);
+	body[0].insertBefore(rejected[0], fc);
+	body[0].insertBefore(retract[0], fc);
+    } else {
+	
+    }
+
+}
+
 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) {
+    function calcMenuDisplayHeight(menuD, childArray) {
 	var menuArray = $('.menu');
 	var height = 0;
 	for (var i=0; i<menuArray.length; i++) {
@@ -627,8 +662,19 @@
 	}
 	return height;
     }
+    function updateMenuTop(childArray) {
+	var MARGIN = 5;
+	var height = 0;
+	for (var i=0; i<childArray.length; i++) {
+	    console.log(childArray[i].offsetHeight);
+	    childArray[i].style.top = height + 'px';
+	    height = height + childArray[i].offsetHeight + MARGIN;
+	}
+    }
     var menuD =  $('#menuDisplay');
-    var height = calcMenuDisplayHeight(menuD) + BASE_MARGIN;
+    var childArray = $('.menu');
+    updateMenuTop(childArray);
+    var height = calcMenuDisplayHeight(menuD, childArray) + BASE_MARGIN;
     menuD.css('height', height + 'px');
 }