pt-start-guide-final.html

<script type="text/javascript">

    space = new CanvasSpace("#pt").setup( {bgcolor: "#f1f1f1"} ) 
    form = new Form( space )

    dot = new Circle( 250, 250 ).setRadius( 50 )
    another = new Circle( 100, 100 ).setRadius( 50 )
    
    bot = {
        animate: function ( time, fs, context ) {
            form.fill( "#999" ).text( new Point( 20, 20 ), "frame rate is "+(1000/fs) )

            form.fill( "#5AF" ).stroke( false )
            dot.setRadius( Math.abs(500 - time % 1000)/50 + 50 )
            form.circle( dot )

            form.fill( false ).stroke( "#fc0", 5 )
            form.circle( another )

            var hits = another.intersectCircle( dot )
            if (hits.length > 0) {
                form.stroke( "#fff" ).fill( "#0C9" )
                form.line( new Line( hits[0] ).to( hits[1]) )
                form.points( hits, 5, true )
            }
        },

        onMouseAction: function(type, x, y, evt) {
            if (type == "move") {
                another.set( x, y )
            }
        }
    }

    space.add( bot )
    space.bindMouse()
    space.play()
        
</script>