"Definición de variables"
|v shape elements suelto rayo separacion |

"Esta separacion son los dias para el tiempo de silencios"
separacion :=28.

"Aquí se crean los elementos que serian los avatar"
v := RTView new.
	shape := (RTBox new width: 200; height: 200) color: (Color blue alpha: 0.3).
	elements := shape elementsOn: (1 to: 3).
	v addAll: elements @ RTDraggable .
	elements @ RTPopup.
	"RTTreeLayout on: elements."
	"RTCircleLayout new"
	RTGridLayout new 
	"initialRadius: 140;"
	on: elements.

"Este elemento suelto, es una coleccion. Y es donde irian los datos que representan el silencio"

	suelto := OrderedCollection new . 
	suelto add: ( (RTBox new width: 100; height: 100) color: (Color black alpha: 0.6)  ) element @ RTDraggable.
   (suelto at:1) translateBy: (separacion*50)@0.
	v addAll: suelto.

"Rayo, dibuja la linea que va desde los elementos a la caja suelta"	
		
	rayo := RTEdge from:(elements at: 1) to: (suelto at: 1).
		v add: (rayo + (RTGradientColoredLine new colors: (Array with: (Color red alpha:0.3) with: (Color red alpha:0.9)); precision: 100; width:10; gradientColorShape)).

rayo := RTEdge from:(elements at: 2) to: (suelto at: 1).
		v add: (rayo + (RTGradientColoredLine new colors: (Array with: (Color red alpha:0.3) with: (Color red alpha:0.9)); precision: 100; width:10; gradientColorShape)).

rayo := RTEdge from:(elements at: 3) to: (suelto at: 1).
		v add: (rayo + (RTGradientColoredLine new colors: (Array with: (Color red alpha:0.3) with: (Color red alpha:0.9)); precision: 100; width:10; gradientColorShape)).

"Aquí se dibuja en el canvas."
		
	v canvas focusOnCenterScaled