Code
var bg = new Path.Rectangle({
size: view.size,
fillColor: 'black'
})
var randGroup = new Group()
function createPoints(){
randGroup.clear()
for (var i = 0; i < 50; i++){
var object = new Path.Circle(new Point(Math.random() * view.size.width, Math.random() * view.size.height), Math.random() * 15)
object.strokeColor = 'blue'
object.strokeColor.hue += Math.random() * 200
object.applyMatrix = false
randGroup.addChild(object)
var clone = object.clone()
clone.fillColor = clone.strokeColor
clone.applyMatrix = false
clone.onFrame = function(event){
this.position.y += Math.sin(event.count * Math.random() * 100) * Math.random() * 4
this.position.x += Math.sin(event.count * Math.random() * 100) * Math.random() * 4
}
var tweenClone = clone.tweenTo(
{ opacity: 0 },
{ duration: Math.random() * 40000 + 500, start: true }
)
var tween = object.tweenTo(
{ opacity: 0 },
{ duration: Math.random() * 1000 + 500, start: true }
)
}
}
createPoints()
var red = 'red'
var group = new Group()
var cursor = new Path.Circle(view.center, 25)
cursor.fillColor = 'white'
cursor.strokeWidth = 1
cursor.strokeColor = 'red'
group.addChild(cursor)
var point = new Path.Circle(view.center, 4)
point.fillColor = red
group.addChild(point)
group.onMouseEnter = function(event){
cursor.strokeWidth = 2
}
group.onMouseLeave = function(event){
cursor.strokeWidth = 0
}
group.onMouseDrag = function(event){
this.position += event.delta
randGroup.position.x = this.position.x + event.point.x
randGroup.children.map(function(object, i){
if (object.position.x > view.size.width || object.position.x < 0){
object.remove()
createPoints()
}
})
}