Use the crossframe to show/hide the sidebar

src/annotator/guest.coffee

@@ -39,6 +39,8 @@ module.exports = class Guest extends Delegator
     ".annotator-hl click":               "onHighlightClick"
     ".annotator-hl mouseover":           "onHighlightMouseover"
     ".annotator-hl mouseout":            "onHighlightMouseout"
+    "click":                             "onElementClick"
+    "touchstart":                        "onElementTouchStart"
 
   options:
     Document: {}
@@ -336,6 +338,7 @@ module.exports = class Guest extends Delegator
     targets.then(-> self.publish('beforeAnnotationCreated', [annotation]))
     targets.then(-> self.anchor(annotation))
 
+    @crossframe?.call('showSidebar') unless annotation.$highlight
     annotation
 
   createHighlight: ->
@@ -374,6 +377,7 @@ module.exports = class Guest extends Delegator
   showAnnotations: (annotations) ->
     tags = (a.$tag for a in annotations)
     @crossframe?.call('showAnnotations', tags)
+    @crossframe?.call('showSidebar')
 
   toggleAnnotationSelection: (annotations) ->
     tags = (a.$tag for a in annotations)
@@ -421,6 +425,21 @@ module.exports = class Guest extends Delegator
     else
       this.showAnnotations annotations
 
+  # Moved from Sidebar.coffee to Guest
+  onElementClick: (event) ->
+    if !@selectedTargets?.length
+      @crossframe?.call('hideSidebar')
+
+  # Moved from Sidebar.coffee to Guest
+  onElementTouchStart: (event) ->
+    # Mobile browsers do not register click events on
+    # elements without cursor: pointer. So instead of
+    # adding that to every element, we can add the initial
+    # touchstart event which is always registered to
+    # make up for the lack of click support for all elements.
+    if !@selectedTargets?.length
+      @crossframe?.call('hideSidebar')
+
   onHighlightMouseover: (event) ->
     return unless @visibleHighlights
     annotation = $(event.currentTarget).data('annotation')

src/annotator/sidebar.coffee

@@ -47,29 +47,12 @@ module.exports = class Sidebar extends Host
       @onHelpRequest = serviceConfig.onHelpRequest
 
     this._setupSidebarEvents()
-    this._setupDocumentEvents()
-
-  _setupDocumentEvents: ->
-    sidebarTrigger(document.body, => this.show())
-
-    @element.on 'click', (event) =>
-      if !@selectedTargets?.length
-        this.hide()
-
-    # Mobile browsers do not register click events on
-    # elements without cursor: pointer. So instead of
-    # adding that to every element, we can add the initial
-    # touchstart event which is always registered to
-    # make up for the lack of click support for all elements.
-    @element.on 'touchstart', (event) =>
-      if !@selectedTargets?.length
-        this.hide()
-
-    return this
 
   _setupSidebarEvents: ->
     annotationCounts(document.body, @crossframe)
 
+    @crossframe.on('showSidebar', => this.show())
+    @crossframe.on('hideSidebar', => this.hide())
     @crossframe.on(events.LOGIN_REQUESTED, =>
       if @onLoginRequest
         @onLoginRequest()
@@ -205,11 +188,3 @@ module.exports = class Sidebar extends Host
 
   isOpen: ->
     !@frame.hasClass('annotator-collapsed')
-
-  createAnnotation: (annotation = {}) ->
-    super
-    this.show() unless annotation.$highlight
-
-  showAnnotations: (annotations) ->
-    super
-    this.show()

src/sidebar/frame-sync.js

@@ -149,6 +149,15 @@ function FrameSync($rootScope, $window, Discovery, annotationUI, bridge) {
     bridge.on('sidebarOpened', function () {
       $rootScope.$broadcast('sidebarOpened');
     });
+
+    // These merely relay calls
+    bridge.on('showSidebar', function () {
+      bridge.call('showSidebar');
+    });
+
+    bridge.on('hideSidebar', function () {
+      bridge.call('hideSidebar');
+    });
   }
 
   /**