gistfile1.txt

//set hook frame positions
var show_frames = false;
var frame_level = 0;

function show_hook_frames(){
  $jQ.each($("[data-hook]"), function(i, hook){
    $jQ(hook).popover('disable');
  });

  if(show_frames){
    $jQ.each($("[data-hook]"), function(i, hook){
      var hooks = $jQ(hook).parents().filter(function(i,p) { return $jQ(p).attr("data-hook")!=undefined });
      if(hooks.length == frame_level){
        var hook = $jQ(hook);
        if(hook.attr('id')!="" || hook.attr('data-hook')!=""){
          hook.attr('data-layer', frame_level);

          hook.addClass('spraycan_hook_frame');

          hook.popover({
            title: function(){
              var hook_name = $jQ(this).attr('data-hook');
              if(hook_name==""){
                hook_name = $jQ(this).attr('id');
              }

            return hook_name}, 

            content: function(){ 
              var hook_name = $jQ(this).attr('data-hook');
              if(hook_name==""){
                hook_name = $jQ(this).attr('id');
              }

              return '<a href="/spraycan#view_override?new=' + hook_name + '" target="_top">Add New Override</a>';

            }, 

            delayOut: 2400,

            html: true,

            animate: true,

            //ensures popover is visible
            placement: function (tip, element) {
              $jQ.each( $jQ('div.popover'), function(i, popover){
                if(popover!=tip){
                  $jQ(popover).hide();
                }
              });

              var $element = $(element)
                , pos = $.extend({}, $element.offset(), {
                    width: element.offsetWidth
                  , height: element.offsetHeight
                  })
                , actualWidth = tip.offsetWidth
                , actualHeight = tip.offsetHeight
                , boundTop = $(document).scrollTop()
                , boundLeft = $(document).scrollLeft()
                , boundRight = boundLeft + $(window).width()
                , boundBottom = boundTop + $(window).height()
                , elementAbove = {
                    top: pos.top - actualHeight - this.options.offset
                  , left: pos.left + pos.width / 2 - actualWidth / 2
                  }
                , elementBelow = {
                    top: pos.top + pos.height + this.options.offset
                  , left: pos.left + pos.width / 2 - actualWidth / 2
                  }
                , elementLeft = {
                    top: pos.top + pos.height / 2 - actualHeight / 2
                  , left: pos.left - actualWidth - this.options.offset
                  }
                , elementRight = {
                    top: pos.top + pos.height / 2 - actualHeight / 2
                  , left: pos.left + pos.width + this.options.offset
                  }
                , above = isWithinBounds(elementAbove)
                , below = isWithinBounds(elementBelow)
                , left = isWithinBounds(elementLeft)
                , right = isWithinBounds(elementRight)

                console.log(boundTop, elementAbove.top)


                function isWithinBounds (elementPosition) {
                  return boundTop < elementPosition.top
                    && boundLeft < elementPosition.left
                    && boundRight > (elementPosition.left + actualWidth)
                    && boundBottom > (elementPosition.top + actualHeight)
                }

                return above ? 'above' : below ? 'below' : left ? 'left' : right ? 'right' : 'below'
            } });

            hook.popover('enable');


        }
      }
    });
  }else{
    $jQ('.spraycan_hook_frame').removeClass('spraycan_hook_frame');

  }
}

function hook_zoom(in_or_out){
  show_frames = true;
  var current_level = frame_level;

  if(in_or_out=="in"){
    frame_level = current_level + 1;
  }else{
    frame_level = current_level - 1;
  }

  if(frame_level!=current_level){
    $jQ('.spraycan_hook_frame').removeClass('spraycan_hook_frame');

    show_hook_frames();

    //check we haven't zoomed to far in or out, 
    //undo if we did
    if($jQ('.spraycan_hook_frame').length==0){
      frame_level = current_level;

      show_hook_frames();
    }
  }
}

$jQ(function() {
  if(top.Spraycan!=undefined){
    show_hook_frames();
  }
});

//show activity while iframe is loading
window.onbeforeunload = function() {
  if(top.Spraycan!=undefined){
    top.$('#busy').show();
  }
}