/*############################################################################## # HPCC SYSTEMS software Copyright (C) 2012 HPCC Systems. # # Licensed 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. ############################################################################## */ require([ "dojo/_base/declare", "dojo/aspect", "dojo/has", "dojo/dom", "dojo/dom-construct", "dojo/dom-class", "dijit/layout/_LayoutWidget", "dijit/_TemplatedMixin", "dijit/_WidgetsInTemplateMixin", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/text!./templates/GraphWidget.html", "dijit/Toolbar", "dijit/ToolbarSeparator", "dijit/form/Button" ], function (declare, aspect, has, dom, domConstruct, domClass, _LayoutWidget, _TemplatedMixin, _WidgetsInTemplateMixin, BorderContainer, ContentPane, template) { return declare("GraphWidget", [_LayoutWidget, _TemplatedMixin, _WidgetsInTemplateMixin], { templateString: template, baseClass: "GraphWidget", borderContainer: null, graphContentPane: null, _isPluginInstalled: false, plugin: null, eventsRegistered: false, xgmml: "", dot: "", svg: "", _onClickZoomAll: function (args) { this.centerOnItem(0, true); }, _onClickZoomWidth: function (args) { this.centerOnItem(0, true, true); }, onSelectionChanged: function (items) { }, onDoubleClick: function (globalID) { }, onLayoutFinished: function () { }, buildRendering: function (args) { this.inherited(arguments); }, postCreate: function (args) { this.inherited(arguments); this.borderContainer = dijit.byId(this.id + "BorderContainer"); this.graphContentPane = dijit.byId(this.id + "GraphContentPane"); }, startup: function (args) { this.inherited(arguments); this._isPluginInstalled = this.isPluginInstalled(); this.createPlugin(); this.watchStyleChange(); }, resize: function (args) { this.inherited(arguments); this.borderContainer.resize(); }, layout: function (args) { this.inherited(arguments); }, // Plugin wrapper --- clear: function () { if (this.plugin) { this.plugin.clear(); } }, loadXGMML: function (xgmml, merge) { this.registerEvents(); if (this.plugin && this.xgmml != xgmml) { this.setMessage("Loading Data..."); if (merge) this.plugin.mergeXGMML(xgmml); else this.plugin.loadXGMML(xgmml); this.setMessage("Performing Layout..."); this.plugin.startLayout("dot"); this.xgmml = xgmml; } }, mergeXGMML: function (xgmml) { this.registerEvents(); if (this.plugin && this.xgmml != xgmml) { this.plugin.mergeXGMML(xgmml); this.xgmml = xgmml; } }, loadDOT: function (dot) { this.registerEvents(); this.load(dot, "dot"); }, load: function (dot, layout) { this.registerEvents(); if (this.plugin && this.xgmml != xgmml) { this.setMessage("Loading Data..."); this.plugin.loadDOT(dot); this.setMessage("Performing Layout..."); this.plugin.startLayout(layout); this.xgmml = xgmml; } }, setLayout: function (layout) { if (this.plugin) { this.setMessage("Performing Layout..."); this.plugin.startLayout(layout); } }, centerOn: function (globalID) { var item = this.plugin.getItem(globalID); this.plugin.centerOnItem(item, true); var items = [item]; this.plugin.setSelected(items, true); }, getVersion: function () { return this.plugin.version; }, displayProperties: function (item, place) { var props = this.plugin.getProperties(item); if (props.id) { var table = domConstruct.create("h3", { innerHTML: props.id, align: "center" }, place); delete props.id; } if (props.count) { var table = domConstruct.create("table", { border: 1, cellspacing: 0, width: "100%" }, place); var tr = domConstruct.create("tr", null, table); var td = domConstruct.create("td", { innerHTML: "Count" }, tr); var td = domConstruct.create("td", { align: "right", innerHTML: props.count }, tr); delete props.count; domConstruct.create("br", null, place); } if (props.max) { var table = domConstruct.create("table", { border: 1, cellspacing: 0, width: "100%" }, place); var tr = domConstruct.create("tr", null, table); domConstruct.create("th", { innerHTML: " " }, tr); domConstruct.create("th", { innerHTML: "Skew" }, tr); domConstruct.create("th", { innerHTML: "Node" }, tr); domConstruct.create("th", { innerHTML: "Rows" }, tr); tr = domConstruct.create("tr", null, table); domConstruct.create("td", { innerHTML: "Max" }, tr); domConstruct.create("td", { innerHTML: props.maxskew }, tr); domConstruct.create("td", { innerHTML: props.maxEndpoint }, tr); domConstruct.create("td", { innerHTML: props.max }, tr); tr = domConstruct.create("tr", null, table); domConstruct.create("td", { innerHTML: "Min" }, tr); domConstruct.create("td", { innerHTML: props.minskew }, tr); domConstruct.create("td", { innerHTML: props.minEndpoint }, tr); domConstruct.create("td", { innerHTML: props.min }, tr); delete props.maxskew; delete props.maxEndpoint; delete props.max; delete props.minskew; delete props.minEndpoint; delete props.min; domConstruct.create("br", null, place); } if (props.slaves) { var table = domConstruct.create("table", { border: 1, cellspacing: 0, width: "100%" }, place); var tr = domConstruct.create("tr", null, table); domConstruct.create("th", { innerHTML: "Slaves" }, tr); domConstruct.create("th", { innerHTML: "Started" }, tr); domConstruct.create("th", { innerHTML: "Stopped" }, tr); tr = domConstruct.create("tr", null, table); domConstruct.create("td", { innerHTML: props.slaves }, tr); domConstruct.create("td", { innerHTML: props.started }, tr); domConstruct.create("td", { innerHTML: props.stopped }, tr); delete props.slaves; delete props.started; delete props.stopped; domConstruct.create("br", null, place); } var first = true; var table = {}; var tr = {}; for (key in props) { if (key[0] == "_") continue; if (first) { first = false; table = domConstruct.create("table", { border: 1, cellspacing: 0, width: "100%" }, place); tr = domConstruct.create("tr", null, table); domConstruct.create("th", { innerHTML: "Property" }, tr); domConstruct.create("th", { innerHTML: "Value" }, tr); } tr = domConstruct.create("tr", null, table); domConstruct.create("td", { innerHTML: key }, tr); domConstruct.create("td", { innerHTML: props[key] }, tr); } if (first == false) { domConstruct.create("br", null, place); } }, isPluginInstalled: function () { if (has("ie")) { try { var o = new ActiveXObject("HPCCSystems.HPCCSystemsGraphViewControl.1"); o = null; return true; } catch (e) { } return false; } else { for (var i = 0, p = navigator.plugins, l = p.length; i < l; i++) { if (p[i].name.indexOf("HPCCSystemsGraphViewControl") > -1) { return true; } } return false; } }, createPlugin: function () { var pluginID = this.id + "Plugin"; if (this.plugin == null) { if (this._isPluginInstalled) { if (has("ie")) { this.graphContentPane.domNode.innerHTML = ''; } else { this.graphContentPane.domNode.innerHTML = ''; } this.plugin = dom.byId(pluginID); var context = this; } else { domConstruct.create("div", { innerHTML: "
To enable graph views, please install the Graph View Control plugin:
" + this.getResourceLinks() }, this.graphContentPane.domNode); } } }, getResourceLinks: function () { return "Binary Installs