nutella_framework 0.4.23 → 0.4.24

data/framework_components/monitoring-interface/img/cross_red_border_white_mouseover.svg

@@ -0,0 +1,143 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="30"
+   height="30"
+   viewBox="0 0 30 30"
+   id="svg3779"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="cross_red_border_white_mouseover.svg">
+  <defs
+     id="defs3781" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="7.1166667"
+     inkscape:cx="7.7517564"
+     inkscape:cy="4.2857143"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer2"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1280"
+     inkscape:window-height="751"
+     inkscape:window-x="4"
+     inkscape:window-y="0"
+     inkscape:window-maximized="0" />
+  <metadata
+     id="metadata3784">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-1022.3622)">
+    <rect
+       style="fill:#ffffff"
+       id="rect3878"
+       width="19.672131"
+       height="20.936768"
+       x="44.824356"
+       y="1027.0695" />
+    <circle
+       style="fill:#ffffff"
+       id="path4019"
+       cx="15"
+       cy="15"
+       r="15"
+       transform="translate(0,1022.3622)" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Layer 2">
+    <g
+       id="g3648-9"
+       transform="matrix(1.0012516,0,0,1.0012516,1,0.99999901)"
+       style="fill:#ff8080">
+      <g
+         id="g3606-0"
+         style="fill:#ff8080">
+        <g
+           id="c142_x-7"
+           style="fill:#ff8080">
+          <path
+             id="path3609-4"
+             d="M 13.98,0 C 6.259,0 0,6.261 0,13.983 c 0,7.721 6.259,13.982 13.98,13.982 7.725,0 13.985,-6.262 13.985,-13.982 C 27.965,6.261 21.705,0 13.98,0 Z m 6.012,17.769 -2.227,2.224 c 0,0 -3.523,-3.78 -3.786,-3.78 -0.259,0 -3.783,3.78 -3.783,3.78 L 7.968,17.769 c 0,0 3.784,-3.472 3.784,-3.781 0,-0.314 -3.784,-3.787 -3.784,-3.787 l 2.228,-2.229 c 0,0 3.553,3.782 3.783,3.782 0.232,0 3.786,-3.782 3.786,-3.782 l 2.227,2.229 c 0,0 -3.785,3.523 -3.785,3.787 0,0.251 3.785,3.781 3.785,3.781 z"
+             inkscape:connector-curvature="0"
+             style="fill:#ff8080" />
+        </g>
+        <g
+           id="Capa_1_104_-6"
+           style="fill:#ff8080" />
+      </g>
+      <g
+         id="g3612-9"
+         style="fill:#ff8080" />
+      <g
+         id="g3614-7"
+         style="fill:#ff8080" />
+      <g
+         id="g3616-3"
+         style="fill:#ff8080" />
+      <g
+         id="g3618-0"
+         style="fill:#ff8080" />
+      <g
+         id="g3620-0"
+         style="fill:#ff8080" />
+      <g
+         id="g3622-5"
+         style="fill:#ff8080" />
+      <g
+         id="g3624-1"
+         style="fill:#ff8080" />
+      <g
+         id="g3626-2"
+         style="fill:#ff8080" />
+      <g
+         id="g3628-3"
+         style="fill:#ff8080" />
+      <g
+         id="g3630-1"
+         style="fill:#ff8080" />
+      <g
+         id="g3632-7"
+         style="fill:#ff8080" />
+      <g
+         id="g3634-2"
+         style="fill:#ff8080" />
+      <g
+         id="g3636-9"
+         style="fill:#ff8080" />
+      <g
+         id="g3638-9"
+         style="fill:#ff8080" />
+      <g
+         id="g3640-6"
+         style="fill:#ff8080" />
+    </g>
+  </g>
+</svg>

data/framework_components/monitoring-interface/img/email.svg

