panorama.js

$(function(){

  function getPosition(element) {
    var xPosition = 0;
    var yPosition = 0;
  
    while(element) {
      xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
      yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
      element = element.offsetParent;
    }
    return { x: xPosition, y: yPosition };
  }

  var isMobile = $(window).width() < 1025;
  if (!isMobile) {
    $('.panorama-view').panorama360({
      sliding_controls: true
    });

    // mouse cursor
    $(".panorama-view").css('cursor','url(../wp-content/themes/capitol-theme/images/panorama/drag-icon.png),auto');

    // compass

    var compass = $('.compass').find('.pointer');
    // var compassCenter = [compass.offset().left + compass.width()/2, compass.offset().top + compass.height()];

    // initial angle for compass
    var target = $('.panorama-container');
    adjustCompass(compass, target);

    // watch for changes
    target.watch('marginLeft', function() {
      adjustCompass(compass, $(this));
    });
    
  } else {
    $('.panorama-img').css({'height' : '600px'});
  }

function adjustCompass(compass, target) {
  var compass = compass;
  var compassCenter = {x: compass.offset().left + compass.width()/2, y: compass.offset().top + compass.height()};

  var points = generatePoints(target);

  var closest = getCloserPoint(compassCenter, points);

  var angle = Math.atan2(closest.x - compassCenter.x, -(closest.y - compassCenter.y) )*(180/Math.PI);

  compass.css({ "-webkit-transform": 'rotate(' + angle + 'deg)'});    
  compass.css({ '-moz-transform': 'rotate(' + angle + 'deg)'});
  compass.css({ 'transform': 'rotate(' + angle + 'deg)'});
}

  function getCloserPoint(reference, points) {
    var closestPoint = points[0];
    var closestValue = Math.sqrt(Math.pow(closestPoint.x, 2) + Math.pow(closestPoint.y, 2));

    for (var i = 1; i >= points.length; i++) {
      var z = Math.sqrt(Math.pow(points[i].x, 2) + Math.pow(points[i].y, 2));
      if(z < closestValue) {
        closestPoint = points[i];
        closestValue = z;
      }
    };

    return closestPoint;

  }

  function generatePoints(target) {
    var points = [];
    var common = {width: target.width(), height: target.height()};
    var windowWidth = $(window).width()

    points.push({
      x: target.offset().left + (windowWidth) / 2,
      y: target.offset().top
    });

    points.push({
      x: (target.offset().left + common.width),
      y: target.offset().top
    });

    return points;
  }

});