Simon Hunt

GUI -- two module template flavors: DIV and SVG.

...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
15 */ 15 */
16 16
17 /* 17 /*
18 - Module template file. 18 + Module template file for DIV based view.
19 19
20 @author Simon Hunt 20 @author Simon Hunt
21 */ 21 */
...@@ -23,14 +23,43 @@ ...@@ -23,14 +23,43 @@
23 (function (onos) { 23 (function (onos) {
24 'use strict'; 24 'use strict';
25 25
26 - var api = onos.api; 26 + var list,
27 + data = [ 'foo', 'bar', 'baz' ];
27 28
28 - // == define your functions here..... 29 + // invoked only the first time the view is loaded
30 + function preload(view, ctx) {
31 + // NOTE: view.$div is a D3 selection of the view's div
32 + list = view.$div.append('ul');
33 + }
29 34
35 + // invoked just prior to loading the view
36 + function reset(view) {
30 37
31 - // == register views here, with links to lifecycle callbacks 38 + }
32 39
33 -// api.addView('view-id', {/* callbacks */}); 40 + // invoked when the view is loaded
41 + function load(view, ctx) {
42 + list.selectAll('li')
43 + .data(data)
44 + .enter()
45 + .append('li')
46 + .text(function (d) { return d; })
47 + }
34 48
49 + // invoked when the view is resized
50 + function resize(view, ctx) {
51 +
52 + }
53 +
54 + // == register the view here, with links to lifecycle callbacks
55 +
56 + onos.ui.addView('myViewId', {
57 + preload: preload,
58 + reset: reset,
59 + load: load,
60 + // unload: unload,
61 + // error: error
62 + resize: resize
63 + });
35 64
36 }(ONOS)); 65 }(ONOS));
......
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 + Module template file for SVG based view.
19 +
20 + @author Simon Hunt
21 + */
22 +
23 +(function (onos) {
24 + 'use strict';
25 +
26 + var svg;
27 +
28 + // set the size of the SVG layer to match that of the view
29 + function sizeSvg(view) {
30 + svg.attr({
31 + width: view.width(),
32 + height: view.height()
33 + });
34 + }
35 +
36 + // invoked only the first time the view is loaded
37 + function preload(view, ctx) {
38 + // NOTE: view.$div is a D3 selection of the view's div
39 + svg = view.$div.append('svg');
40 + sizeSvg(view);
41 + // ... further code to initialize the SVG view ...
42 +
43 + }
44 +
45 + // invoked just prior to loading the view
46 + function reset(view) {
47 +
48 + }
49 +
50 + // invoked when the view is loaded
51 + function load(view, ctx) {
52 +
53 + }
54 +
55 + // invoked when the view is resized
56 + function resize(view, ctx) {
57 + sizeSvg(view);
58 + // ... further code to handle resize of view ...
59 +
60 + }
61 +
62 + // == register the view here, with links to lifecycle callbacks
63 +
64 + onos.ui.addView('myViewId', {
65 + preload: preload,
66 + reset: reset,
67 + load: load,
68 + // unload: unload,
69 + // error: error
70 + resize: resize
71 + });
72 +
73 +}(ONOS));