@@ -0,0 +1,89 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.1"
+   id="Capa_1"
+   x="0px"
+   y="0px"
+   viewBox="0 0 33 24"
+   xml:space="preserve"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="email.svg"
+   width="33"
+   height="24"><metadata
+     id="metadata3494"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+     id="defs3492" /><sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1080"
+     inkscape:window-height="757"
+     id="namedview3490"
+     showgrid="false"
+     inkscape:zoom="17.1875"
+     inkscape:cx="11.728254"
+     inkscape:cy="16.543966"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="Capa_1" /><g
+     id="g3450"
+     transform="scale(1.5,1.5)"
+     style="fill:#cccccc"><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#cccccc"
+       points="0,2 11,11 22,2 22,0 0,0 "
+       id="polygon3452" /><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#cccccc"
+       points="16.446,8.268 22,14.396 22,3.451 "
+       id="polygon3454" /><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#cccccc"
+       points="11,12.741 6.5,9 0,16 22,16 15.49,9 "
+       id="polygon3456" /><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#cccccc"
+       points="5.402,8.248 0,3.378 0,14.249 "
+       id="polygon3458" /></g><g
+     id="g3460"
+     transform="translate(0,8)" /><g
+     id="g3462"
+     transform="translate(0,8)" /><g
+     id="g3464"
+     transform="translate(0,8)" /><g
+     id="g3466"
+     transform="translate(0,8)" /><g
+     id="g3468"
+     transform="translate(0,8)" /><g
+     id="g3470"
+     transform="translate(0,8)" /><g
+     id="g3472"
+     transform="translate(0,8)" /><g
+     id="g3474"
+     transform="translate(0,8)" /><g
+     id="g3476"
+     transform="translate(0,8)" /><g
+     id="g3478"
+     transform="translate(0,8)" /><g
+     id="g3480"
+     transform="translate(0,8)" /><g
+     id="g3482"
+     transform="translate(0,8)" /><g
+     id="g3484"
+     transform="translate(0,8)" /><g
+     id="g3486"
+     transform="translate(0,8)" /><g
+     id="g3488"
+     transform="translate(0,8)" /></svg>

data/framework_components/monitoring-interface/img/email_highlighted.svg

@@ -0,0 +1,89 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.1"
+   id="Capa_1"
+   x="0px"
+   y="0px"
+   viewBox="0 0 33 24"
+   xml:space="preserve"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="email_highlighted.svg"
+   width="33"
+   height="24"><metadata
+     id="metadata3494"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+     id="defs3492" /><sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1080"
+     inkscape:window-height="757"
+     id="namedview3490"
+     showgrid="false"
+     inkscape:zoom="17.1875"
+     inkscape:cx="11.728254"
+     inkscape:cy="16.543966"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="Capa_1" /><g
+     id="g3450"
+     transform="scale(1.5,1.5)"
+     style="fill:#ffffff"><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#ffffff"
+       points="0,2 11,11 22,2 22,0 0,0 "
+       id="polygon3452" /><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#ffffff"
+       points="16.446,8.268 22,14.396 22,3.451 "
+       id="polygon3454" /><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#ffffff"
+       points="11,12.741 6.5,9 0,16 22,16 15.49,9 "
+       id="polygon3456" /><polygon
+       style="clip-rule:evenodd;fill-rule:evenodd;fill:#ffffff"
+       points="5.402,8.248 0,3.378 0,14.249 "
+       id="polygon3458" /></g><g
+     id="g3460"
+     transform="translate(0,8)" /><g
+     id="g3462"
+     transform="translate(0,8)" /><g
+     id="g3464"
+     transform="translate(0,8)" /><g
+     id="g3466"
+     transform="translate(0,8)" /><g
+     id="g3468"
+     transform="translate(0,8)" /><g
+     id="g3470"
+     transform="translate(0,8)" /><g
+     id="g3472"
+     transform="translate(0,8)" /><g
+     id="g3474"
+     transform="translate(0,8)" /><g
+     id="g3476"
+     transform="translate(0,8)" /><g
+     id="g3478"
+     transform="translate(0,8)" /><g
+     id="g3480"
+     transform="translate(0,8)" /><g
+     id="g3482"
+     transform="translate(0,8)" /><g
+     id="g3484"
+     transform="translate(0,8)" /><g
+     id="g3486"
+     transform="translate(0,8)" /><g
+     id="g3488"
+     transform="translate(0,8)" /></svg>

data/framework_components/monitoring-interface/index.html

