Mercurial > hg > Members > nobuyasu > html > graphViewer
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'); }