Return-Path: X-Original-To: apmail-flink-commits-archive@minotaur.apache.org Delivered-To: apmail-flink-commits-archive@minotaur.apache.org Received: from mail.apache.org (hermes.apache.org [140.211.11.3]) by minotaur.apache.org (Postfix) with SMTP id 3236010C16 for ; Thu, 18 Dec 2014 18:45:58 +0000 (UTC) Received: (qmail 28454 invoked by uid 500); 18 Dec 2014 18:45:58 -0000 Delivered-To: apmail-flink-commits-archive@flink.apache.org Received: (qmail 28424 invoked by uid 500); 18 Dec 2014 18:45:58 -0000 Mailing-List: contact commits-help@flink.incubator.apache.org; run by ezmlm Precedence: bulk List-Help: List-Unsubscribe: List-Post: List-Id: Reply-To: dev@flink.incubator.apache.org Delivered-To: mailing list commits@flink.incubator.apache.org Received: (qmail 28415 invoked by uid 99); 18 Dec 2014 18:45:58 -0000 Received: from athena.apache.org (HELO athena.apache.org) (140.211.11.136) by apache.org (qpsmtpd/0.29) with ESMTP; Thu, 18 Dec 2014 18:45:57 +0000 X-ASF-Spam-Status: No, hits=-2000.0 required=5.0 tests=ALL_TRUSTED,T_RP_MATCHES_RCVD X-Spam-Check-By: apache.org Received: from [140.211.11.3] (HELO mail.apache.org) (140.211.11.3) by apache.org (qpsmtpd/0.29) with SMTP; Thu, 18 Dec 2014 18:45:26 +0000 Received: (qmail 20297 invoked by uid 99); 18 Dec 2014 18:44:59 -0000 Received: from tyr.zones.apache.org (HELO tyr.zones.apache.org) (140.211.11.114) by apache.org (qpsmtpd/0.29) with ESMTP; Thu, 18 Dec 2014 18:44:59 +0000 Received: by tyr.zones.apache.org (Postfix, from userid 65534) id 5E7239579EA; Thu, 18 Dec 2014 18:44:59 +0000 (UTC) Content-Type: text/plain; charset="us-ascii" MIME-Version: 1.0 Content-Transfer-Encoding: 7bit From: trohrmann@apache.org To: commits@flink.incubator.apache.org Date: Thu, 18 Dec 2014 18:45:36 -0000 Message-Id: In-Reply-To: References: X-Mailer: ASF-Git Admin Mailer Subject: [40/82] [abbrv] incubator-flink git commit: Moved WebInfoServer and WebInterfaceServer resources into resource folders of respective projects. Jetty uses the jar as base directory. X-Virus-Checked: Checked by ClamAV on apache.org http://git-wip-us.apache.org/repos/asf/incubator-flink/blob/76d603c0/flink-clients/resources/web-docs/js/graphCreator.js ---------------------------------------------------------------------- diff --git a/flink-clients/resources/web-docs/js/graphCreator.js b/flink-clients/resources/web-docs/js/graphCreator.js deleted file mode 100644 index 86c8c81..0000000 --- a/flink-clients/resources/web-docs/js/graphCreator.js +++ /dev/null @@ -1,445 +0,0 @@ -/*! - * Licensed to the Apache Software Foundation (ASF) under one - * or more contributor license agreements. See the NOTICE file - * distributed with this work for additional information - * regarding copyright ownership. The ASF licenses this file - * to you under the Apache License, Version 2.0 (the - * "License"); you may not use this file except in compliance - * with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - * Document initialization. - */ -$(document).ready(function () -{ - zoom = d3.behavior.zoom("#svg-main").on("zoom", function() { - var ev = d3.event; - d3.select("#svg-main g") - .attr("transform", "translate(" + ev.translate + ") scale(" + ev.scale + ")"); - }); - zoom.scaleExtent([0.3, 3]) -}); - -//The current JSON file -var JSONData; -//The informations for the iterations -var iterationIds = new Array(); -var iterationGraphs = new Array(); -var iterationWidths = new Array(); -var iterationHeights = new Array(); - -//The zoom element -var zoom; -//informations about the enviroment -var svgWidth; -var svgHeight; - -//Renders and draws the graph -function drawGraph(data, svgID){ - JSONData = data; - - //First step: precompute all iteration graphs - - //find all iterations - iterationNodes = searchForIterationNodes(); - - //add the graphs of iterations and their sizes + Ids to arrays - if (iterationNodes != null) { - for (var i in iterationNodes) { - var itNode = iterationNodes[i]; - iterationIds.push(itNode.id); - var g0 = loadJsonToDagre(itNode); - iterationGraphs.push(g0); - var r = new dagreD3.Renderer(); - var l = dagreD3.layout() - .nodeSep(20) - .rankDir("LR"); - l = r.layout(l).run(g0, d3.select("#svg-main")); - - iterationWidths.push(l._value.width); - iterationHeights.push(l._value.height); - - //Clean svg - $("#svg-main g").empty(); - } - } - - //Continue normal - var g = loadJsonToDagre(data); - var selector = svgID + " g"; - var renderer = new dagreD3.Renderer(); - var layout = dagreD3.layout() - .nodeSep(20) - .rankDir("LR"); - var svgElement = d3.select(selector); - layout = renderer.layout(layout).run(g, svgElement); - - svgHeight = layout._value.height; - svgWidth = layout._value.width; - - var svg = d3.select("#svg-main") - .attr("width", $(document).width() - 15) - .attr("height", $(document).height() - 15 - 110) -// .attr("viewBox", "0 0 "+ ($(document).width() - 150) +" "+($(document).height() - 15 - 110)) - .call(zoom); - - // This should now draw the precomputed graphs in the svgs... . - - for (var i in iterationIds) { - var workset = searchForNode(iterationIds[i]); - renderer = new dagreD3.Renderer(); - layout = dagreD3.layout() - .nodeSep(20) - .rankDir("LR"); - selector = "#svg-"+iterationIds[i]+" g"; - svgElement = d3.select(selector); - layout = renderer.layout(layout).run(iterationGraphs[i], svgElement); - } - - //enable Overlays and register function for overlay-infos - $("a[rel]").overlay({ - onBeforeLoad: function(){ - var id = this.getTrigger().attr("nodeID") - showProperties(id); - } - }); - - } - -//Creates the dagreD3 graph object -//Responsible for adding nodes and edges -function loadJsonToDagre(data){ - - //stores all nodes that are in current graph -> no edges to nodes which are outside of current iterations! - var existingNodes = new Array; - - var g = new dagreD3.Digraph(); - - //Find out whether we are in an iteration or in the normal json - //Bulk variables - var partialSolution; - var nextPartialSolution; - //Workset variables - var workset; - var nextWorkset; - var solutionSet; - var solutionDelta; - - if (data.nodes != null) { - //This is the normal json data - var toIterate = data.nodes; - } else { - //This is an iteration, we now store special iteration nodes if possible - var toIterate = data.step_function; - partialSolution = data.partial_solution; - nextPartialSolution = data.next_partial_solution; - workset = data.workset; - nextWorkset = data.next_workset; - solutionSet = data.solution_set; - solutionDelta = data.solution_delta; - } - - for (var i in toIterate) { - var el = toIterate[i]; - //create node, send additional informations about the node if it is a special one - if (el.id == partialSolution) { - g.addNode(el.id, { label: createLabelNode(el, "partialSolution"), nodesWithoutEdges: ""} ); - } else if (el.id == nextPartialSolution) { - g.addNode(el.id, { label: createLabelNode(el, "nextPartialSolution"), nodesWithoutEdges: ""} ); - } else if (el.id == workset) { - g.addNode(el.id, { label: createLabelNode(el, "workset"), nodesWithoutEdges: ""} ); - } else if (el.id == nextWorkset) { - g.addNode(el.id, { label: createLabelNode(el, "nextWorkset"), nodesWithoutEdges: ""} ); - } else if (el.id == solutionSet) { - g.addNode(el.id, { label: createLabelNode(el, "solutionSet"), nodesWithoutEdges: ""} ); - } else if (el.id == solutionDelta) { - g.addNode(el.id, { label: createLabelNode(el, "solutionDelta"), nodesWithoutEdges: ""} ); - } else { - g.addNode(el.id, { label: createLabelNode(el, ""), nodesWithoutEdges: ""} ); - } - existingNodes.push(el.id); - - //create edgdes from predecessors to current node - if (el.predecessors != null) { - for (var j in el.predecessors) { - if (existingNodes.indexOf(el.predecessors[j].id) != -1) { - g.addEdge(null, el.predecessors[j].id, el.id, { label: createLabelEdge(el.predecessors[j]) }); - } else { - var missingNode = searchForNode(el.predecessors[j].id); - if (missingNode.alreadyAdded != true) { - missingNode.alreadyAdded = true; - g.addNode(missingNode.id, {label: createLabelNode(missingNode, "mirror")}); - g.addEdge(null, missingNode.id, el.id, { label: createLabelEdge(missingNode) }); - } - } - } - } - } - return g; -} - -//create a label of an edge -function createLabelEdge(el) { - var labelValue = ""; - - if (el.ship_strategy != null || el.local_strategy != null) { - labelValue += "
"; - if (el.ship_strategy != null) { - labelValue += el.ship_strategy; - } - if (el.temp_mode != undefined) { - labelValue += " (" + el.temp_mode + ")"; - } - if (el.local_strategy != undefined) { - labelValue += ",
" + el.local_strategy; - } - labelValue += "
"; - } - - return labelValue; -} - -//creates the label of a node, in info is stored, whether it is a special node (like a mirror in an iteration) -function createLabelNode(el, info) { -// if (info != "") { -// console.log("The node " + el.id + " is a " + info); -// } - - //true, if the node is a special node from an iteration - var specialIterationNode = (info == "partialSolution" || info == "nextPartialSolution" || info == "workset" || info == "nextWorkset" || info == "solutionSet" || info == "solutionDelta" ); - - var labelValue = "
"; - //set color of panel - if (info == "mirror") { - labelValue += "
"; - } else if (specialIterationNode) { - labelValue += "
"; - } else { - //there is no info value, set normal color - if (el.pact == "Data Source") { - labelValue += "
"; - } else if (el.pact == "Data Sink") { - labelValue += "
"; - } else { - labelValue += "
"; - } - } - //Nodename - if (info == "mirror") { - labelValue += "