@@ -0,0 +1,144 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+    <meta charset="UTF-8">
+
+    <meta name="description" content="">
+
+    <title>Monitoring Interface</title>
+
+    <link rel="stylesheet" href="css/bootstrap.min.css">
+    <link href="css/page.css" rel="stylesheet" type="text/css">
+    <link href="css/cursor.css" rel="stylesheet" type="text/css">
+    <link href="css/ui-connection-view.css" rel="stylesheet" type="text/css">
+    <link href="css/ui-application.css" rel="stylesheet" type="text/css">
+    <link href="css/ui-legend-view.css" rel="stylesheet" type="text/css">
+    <link rel="stylesheet" href="css/highlight.default.min.css">
+
+    <script type="application/javascript" src="js/lib/d3.v3.min.js" charset="utf-8"></script>
+    <script type="application/javascript" src="js/lib/underscore-min.js" charset="utf-8"></script>
+    <script type="application/javascript" src="js/lib/jquery-1.10.0.min.js" charset="utf-8"></script>
+    <script type="application/javascript" src="js/lib/bootstrap.min.js" charset="utf-8"></script>
+    <script type="application/javascript" src="js/lib/highlight.min.js"></script>
+
+    <script type="application/javascript" src="js/lib/react-with-addons-0.12.2.js"></script>
+    <script type="application/javascript" src="js/lib/JSXTransformer-0.12.2.js"></script>
+
+    <script type="application/javascript" src="js/d3/layout/radial-layout.js"></script>
+    <script type="application/javascript" src="js/d3/layout/grid-layout.js"></script>
+
+    <script type="application/javascript" src="js/notification/notifications.js"></script>
+    <script type="application/javascript" src="js/notification/notification-center.js"></script>
+
+    <script type="application/javascript" src="js/model/applications-model.js"></script>
+    <script type="application/javascript" src="js/model/messages-model.js"></script>
+    <script type="application/javascript" src="js/model/alerts-model.js"></script>
+
+    <script type="application/javascript" src="js/view-controller/view-controller.js"></script>
+    <script type="application/javascript" src="js/view-controller/window-view-controller.js"></script>
+    <script type="application/javascript" src="js/view-controller/application-view-controller.js"></script>
+    <script type="application/javascript" src="js/view-controller/instance-view-controller.js"></script>
+
+    <script type="application/javascript" src="js/d3/plugin/graphics.js"></script>
+    <script type="application/javascript" src="js/d3/plugin/tab-table.js"></script>
+
+    <script type="application/javascript" src="js/d3/ui/animations.js"></script>
+    <script type="application/javascript" src="js/d3/ui/ui-element.js"></script>
+    <script type="application/javascript" src="js/d3/ui/ui-legend.js"></script>
+    <script type="application/javascript" src="js/d3/ui/ui-notification.js"></script>
+    <script type="application/javascript" src="js/d3/ui/ui-application.js"></script>
+    <script type="application/javascript" src="js/d3/ui/ui-connection-view.js"></script>
+    <script type="application/javascript" src="js/d3/ui/ui-tab.js"></script>
+
+    <script type="application/javascript" src="js/react/dist/ui-messages.js"></script>
+    <script type="application/javascript" src="js/react/dist/ui-alerts.js"></script>
+    <script type="application/javascript" src="js/react/dist/ui-message-send.js"></script>
+
+    <!-- Scripts -->
+    <script src="js/lib/nutella_lib.js"></script>
+
+</head>
+<body style="margin: 0">
+
+<svg id="container"></svg>
+
+<!-- Message display -->
+<div class="modal fade" id="messageDisplay" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
+
+<!-- Message send -->
+<div class="modal fade" id="messageSend" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
+
+<!-- Mail -->
+<div class="modal fade" id="mailDisplay" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
+
+</body>
+
+<script  type="text/jsx">
+    // Initialize react components here
+
+    React.render(
+            <UIMessages/>,
+            document.getElementById('messageDisplay')
+    );
+
+    React.render(
+            <UIAlerts/>,
+            document.getElementById('mailDisplay')
+    );
+
+    React.render(
+            <UIMessageSend/>,
+            document.getElementById('messageSend')
+    );
+</script>
+
+<script>
+    $("#subscribeButton").on("click", function() {
+        var email = $("#subscribeEmail").val();
+        alert("ciao " + email);
+    });
+</script>
+
+<script>
+
+    // Parse the query parameters
+    var query_parameters = NUTELLA.parseURLParameters();
+
+    var nutella = NUTELLA.init(query_parameters.broker, query_parameters.app_id, query_parameters.run_id, 'monitoring-interface');
+
+    var nutellaFramework = NUTELLA.initFramework(query_parameters.broker, 'monitoring-interface');
+
+    // Nutella request
+//    var email = "gianluca.91@gmail.com";
+//
+//    nutella.net.request("mail/send_subscription", {to: email, application: "palloSinistro", instance:"palloDestro", component:"e la minchia"});
+//    nutella.net.request("mail/send_notification", {to: email, application: "palloSinistro", instance:"palloDestro"});
+
+    var svg = d3.select("#container");
+
+    // Set background color
+    svg.style("background", defaultPalette.background.normal);
+
+    windowViewController.view = svg;
+    windowViewController.updateViewBox();
+
+    applicationModel.fetchData("data/data.json");
+
+    /*
+    var c = 0;
+    window.setInterval(function(){
+        console.log("change");
+        if(c%4 == 0)
+            applicationModel.fetchData("data/data2.json");
+        else if(c%4 == 1)
+            applicationModel.fetchData("data/data3.json");
+        else if(c%4 == 2)
+            applicationModel.fetchData("data/data4.json");
+        else
+            applicationModel.fetchData("data/data.json");
+        c++;
+    }, 5000);
+    */
+</script>
+
+</html>

