Simon Hunt

GUI -- Reduced size of onos-logo to be 41x38 pixels.

- cleaned up ONOS instances a little: added icon; centered text; UI-attached icon shown.

Change-Id: If6d1adf4866c33f1c40baf3e37bebbe4e705ea80

37.7 KB | W: | H:

5.61 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
......@@ -204,20 +204,19 @@
}
#topo-oibox .onosInst {
margin: 6px 0;
padding: 3px;
position: relative;
width: 80%;
left: 10%;
height: 40px;
height: 80px;
margin: 4px 0;
cursor: pointer;
/* theme-related */
color: #444;
background-color: #ccc;
border: 2px dashed #aaa;
border: 2px solid #aaa;
}
#topo-oibox .onosInst.online {
/* theme-related */
color: #113;
......@@ -225,6 +224,34 @@
border: 2px solid #555;
}
#topo-oibox .onosInst .onosTitle {
text-align: center;
font-size: 11pt;
margin-top: 6px;
color: #888;
}
#topo-oibox .onosInst.online .onosTitle {
color: black;
}
#topo-oibox .onosInst img {
opacity: 0.5;
}
#topo-oibox .onosInst.online img {
opacity: 1.0;
}
#topo-oibox .onosInst img.ui {
opacity: 1;
position: absolute;
top: 3px;
right: 3px;
width: 20px;
height: 20px;
}
#topo-oibox .onosInst.mastership {
opacity: 0.3;
}
......
......@@ -696,8 +696,31 @@
.append('div')
.attr('class', 'onosInst')
.classed('online', function (d) { return d.online; })
.on('click', clickInst)
.text(function (d) { return d.id; });
.on('click', clickInst);
entering.each(function (d, i) {
var el = d3.select(this),
img;
$('<img src="img/host.png">').appendTo(el);
img = el.select('img')
.attr({
width: 40,
top: -10,
left: -10
})
.style({
});
$('<div>').attr('class', 'onosTitle').text(d.id).appendTo(el);
// is the UI attached to this instance?
// TODO: need uiAttached boolean in instance data
//if (d.uiAttached) {
if (i === 0) {
$('<img src="img/ui.png">').attr('class','ui').appendTo(el);
}
});
// operate on existing + new onoses here
......