       (let [{:keys [programmes projects active-components]} tables
             history (om/get-shared owner :history)]
         (html
-         [:div {:id "projects" :class (if (:projects active-components) "hidden" "")}
+         [:div {:id "projects-div"}
           [:h2 "Projects"]
           [:ul {:class "breadcrumb"}
            [:li [:a
                  {:onClick (fn projects-div-history-change
                              [_ _]
-                             (history/update-token-ids! history :programmes nil))}
+                             (history/update-token-ids! history :programmes nil)
+                             (fixed-scroll-to-element "programmes-div"))}
                  (title-for programmes)]]]
           (om/build table projects {:opts {:histkey :projects}})])))))
 

                         (merge {:response-format :json :keywords? true}))))))
    (recur)))


(defn selected-range-change
  [selected selection-key {{ids :ids search :search} :args}]
  (let [new-selected (get ids selection-key)]

      (let [programmes (-> tables :programmes)]
        (html
         ;; hide div if we've already chosen something
         [:div {:id "programmes-div"}
          [:h1 "Programmes"]
          (om/build programmes-table programmes)])))))

;; our banner is 50px so we need to tweak the scrolling
(defn fixed-scroll-to-element [element]
  (-> (.getElementById js/document element)
                                    .scrollIntoView)
  (.scrollBy js/window 0 -50))

(defn programmes-table [cursor owner]
  (reify
