diff options
| -rw-r--r-- | src/ws/munia.css | 24 | ||||
| -rw-r--r-- | src/ws/node.js | 25 | ||||
| -rw-r--r-- | src/ws/view.js | 49 |
3 files changed, 94 insertions, 4 deletions
diff --git a/src/ws/munia.css b/src/ws/munia.css index 3a94e85..8eeebba 100644 --- a/src/ws/munia.css +++ b/src/ws/munia.css @@ -29,7 +29,10 @@ body border-radius: 3px; padding: 6px; margin: 10px; - max-width: 300px; +/* max-width: 800px;*/ + margin-left: auto; + margin-right: auto; + overflow: hidden; } .node .id @@ -73,12 +76,28 @@ body cursor: pointer; } +.node .collapse_button +{ + float: right; + display: inline-box; + width: 1em; + height: 1em; + font-size: 0.5em; + vertical-align: text-center; + text-align: center; + border: solid green 2px; + cursor: pointer; +} + .board { - width: *; +/* width: *; */ min-height: 100px; + width: 500px; padding: 2px; margin: 2px; + display: inline-box; + float:left; background: -moz-linear-gradient(left center, rgb(0,0,0), rgb(79,79,79), rgb(21,21,21)); background: -webkit-gradient(linear, left top, right top, @@ -91,6 +110,7 @@ body .log { + clear: both; height: 20em; font-family: monospace; font-size: 1em; diff --git a/src/ws/node.js b/src/ws/node.js index a8208fd..d79137d 100644 --- a/src/ws/node.js +++ b/src/ws/node.js @@ -94,8 +94,8 @@ Node.prototype.addChild = function(node, insertBeforeId) if(this.children[i].id == insertBeforeId) { this.children.splice(i - 1, 0, node); - // Insert after id, title and add button (ie. + 3) - this.element.insertBefore(node.element, this.element.childNodes[i + 3]); + // Insert after id, title, add button and collapse button (ie. + 4) + this.element.insertBefore(node.element, this.element.childNodes[i + 4]); inserted = true; break; } @@ -148,6 +148,15 @@ Node.prototype.create = function() add_child_button.appendChild(txt_plus); node.appendChild(add_child_button); + var collapse_button = document.createElement("div"); + collapse_button.name = "add_button"; + collapse_button.setAttribute("onclick", "collapse(event)"); + collapse_button.setAttribute("nodeid", this.id); + collapse_button.setAttribute("class", "collapse_button"); + var txt_plus = document.createTextNode("v"); + collapse_button.appendChild(txt_plus); + node.appendChild(collapse_button); + /* var subscribe_button = document.createElement("div"); subscribe_button.name = "subscribe_button"; @@ -173,6 +182,18 @@ Node.prototype.create = function() this.div_id.appendChild(id_txt); this.element.appendChild(this.div_title); this.setAttribute("title", ""); + + { + var collapsed = getCookie(node.id+"_collapsed") == "true"; + if(collapsed) + { + this.element.style.maxHeight = "32px"; + } + else + { + this.element.style.maxHeight = "inherit"; + } + } }; Node.prototype.setAttribute = function(name, value) diff --git a/src/ws/view.js b/src/ws/view.js index 78b23c1..2c9d507 100644 --- a/src/ws/view.js +++ b/src/ws/view.js @@ -13,6 +13,37 @@ function createNode() } */ +var cookies = null; +function initCookie(cookie, index) +{ + name = cookie.split('=')[0].trim(); + value = cookie.split('=')[1]; + cookies[name] = value; +} +function initCookies() +{ + cookies = new Object(); + document.cookie.split(';').forEach(initCookie); +} +function setCookie(name, value) +{ + if(cookies == null) + { + initCookies(); + } + cookies[name] = value; + document.cookie = name + "=" + value+"; expires=Fri, 31 Dec 9999 23:59:59 GMT"; +} + +function getCookie(name) +{ + if(cookies == null) + { + initCookies(); + } + return cookies[name]; +} + function getNode(subscribeid, id) { } @@ -249,3 +280,21 @@ function addChild(e) id = idFromStr(e.target.parentElement.id); create("x", id, -1); } + +function collapse(e) +{ + var id = e.target.parentElement.id; + var collapsed = getCookie(id+"_collapsed") == "true"; + collapsed = !collapsed; + setCookie(id+"_collapsed", collapsed?"true":"false"); + + e.stopPropagation(); + if(collapsed) + { + e.target.parentElement.style.maxHeight = "32px"; + } + else + { + e.target.parentElement.style.maxHeight = "inherit"; + } +} |