Mirror of " + el.pact + " (ID = "+el.id+")

"; - } else { - labelValue += "

" + el.pact + " (ID = "+el.id+")

"; - } - if (el.contents == "") { - labelValue += "
"; - } else { - var stepName = el.contents; - //clean stepName - stepName = shortenString(stepName); - labelValue += "

" + stepName + "

"; - } - - //If this node is an "iteration" we need a different panel-body - if (el.step_function != null) { - labelValue += extendLabelNodeForIteration(el.id); - } else { - //Otherwise add infos - if (specialIterationNode) { - labelValue += "
" + info + " Node
"; - } - - if (el.parallelism != "") { - labelValue += "
Parallelism: " + el.parallelism + "
"; - } - - if (el.driver_strategy != undefined) { - labelValue += "
Driver Strategy: " + el.driver_strategy + "
"; - return labelValue; -} - -//presents properties for a given nodeID in the propertyCanvas overlay -function showProperties(nodeID) { - $("#propertyCanvas").empty(); - node = searchForNode(nodeID); - var phtml = "

Properties of "+ shortenString(node.contents) + " - ID = " + nodeID + "

"; - phtml += "
"; - - phtml += "

Pact Properties

"; - phtml += ""; - phtml += tableRow("Operator", (node.driver_strategy == undefined ? "None" : node.driver_strategy)); - phtml += tableRow("Parallelism", (node.parallelism == undefined ? "None" : node.parallelism)); - phtml += tableRow("Subtasks-per-instance", (node.subtasks_per_instance == undefined ? "None" : node.subtasks_per_instance)); - phtml += "
"; - - phtml += "

