all files / lib/features/grid-snapping/ Grid.js

100% Statements 38/38
75% Branches 6/8
100% Functions 7/7
100% Lines 38/38
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111                                    35×   35×   35×   34×     35×   35× 35×   35×       35×   35× 35×   35×     35×   35×             35×   35×             35×   35×   35×   35×                     41×   41×   41× 33×             46×            
import {
  append as svgAppend,
  attr as svgAttr,
  clear as svgClear,
  create as svgCreate
} from 'tiny-svg';
 
import { query as domQuery } from 'min-dom';
 
import { SPACING } from './GridSnapping';
 
var GRID_COLOR = '#ccc',
    LAYER_NAME = 'djs-grid';
 
var GRID_DIMENSIONS = {
  width : 100000,
  height: 100000
};
 
 
export default function Grid(canvas, config, eventBus) {
  this._canvas = canvas;
 
  this.hasGrid = false;
 
  if (config) {
    this.visible = config.visible === false ? false : true;
  } else {
    this.visible = true;
  }
 
  var self = this;
 
  eventBus.on('diagram.init', function() {
    self._init();
 
    self.setVisible(self.visible);
  });
}
 
Grid.prototype._init = function() {
  var defs = domQuery('defs', this._canvas._svg);
 
  Eif (!defs) {
    defs = svgCreate('defs');
 
    svgAppend(this._canvas._svg, defs);
  }
 
  var pattern = this.pattern = svgCreate('pattern');
 
  svgAttr(pattern, {
    id: 'djs-grid-pattern',
    width: SPACING,
    height: SPACING,
    patternUnits: 'userSpaceOnUse'
  });
 
  var circle = this.circle = svgCreate('circle');
 
  svgAttr(circle, {
    cx: 0.5,
    cy: 0.5,
    r: 0.5,
    fill: GRID_COLOR
  });
 
  svgAppend(pattern, circle);
 
  svgAppend(defs, pattern);
 
  var grid = this.grid = svgCreate('rect');
 
  svgAttr(grid, {
    x: -(GRID_DIMENSIONS.width / 2),
    y: -(GRID_DIMENSIONS.height / 2),
    width: GRID_DIMENSIONS.width,
    height: GRID_DIMENSIONS.height,
    fill: 'url(#djs-grid-pattern)'
  });
};
 
Grid.prototype.isVisible = function() {
  return this.visible;
};
 
Grid.prototype.setVisible = function(visible) {
  this.visible = visible;
 
  var parent = this._getParent();
 
  if (visible) {
    svgAppend(parent, this.grid);
  } else {
    svgClear(parent);
  }
};
 
Grid.prototype.toggleVisible = function() {
  this.setVisible(!this.visible);
};
 
Grid.prototype._getParent = function() {
  return this._canvas.getLayer(LAYER_NAME, -2);
};
 
Grid.$inject = [
  'canvas',
  'config.grid',
  'eventBus'
];