modified pointer script to allow users to draw on surfaces

examples/pointer.js

@@ -1,9 +1,50 @@
+//Dimensions property for lines is the offset of the position
+
 var lineEntityID = null;
 var lineIsRezzed = false;
 var altHeld = false;
 var lineCreated = false;
+var position, positionOffset, prevPosition;
+var nearLinePosition;
+var strokes = [];
+var STROKE_ADJUST = 0.005;
+var DISTANCE_DRAW_THRESHOLD = .03;
+var drawDistance = 0;
 
-function nearLinePoint(targetPosition) {
+var userCanDraw = true;
+
+var BUTTON_SIZE = 32;
+var PADDING = 3;
+
+var buttonOffColor = {red: 250, green: 10, blue: 10};
+var buttonOnColor = {red: 10, green: 200, blue: 100};
+
+HIFI_PUBLIC_BUCKET = "http://s3.amazonaws.com/hifi-public/";
+var screenSize = Controller.getViewportDimensions();
+
+var drawButton = Overlays.addOverlay("image", {
+  x: screenSize.x / 2 - BUTTON_SIZE * 2 + PADDING,
+  y: screenSize.y - (BUTTON_SIZE + PADDING),
+  width: BUTTON_SIZE,
+  height: BUTTON_SIZE,
+  imageURL: HIFI_PUBLIC_BUCKET + "images/pencil.png?v2",
+  color: buttonOnColor,
+  alpha: 1
+});
+
+
+
+
+var center = Vec3.sum(MyAvatar.position, Vec3.multiply(2.0, Quat.getFront(Camera.getOrientation())));
+center.y += 0.5;
+var whiteBoard = Entities.addEntity({
+  type: "Box",
+  position: center,
+  dimensions: {x: 1, y: 1, z: .001},
+  color: {red: 255, green: 255, blue: 255}
+});
+
+function calculateNearLinePosition(targetPosition) {
   var handPosition = MyAvatar.getRightPalmPosition();
   var along = Vec3.subtract(targetPosition, handPosition);
   along = Vec3.normalize(along);
@@ -27,19 +68,27 @@ function createOrUpdateLine(event) {
   var props = Entities.getEntityProperties(intersection.entityID);
 
   if (intersection.intersects) {
-    var dim = Vec3.subtract(intersection.intersection, nearLinePoint(intersection.intersection));
+    startPosition = intersection.intersection;
+    var subtractVec = Vec3.multiply(Vec3.normalize(pickRay.direction), STROKE_ADJUST);
+    startPosition = Vec3.subtract(startPosition, subtractVec);
+    nearLinePosition = calculateNearLinePosition(intersection.intersection);
+    positionOffset= Vec3.subtract(startPosition, nearLinePosition);
     if (lineIsRezzed) {
       Entities.editEntity(lineEntityID, {
-        position: nearLinePoint(intersection.intersection),
-        dimensions: dim,
+        position: nearLinePosition,
+        dimensions: positionOffset,
         lifetime: 15 + props.lifespan // renew lifetime
       });
+      if(userCanDraw){
+        draw();
+      }
     } else {
       lineIsRezzed = true;
+      prevPosition = startPosition;
       lineEntityID = Entities.addEntity({
         type: "Line",
-        position: nearLinePoint(intersection.intersection),
-        dimensions: dim,
+        position: nearLinePosition,
+        dimensions: positionOffset,
         color: {
           red: 255,
           green: 255,
@@ -53,8 +102,39 @@ function createOrUpdateLine(event) {
   }
 }
 
+function draw(){
+
+  //We only want to draw line if distance between starting and previous point is large enough
+  drawDistance = Vec3.distance(startPosition, prevPosition);
+  if( drawDistance < DISTANCE_DRAW_THRESHOLD){
+    return;
+  }
+
+  var offset = Vec3.subtract(startPosition, prevPosition);
+  strokes.push(Entities.addEntity({
+    type: "Line",
+    position: prevPosition,
+    dimensions: offset,
+    color: {red: 200, green: 40, blue: 200},
+    // lifetime: 20
+  }));
+  prevPosition = startPosition;
+}
 
 function mousePressEvent(event) {
+  var clickedOverlay = Overlays.getOverlayAtPoint({
+    x: event.x,
+    y: event.y
+  });
+  if (clickedOverlay == drawButton) {
+    userCanDraw = !userCanDraw;
+    if(userCanDraw === true){
+      Overlays.editOverlay(drawButton, {color: buttonOnColor});
+    } else {
+      Overlays.editOverlay(drawButton, {color: buttonOffColor});
+    }
+  } 
+
   if (!event.isLeftButton || altHeld) {
     return;
   }
@@ -69,6 +149,7 @@ function mouseMoveEvent(event) {
 }
 
 
+
 function mouseReleaseEvent(event) {
   if (!lineCreated) {
     return;
@@ -91,7 +172,17 @@ function keyReleaseEvent(event) {
 
 }
 
+function cleanup(){
+  Entities.deleteEntity(whiteBoard);
+  for(var i =0; i < strokes.length; i++){
+    Entities.deleteEntity(strokes[i]);
+  }
 
+  Overlays.deleteOverlay(drawButton);
+}
+
+
+Script.scriptEnding.connect(cleanup);
 Controller.mousePressEvent.connect(mousePressEvent);
 Controller.mouseReleaseEvent.connect(mouseReleaseEvent);