Global Data Properties

"; - phtml += ""; - if (node.global_properties != null) { - for (var i = 0; i < node.global_properties.length; i++) { - var prop = node.global_properties[i]; - phtml += tableRow((prop.name == undefined ? '(unknown)' : prop.name),(prop.value == undefined ? "(none)" : prop.value)); - } - } else { - phtml += tableRow("Global Properties", "None"); - } - phtml += "
"; - - phtml += "

Local Data Properties

"; - phtml += ""; - if (node.local_properties != null) { - for (var i = 0; i < node.local_properties.length; i++) { - var prop = node.local_properties[i]; - phtml += tableRow((prop.name == undefined ? '(unknown)' : prop.name),(prop.value == undefined ? "(none)" : prop.value)); - } - } else { - phtml += tableRow("Local Properties", "None"); - } - phtml += "
"; - - phtml += "
"; - phtml += "

Size Estimates

"; - phtml += ""; - if (node.estimates != null) { - for (var i = 0; i < node.estimates.length; i++) { - var prop = node.estimates[i]; - phtml += tableRow((prop.name == undefined ? '(unknown)' : prop.name),(prop.value == undefined ? "(none)" : prop.value)); - } - } else { - phtml += tableRow("Size Estimates", "None"); - } - phtml += "
"; - - phtml += "

