skyquake/plugins/composer/src/src/libraries/graph/GraphConnectionPointNumber.js

   1 /**
   2  * Created by onvelocity on 2/8/16.
   3  */
   4 'use strict';
   5 import DescriptorModelFactory from '../model/DescriptorModelFactory'
   6 const defaults = {
   7         adjustTop: -9,
   8         adjustBottom: 21
   9 };
  10 export default class GraphConnectionPointNumber {
  11
  12         constructor(graph, props) {
  13                 this.cpNumbersGroup = graph.cpNumbers;
  14                 Object.assign(this, defaults, props);
  15                 this.containers = [];
  16         }
  17
  18         addContainers(containers) {
  19                 this.containers = containers.filter(d => DescriptorModelFactory.isConnectionPoint(d) && DescriptorModelFactory.isNetworkService(d.getRoot()));
  20         }
  21
  22         render() {
  23                 const cpNumber = this.cpNumbersGroup.selectAll('.connection-point-number').data(this.containers, d => d.uid);
  24                 cpNumber.enter().append('text').text(d => d.uiState.cpNumber);
  25                 cpNumber.attr({
  26                         'data-key': d => d.key,
  27                         'data-cp-number': d => d.uiState.cpNumber,
  28                         'text-anchor': 'middle',
  29                         'class': 'connection-point-number',
  30                         transform: d => {
  31                                 const point = d.position.centerPoint();
  32                                 const yAdjust = (/top/.test(d.location) ? this.adjustTop : this.adjustBottom);
  33                                 return 'translate(' + (point.x) + ', ' + (point.y + yAdjust) + ')';
  34                         }
  35                 });
  36                 cpNumber.exit().remove();
  37         }
  38
  39 }