I'm making a puzzle game in which the player creates lines across a set area. They do this by clicking two points within the area, and the game plots the lines across the points.

My problem is how to prevent the lines from extending past the area edges. Here is a capx file which shows the problem (the area that should contain the lines is the dark area in the middle):

dropbox.com/s/gbm6ie2q0ib3s5a/bounded_lines.capx

FWIW, the solutions I've considered / tried are:

1) Overlay a background image that is transparent over the drawing area, but obscures the rest of the screen. I plan to add video backgrounds later, so this isn't suitable here.

2) Set invisible sprites around the area edges and check for where the line collides with them

From my forum searches, it seems that checking for collision points on two sprites is difficult. The best solution I could come up with was to have invisible single pixel sprites that run along the edges of the set area and check for collisions where the lines exit the area, then place sprites on either side and draw new, shorter lines between them using distance joints. This seems workable, but really inefficient.

3) Use the initial x and y coordinates of the specified points, and the x and y axes of the area to mathemagically calculate the exit coordinates of the lines and draw new lines between the points as above. This seems to be best solution I could come up with, but it's way beyond my feeble math ability.

This is an important point for my game's presentation, so any help would be much appreciated!