Cost Estimates

"; - phtml += ""; - if (node.costs != null) { - for (var i = 0; i < node.costs.length; i++) { - var prop = node.costs[i]; - phtml += tableRow((prop.name == undefined ? '(unknown)' : prop.name),(prop.value == undefined ? "(none)" : prop.value)); - } - } else { - phtml += tableRow("Cost Estimates", "None"); - } - phtml += "
"; - - phtml += "
"; - $("#propertyCanvas").append(phtml); - -} - -//searches in the global JSONData for the node with the given id -function searchForNode(nodeID) { - for (var i in JSONData.nodes) { - var el = JSONData.nodes[i]; - if (el.id == nodeID) { - return el; - } - //look for nodes that are in iterations - if (el.step_function != null) { - for (var j in el.step_function) { - if (el.step_function[j].id == nodeID) { - return el.step_function[j]; - } - } - } - } -} - -//searches for all nodes in the global JSONData, that are iterations -function searchForIterationNodes() { - var itN = new Array(); - for (var i in JSONData.nodes) { - var el = JSONData.nodes[i]; - if (el.step_function != null) { - itN.push(el); - } - } - return itN; -} - -//creates a row for a table with two collums -function tableRow(nameX, valueX) { - var htmlCode = ""; - htmlCode += "" + nameX + "" + valueX + ""; - return htmlCode; -} - -//Split a string into multiple lines so that each line has less than 30 letters. -function shortenString(s) { - //make sure that name does not contain a < (because of html) - if (s.charAt(0) == "<") { - s = s.replace("<", "<"); - s = s.replace(">", ">"); - } - - sbr = "" - while (s.length > 30) { - sbr = sbr + s.substring(0, 30) + "
" - s = s.substring(30, s.length) - } - sbr = sbr + s - - return sbr; -} - -//activates the zoom buttons -function activateZoomButtons() { - $("#zoomIn").click(function() { - console.log("Clicked zoom in"); - if (zoom.scale() < 2.99) { - var svg = d3.select("#svg-main"); - //Calculate and store new values in zoom object - var translate = zoom.translate(); - var v1 = translate[0] * (zoom.scale() + 0.1 / (zoom.scale())); - var v2 = translate[1] * (zoom.scale() + 0.1 / (zoom.scale())); - zoom.scale(zoom.scale() + 0.1); - zoom.translate([v1, v2]); - //Transform svg - svg.select("#svg-main g") - .attr("transform", "translate(" + v1 + ","+ v2 + ") scale(" + zoom.scale() + ")"); - } - }); - - $("#zoomOut").click(function() { - if (zoom.scale() > 0.31) { - var svg = d3.select("#svg-main"); - //Calculate and store new values in zoom object - zoom.scale(zoom.scale() - 0.1); - var translate = zoom.translate(); - var v1 = translate[0] * (zoom.scale() - 0.1 / (zoom.scale())); - var v2 = translate[1] * (zoom.scale() - 0.1 / (zoom.scale())); - zoom.translate([v1, v2]); - //Transform svg - svg.select("#svg-main g") - .attr("transform", "translate(" + v1 + ","+ v2 + ") scale(" + zoom.scale() + ")"); - } - }); -}