Alexander Deplov

Modify pattern by moving points

Modify pattern by moving points

Code

var bg = new Path.Rectangle({
    size: view.bounds,
    fillColor: 'black'
})

var group = new Group()
var path = new Path.Rectangle({
  size: [200],
  strokeWidth: 3,
  strokeColor: 'blue',
  position: view.center,
  parent: group,
})



function highLightPointsTest(path){
  path.segments.map(function(object, i){
    var circle = new Path.Circle({
      radius: 20,
      fillColor: "yellow",
      strokeWidth: 1,
      center: object.point,
      opacity: 0.2
    })

    circle.onMouseDrag = function(event){
      this.position += event.delta
      object.point += event.delta
      createGrid(group)
    }
  })
}

var tempGroup
function createGrid(group){
  
  if (tempGroup){
    tempGroup.remove()
  }

  tempGroup = new Group()

  for (var x = 0; x < 10; x++){
    for (var y = 0; y < 10; y++){
      var clone = group.clone()
      clone.position = [x * group.bounds.width, y * group.bounds.height]
      clone.strokeColor = 'yellow'
      tempGroup.addChild(clone)

    }
  }
  tempGroup.position = view.center
}

createGrid(group)

highLightPointsTest(path)