Mercurial > hg > Members > nobuyasu > Consensus
changeset 95:341766c5a6e9 draft
modified viewer_whit.html
author | Nobuyasu Oshiro <dimolto@cr.ie.u-ryukyu.ac.jp> |
---|---|
date | Fri, 15 Mar 2013 23:03:00 +0900 (2013-03-15) |
parents | bf0cd5920429 |
children | 1a97674f1cea |
files | public/viewer/viewer_white.html |
diffstat | 1 files changed, 116 insertions(+), 4 deletions(-) [+] |
line wrap: on
line diff
--- a/public/viewer/viewer_white.html Fri Mar 15 19:20:04 2013 +0900 +++ b/public/viewer/viewer_white.html Fri Mar 15 23:03:00 2013 +0900 @@ -15,8 +15,24 @@ <script type="text/javascript" src="js/1.3.15/jsPlumb-renderers-vml-1.3.15-RC1.js"></script> <script type="text/javascript" src="js/1.3.15/jquery.jsPlumb-1.3.15-RC1.js"></script> <script type="text/javascript" src='treeArrangement.js'></script> + +<style> +div.header{ + position:absolute; + left:0;top:0; + z-index:5; + height:50px; + width:100%; + background:#223; + background:-moz-linear-gradient(top,#002,#223); + background:-webkit-gradient(linear,left top,left bottom,from(#002),to(#223)); + color:silver; + font-size:40px; +} +</style> + + <script type="text/javascript"> - var LOAD_INTERVAL = 5; var BASE_URL = ""; if(!Array.prototype.filter){ @@ -50,17 +66,109 @@ $(function() { userName = localStorage.userName; if(userName) start(); - else $("#loginPopup").css("display", "block"); +// else $("#loginPopup").css("display", "hidden"); + else $("#loginPopup").css("visibility", "visible"); }) function start() { } + +function beginScript() { + function begin(element, x, y) { + var s = '#' + element.id + '(begin drag)' + ' x:' + x + ', y:' + y; + updateInfo(s); + } + function drag(element, x, y) { + var s = '#' + element.id + ' (dragging)' + ' x:' + x +', y:' +y; + updateInfo(s); + } + function end(element, x, y) { + var s = '#' + element.id + ' (end drag)' + ' x:' + x +', y:' +y; + updateInfo(s); + } + function updateInfo(s) { + document.getElementById("info").innerHTML = s; + } + var infoForm = DragHandler.attach(document.getElementById('loginPopup')); + infoForm.dragBegin = begin; + infoForm.drag = drag; + infoForm.dragEnd = end; +} + +var DragHandler = { + _oElem : null, + attach : function(oElem) { + oElem.onmousedown = DragHandler._dragBegin; + oElem.dragBegin = new Function(); + oElem.drag = new Function(); + oElem.dragEnd = new Function(); + return oElem; + }, + _dragBegin : function(e) { + var oElem = DragHandler._oElem = this; + if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; } + if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0px'; } + var x = parseInt(oElem.style.left); + var y = parseInt(oElem.style.top); + e = e ? e : window.event; + oElem.mouseX = e.clientX; + oElem.mouseY = e.clientY; + oElem.dragBegin(oElem, x, y); + document.onmousemove = DragHandler._drag; + document.onmouseup = DragHandler._dragEnd; + return false; + }, + _drag : function(e) { + var oElem = DragHandler._oElem; + var x = parseInt(oElem.style.left); + var y = parseInt(oElem.style.top); + e = e ? e : window.event; + oElem.style.left = x + (e.clientX - oElem.mouseX) + 'px'; + oElem.style.top = y + (e.clientY - oElem.mouseY) + 'px'; + oElem.mouseX = e.clientX; + oElem.mouseY = e.clientY; + oElem.drag(oElem, x, y); + return false; + }, + _dragEnd : function() { + var oElem = DragHandler._oElem; + var x = parseInt(oElem.style.left); + var y = parseInt(oElem.style.top); + oElem.dragEnd(oElem, x, y); + document.onmousemove = null; + document.onmouseup = null; + DragHandler._oElem = null; + } + +}; + +function addLoadEvent(func) { + var oldonload = window.onload; + if (typeof window.onload != 'function') { + window.onload = func; + } else { + window.onload = function() { + if (oldonload) { + oldonload(); + } + func(); + } + } +} + +addLoadEvent(function() { + beginScript(); +}); + </script> -<nobr id='header_title' style='margin-left:40px;'><a href='index.html'>Home</a></nobr> +<div class='header'> + <nobr id='header_title' style='margin-left:40px;'><a href='index.html'>Home</a></nobr> +</div> -<div id="loginPopup" style='position:fixed; left:0; top:0; width:100%; height:100%; z-index:10; display:none;'> +<div id='info'></div> +<div id="loginPopup" style='position:fixed; left:20; top:70; width:35%; height:35%; border:solid 1px; border-radius:5px; '> <div style='position:absolute; left:0; top:0; width:100%; height:100%; background:black; opacity:0.5;'></div> <div style='position:absolute; left:50%; top:50%'> <div style='position:absolute; left:-160px; top:-80px; width:320px; height:120px; background:white;'> @@ -69,8 +177,12 @@ dimolto </div> <input type=text placeholder='username' style='position:absolute; left:20px; top:70px; width:180px; font-size:16px; height:24px;' id='loginUserName'> +<!-- <span style='position:absolute; left:220px; top:70px; width:80px; font-size:16px; height:24px; line-height:24px;' class='button' value='login' onclick="try{var a=$('#loginUserName');if(a.val()){login(a.val());$('#loginPopup').remove();}}catch(e){console.log(e)}return false;">Login</span> +--> + <span style='position:absolute; left:220px; top:70px; width:80px; font-size:16px; height:24px; line-height:24px;' class='button' value='login' >move</span> </form> </div> </div> </div> +