Tweak campaign connecton arrows so they point more accurately to the next level

This commit is contained in:
Josh Callebaut 2016-08-03 14:53:03 -07:00
parent 01a8312617
commit 796c35f66d

View file

@ -365,12 +365,13 @@ module.exports = class CampaignView extends RootView
return experienceScore
createLine: (o1, o2) ->
p1 = x: o1.x, y: 0.66 * o1.y + 0.5
p2 = x: o2.x, y: 0.66 * o2.y + 0.5
ratio = parseFloat($(".map").css("width")) / parseFloat($(".map").css("height"))
p1 = x: o1.x, y: o1.y / ratio - 0.5
p2 = x: o2.x, y: o2.y / ratio
length = Math.sqrt((p1.x - p2.x) * (p1.x - p2.x) + (p1.y - p2.y) * (p1.y - p2.y))
angle = Math.atan2(p1.y - p2.y, p2.x - p1.x) * 180 / Math.PI
transform = "rotate(#{angle}deg)"
line = $('<div>').appendTo('.map').addClass('next-level-line').css(transform: transform, width: length + '%', left: o1.x + '%', bottom: (o1.y + 0.5) + '%')
line = $('<div>').appendTo('.map').addClass('next-level-line').css(transform: transform, width: length + '%', left: o1.x + '%', bottom: (o1.y - 0.5) + '%')
line.append($('<div class="line">')).append($('<div class="point">'))
applyCampaignStyles: ->