From 5db8dc3f62a8e0eba9dd533313b441d7267902fd Mon Sep 17 00:00:00 2001 From: dacowan404 Date: Wed, 13 Dec 2023 11:24:16 -0500 Subject: [PATCH] Auto-generated commit [ci skip] --- main.js | 421 +++++++++++++++++++++++++++++--------------------------- 1 file changed, 215 insertions(+), 206 deletions(-) diff --git a/main.js b/main.js index 154ca63a..082b263d 100644 --- a/main.js +++ b/main.js @@ -9933,7 +9933,6 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.Show2DSettingsPane = false; this.IsDataAvailable = false; this.svg = null; - this.settings = this.commonService.session.style.widgets; this.halfWidth = null; this.halfHeight = null; this.transform = null; @@ -10050,9 +10049,6 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.SelectedNetworkExportFileTypeListVariable = "png"; this.SelectedNetworkExportScaleVariable = 1; this.SelectedNetworkExportQualityVariable = 0.92; - this.CalculatedResolutionWidth = 1918; - this.CalculatedResolutionHeight = 909; - this.CalculatedResolution = this.CalculatedResolutionWidth * this.SelectedNetworkExportScaleVariable + " x " + this.CalculatedResolutionHeight * this.SelectedNetworkExportScaleVariable + "px"; this.SelectedNodeLabelSizeVariable = 16; this.nodeBorderWidth = 2.0; this.ShowNodeSymbolWrapper = false; @@ -10093,9 +10089,10 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.polygonNodeSelected = null; this.visuals = commonService.visuals; this.commonService.visuals.twoD = this; + this.widgets = this.commonService.session.style.widgets; ngx_bootstrap__WEBPACK_IMPORTED_MODULE_3__.window.addEventListener('resize', () => { // Replace this with the logic to determine the current show/hide state - const showState = this.visuals.twoD.commonService.session.style.widgets['network-gridlines-show']; + const showState = this.widgets['network-gridlines-show']; this.drawGridlines(showState); }); } @@ -10106,9 +10103,9 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di ngAfterViewInit() {} InitView() { this.visuals.twoD.IsDataAvailable = this.visuals.twoD.commonService.session.data.nodes.length === 0 ? false : true; - if (!this.visuals.twoD.commonService.session.style.widgets['default-distance-metric']) { - this.visuals.twoD.commonService.session.style.widgets['default-distance-metric'] = this.visuals.twoD.commonService.GlobalSettingsModel.SelectedDistanceMetricVariable; - this.visuals.twoD.commonService.session.style.widgets['link-threshold'] = this.visuals.twoD.commonService.GlobalSettingsModel.SelectedLinkThresholdVariable; + if (!this.widgets['default-distance-metric']) { + this.widgets['default-distance-metric'] = this.visuals.twoD.commonService.GlobalSettingsModel.SelectedDistanceMetricVariable; + this.widgets['link-threshold'] = this.visuals.twoD.commonService.GlobalSettingsModel.SelectedLinkThresholdVariable; } if (this.visuals.twoD.IsDataAvailable === true && this.visuals.twoD.zoom === null) { d3__WEBPACK_IMPORTED_MODULE_4__.select('svg#network').exit().remove(); @@ -10145,7 +10142,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.visuals.twoD.halfWidth = $('#network').parent().width() / 2; this.visuals.twoD.halfHeight = $('#network').parent().parent().parent().height() / 2; this.visuals.twoD.transform = d3__WEBPACK_IMPORTED_MODULE_4__.zoomTransform(d3__WEBPACK_IMPORTED_MODULE_4__.select('svg#network').node()); - this.visuals.twoD.commonService.session.style.widgets = this.visuals.twoD.commonService.session.style.widgets; + this.widgets = this.widgets; let zoom = d3__WEBPACK_IMPORTED_MODULE_4__.zoom().filter(() => !this.ctrlPressed).on('zoom', () => this.visuals.twoD.svg.attr('transform', this.visuals.twoD.transform = d3__WEBPACK_IMPORTED_MODULE_4__.event.transform)); let width = d3__WEBPACK_IMPORTED_MODULE_4__.select('svg#network').node().getBoundingClientRect().width; let height = d3__WEBPACK_IMPORTED_MODULE_4__.select('svg#network').node().getBoundingClientRect().height; @@ -10208,8 +10205,8 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.visuals.twoD.svg.append('g').attr('class', 'clustersLabels'); d3__WEBPACK_IMPORTED_MODULE_4__.select('svg#network').append('g').attr('class', 'brush').call(this.visuals.twoD.brush); this.visuals.twoD.svg.append('svg:defs').append('marker').attr('id', 'end-arrow').attr('viewBox', '0 0 10 10').attr('refX', 20).attr('refY', 5).attr('markerWidth', 4).attr('markerHeight', 4).attr('orient', 'auto').append('svg:path').attr('d', 'M0,0 L0,10 L10,5 z'); - this.visuals.twoD.force = d3__WEBPACK_IMPORTED_MODULE_4__.forceSimulation().force('link', d3__WEBPACK_IMPORTED_MODULE_4__.forceLink().id(d => d._id).distance(l => l.origin.length * this.visuals.twoD.commonService.session.style.widgets['link-length']).strength(this.visuals.twoD.commonService.session.style.widgets['network-link-strength'])).force('charge', d3__WEBPACK_IMPORTED_MODULE_4__.forceManyBody().strength(-this.visuals.twoD.commonService.session.style.widgets['node-charge'])).force('gravity', (0,d3_force_attract__WEBPACK_IMPORTED_MODULE_5__.forceAttract)().target([this.visuals.twoD.halfWidth, this.visuals.twoD.halfHeight]).strength(this.visuals.twoD.commonService.session.style.widgets['network-gravity'])).force('center', d3__WEBPACK_IMPORTED_MODULE_4__.forceCenter(this.visuals.twoD.halfWidth, this.visuals.twoD.halfHeight)); - if (this.visuals.twoD.commonService.session.style.widgets['network-friction']) this.visuals.twoD.force.velocityDecay(this.visuals.twoD.commonService.session.style.widgets['network-friction']); + this.visuals.twoD.force = d3__WEBPACK_IMPORTED_MODULE_4__.forceSimulation().force('link', d3__WEBPACK_IMPORTED_MODULE_4__.forceLink().id(d => d._id).distance(l => l.origin.length * this.widgets['link-length']).strength(this.widgets['network-link-strength'])).force('charge', d3__WEBPACK_IMPORTED_MODULE_4__.forceManyBody().strength(-this.widgets['node-charge'])).force('gravity', (0,d3_force_attract__WEBPACK_IMPORTED_MODULE_5__.forceAttract)().target([this.visuals.twoD.halfWidth, this.visuals.twoD.halfHeight]).strength(this.widgets['network-gravity'])).force('center', d3__WEBPACK_IMPORTED_MODULE_4__.forceCenter(this.visuals.twoD.halfWidth, this.visuals.twoD.halfHeight)); + if (this.widgets['network-friction']) this.visuals.twoD.force.velocityDecay(this.widgets['network-friction']); // this.visuals.twoD.clipboard.on('success', ()=>this.hideContextMenu()); let that = this; // this.visuals.twoD.eventManager.addGlobalEventListener('window', 'node-color-change', () => { @@ -10225,10 +10222,10 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di // that.visuals.twoD.updateLinkColor; // }); // // this.visuals.twoD.eventManager.addGlobalEventListener('window', 'background-color-change', () => { - // // $('#network').css('background-color', this.visuals.twoD.commonService.session.style.widgets['background-color']); + // // $('#network').css('background-color', this.widgets['background-color']); // // }); // $( document ).on( "background-color-change", function( ) { - // $('#network').css('background-color', that.visuals.twoD.commonService.session.style.widgets['background-color']); + // $('#network').css('background-color', that.widgets['background-color']); // }); // // this.visuals.twoD.eventManager.addGlobalEventListener('document', 'node-visibility link-visibility cluster-visibility node-selected', () => { // // this.visuals.twoD.render(false); @@ -10254,14 +10251,14 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.visuals.twoD.render(false); }); if (this.visuals.twoD.commonService.session.files.length > 1) $('#link-color-variable').val('origin').change(); - if (this.visuals.twoD.commonService.session.style.widgets['background-color']) $('#network').css('background-color', this.visuals.twoD.commonService.session.style.widgets['background-color']); + if (this.widgets['background-color']) $('#network').css('background-color', this.widgets['background-color']); this.visuals.microbeTrace.SelectedStatisticsTypesVariable = 'Show'; this.visuals.microbeTrace.onShowStatisticsChanged(); this.loadSettings(); this.visuals.twoD.render(); //For some mysterious reason, this really needed a delay... setTimeout(() => { - if (this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable'] !== 'None') { + if (this.widgets['node-symbol-variable'] !== 'None') { $('#node-symbol-variable').change(); //.trigger('change'); } }, 1); @@ -10288,8 +10285,17 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di // }, 1000); // this.LoadDefaultVisualizationEvent.emit(e); // } + getImageDimensions() { + let parent = this.svg.node().parentElement.parentElement; + return [parent.clientWidth, parent.clientHeight]; + } + setCalculatedResolution() { + let [width, height] = this.getImageDimensions(); + this.CalculatedResolution = Math.round(width * this.SelectedNetworkExportScaleVariable) + " x " + Math.round(height * this.SelectedNetworkExportScaleVariable) + "px"; + } updateCalculatedResolution(event) { - this.CalculatedResolution = Math.round(this.CalculatedResolutionWidth * this.SelectedNetworkExportScaleVariable) + " x " + Math.round(this.CalculatedResolutionHeight * this.SelectedNetworkExportScaleVariable) + "px"; + let [width, height] = this.getImageDimensions(); + this.CalculatedResolution = Math.round(width * this.SelectedNetworkExportScaleVariable) + " x " + Math.round(height * this.SelectedNetworkExportScaleVariable) + "px"; this.cdref.detectChanges(); } showGlobalSettings() { @@ -10299,19 +10305,18 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di exportVisualization(event) { this.visuals.twoD.Show2DExportPane = false; this.isExporting = true; - // if (this.commonService.session.style.widgets['node-symbol-variable'] != 'None') { - // this.generateNodeSymbolSelectionTable("#node-symbol-table-bottom", this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable'], false); + // if (this.widgets['node-symbol-variable'] != 'None') { + // this.generateNodeSymbolSelectionTable("#node-symbol-table-bottom", this.widgets['node-symbol-variable'], false); // } - // if (this.commonService.session.style.widgets['node-color-variable'] != 'None') { + // if (this.widgets['node-color-variable'] != 'None') { // this.visuals.microbeTrace.generateNodeColorTable("#node-color-table-bottom", false); // } - // if (this.commonService.session.style.widgets['link-color-variable'] != 'None') { + // if (this.widgets['link-color-variable'] != 'None') { // this.visuals.microbeTrace.generateNodeLinkTable("#link-color-table-bottom", false); // } if (!this.isExportClosed) { setTimeout(() => this.exportVisualization(undefined), 300); } else { - console.log('e2'); this.exportWork2(); } } @@ -10379,22 +10384,24 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di exportWork2() { let network = document.getElementById('network'); let $network = $(network); + // add microbeTrace logo as a watermark let watermark = d3__WEBPACK_IMPORTED_MODULE_4__.select(network).append('image').attr('xlink:href', this.visuals.twoD.commonService.watermark).attr('height', 128).attr('width', 128).attr('x', 35).attr('y', 35).style('opacity', $('#network-export-opacity').val()); - let filetype = this.SelectedNetworkExportFileTypeListVariable, - filename = this.SelectedNetworkExportFilenameVariable; + let filetype = this.SelectedNetworkExportFileTypeListVariable; + let filename = this.SelectedNetworkExportFilenameVariable; + // add node color table let vnodes = this.visuals.twoD.commonService.getVisibleNodes(); let aggregates = this.visuals.twoD.commonService.createNodeColorMap(); let values = Object.keys(aggregates); var columns = []; - columns.push('Node ' + this.visuals.twoD.commonService.titleize(this.visuals.twoD.commonService.session.style.widgets["node-color-variable"])); - if (this.visuals.twoD.commonService.session.style.widgets["node-color-table-counts"]) columns.push('Count'); - if (this.visuals.twoD.commonService.session.style.widgets["node-color-table-frequencies"]) columns.push('Frequency'); + columns.push('Node ' + this.visuals.twoD.commonService.titleize(this.widgets["node-color-variable"])); + if (this.widgets["node-color-table-counts"]) columns.push('Count'); + if (this.widgets["node-color-table-frequencies"]) columns.push('Frequency'); columns.push('Color'); var data = []; values.forEach((value, i) => { let nodeValue = this.visuals.twoD.commonService.session.style.nodeValueNames[value] ? this.visuals.twoD.commonService.session.style.nodeValueNames[value] : this.visuals.twoD.commonService.titleize("" + value); - let tableCounts = this.visuals.twoD.commonService.session.style.widgets["node-color-table-counts"] ? aggregates[value] : undefined; - let tableFreq = this.visuals.twoD.commonService.session.style.widgets["node-color-table-frequencies"] ? (aggregates[value] / vnodes.length).toLocaleString() : undefined; + let tableCounts = this.widgets["node-color-table-counts"] ? aggregates[value] : undefined; + let tableFreq = this.widgets["node-color-table-frequencies"] ? (aggregates[value] / vnodes.length).toLocaleString() : undefined; let line = { Node: nodeValue, Count: tableCounts, @@ -10417,19 +10424,20 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di // let nodeWrapper = this.parent.getElementById('node-color-table'); console.log('node wrapper: ', nodeWrapper); let nodeLegend = this.tabulate2(data, columns, nodeWrapper, network, 200, false); + // add link origin table let vlinks = this.visuals.twoD.commonService.getVisibleLinks(); aggregates = this.visuals.twoD.commonService.createLinkColorMap(); values = Object.keys(aggregates); columns = []; - columns.push('Link ' + this.visuals.twoD.commonService.titleize(this.visuals.twoD.commonService.session.style.widgets["link-color-variable"])); - if (this.visuals.twoD.commonService.session.style.widgets["link-color-table-counts"]) columns.push('Count'); - if (this.visuals.twoD.commonService.session.style.widgets["link-color-table-frequencies"]) columns.push('Frequency'); + columns.push('Link ' + this.visuals.twoD.commonService.titleize(this.widgets["link-color-variable"])); + if (this.widgets["link-color-table-counts"]) columns.push('Count'); + if (this.widgets["link-color-table-frequencies"]) columns.push('Frequency'); columns.push('Color'); data = []; values.forEach((value, i) => { let nodeValue = this.visuals.twoD.commonService.session.style.linkValueNames[value] ? this.visuals.twoD.commonService.session.style.linkValueNames[value] : this.visuals.twoD.commonService.titleize("" + value); - let tableCounts = this.visuals.twoD.commonService.session.style.widgets["link-color-table-counts"] ? aggregates[value] : undefined; - let tableFreq = this.visuals.twoD.commonService.session.style.widgets["link-color-table-frequencies"] ? (aggregates[value] / vlinks.length).toLocaleString() : undefined; + let tableCounts = this.widgets["link-color-table-counts"] ? aggregates[value] : undefined; + let tableFreq = this.widgets["link-color-table-frequencies"] ? (aggregates[value] / vlinks.length).toLocaleString() : undefined; let line = { Link: nodeValue, Count: tableCounts, @@ -10438,7 +10446,6 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di }; data.push(line); }); - console.log('1'); let linkWrapper = null; this.visuals.twoD.commonService.currentLinkTableElement.subscribe(element => { linkWrapper = element; @@ -10446,7 +10453,8 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di }); // let linkWrapper = document.getElementById('link-color-table-wrapper'); let linkLegend = this.tabulate2(data, columns, linkWrapper, network, 600, false); - let variable = this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable']; + // add node symbol table + let variable = this.widgets['node-symbol-variable']; values = []; aggregates = {}; let nodes = this.visuals.twoD.commonService.session.data.nodes; @@ -10466,19 +10474,19 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } columns = []; columns.push('Node ' + this.visuals.twoD.commonService.titleize(variable)); - if (this.visuals.twoD.commonService.session.style.widgets["node-symbol-table-counts"]) columns.push('Count'); - if (this.visuals.twoD.commonService.session.style.widgets["node-symbol-table-frequencies"]) columns.push('Frequency'); + if (this.widgets["node-symbol-table-counts"]) columns.push('Count'); + if (this.widgets["node-symbol-table-frequencies"]) columns.push('Frequency'); columns.push('Shape'); data = []; values.forEach((value, i) => { let nodeValue = this.visuals.twoD.commonService.titleize("" + value); - let tableCounts = this.visuals.twoD.commonService.session.style.widgets["node-symbol-table-counts"] ? aggregates[value] : undefined; - let tableFreq = this.visuals.twoD.commonService.session.style.widgets["node-symbol-table-frequencies"] ? (aggregates[value] / vnodes.length).toLocaleString() : undefined; + let tableCounts = this.widgets["node-symbol-table-counts"] ? aggregates[value] : undefined; + let tableFreq = this.widgets["node-symbol-table-frequencies"] ? (aggregates[value] / vnodes.length).toLocaleString() : undefined; let line = { Node: nodeValue, Count: tableCounts, Frequency: tableFreq, - Shape: $("#node-symbol option[value='" + this.visuals.twoD.commonService.temp.style.nodeSymbolMap(value) + "']").text() + Shape: $("#node-symbol-table option[value='" + this.commonService.temp.style.nodeSymbolMap(value) + "']").eq(parseInt(value)).text() }; data.push(line); }); @@ -10487,10 +10495,10 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di if (symbolWrapper) { symbolLegend = this.tabulate2(data, columns, symbolWrapper, network, 200, true); } + // add network statistics table let statsDiv = document.getElementById('network-statistics-wrapper'); - let foreignObjStats = d3__WEBPACK_IMPORTED_MODULE_4__.select(network).append("svg:foreignObject").attr("x", statsDiv.offsetLeft).attr("y", statsDiv.offsetTop - 60).attr("width", statsDiv.offsetWidth).attr("height", statsDiv.offsetHeight); + let foreignObjStats = d3__WEBPACK_IMPORTED_MODULE_4__.select(network).append("svg:foreignObject").attr("x", statsDiv.offsetLeft).attr("y", statsDiv.offsetTop - 10).attr("width", statsDiv.offsetWidth).attr("height", statsDiv.offsetHeight); foreignObjStats.append("xhtml:body").html(statsDiv.innerHTML); - console.log('file type: ', filetype); if (filetype == 'svg') { let content = this.visuals.twoD.commonService.unparseSVG(network); let blob = new Blob([content], { @@ -10514,10 +10522,10 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } } else { (0,save_svg_as_png__WEBPACK_IMPORTED_MODULE_11__.saveSvgAsPng)(network, filename + '.' + filetype, { - scale: parseFloat($('#network-export-scale').val()), - backgroundColor: this.visuals.twoD.commonService.session.style.widgets['background-color'], + scale: this.SelectedNetworkExportScaleVariable, + backgroundColor: this.widgets['background-color'], encoderType: 'image/' + filetype, - encoderOptions: parseFloat($('#network-export-quality').val()) + encoderOptions: this.SelectedNetworkExportQualityVariable }).then(() => { if (watermark) { watermark.remove(); @@ -10543,8 +10551,8 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di const start = Date.now(); let newNodes = this.visuals.twoD.commonService.getVisibleNodes(true); let oldNodes; - if (this.visuals.twoD.commonService.session.style.widgets["timeline-date-field"] != 'None') oldNodes = this.visuals.twoD.commonService.session.network.timelineNodes;else oldNodes = this.visuals.twoD.commonService.session.network.nodes; - if (newNodes.length === 0 && this.visuals.twoD.commonService.session.style.widgets["timeline-date-field"] == 'None') return; + if (this.widgets["timeline-date-field"] != 'None') oldNodes = this.visuals.twoD.commonService.session.network.timelineNodes;else oldNodes = this.visuals.twoD.commonService.session.network.nodes; + if (newNodes.length === 0 && this.widgets["timeline-date-field"] == 'None') return; newNodes.forEach((d, i) => { let match = oldNodes.find(d2 => { if (!d2.id) { @@ -10579,16 +10587,16 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.visuals.twoD.redrawNodeBorder(); this.visuals.twoD.updateNodeColors(); let vlinks = this.visuals.twoD.getVLinks(); - let links = this.visuals.twoD.svg.select('g.links').selectAll('line').data(vlinks).join('line').attr('stroke-width', this.visuals.twoD.commonService.session.style.widgets['link-width']).attr('opacity', 1 - this.visuals.twoD.commonService.session.style.widgets['link-opacity']).on('mouseenter', x => this.visuals.twoD.showLinkTooltip(x)).on('mouseout', x => this.visuals.twoD.hideTooltip()); + let links = this.visuals.twoD.svg.select('g.links').selectAll('line').data(vlinks).join('line').attr('stroke-width', this.widgets['link-width']).attr('opacity', 1 - this.widgets['link-opacity']).on('mouseenter', x => this.visuals.twoD.showLinkTooltip(x)).on('mouseout', x => this.visuals.twoD.hideTooltip()); this.visuals.twoD.updateLinkColor(); this.visuals.twoD.scaleLinkWidth(); - let linklabels = this.visuals.twoD.svg.select('g.links').selectAll('text').data(vlinks).join('text').attr('text-anchor', 'middle').attr('dy', this.visuals.twoD.commonService.session.style.widgets['link-width'] + 2).text(l => { - const labelValue = l[this.visuals.twoD.commonService.session.style.widgets['link-label-variable']]; + let linklabels = this.visuals.twoD.svg.select('g.links').selectAll('text').data(vlinks).join('text').attr('text-anchor', 'middle').attr('dy', this.widgets['link-width'] + 2).text(l => { + const labelValue = l[this.widgets['link-label-variable']]; if (typeof labelValue === 'number' || !isNaN(parseFloat(labelValue))) { - if (this.visuals.twoD.commonService.session.style.widgets['default-distance-metric'] == 'snps') { + if (this.widgets['default-distance-metric'] == 'snps') { return Math.round(parseFloat(labelValue)); } else { - return parseFloat(labelValue).toFixed(this.visuals.twoD.commonService.session.style.widgets['link-label-decimal-length']); + return parseFloat(labelValue).toFixed(this.widgets['link-label-decimal-length']); } } else { return labelValue; @@ -10600,15 +10608,15 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di return ew; }); links.attr('x1', l => l.source.x).attr('y1', l => l.source.y).attr('x2', l => l.target.x).attr('y2', l => l.target.y); - if (this.visuals.twoD.commonService.session.style.widgets['link-label-variable'] !== 'None') { + if (this.widgets['link-label-variable'] !== 'None') { linklabels.attr('x', l => (l.source.x + l.target.x) / 2).attr('y', l => (l.source.y + l.target.y) / 2).attr('transform', l => 'rotate(' + this.visuals.twoD.calcAngle(l.source, l.target) + ' ' + (l.source.x + l.target.x) / 2 + ' ' + (l.source.y + l.target.y) / 2 + ')'); } }; - let foci = this.visuals.twoD.commonService.session.style.widgets['polygons-foci']; - let gather = this.visuals.twoD.commonService.session.style.widgets['polygons-gather-force']; - let fill = this.visuals.twoD.commonService.session.style.widgets['polygon-color']; + let foci = this.widgets['polygons-foci']; + let gather = this.widgets['polygons-gather-force']; + let fill = this.widgets['polygon-color']; var opacity; - if (this.visuals.twoD.commonService.session.style.widgets['polygons-color-show']) { + if (this.widgets['polygons-color-show']) { fill = d => this.visuals.twoD.commonService.temp.style.polygonColorMap(d.key); opacity = d => this.visuals.twoD.commonService.temp.style.polygonAlphaMap(d.key); } else { @@ -10653,14 +10661,14 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di }); nodes.attr('transform', d => `translate(${d.x}, ${d.y})`); links.attr('x1', l => l.source.x).attr('y1', l => l.source.y).attr('x2', l => l.target.x).attr('y2', l => l.target.y); - if (this.visuals.twoD.commonService.session.style.widgets['link-label-variable'] !== 'None') { + if (this.widgets['link-label-variable'] !== 'None') { linklabels.attr('x', l => (l.source.x + l.target.x) / 2).attr('y', l => (l.source.y + l.target.y) / 2).attr('transform', l => 'rotate(' + this.calcAngle(l.source, l.target) + ' ' + (l.source.x + l.target.x) / 2 + ' ' + (l.source.y + l.target.y) / 2 + ')'); } d3__WEBPACK_IMPORTED_MODULE_4__.select('#network g.clusters').selectAll('path').data(groups).attr("d", groupPath).enter().insert("path", "circle").style("fill", fill).style("stroke", fill).style("stroke-width", 40).style("stroke-linejoin", "round").style("opacity", opacity).attr("d", groupPath); d3__WEBPACK_IMPORTED_MODULE_4__.select('#network g.clusters').selectAll('path').call(d3__WEBPACK_IMPORTED_MODULE_4__.drag() //A bunch of mouse handlers. .on('start', x => this.visuals.twoD.polygonDragStarted(x)).on('drag', x => this.visuals.twoD.polygonDragged(x)).on('end', x => this.visuals.twoD.polygonDragEnded(x))); // (x) => this.visuals.twoD.dragstarted(x) - if (this.visuals.twoD.commonService.session.style.widgets['polygons-label-show']) { + if (this.widgets['polygons-label-show']) { let g = d3__WEBPACK_IMPORTED_MODULE_4__.select('#network g.clustersLabels').text("").selectAll('text').data(groups).enter().append("text").attr('transform', function (d) { return "translate(" + d3__WEBPACK_IMPORTED_MODULE_4__.polygonCentroid(polygonTextCord(d)) + ")"; }).text(d => this.visuals.twoD.commonService.titleize("" + d.key)); @@ -10668,13 +10676,13 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.redrawPolygonLabels(); } }; - if (this.visuals.twoD.commonService.session.style.widgets['polygons-show']) this.visuals.twoD.commonService.temp.polygonGroups = groups;else delete this.visuals.twoD.commonService.temp.polygonGroups; + if (this.widgets['polygons-show']) this.visuals.twoD.commonService.temp.polygonGroups = groups;else delete this.visuals.twoD.commonService.temp.polygonGroups; let handleTick = d => { if (d) { return polygonsTick; } else return layoutTick; }; - this.visuals.twoD.force.nodes(this.visuals.twoD.commonService.session.network.nodes).on('tick', handleTick(this.visuals.twoD.commonService.session.style.widgets['polygons-show'])); + this.visuals.twoD.force.nodes(this.visuals.twoD.commonService.session.network.nodes).on('tick', handleTick(this.widgets['polygons-show'])); this.visuals.twoD.force.force('link').links(vlinks); this.visuals.twoD.force.alpha(0.3).alphaTarget(0).restart(); $('#node-symbol-variable').trigger('change'); @@ -10696,30 +10704,30 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } updatePolygonColors() { let polygonSort = $("⇅").on("click", e => { - this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts-sort"] = ""; - if (this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-name-sort"] === "ASC") this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-name-sort"] = "DESC";else this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-name-sort"] = "ASC"; + this.widgets["polygon-color-table-counts-sort"] = ""; + if (this.widgets["polygon-color-table-name-sort"] === "ASC") this.widgets["polygon-color-table-name-sort"] = "DESC";else this.widgets["polygon-color-table-name-sort"] = "ASC"; this.visuals.twoD.updatePolygonColors(); }); - let polygonColorHeaderTitle = this.visuals.twoD.commonService.session.style['overwrite'] && this.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderVariable'] && this.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderVariable'] == this.visuals.twoD.commonService.session.style.widgets['polygons-foci'] ? this.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderTitle'] : "Polygon " + this.visuals.twoD.commonService.titleize(this.visuals.twoD.commonService.session.style.widgets['polygons-foci']); + let polygonColorHeaderTitle = this.visuals.twoD.commonService.session.style['overwrite'] && this.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderVariable'] && this.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderVariable'] == this.widgets['polygons-foci'] ? this.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderTitle'] : "Polygon " + this.visuals.twoD.commonService.titleize(this.widgets['polygons-foci']); let polygonHeader = $("" + polygonColorHeaderTitle + "").append(polygonSort); let countSort = $("⇅").on("click", e => { - this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-name-sort"] = ""; - if (this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts-sort"] === "ASC") this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts-sort"] = "DESC";else this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts-sort"] = "ASC"; + this.widgets["polygon-color-table-name-sort"] = ""; + if (this.widgets["polygon-color-table-counts-sort"] === "ASC") this.widgets["polygon-color-table-counts-sort"] = "DESC";else this.widgets["polygon-color-table-counts-sort"] = "ASC"; this.visuals.twoD.updatePolygonColors(); }); - let countHeader = $(this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts"] ? "Count" : "").append(countSort); - let polygonColorTable = $("#polygon-color-table").empty().append($("")).append(polygonHeader).append(countHeader).append(this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-frequencies"] ? "Frequency" : "").append("Color"); + let countHeader = $(this.widgets["polygon-color-table-counts"] ? "Count" : "").append(countSort); + let polygonColorTable = $("#polygon-color-table").empty().append($("")).append(polygonHeader).append(countHeader).append(this.widgets["polygon-color-table-frequencies"] ? "Frequency" : "").append("Color"); if (!this.visuals.twoD.commonService.session.style['polygonValueNames']) this.visuals.twoD.commonService.session.style['polygonValueNames'] = {}; let aggregates = this.visuals.twoD.commonService.createPolygonColorMap(); let values = Object.keys(aggregates); - if (this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts-sort"] == "ASC") values.sort(function (a, b) { + if (this.widgets["polygon-color-table-counts-sort"] == "ASC") values.sort(function (a, b) { return aggregates[a] - aggregates[b]; - });else if (this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts-sort"] == "DESC") values.sort(function (a, b) { + });else if (this.widgets["polygon-color-table-counts-sort"] == "DESC") values.sort(function (a, b) { return aggregates[b] - aggregates[a]; }); - if (this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-name-sort"] == "ASC") values.sort(function (a, b) { + if (this.widgets["polygon-color-table-name-sort"] == "ASC") values.sort(function (a, b) { return a - b; - });else if (this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-name-sort"] == "DESC") values.sort(function (a, b) { + });else if (this.widgets["polygon-color-table-name-sort"] == "DESC") values.sort(function (a, b) { return b - a; }); let total = 0; @@ -10747,7 +10755,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di }); }); let cell = $("").append(colorinput).append(alphainput); - let row = $("" + "" + (that.visuals.twoD.commonService.session.style['polygonValueNames'][value] ? that.visuals.twoD.commonService.session.style['polygonValueNames'][value] : that.visuals.twoD.commonService.titleize("" + value)) + "" + (that.visuals.twoD.commonService.session.style.widgets["polygon-color-table-counts"] ? "" + aggregates[value] + "" : "") + (that.visuals.twoD.commonService.session.style.widgets["polygon-color-table-frequencies"] ? "" + (aggregates[value] / total).toLocaleString() + "" : "") + "").append(cell); + let row = $("" + "" + (that.visuals.twoD.commonService.session.style['polygonValueNames'][value] ? that.visuals.twoD.commonService.session.style['polygonValueNames'][value] : that.visuals.twoD.commonService.titleize("" + value)) + "" + (that.widgets["polygon-color-table-counts"] ? "" + aggregates[value] + "" : "") + (that.widgets["polygon-color-table-frequencies"] ? "" + (aggregates[value] / total).toLocaleString() + "" : "") + "").append(cell); polygonColorTable.append(row); }); this.visuals.twoD.commonService.temp.style.polygonColorMap = d3__WEBPACK_IMPORTED_MODULE_4__.scaleOrdinal(this.visuals.twoD.commonService.session.style['polygonColors']).domain(values); @@ -10760,7 +10768,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di that.visuals.twoD.commonService.session.style['polygonValueNames'][$this.data("value")] = $this.text(); }); polygonColorTable.find(".p-1").on("focusout", function () { - that.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderVariable'] = that.visuals.twoD.commonService.session.style.widgets["polygons-foci"]; + that.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderVariable'] = that.widgets["polygons-foci"]; that.visuals.twoD.commonService.session.style['overwrite']['polygonColorHeaderTitle'] = $($(this).contents()[0]).text(); }); let isAscending = true; // add this line before the click event handler @@ -10791,14 +10799,14 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.visuals.twoD.render(); } polygonsToggle(e) { - this.visuals.twoD.commonService.session.style.widgets['polygons-show'] = e; + this.widgets['polygons-show'] = e; if (e) { - if (this.visuals.twoD.commonService.session.style.widgets['polygons-color-show'] == true) { + if (this.widgets['polygons-color-show'] == true) { $('#polygons-color-show').click(); } else { $('#polygons-color-hide').click(); } - if (this.visuals.twoD.commonService.session.style.widgets['polygons-label-show'] == true) { + if (this.widgets['polygons-label-show'] == true) { $('#polygons-label-show').click(); } else { $('#polygons-label-hide').click(); @@ -10815,7 +10823,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } polygonColorsToggle(e) { if (e) { - this.visuals.twoD.commonService.session.style.widgets['polygons-color-show'] = true; + this.widgets['polygons-color-show'] = true; $("#polygon-color-value-row").slideUp(); $("#polygon-color-table-row").slideDown(); this.visuals.twoD.PolygonColorTableWrapperDialogSettings.setVisibility(true); @@ -10824,7 +10832,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.visuals.twoD.updatePolygonColors(); }, 200); } else { - this.visuals.twoD.commonService.session.style.widgets['polygons-color-show'] = false; + this.widgets['polygons-color-show'] = false; $("#polygon-color-value-row").slideDown(); $("#polygon-color-table-row").slideUp(); $("#polygon-color-table").empty(); @@ -10833,7 +10841,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.visuals.twoD.render(); } onPolygonColorChanged(e) { - this.visuals.twoD.commonService.session.style.widgets["polygon-color"] = e; + this.widgets["polygon-color"] = e; this.visuals.twoD.render(); } polygonColorsTableToggle(e) { @@ -10849,8 +10857,8 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } redrawPolygonLabels() { let nodes = d3__WEBPACK_IMPORTED_MODULE_4__.select('#network g.clustersLabels').selectAll('text'); - let size = this.visuals.twoD.commonService.session.style.widgets['polygons-label-size'], - orientation = this.visuals.twoD.commonService.session.style.widgets['polygons-label-orientation']; + let size = this.widgets['polygons-label-size'], + orientation = this.widgets['polygons-label-orientation']; nodes.style('font-size', size + 'px'); switch (orientation) { case 'Left': @@ -11002,7 +11010,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di d.fy = null; } else { // save node location back to temp network for pinned network - if (that.visuals.twoD.commonService.session.style.widgets["timeline-date-field"] != 'None') { + if (that.widgets["timeline-date-field"] != 'None') { let node = that.visuals.twoD.commonService.session.network.timelineNodes.find(d2 => d2._id == d._id); if (node) { node.x = d.x; @@ -11089,10 +11097,10 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di }); } showNodeTooltip(d) { - if (this.visuals.twoD.commonService.session.style.widgets['node-highlight']) this.visuals.twoD.highlightNeighbors(d); + if (this.widgets['node-highlight']) this.visuals.twoD.highlightNeighbors(d); // If no tooltip variable is selected, we shouldn't show a tooltip - if (this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable'].length > 0 && this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable'][0] == 'None') return; - this.visuals.twoD.SelectedNodeTooltipVariable = this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable']; + if (this.widgets['node-tooltip-variable'].length > 0 && this.widgets['node-tooltip-variable'][0] == 'None') return; + this.visuals.twoD.SelectedNodeTooltipVariable = this.widgets['node-tooltip-variable']; // Tooltip variables can be a single string or an array let tooltipVariables = this.visuals.twoD.SelectedNodeTooltipVariable; if (!Array.isArray(tooltipVariables)) { @@ -11197,9 +11205,9 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di d3__WEBPACK_IMPORTED_MODULE_4__.select('#tooltip').html(tooltipHtml).style('left', d3__WEBPACK_IMPORTED_MODULE_4__.event.pageX + 'px').style('top', d3__WEBPACK_IMPORTED_MODULE_4__.event.pageY - 120 + 'px').style('z-index', 1000).transition().duration(100).style('opacity', 1); } hideTooltip() { - if (this.visuals.twoD.commonService.session.style.widgets['node-highlight']) { + if (this.widgets['node-highlight']) { this.visuals.twoD.svg.select('g.nodes').selectAll('g').selectAll('path').attr('opacity', 1); - let linkOpacity = 1 - this.visuals.twoD.commonService.session.style.widgets['link-opacity']; + let linkOpacity = 1 - this.widgets['link-opacity']; this.visuals.twoD.svg.select('g.links').selectAll('line').attr('opacity', linkOpacity); } let tooltip = d3__WEBPACK_IMPORTED_MODULE_4__.select('#tooltip'); @@ -11211,24 +11219,24 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di redrawNodes() { //Things to track in the function: //* Shapes: - let type = d3__WEBPACK_IMPORTED_MODULE_4__[this.visuals.twoD.commonService.session.style.widgets['node-symbol']]; - let symbolVariable = this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable']; + let type = d3__WEBPACK_IMPORTED_MODULE_4__[this.widgets['node-symbol']]; + let symbolVariable = this.widgets['node-symbol-variable']; // Custom Shape Selected if (type === undefined) { - type = this.customShapes.shapes[this.visuals.twoD.commonService.session.style.widgets['node-symbol']]; + type = this.customShapes.shapes[this.widgets['node-symbol']]; } //* Sizes: - let defaultSize = this.visuals.twoD.commonService.session.style.widgets['node-radius']; + let defaultSize = this.widgets['node-radius']; let size = defaultSize, med = defaultSize, oldrng, min, max; - let sizeVariable = this.visuals.twoD.commonService.session.style.widgets['node-radius-variable']; + let sizeVariable = this.widgets['node-radius-variable']; let scale; let nodes; if (sizeVariable !== 'None') { - if (this.visuals.twoD.commonService.session.style.widgets["timeline-date-field"] == 'None') nodes = this.visuals.twoD.commonService.session.network.nodes;else nodes = this.visuals.twoD.commonService.session.network.timelineNodes; + if (this.widgets["timeline-date-field"] == 'None') nodes = this.visuals.twoD.commonService.session.network.nodes;else nodes = this.visuals.twoD.commonService.session.network.timelineNodes; let n = this.visuals.twoD.commonService.session.network.nodes.length; min = Number.MAX_VALUE; max = Number.MIN_VALUE; @@ -11240,8 +11248,8 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } oldrng = max - min; med = oldrng / 2; - let maxWidth = this.visuals.twoD.commonService.session.style.widgets['node-radius-max']; - let minWidth = this.visuals.twoD.commonService.session.style.widgets['node-radius-min']; + let maxWidth = this.widgets['node-radius-max']; + let minWidth = this.widgets['node-radius-min']; scale = d3__WEBPACK_IMPORTED_MODULE_4__.scaleLinear().domain([min, max]).range([minWidth, maxWidth]); } nodes = this.visuals.twoD.svg.select('g.nodes').selectAll('g').data(this.visuals.twoD.commonService.session.network.nodes); @@ -11268,16 +11276,16 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } redrawNodeBorder() { let nodes = this.visuals.twoD.svg.select('g.nodes').selectAll('g').data(this.visuals.twoD.commonService.session.network.nodes); - nodes.selectAll('path').style('stroke', 'black').style('stroke-width', this.visuals.twoD.commonService.session.style.widgets['node-border-width']); + nodes.selectAll('path').style('stroke', 'black').style('stroke-width', this.widgets['node-border-width']); } redrawLabels() { let nodes = this.visuals.twoD.svg.select('g.nodes').selectAll('g').data(this.visuals.twoD.commonService.session.network.nodes).select('text'), - labelVar = this.visuals.twoD.commonService.session.style.widgets['node-label-variable']; + labelVar = this.widgets['node-label-variable']; if (labelVar == 'None') { nodes.text(''); } else { - let size = this.visuals.twoD.commonService.session.style.widgets['node-label-size'], - orientation = this.visuals.twoD.commonService.session.style.widgets['node-label-orientation']; + let size = this.widgets['node-label-size'], + orientation = this.widgets['node-label-orientation']; nodes.text(n => n[labelVar]).style('font-size', size + 'px'); switch (orientation) { case 'Left': @@ -11300,7 +11308,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } //Polygon Events onPolygonLabelVariableChange(e) { - this.visuals.twoD.commonService.session.style.widgets['polygons-label-variable'] = e; + this.widgets['polygons-label-variable'] = e; if (e == 'None') { $('.polygon-label-row').slideUp(); } else { @@ -11309,9 +11317,9 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.redrawPolygonLabels(); } centerPolygons(e) { - this.visuals.twoD.commonService.session.style.widgets['polygons-foci'] = e; + this.widgets['polygons-foci'] = e; this.visuals.twoD.render(); - if (this.visuals.twoD.commonService.session.style.widgets['polygons-color-show'] == true) { + if (this.widgets['polygons-color-show'] == true) { $("#polygon-color-table").empty(); this.visuals.twoD.updatePolygonColors(); } @@ -11324,35 +11332,35 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } } setPolygonLabelSize(size) { - this.visuals.twoD.commonService.session.style.widgets['polygons-label-size'] = parseFloat(size); + this.widgets['polygons-label-size'] = parseFloat(size); this.visuals.twoD.redrawPolygonLabels(); } onPolygonLabelSizeChange(e) { this.setPolygonLabelSize(e); } onPolygonLabelOrientationChange(e) { - this.visuals.twoD.commonService.session.style.widgets['polygons-label-orientation'] = e; + this.widgets['polygons-label-orientation'] = e; this.visuals.twoD.redrawPolygonLabels(); } onPolygonGatherChange(e) { let v = parseFloat(e); - this.visuals.twoD.commonService.session.style.widgets['polygons-gather-force'] = v; + this.widgets['polygons-gather-force'] = v; this.visuals.twoD.render(); } onPolygonLabelShowChange(e) { if (e) { - this.visuals.twoD.commonService.session.style.widgets['polygons-label-show'] = true; + this.widgets['polygons-label-show'] = true; $('.polygons-label-row').slideDown(); this.visuals.twoD.render(); } else { - this.visuals.twoD.commonService.session.style.widgets['polygons-label-show'] = false; + this.widgets['polygons-label-show'] = false; $('.polygons-label-row').slideUp(); this.visuals.twoD.render(); } } onPolygonShowChange(e) { if (e == "Show") { - this.visuals.twoD.commonService.session.style.widgets['polygons-label-show'] = true; + this.widgets['polygons-label-show'] = true; $('.polygons-label-row').slideDown(); this.visuals.twoD.render(); //If hidden by default, unhide to perform slide up and down @@ -11362,7 +11370,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di // $('#node-color-table-row').slideDown(); // } } else { - this.visuals.twoD.commonService.session.style.widgets['polygons-label-show'] = false; + this.widgets['polygons-label-show'] = false; $('#node-color-value-row').slideDown(); $('#node-color-table-row').slideUp(); this.visuals.twoD.render(); @@ -11370,7 +11378,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } onPolygonColorTableChange(e) { this.SelectedNetworkTableTypeVariable = e; - this.visuals.twoD.commonService.session.style.widgets["polygon-color-table-visible"] = e; + this.widgets["polygon-color-table-visible"] = e; if (this.SelectedNetworkTableTypeVariable == 'Show') { this.PolygonColorTableWrapperDialogSettings.setVisibility(true); } else { @@ -11381,7 +11389,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di Node Events /*/ onNodeLabelVaribleChange(e) { - this.visuals.twoD.commonService.session.style.widgets['node-label-variable'] = e; + this.widgets['node-label-variable'] = e; if (e == 'None') { $('.node-label-row').slideUp(); } else { @@ -11393,11 +11401,11 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.setNodeLabelSize(e.target.value); } setNodeLabelSize(size) { - this.visuals.twoD.commonService.session.style.widgets['node-label-size'] = parseFloat(size); + this.widgets['node-label-size'] = parseFloat(size); this.visuals.twoD.redrawLabels(); } onNodeLabelOrientationChange(e) { - this.visuals.twoD.commonService.session.style.widgets['node-label-orientation'] = e; + this.widgets['node-label-orientation'] = e; this.visuals.twoD.redrawLabels(); } onNodeTooltipVariableChange(e) { @@ -11405,11 +11413,11 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di if (!Array.isArray(selectedValue)) { selectedValue = [selectedValue]; } - this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable'] = selectedValue; + this.widgets['node-tooltip-variable'] = selectedValue; this.visuals.twoD.redrawLabels(); } onNodeSymbolVariableChange(e, setVisibility = true) { - this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable'] = this.SelectedNodeSymbolVariable; + this.widgets['node-symbol-variable'] = this.SelectedNodeSymbolVariable; if (setVisibility) { this.visuals.twoD.NodeSymbolTableWrapperDialogSettings.setVisibility(true); this.visuals.twoD.SelectedNetworkTableTypeVariable = "Show"; @@ -11492,7 +11500,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di }]; let table = $(tableId); const disabled = isEditable ? '' : 'disabled'; - this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable'] = variable; + this.widgets['node-symbol-variable'] = variable; if (variable === 'None' && !isEditable) return; let values = []; let aggregates = {}; @@ -11519,7 +11527,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } this.visuals.twoD.commonService.session.style.nodeSymbols = symbols; } - table.empty().append("" + `
Node ${this.commonService.titleize(variable)}⇅
` + (this.visuals.twoD.commonService.session.style.widgets['node-symbol-table-counts'] ? `
Count⇅
` : '') + (this.visuals.twoD.commonService.session.style.widgets['node-symbol-table-frequencies'] ? `
Frequency⇅
` : '') + 'Shape' + ''); + table.empty().append("" + `
Node ${this.commonService.titleize(variable)}⇅
` + (this.widgets['node-symbol-table-counts'] ? `
Count⇅
` : '') + (this.widgets['node-symbol-table-frequencies'] ? `
Frequency⇅
` : '') + 'Shape' + ''); let options = $('#node-symbol2').html(); values.sort((a, b) => { return aggregates[b] - aggregates[a]; @@ -11533,7 +11541,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di }); let symbolText = symbolMapping.find(x => x.key === this.visuals.twoD.commonService.temp.style.nodeSymbolMap(v)); let cell = $('').append(isEditable ? selector : symbolText ? symbolText.value : ''); - let row = $('' + ` ${this.visuals.twoD.commonService.titleize('' + v)} ` + (this.visuals.twoD.commonService.session.style.widgets['node-symbol-table-counts'] ? '' + aggregates[v] + '' : '') + (this.visuals.twoD.commonService.session.style.widgets['node-symbol-table-frequencies'] ? '' + (aggregates[v] / vnodes).toLocaleString() + '' : '') + '').append(cell); + let row = $('' + ` ${this.visuals.twoD.commonService.titleize('' + v)} ` + (this.widgets['node-symbol-table-counts'] ? '' + aggregates[v] + '' : '') + (this.widgets['node-symbol-table-frequencies'] ? '' + (aggregates[v] / vnodes).toLocaleString() + '' : '') + '').append(cell); table.append(row); }); let isAscending = true; // add this line before the click event handler @@ -11571,32 +11579,32 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di $('#node-min-radius-row').css('display', 'flex'); $('#node-radius-row').slideUp(); } - this.visuals.twoD.commonService.session.style.widgets['node-radius-variable'] = e; + this.widgets['node-radius-variable'] = e; this.visuals.twoD.redrawNodes(); } onNodeRadiusMaxChange(e) { - this.visuals.twoD.commonService.session.style.widgets['node-radius-max'] = e; + this.widgets['node-radius-max'] = e; this.visuals.twoD.redrawNodes(); } onNodeRadiusMinChange(e) { - this.visuals.twoD.commonService.session.style.widgets['node-radius-min'] = e; + this.widgets['node-radius-min'] = e; this.visuals.twoD.redrawNodes(); } onNodeBorderWidthChange(e) { - this.visuals.twoD.commonService.session.style.widgets['node-border-width'] = e; + this.widgets['node-border-width'] = e; this.visuals.twoD.redrawNodeBorder(); } onNodeRadiusChange(e) { - this.visuals.twoD.commonService.session.style.widgets['node-radius'] = e; + this.widgets['node-radius'] = e; this.visuals.twoD.redrawNodes(); } onNodeSymbolChange(e) { - this.visuals.twoD.commonService.session.style.widgets['node-symbol'] = e; + this.widgets['node-symbol'] = e; this.visuals.twoD.redrawNodes(); } onNodeSymbolTableChange(e) { this.SelectedNetworkTableTypeVariable = e; - this.visuals.twoD.commonService.session.style.widgets["node-symbol-table-visible"] = this.SelectedNetworkTableTypeVariable; + this.widgets["node-symbol-table-visible"] = this.SelectedNetworkTableTypeVariable; if (this.SelectedNetworkTableTypeVariable == "Show") { this.NodeSymbolTableWrapperDialogSettings.setVisibility(true); } else { @@ -11608,25 +11616,25 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di if (!Array.isArray(selectedValue)) { selectedValue = [selectedValue]; } - this.visuals.twoD.commonService.session.style.widgets['link-tooltip-variable'] = e; - this.visuals.twoD.SelectedLinkTooltipVariable = this.visuals.twoD.commonService.session.style.widgets['link-tooltip-variable']; + this.widgets['link-tooltip-variable'] = e; + this.visuals.twoD.SelectedLinkTooltipVariable = this.widgets['link-tooltip-variable']; this.visuals.twoD.redrawLabels(); //TODO: umm.... do something here? } onLinkLabelVariableChange(e) { let label = e; - this.visuals.twoD.commonService.session.style.widgets['link-label-variable'] = label; + this.widgets['link-label-variable'] = label; if (label == 'None') { this.visuals.twoD.svg.select('g.links').selectAll('text').text(''); } else { this.visuals.twoD.svg.select('g.links').selectAll('text').data(this.visuals.twoD.getLLinks()).text(l => { - const labelValue = l[this.visuals.twoD.commonService.session.style.widgets['link-label-variable']]; + const labelValue = l[this.widgets['link-label-variable']]; if (typeof labelValue === 'number' || !isNaN(parseFloat(labelValue))) { - if (this.visuals.twoD.commonService.session.style.widgets['default-distance-metric'] == 'snps') { + if (this.widgets['default-distance-metric'] == 'snps') { return Math.round(parseFloat(labelValue)); } else { - return parseFloat(labelValue).toFixed(this.visuals.twoD.commonService.session.style.widgets['link-label-decimal-length']); + return parseFloat(labelValue).toFixed(this.widgets['link-label-decimal-length']); } } else { return labelValue; @@ -11636,18 +11644,18 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } } onLinkDecimalVariableChange(e) { - this.visuals.twoD.commonService.session.style.widgets['link-label-decimal-length'] = e; + this.widgets['link-label-decimal-length'] = e; this.visuals.twoD.svg.select('g.links').selectAll('text').data(this.getLLinks()).text(l => { - const labelValue = l[this.visuals.twoD.commonService.session.style.widgets['link-label-variable']]; + const labelValue = l[this.widgets['link-label-variable']]; if (typeof labelValue === 'number' || !isNaN(parseFloat(labelValue))) { - return parseFloat(labelValue).toFixed(this.visuals.twoD.commonService.session.style.widgets['link-label-decimal-length']); + return parseFloat(labelValue).toFixed(this.widgets['link-label-decimal-length']); } else { return labelValue; } }); } onLinkOpacityChange(e) { - this.visuals.twoD.commonService.session.style.widgets['link-opacity'] = e; + this.widgets['link-opacity'] = e; let opacity = 1 - e; this.visuals.twoD.svg.select('g.links').selectAll('line').attr('opacity', opacity); } @@ -11661,50 +11669,50 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di $('#link-max-width-row').css('display', 'flex'); $('#link-min-width-row').css('display', 'flex'); } - this.visuals.twoD.commonService.session.style.widgets['link-width-variable'] = e; + this.widgets['link-width-variable'] = e; this.visuals.twoD.scaleLinkWidth(); } onLinkWidthReciprocalNonReciprocalChange(e) { if (e == "Reciprocal") { - this.visuals.twoD.commonService.session.style.widgets['link-width-reciprocal'] = true; + this.widgets['link-width-reciprocal'] = true; this.visuals.twoD.scaleLinkWidth(); } else { - this.visuals.twoD.commonService.session.style.widgets['link-width-reciprocal'] = false; + this.widgets['link-width-reciprocal'] = false; this.visuals.twoD.scaleLinkWidth(); } } onLinkWidthChange(e) { - this.visuals.twoD.commonService.session.style.widgets['link-width'] = e; + this.widgets['link-width'] = e; this.visuals.twoD.scaleLinkWidth(); } onLinkWidthMaxChange(e) { - this.visuals.twoD.commonService.session.style.widgets['link-width-max'] = e; + this.widgets['link-width-max'] = e; this.visuals.twoD.scaleLinkWidth(); console.log('scaling width'); } onLinkWidthMinChange(e) { - this.visuals.twoD.commonService.session.style.widgets['link-width-min'] = e; + this.widgets['link-width-min'] = e; this.visuals.twoD.scaleLinkWidth(); } onLinkLengthChange(e) { this.visuals.twoD.force.force('link').distance(e); this.visuals.twoD.force.alpha(0.3).alphaTarget(0).restart(); - this.visuals.twoD.commonService.session.style.widgets['link-length'] = e; + this.widgets['link-length'] = e; } onLinkDirectedUndirectedChange(e) { if (e == "Show") { this.visuals.twoD.svg.select('g.links').selectAll('line').attr('marker-end', 'url(#end-arrow)'); - this.visuals.twoD.commonService.session.style.widgets['link-directed'] = true; + this.widgets['link-directed'] = true; } else { this.visuals.twoD.svg.select('g.links').selectAll('line').attr('marker-end', null); - this.visuals.twoD.commonService.session.style.widgets['link-directed'] = false; + this.widgets['link-directed'] = false; } } onDontHighlightNeighborsHighlightNeighborsChange(e) { if (e == "Normal") { - this.visuals.twoD.commonService.session.style.widgets['node-highlight'] = false; + this.widgets['node-highlight'] = false; } else { - this.visuals.twoD.commonService.session.style.widgets['node-highlight'] = true; + this.widgets['node-highlight'] = true; } } drawGridlines(show) { @@ -11746,34 +11754,34 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di onNetworkGridlinesShowHideChange(e) { console.log('network grid:', e); if (e === "Show") { - this.visuals.twoD.commonService.session.style.widgets['network-gridlines-show'] = true; + this.widgets['network-gridlines-show'] = true; this.drawGridlines(true); } else { - this.visuals.twoD.commonService.session.style.widgets['network-gridlines-show'] = false; + this.widgets['network-gridlines-show'] = false; this.drawGridlines(false); } } onNodeChargeChange(e) { this.visuals.twoD.force.force('charge').strength(-e); this.visuals.twoD.force.alpha(0.3).alphaTarget(0).restart(); - this.visuals.twoD.commonService.session.style.widgets['node-charge'] = e; + this.widgets['node-charge'] = e; } onNetworkGravityChange(e) { this.visuals.twoD.force.force('gravity').strength(e); this.visuals.twoD.force.alpha(0.3).alphaTarget(0).restart(); - this.visuals.twoD.commonService.session.style.widgets['network-gravity'] = e; + this.widgets['network-gravity'] = e; } onNetworkFrictionChange(e) { this.visuals.twoD.force.velocityDecay(e); this.visuals.twoD.force.alpha(0.3).alphaTarget(0).restart(); - this.visuals.twoD.commonService.session.style.widgets['network-friction'] = e; + this.widgets['network-friction'] = e; } onNetworkLinkStrengthVariableChange(e) { console.log('st change: ', e); let v = parseFloat(e); this.visuals.twoD.force.force('link').strength(v); this.visuals.twoD.force.alpha(0.3).alphaTarget(0).restart(); - this.visuals.twoD.commonService.session.style.widgets['network-link-strength'] = e; + this.widgets['network-link-strength'] = e; } onNetworkExportFiletypeChange(e) { if (e == "svg") { @@ -11782,11 +11790,11 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } updateNodeColors() { //debugger; - let variable = this.visuals.twoD.commonService.session.style.widgets['node-color-variable']; + let variable = this.widgets['node-color-variable']; let nodes = this.visuals.twoD.svg.select('g.nodes').selectAll('g').select('path').data(this.visuals.twoD.commonService.session.network.nodes).classed('selected', d => d.selected); - let col = this.visuals.twoD.commonService.session.style.widgets['node-color']; - let stroke = this.visuals.twoD.commonService.session.style.widgets['selected-node-stroke-color']; - let stroke_width = parseInt(this.visuals.twoD.commonService.session.style.widgets['selected-node-stroke-width']); + let col = this.widgets['node-color']; + let stroke = this.widgets['selected-node-stroke-color']; + let stroke_width = parseInt(this.widgets['selected-node-stroke-width']); if (variable == 'None') { nodes.attr('fill', col).attr('opacity', 1); // this.context.microbeTrace.clearTable("#node-color-table-bottom"); @@ -11820,7 +11828,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di * Otherwise, turn on the node(s) selected. /*/ y.style['stroke'] = "#000000"; - y.style['strokeWidth'] = this.visuals.twoD.commonService.session.style.widgets['node-border-width']; + y.style['strokeWidth'] = this.widgets['node-border-width']; } }); }); @@ -11831,18 +11839,18 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di * Otherwise, turn on the node(s) selected. /*/ y.style['stroke'] = "#000000"; - y.style['strokeWidth'] = this.visuals.twoD.commonService.session.style.widgets['node-border-width']; + y.style['strokeWidth'] = this.widgets['node-border-width']; }); }); } } updateLinkColor() { - let variable = this.visuals.twoD.commonService.session.style.widgets['link-color-variable']; + let variable = this.widgets['link-color-variable']; // console.log('updating variable: ',variable ); let links = this.visuals.twoD.svg.select('g.links').selectAll('line'); if (variable == 'None') { - let color = this.visuals.twoD.commonService.session.style.widgets['link-color'], - opacity = 1 - this.visuals.twoD.commonService.session.style.widgets['link-opacity']; + let color = this.widgets['link-color'], + opacity = 1 - this.widgets['link-opacity']; links.attr('stroke', color).attr('opacity', opacity); // this.context.microbeTrace.clearTable("#link-color-table-bottom"); } else { @@ -11864,14 +11872,14 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di } } scaleLinkWidth() { - let scalar = this.visuals.twoD.commonService.session.style.widgets['link-width']; - let variable = this.visuals.twoD.commonService.session.style.widgets['link-width-variable']; + let scalar = this.widgets['link-width']; + let variable = this.widgets['link-width-variable']; let vlinks = this.visuals.twoD.getVLinks(); let links = this.visuals.twoD.svg.select('g.links').selectAll('line').data(vlinks); if (variable == 'None') return links.attr('stroke-width', scalar); let n = vlinks.length; - let maxWidth = this.visuals.twoD.commonService.session.style.widgets['link-width-max']; - let minWidth = this.visuals.twoD.commonService.session.style.widgets['link-width-min']; + let maxWidth = this.widgets['link-width-max']; + let minWidth = this.widgets['link-width-min']; let max = -Infinity; let min = Infinity; for (let i = 0; i < n; i++) { @@ -11881,7 +11889,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di if (l < min) min = l; } let mid = (max - min) / 2 + min; - let scale = d3__WEBPACK_IMPORTED_MODULE_4__.scaleLinear().domain(this.visuals.twoD.commonService.session.style.widgets['link-width-reciprocal'] ? [max, min] : [min, max]).range([minWidth, maxWidth]); + let scale = d3__WEBPACK_IMPORTED_MODULE_4__.scaleLinear().domain(this.widgets['link-width-reciprocal'] ? [max, min] : [min, max]).range([minWidth, maxWidth]); links.attr('stroke-width', d => { let v = d[variable]; if (!this.visuals.twoD.isNumber(v)) v = mid; @@ -11922,6 +11930,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di // this.visuals.microbeTrace.GlobalSettingsNodeColorDialogSettings.setStateBeforeExport(); // this.visuals.twoD.NodeSymbolTableWrapperDialogSettings.setStateBeforeExport(); // this.visuals.twoD.Node2DNetworkExportDialogSettings.setStateBeforeExport(); + this.setCalculatedResolution(); this.isExportClosed = false; this.visuals.twoD.Show2DExportPane = true; } @@ -11958,7 +11967,7 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di this.render(); } ngOnDestroy() { - //this.context.twoD.commonService.session.style.widgets['node-label-variable'] = 'None'; + //this.context.twoD.widgets['node-label-variable'] = 'None'; } onLoadNewData() { this.render(); @@ -11969,102 +11978,102 @@ let TwoDComponent = (_class = class TwoDComponent extends _app_base_component_di loadSettings() { //this.context.twoD.zoom = null; //Polygons|Label - this.SelectedPolygonLabelVariable = this.visuals.twoD.commonService.session.style.widgets['polygons-label-variable']; + this.SelectedPolygonLabelVariable = this.widgets['polygons-label-variable']; this.onPolygonLabelVariableChange(this.SelectedPolygonLabelVariable); //Polygons|Label Size - this.SelectedPolygonLabelSizeVariable = this.visuals.twoD.commonService.session.style.widgets['polygons-label-size']; + this.SelectedPolygonLabelSizeVariable = this.widgets['polygons-label-size']; this.setPolygonLabelSize(this.SelectedPolygonLabelSizeVariable); //Node|Orientation - this.SelectedPolygonLabelOrientationVariable = this.visuals.twoD.commonService.session.style.widgets['polygons-label-orientation']; + this.SelectedPolygonLabelOrientationVariable = this.widgets['polygons-label-orientation']; this.onPolygonLabelOrientationChange(this.SelectedPolygonLabelOrientationVariable); - this.polygonsToggle(this.visuals.twoD.commonService.session.style.widgets['polygons-show']); - if (this.visuals.twoD.commonService.session.style.widgets['polygons-show']) { + this.polygonsToggle(this.widgets['polygons-show']); + if (this.widgets['polygons-show']) { this.visuals.twoD.updatePolygonColors(); - this.polygonColorsToggle(this.visuals.twoD.commonService.session.style.widgets['polygon-color-table-visible']); + this.polygonColorsToggle(this.widgets['polygon-color-table-visible']); } //Nodes|Label - this.SelectedNodeLabelVariable = this.visuals.twoD.commonService.session.style.widgets['node-label-variable']; + this.SelectedNodeLabelVariable = this.widgets['node-label-variable']; this.onNodeLabelVaribleChange(this.SelectedNodeLabelVariable); //Node|Label Size - this.SelectedNodeLabelSizeVariable = this.visuals.twoD.commonService.session.style.widgets['node-label-size']; + this.SelectedNodeLabelSizeVariable = this.widgets['node-label-size']; this.setNodeLabelSize(this.SelectedNodeLabelSizeVariable); //Node|Orientation - this.SelectedNodeLabelOrientationVariable = this.visuals.twoD.commonService.session.style.widgets['node-label-orientation']; + this.SelectedNodeLabelOrientationVariable = this.widgets['node-label-orientation']; this.onNodeLabelOrientationChange(this.SelectedNodeLabelOrientationVariable); //Nodes|Tooltip - if (!Array.isArray(this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable'])) { - this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable'] = [this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable']]; + if (!Array.isArray(this.widgets['node-tooltip-variable'])) { + this.widgets['node-tooltip-variable'] = [this.widgets['node-tooltip-variable']]; } - this.SelectedNodeTooltipVariable = this.visuals.twoD.commonService.session.style.widgets['node-tooltip-variable']; + this.SelectedNodeTooltipVariable = this.widgets['node-tooltip-variable']; this.onNodeTooltipVariableChange(this.SelectedNodeTooltipVariable); //Nodes|Shape By Table - this.SelectedNetworkTableTypeVariable = this.visuals.twoD.commonService.session.style.widgets["node-symbol-table-visible"]; + this.SelectedNetworkTableTypeVariable = this.widgets["node-symbol-table-visible"]; this.onNodeSymbolTableChange(this.SelectedNetworkTableTypeVariable); //Nodes|Shape By - this.SelectedNodeSymbolVariable = this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable']; - this.onNodeSymbolVariableChange(this.visuals.twoD.commonService.session.style.widgets['node-symbol-variable'], this.SelectedNetworkTableTypeVariable === "Show"); + this.SelectedNodeSymbolVariable = this.widgets['node-symbol-variable']; + this.onNodeSymbolVariableChange(this.widgets['node-symbol-variable'], this.SelectedNetworkTableTypeVariable === "Show"); //Nodes|Shape - this.SelectedNodeShapeVariable = this.visuals.twoD.commonService.session.style.widgets['node-symbol']; + this.SelectedNodeShapeVariable = this.widgets['node-symbol']; this.onNodeSymbolChange(this.SelectedNodeShapeVariable); //Nodes|Size By - this.SelectedNodeRadiusVariable = this.visuals.twoD.commonService.session.style.widgets['node-radius-variable']; + this.SelectedNodeRadiusVariable = this.widgets['node-radius-variable']; this.onNodeRadiusVariableChange(this.SelectedNodeRadiusVariable); //Nodes|Size - this.SelectedNodeRadiusSizeVariable = this.visuals.twoD.commonService.session.style.widgets['node-radius'].toString(); + this.SelectedNodeRadiusSizeVariable = this.widgets['node-radius'].toString(); this.onNodeRadiusChange(this.SelectedNodeRadiusSizeVariable); //Links|Tooltip - this.SelectedLinkTooltipVariable = this.visuals.twoD.commonService.session.style.widgets['link-tooltip-variable']; + this.SelectedLinkTooltipVariable = this.widgets['link-tooltip-variable']; this.onLinkTooltipVariableChange(this.SelectedLinkTooltipVariable); //Links|Label - this.SelectedLinkLabelVariable = this.visuals.twoD.commonService.session.style.widgets['link-label-variable']; + this.SelectedLinkLabelVariable = this.widgets['link-label-variable']; this.onLinkLabelVariableChange(this.SelectedLinkLabelVariable); //Links|Decimal Length - this.SelectedLinkDecimalVariable = this.visuals.twoD.commonService.session.style.widgets['link-label-decimal-length']; + this.SelectedLinkDecimalVariable = this.widgets['link-label-decimal-length']; this.onLinkDecimalVariableChange(this.SelectedLinkDecimalVariable); //Links|Transparency - this.SelectedLinkTransparencyVariable = this.visuals.twoD.commonService.session.style.widgets['link-opacity']; + this.SelectedLinkTransparencyVariable = this.widgets['link-opacity']; this.onLinkOpacityChange(this.SelectedLinkTransparencyVariable); //Links|Width By - this.SelectedLinkWidthByVariable = this.visuals.twoD.commonService.session.style.widgets['link-width-variable']; + this.SelectedLinkWidthByVariable = this.widgets['link-width-variable']; this.onLinkWidthVariableChange(this.SelectedLinkWidthByVariable); //Links|Reciprical - this.SelectedLinkReciprocalTypeVariable = this.visuals.twoD.commonService.session.style.widgets['link-width-reciprocal'] ? "Reciprocal" : "Non-Reciprocal"; + this.SelectedLinkReciprocalTypeVariable = this.widgets['link-width-reciprocal'] ? "Reciprocal" : "Non-Reciprocal"; this.onLinkWidthReciprocalNonReciprocalChange(this.SelectedLinkReciprocalTypeVariable); //Links|Width - this.SelectedLinkWidthVariable = this.visuals.twoD.commonService.session.style.widgets['link-width']; + this.SelectedLinkWidthVariable = this.widgets['link-width']; this.onLinkWidthChange(this.SelectedLinkWidthVariable); //Links|Width Max - this.SelectedLinkWidthMax = this.visuals.twoD.commonService.session.style.widgets['link-width-max']; + this.SelectedLinkWidthMax = this.widgets['link-width-max']; this.onLinkWidthMaxChange(this.SelectedLinkWidthByVariable); //Links|Width Min - this.SelectedLinkWidthMin = this.visuals.twoD.commonService.session.style.widgets['link-width-min']; + this.SelectedLinkWidthMin = this.widgets['link-width-min']; this.onLinkWidthMinChange(this.SelectedLinkWidthByVariable); //Links|Length - this.SelectedLinkLengthVariable = this.visuals.twoD.commonService.session.style.widgets['link-length']; + this.SelectedLinkLengthVariable = this.widgets['link-length']; this.onLinkLengthChange(this.SelectedLinkLengthVariable); //Links|Arrows - this.SelectedLinkArrowTypeVariable = this.visuals.twoD.commonService.session.style.widgets['link-directed'] ? "Show" : "Hide"; + this.SelectedLinkArrowTypeVariable = this.widgets['link-directed'] ? "Show" : "Hide"; this.onLinkDirectedUndirectedChange(this.SelectedLinkArrowTypeVariable); //Network|Neighbors - this.SelectedNetworkNeighborTypeVariable = this.visuals.twoD.commonService.session.style.widgets['node-highlight'] ? "Highlighted" : "Normal"; + this.SelectedNetworkNeighborTypeVariable = this.widgets['node-highlight'] ? "Highlighted" : "Normal"; this.onDontHighlightNeighborsHighlightNeighborsChange(this.SelectedNetworkNeighborTypeVariable); //Network|Gridlines - this.SelectedNetworkGridLineTypeVariable = this.visuals.twoD.commonService.session.style.widgets['network-gridlines-show'] ? "Show" : "Hide"; + this.SelectedNetworkGridLineTypeVariable = this.widgets['network-gridlines-show'] ? "Show" : "Hide"; this.onNetworkGridlinesShowHideChange(this.SelectedNetworkGridLineTypeVariable); //Network|Charge - this.SelectedNetworkChargeVariable = this.visuals.twoD.commonService.session.style.widgets['node-charge']; + this.SelectedNetworkChargeVariable = this.widgets['node-charge']; this.onNodeChargeChange(this.SelectedNetworkChargeVariable); //Network|Gravity - this.SelectedNetworkGravityVariable = this.visuals.twoD.commonService.session.style.widgets['network-gravity']; + this.SelectedNetworkGravityVariable = this.widgets['network-gravity']; this.onNetworkGravityChange(this.SelectedNetworkGravityVariable); //Network|Friction - this.SelectedNetworkFrictionVariable = this.visuals.twoD.commonService.session.style.widgets['network-friction']; + this.SelectedNetworkFrictionVariable = this.widgets['network-friction']; this.onNetworkFrictionChange(this.SelectedNetworkFrictionVariable); //Network|Link Strength - this.SelecetedNetworkLinkStrengthVariable = this.visuals.twoD.commonService.session.style.widgets['network-link-strength']; + this.SelecetedNetworkLinkStrengthVariable = this.widgets['network-link-strength']; this.onNetworkFrictionChange(this.SelecetedNetworkLinkStrengthVariable); //Network|Polygon Orientation - this.SelectedPolygonLabelOrientationVariable = this.visuals.twoD.commonService.session.style.widgets['polygon-label-orientation']; + this.SelectedPolygonLabelOrientationVariable = this.widgets['polygon-label-orientation']; this.onPolygonLabelOrientationChange(this.SelectedPolygonLabelOrientationVariable); } }, _class.ctorParameters = () => [{ @@ -17250,7 +17259,7 @@ var ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ = __webpack_require__(/*! ../../../ var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(/*! ../../../../node_modules/css-loader/dist/runtime/api.js */ 40479); var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___); // Module -___CSS_LOADER_EXPORT___.push([module.id, ".dialogSize {\n width: 30vw;\n height: 150px;\n min-width: 150px;\n}\n\n:host {\n position: absolute;\n overflow: hidden;\n z-index: 1 !important;\n /*top: 37px !important;\n left: 1px !important; \n width: 99% !important; */\n}\n\n.network {\n margin-top: 0 !important;\n cursor: grab;\n}\n\n.ui-dropdown {\n width: 100% !important;\n}\n\n.display-none {\n display: none;\n}\n\n.bottom-table {\n font-size: 0.5vmax;\n}\n\n#node-max-radius-row, #node-min-radius-row {\n display: none;\n}\n\n.clusters path {\n cursor: grab;\n}\n\n:host ::ng-deep .p-accordion-tab:not(.p-accordion-tab-active) .p-toggleable-content {\n height: 0;\n overflow: hidden;\n}\n:host ::ng-deep .p-accordion-tab.p-accordion-tab-active .p-toggleable-content {\n height: auto !important;\n overflow: auto !important;\n}\n\n/* Button appearance on hover */\n.btn-icon:hover {\n transform: scale(1.1); /* Slight enlarge on hover */\n background-color: rgba(0, 0, 0, 0.1); /* Subtle background color on hover */\n}\n\n.btn-icon {\n margin-right: 10px;\n box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);\n}\n\n.flaticon-settings:before {\n font-weight: 800 !important;\n}\n\n.flaticon-pin:before {\n font-weight: 800 !important;\n}\n\n.flaticon-download:before {\n font-weight: 800 !important;\n}", ""]); +___CSS_LOADER_EXPORT___.push([module.id, ".dialogSize {\n width: 30vw;\n height: 150px;\n min-width: 150px;\n}\n\n:host {\n position: absolute;\n overflow: hidden;\n z-index: 1 !important;\n /*top: 37px !important;\n left: 1px !important; \n width: 99% !important; */\n}\n\n.network {\n margin-top: 0 !important;\n cursor: grab;\n}\n\n.ui-dropdown {\n width: 100% !important;\n}\n\n.display-none {\n display: none;\n}\n\n.bottom-table {\n font-size: 0.5vmax;\n}\n\n#node-max-radius-row, #node-min-radius-row {\n display: none;\n}\n\n.clusters path {\n cursor: grab;\n}\n\n:host ::ng-deep .p-accordion-tab:not(.p-accordion-tab-active) .p-toggleable-content {\n height: 0;\n overflow: hidden;\n}\n:host ::ng-deep .p-accordion-tab.p-accordion-tab-active .p-toggleable-content {\n height: auto !important;\n overflow: auto !important;\n}\n\n/* Button appearance on hover */\n.btn-icon:hover {\n transform: scale(1.1); /* Slight enlarge on hover */\n background-color: rgba(0, 0, 0, 0.1); /* Subtle background color on hover */\n}\n\n.btn-icon {\n margin-right: 10px;\n box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);\n}\n\n.flaticon-settings:before {\n font-weight: 800 !important;\n}\n\n.flaticon-pin:before {\n font-weight: 800 !important;\n}\n\n.flaticon-download:before {\n font-weight: 800 !important;\n}\n\n#network-export-filename {\n height: 42px;\n}", ""]); // Exports module.exports = ___CSS_LOADER_EXPORT___.toString(); @@ -17685,7 +17694,7 @@ module.exports = "
\r\n
{ "use strict"; -module.exports = "\r\n\r\n\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n\r\n\r\n
\r\n
\r\n

\r\n Node Shapes\r\n

\r\n
\r\n
\r\n
\r\n

\r\n Node Colors\r\n

\r\n
\r\n
\r\n
\r\n

\r\n Link Colors\r\n

\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n

Please add data files to load...

\r\n
\r\n
\r\n
\r\n
\r\n\r\n\r\n\r\n\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n ()\r\n Nodes (Selected)
Links
Clusters
Singletons
\r\n
\r\n\r\n\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n {{option}}\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Table
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n {{option}}\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Arrows
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n
\r\n
Neighbors
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Gridlines
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
Polygons
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
Label Polygons
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
Color Polygons
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Polygon Color Table
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n\r\n\r\n
\r\n\r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n\r\n \r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n \r\n \r\n\r\n\r\n\r\n\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n {{item.attribute}}\r\n \r\n {{item.value}}
\r\n
\r\n\r\n\r\n\r\n\r\n\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Resolution
\r\n
{{CalculatedResolution}}
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n\r\n"; +module.exports = "\r\n\r\n\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n\r\n\r\n
\r\n
\r\n

\r\n Node Shapes\r\n

\r\n
\r\n
\r\n
\r\n

\r\n Node Colors\r\n

\r\n
\r\n
\r\n
\r\n

\r\n Link Colors\r\n

\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n

Please add data files to load...

\r\n
\r\n
\r\n
\r\n
\r\n\r\n\r\n\r\n\r\n\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n ()\r\n Nodes (Selected)
Links
Clusters
Singletons
\r\n
\r\n\r\n\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n {{option}}\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Table
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n {{option}}\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Arrows
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n
\r\n
Neighbors
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Gridlines
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
Polygons
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
Label Polygons
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n
Color Polygons
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Polygon Color Table
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n\r\n\r\n
\r\n\r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n \r\n\r\n \r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n \r\n \r\n\r\n\r\n\r\n\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n {{item.attribute}}\r\n \r\n {{item.value}}
\r\n
\r\n\r\n\r\n\r\n\r\n\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n
Resolution
\r\n
{{CalculatedResolution}}
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n\r\n"; /***/ })