홍길동 / onos

Go to a project
Toggle navigation Toggle navigation pinning
Simon Hunt
19cb098a 1 parent 936c49d1

Another step forward with the UI. 

- Added (placeholder) logo to mast head.
- Minor tweaks.
Inline Side-by-side
Showing 9 changed files with 17 additions and 16 deletions
......@@ -15,19 +15,18 @@
<link rel="stylesheet" href="onos.css">
<script src="geometry.js"></script>
<script src="onosui.js"></script>
<script src="onos.js"></script>
</head>
<body>
<div id="frame">
<div id="mast">
<span class="title">
ONOS Web UI
</span>
<img id="logo" src="img/onos-logo.png" width="60" height="38">
<span class="title">Open Network Operating System</span>
<span class="right">
<span class="radio">[one]</span>
<span class="radio">[two]</span>
<span class="radio">[three]</span>
<span class="radio">[All Layers]</span>
<span class="radio">[Packet Only]</span>
<span class="radio">[Optical Only]</span>
</span>
</div>
<div id="view"></div>
......
......@@ -11,18 +11,17 @@
var config = {
options: {
layering: false,
layering: true,
collisionPrevention: true
},
jsonUrl: 'network.json',
iconUrl: {
logo: 'img/onos-logo.tiff',
device: 'img/device.png',
host: 'img/host.png',
pkt: 'img/pkt.png',
opt: 'img/opt.png'
},
mastHeight: 32,
mastHeight: 36,
force: {
note: 'node.class or link.class is used to differentiate',
linkDistance: {
......@@ -47,7 +46,7 @@
}
},
labels: {
imgPad: 22,
imgPad: 16,
padLR: 8,
padTB: 6,
marginLR: 3,
......@@ -57,7 +56,7 @@
w: 32,
h: 32,
xoff: -12,
yoff: -10
yoff: -8
},
constraints: {
ypos: {
......@@ -376,6 +375,7 @@
rect = node.select('rect'),
icon = iconUrl(d),
text = node.append('text')
// TODO: add label cycle behavior
.text(d.id)
.attr('dy', '1.1em');
......
......@@ -13,13 +13,15 @@ body, html {
*/
span.title {
color: darkblue;
font-size: 16pt;
color: #37b;
font-size: 14pt;
font-style: italic;
vertical-align: 10px;
}
span.radio {
color: darkslateblue;
font-size: 10pt;
}
span.right {
......@@ -127,8 +129,8 @@ svg .legend .category text {
}
#mast {
height: 32px;
padding: 6px;
height: 36px;
padding: 4px;
background-color: #ccc;
vertical-align: baseline;
}
......