anchor.diff:        {
           //Because we're rotated, translating along the y moves the image horizontally.
           //We want to line up the original bottom edge with left of the screen.
  +//          alignment_translation = half_width - half_height;
             img_preview.style.webkitTransform = rotation_call + translation_call_begin + (half_width - half_height) + translation_call_end;
         }
         else //angle is 270
         {
           //Because we're rotated, translating along the y moves the image horizontally.
           //We want to line up the original right edge with the left of the screen.
  +//          alignment_translation = half_height - half_width;
             img_preview.style.webkitTransform = rotation_call + " translate(0%, " + (half_height - half_width) + translation_call_end;
         }
   
  
positive.code:         }
          var units = "px"
  
          //todo: get annotation_holders and change px
  
        var bounding_rect = image_preview.getBoundingClientRect();
        var half_width = bounding_rect.width/2;
        var half_height = bounding_rect.height/2;
  
negative.code: 
              //rotate the anchors
              var oldTop = parseFloat(annotations[i].style.top) - offsetTop;
              var top = offsetTop + parseFloat(annotations[i].style.left) - offsetLeft;
              var left = offsetLeft + img_bound - parseFloat(annotations[i].style.width) - oldTop;
  
              //need to undo the translation that we did to align the image with the edges of the panel
              var alignment_translation = half_width - half_height;
              if (angle == 90 || angle == 270)
              {
                  top -= alignment_translation;
              }
              else
              {
                  left += alignment_translation;
              }
  
              annotations[i].style.top = top + units;
              annotations[i].style.left = left + units;
          }
      }
  
  