data/framework_components/monitoring-interface/js/d3/layout/grid-layout.js

@@ -0,0 +1,103 @@
+(function() {
+    d3.layout.grid = function() {
+        var mode = "equal",
+            layout = _distributeEqually,
+            x = d3.scale.ordinal(),
+            y = d3.scale.ordinal(),
+            size = [1, 1],
+            actualSize = [0, 0],
+            nodeSize = false,
+            bands = false,
+            padding = [0, 0],
+            cols, rows;
+
+        function grid(nodes) {
+            return layout(nodes);
+        }
+
+        function _distributeEqually(nodes) {
+            var i = -1,
+                n = nodes.length,
+                _cols = cols ? cols : 0,
+                _rows = rows ? rows : 0,
+                col, row;
+
+            if (_rows && !_cols) {
+                _cols = Math.ceil(n / _rows)
+            } else {
+                _cols || (_cols = Math.ceil(Math.sqrt(n)));
+                _rows || (_rows = Math.ceil(n / _cols));
+            }
+
+            if (nodeSize) {
+                x.domain(d3.range(_cols)).range(d3.range(0, (size[0] + padding[0]) * _cols, size[0] + padding[0]));
+                y.domain(d3.range(_rows)).range(d3.range(0, (size[1] + padding[1]) * _rows, size[1] + padding[1]));
+                actualSize[0] = bands ? x(_cols - 1) + size[0] : x(_cols - 1);
+                actualSize[1] = bands ? y(_rows - 1) + size[1] : y(_rows - 1);
+            } else if (bands) {
+                x.domain(d3.range(_cols)).rangeBands([0, size[0]], padding[0], 0);
+                y.domain(d3.range(_rows)).rangeBands([0, size[1]], padding[1], 0);
+                actualSize[0] = x.rangeBand();
+                actualSize[1] = y.rangeBand();
+            } else {
+                x.domain(d3.range(_cols)).rangePoints([0, size[0]]);
+                y.domain(d3.range(_rows)).rangePoints([0, size[1]]);
+                actualSize[0] = x(1);
+                actualSize[1] = y(1);
+            }
+
+            while (++i < n) {
+                col = i % _cols;
+                row = Math.floor(i / _cols);
+                nodes[i].x = x(col);
+                nodes[i].y = y(row);
+            }
+
+            return nodes;
+        }
+
+        grid.size = function(value) {
+            if (!arguments.length) return nodeSize ? actualSize : size;
+            actualSize = [0, 0];
+            nodeSize = (size = value) == null;
+            return grid;
+        };
+
+        grid.nodeSize = function(value) {
+            if (!arguments.length) return nodeSize ? size : actualSize;
+            actualSize = [0, 0];
+            nodeSize = (size = value) != null;
+            return grid;
+        };
+
+        grid.rows = function(value) {
+            if (!arguments.length) return rows;
+            rows = value;
+            return grid;
+        };
+
+        grid.cols = function(value) {
+            if (!arguments.length) return cols;
+            cols = value;
+            return grid;
+        };
+
+        grid.bands = function() {
+            bands = true;
+            return grid;
+        };
+
+        grid.points = function() {
+            bands = false;
+            return grid;
+        };
+
+        grid.padding = function(value) {
+            if (!arguments.length) return padding;
+            padding = value;
+            return grid;
+        };
+
+        return grid;
+    };
+})();