Index: draw.html
==================================================================
--- draw.html
+++ draw.html
@@ -50,11 +50,11 @@
 var delta_vertical_angle = 0;
 var delta_position = [0,0,0];
 
 
 //  Use to rotate selected points about a vector line
-var selection_rotation_vector = null;
+var selection_rotation_axis = null;
 var rotation_center = origin.slice(0);
 
 
 
 
@@ -396,11 +396,11 @@
 function writeMsg(canvas, msg){
 	var lines = msg.split("\n");
 	var ctx = canvas.getContext("2d");
 	ctx.font = "9pt sans-serif"
 	for(var i = 0; i < lines.length; ++i){
-		ctx.fillText(lines[i], 5, 10 + 15 *  i); }}
+		ctx.fillText(lines[i], 5, 10 + 16 *  i); }}
 
     
 //  camera functions
 
 function rotateView(norm, theta, cameracentric){
@@ -408,10 +408,14 @@
     // camera centric uses the camera axes to perform the rotation instead of the space axes.   
     if(cameracentric) norm = matrix_mult(view_transform, [norm])[0];
     var rotation = vector_rotation(norm, theta);
     
     view_transform = matrix_mult(rotation, view_transform); }
+	
+	
+function rotatePoint(point, axis, angle, center){
+}
     
     
     
 function rotateHorizontal(theta){
     rotateView([0, 1, 0], theta, false); }
@@ -580,36 +584,55 @@
 	ctx.fillStyle = "rgba(0, 0, 0, 0.9)";
     for(var k in solo_points){
        var pt = point_projections[k];
        if(pt) ctx.fillRect(pt[0] - 2, pt[1] - 2, 4, 4); }
         
-    
+	//
+	//  The following drawing of axes is to help provide an perspective
+	//  The nuances of this draw behavior are created to provide visual cues for interpreting perspective and depth.
+	//  
+	//
 
 	// axis lines and dots
 	ctx.beginPath();
-    var faxis_pt = project(canvas, vector_add(origin, [0, 0, forward_axis_size, 0, 0]), view_transform, origin);
+    var faxis_pt = project(canvas, vector_add(origin, [0, 0, forward_axis_size]), view_transform, origin);
 	var vaxis_pt = project(canvas, vector_add(origin, [0, -vertical_axis_size, 0]), view_transform, origin);
 	
 	ctx.fillStyle = "rgba(0,0,0,0.9)";
 	
+	var dot = vector_dot(view_transform[2], [0, 0, 1]);
+	var r = 3.2 - 1.8 * dot;
+	
+	ctx.lineWidth = 1.333;
+	
+	if(dot < 0){  // draw red square first to partially occlude with axes
+		ctx.fillStyle = "rgba(250, 0, 0, 0.9)";
+		ctx.fillRect(w/2 - 2, h/2 - 2, 4, 4); }
+		
+	ctx.fillStyle = "rgba(0,0,0,0.9)";
+	
 	if(faxis_pt){
 		ctx.moveTo(w/2, h/2);
-		ctx.lineTo(faxis_pt[0], faxis_pt[1]);
-		ctx.fillRect(faxis_pt[0] - 2, faxis_pt[1] - 2, 4, 4); }
+		ctx.lineTo(faxis_pt[0], faxis_pt[1]);	
+		ctx.fillRect(faxis_pt[0] - r/2, faxis_pt[1] - r/2, r, r); }
 		
 	if(vaxis_pt){
 		ctx.moveTo(w/2, h/2);
 		ctx.lineTo(vaxis_pt[0], vaxis_pt[1]);
 		ctx.fillRect(vaxis_pt[0] - 2, vaxis_pt[1] - 2, 4, 4); }
+	
+	ctx.stroke();
+	
+	if(dot >= 0){  // draw red square last so it is not occluded by axes
+		ctx.fillStyle = "rgba(250, 0, 0, 0.9)";
+		ctx.fillRect(w/2 - 2, h/2 - 2, 4, 4); }
 		
-	ctx.stroke();	
+	ctx.lineWidth = 1;
 	
 	
 
-    // red center dot.
-	ctx.fillStyle = "rgba(250, 0, 0, 0.9)";
-	ctx.fillRect(w/2 - 2, h/2 - 2, 4, 4);
+    
 		
 	
 	for(var i = 0; i < selected_points.length; ++i){
 		var pt;