Restore the location sort for annotations

h/static/scripts/annotator/guest.coffee

@@ -167,11 +167,17 @@ module.exports = class Guest extends Annotator
         return new Promise(raf).then ->
           range = Annotator.Range.sniff(anchor.range)
           normedRange = range.normalize(self.element[0])
-          anchor.highlights = highlighter.highlightRange(normedRange)
+          highlights = highlighter.highlightRange(normedRange)
+          rect = highlighter.getBoundingClientRect(highlights)
+          anchor.highlights = highlights
+          anchor.pos =
+            left: rect.left + window.scrollX
+            top: rect.top + window.scrollY
           return anchor
       return anchor
 
     sync = (anchors) ->
+      annotation.$anchors = ({pos} for {pos} in anchors)
       annotation.$orphan = anchors.length > 0
       for anchor in anchors
         if anchor.range?

h/static/scripts/annotator/highlighter.coffee

@@ -27,3 +27,17 @@ exports.highlightRange = (normedRange, cssClass='annotator-hl') ->
 exports.removeHighlights = (highlights) ->
   for h in highlights when h.parentNode?
     $(h).replaceWith(h.childNodes)
+
+
+# Get the bounding client rectangle of a collection in viewport coordinates.
+# Unfortunately, Chrome has issues[1] with Range.getBoundingClient rect or we
+# could just use that.
+# [1] https://code.google.com/p/chromium/issues/detail?id=324437
+exports.getBoundingClientRect = (collection) ->
+  # Reduce the client rectangles of the highlights to a bounding box
+  rects = collection.map((n) -> n.getBoundingClientRect())
+  return rects.reduce (acc, r) ->
+    top: Math.min(acc.top, r.top)
+    left: Math.min(acc.left, r.left)
+    bottom: Math.max(acc.bottom, r.bottom)
+    right: Math.max(acc.right, r.right)

h/static/scripts/annotator/plugin/bucket-bar.coffee

@@ -3,19 +3,7 @@ raf = require('raf')
 Annotator = require('annotator')
 $ = Annotator.$
 
-
-# Get the bounding client rectangle of a collection in viewport coordinates.
-# Unfortunately, Chrome has issues[1] with Range.getBoundingClient rect or we
-# could just use that.
-# [1] https://code.google.com/p/chromium/issues/detail?id=324437
-getBoundingClientRect = (collection) ->
-  # Reduce the client rectangles of the highlights to a bounding box
-  rects = collection.map((n) -> n.getBoundingClientRect())
-  return rects.reduce (acc, r) ->
-    top: Math.min(acc.top, r.top)
-    left: Math.min(acc.left, r.left)
-    bottom: Math.max(acc.bottom, r.bottom)
-    right: Math.max(acc.right, r.right)
+highlighter = require('../highlighter')
 
 
 # Scroll to the next closest anchor off screen in the given direction.
@@ -26,7 +14,7 @@ scrollToClosest = (anchors, direction) ->
       return acc
 
     {start, next} = acc
-    rect = getBoundingClientRect(anchor.highlights)
+    rect = highlighter.getBoundingClientRect(anchor.highlights)
 
     # Ignore if it's not in the right direction.
     if (dir is 1 and rect.top >= 0)
@@ -123,7 +111,7 @@ class Annotator.Plugin.BucketBar extends Annotator.Plugin
       unless anchor.highlights?.length
         return points
 
-      rect = getBoundingClientRect(anchor.highlights)
+      rect = highlighter.getBoundingClientRect(anchor.highlights)
       x = rect.top
       h = rect.bottom - rect.top
 

h/static/scripts/app-controller.coffee

@@ -74,7 +74,11 @@ module.exports = class AppController
       predicate = switch name
         when 'Newest' then ['-!!message', '-message.updated']
         when 'Oldest' then ['-!!message',  'message.updated']
-        when 'Location' then ['-!!message', 'message.target[0].pos.top']
+        when 'Location' then [
+          '-!!message'
+          'message.$anchors[0].pos.top'
+          'message.$anchors[0].pos.left'
+        ]
       $scope.sort = {name, predicate}
 
     $scope.$watch (-> auth.user), (newVal, oldVal) ->

h/static/scripts/cross-frame.coffee

@@ -20,7 +20,10 @@ module.exports = class CrossFrame
       new Discovery($window, options)
 
     createAnnotationSync = ->
-      whitelist = ['$highlight', '$orphan', 'target', 'document', 'uri']
+      whitelist = [
+        '$anchors', '$highlight', '$orphan',
+        'target', 'document', 'uri'
+      ]
       options =
         formatter: (annotation) ->
           formatted = {}