Simon Hunt

GUI -- Added shadow of ONOS logo to death mask.

Change-Id: I8abfdb88c536eec1e8ec47ae127c809058df4588
1 +/*
2 + * Copyright 2014 Open Networking Laboratory
3 + *
4 + * Licensed under the Apache License, Version 2.0 (the "License");
5 + * you may not use this file except in compliance with the License.
6 + * You may obtain a copy of the License at
7 + *
8 + * http://www.apache.org/licenses/LICENSE-2.0
9 + *
10 + * Unless required by applicable law or agreed to in writing, software
11 + * distributed under the License is distributed on an "AS IS" BASIS,
12 + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 + * See the License for the specific language governing permissions and
14 + * limitations under the License.
15 + */
16 +
17 +/*
18 + SVG Glyphs.
19 +
20 + @author Simon Hunt
21 + */
22 +
23 +
24 +(function (onos) {
25 + 'use strict';
26 +
27 + var birdData = "M427.7,300.4 c-6.9,0.6-13.1,5-19.2,7.1" +
28 + "c-18.1,6.2-33.9,9.1-56.5,4.7c24.6,17.2,36.6,13,63.7,0.1" +
29 + "c-0.5,0.6-0.7,1.3-1.3,1.9c1.4-0.4,2.4-1.7,3.4-2.2" +
30 + "c-0.4,0.7-0.9,1.5-1.4,1.9c2.2-0.6,3.7-2.3,5.9-3.9" +
31 + "c-2.4,2.1-4.2,5-6,8c-1.5,2.5-3.1,4.8-5.1,6.9c-1,1-1.9,1.9-2.9,2.9" +
32 + "c-1.4,1.3-2.9,2.5-5.1,2.9c1.7,0.1,3.6-0.3,6.5-1.9" +
33 + "c-1.6,2.4-7.1,6.2-9.9,7.2c10.5-2.6,19.2-15.9,25.7-18" +
34 + "c18.3-5.9,13.8-3.4,27-14.2c1.6-1.3,3-1,5.1-0.8" +
35 + "c1.1,0.1,2.1,0.3,3.2,0.5c0.8,0.2,1.4,0.4,2.2,0.8l1.8,0.9" +
36 + "c-1.9-4.5-2.3-4.1-5.9-6c-2.3-1.3-3.3-3.8-6.2-4.9" +
37 + "c-7.1-2.6-11.9,11.7-11.7-5c0.1-8,4.2-14.4,6.4-22" +
38 + "c1.1-3.8,2.3-7.6,2.4-11.5c0.1-2.3,0-4.7-0.4-7" +
39 + "c-2-11.2-8.4-21.5-19.7-24.8c-1-0.3-1.1-0.3-0.9,0" +
40 + "c9.6,17.1,7.2,38.3,3.1,54.2C429.9,285.5,426.7,293.2,427.7,300.4z";
41 +
42 +
43 + function defBird(defs) {
44 + defs.append('symbol')
45 + .attr({
46 + id: 'bird',
47 + viewBox: '352 224 113 112'
48 + })
49 + .append('path').attr('d', birdData);
50 + }
51 +
52 + // === register the functions as a library
53 + onos.ui.addLib('glyphs', {
54 + defBird: defBird
55 + });
56 +
57 +}(ONOS));
...@@ -85,6 +85,7 @@ ...@@ -85,6 +85,7 @@
85 85
86 <!-- Library module files included here --> 86 <!-- Library module files included here -->
87 <script src="d3Utils.js"></script> 87 <script src="d3Utils.js"></script>
88 + <script src="glyphs.js"></script>
88 89
89 <!-- Framework module files included here --> 90 <!-- Framework module files included here -->
90 <script src="mast2.js"></script> 91 <script src="mast2.js"></script>
......
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
25 25
26 // shorter names for library APIs 26 // shorter names for library APIs
27 var d3u = onos.lib.d3util, 27 var d3u = onos.lib.d3util,
28 + gly = onos.lib.glyphs,
28 trace; 29 trace;
29 30
30 // configuration data 31 // configuration data
...@@ -36,6 +37,7 @@ ...@@ -36,6 +37,7 @@
36 showNodeXY: true, 37 showNodeXY: true,
37 showKeyHandler: false 38 showKeyHandler: false
38 }, 39 },
40 + birdDim: 400,
39 options: { 41 options: {
40 layering: true, 42 layering: true,
41 collisionPrevention: true, 43 collisionPrevention: true,
...@@ -216,10 +218,7 @@ ...@@ -216,10 +218,7 @@
216 218
217 function testMe(view) { 219 function testMe(view) {
218 //view.alert('test'); 220 //view.alert('test');
219 - detailPane.show(); 221 + noWebSock(true);
220 - setTimeout(detailPane.hide, 2000);
221 - oiBox.show();
222 - setTimeout(oiBox.hide, 2000);
223 } 222 }
224 223
225 function abortIfLive() { 224 function abortIfLive() {
...@@ -1663,6 +1662,9 @@ ...@@ -1663,6 +1662,9 @@
1663 svg = view.$div.append('svg').attr('viewBox', viewBox); 1662 svg = view.$div.append('svg').attr('viewBox', viewBox);
1664 setSize(svg, view); 1663 setSize(svg, view);
1665 1664
1665 + var defs = svg.append('defs');
1666 + gly.defBird(defs);
1667 +
1666 zoomPanContainer = svg.append('g').attr('id', 'zoomPanContainer'); 1668 zoomPanContainer = svg.append('g').attr('id', 'zoomPanContainer');
1667 setupZoomPan(); 1669 setupZoomPan();
1668 1670
...@@ -1740,6 +1742,23 @@ ...@@ -1740,6 +1742,23 @@
1740 para(mask, 'Oops!'); 1742 para(mask, 'Oops!');
1741 para(mask, 'Web-socket connection to server closed...'); 1743 para(mask, 'Web-socket connection to server closed...');
1742 para(mask, 'Try refreshing the page.'); 1744 para(mask, 'Try refreshing the page.');
1745 +
1746 + mask.append('svg')
1747 + .attr({
1748 + id: 'mask-bird',
1749 + width: w,
1750 + height: h
1751 + })
1752 + .append('g')
1753 + .attr('transform', birdTranslate(w, h))
1754 + .style('opacity', 0.3)
1755 + .append('use')
1756 + .attr({
1757 + 'xlink:href': '#bird',
1758 + width: config.birdDim,
1759 + height: config.birdDim,
1760 + fill: '#111'
1761 + })
1743 } 1762 }
1744 1763
1745 function para(sel, text) { 1764 function para(sel, text) {
...@@ -1862,9 +1881,19 @@ ...@@ -1862,9 +1881,19 @@
1862 } 1881 }
1863 1882
1864 function resize(view, ctx, flags) { 1883 function resize(view, ctx, flags) {
1884 + var w = view.width(),
1885 + h = view.height();
1886 +
1865 setSize(svg, view); 1887 setSize(svg, view);
1888 +
1889 + d3.select('#mask-bird').attr({ width: w, height: h})
1890 + .select('g').attr('transform', birdTranslate(w, h));
1866 } 1891 }
1867 1892
1893 + function birdTranslate(w, h) {
1894 + var bdim = config.birdDim;
1895 + return 'translate('+((w-bdim)*.4)+','+((h-bdim)*.1)+')';
1896 + }
1868 1897
1869 // ============================== 1898 // ==============================
1870 // View registration 1899 // View registration
......