Add tooltip to Om DOM components showing displayname and contents of cursor and local state

tooltip-om.clj

;;; To add a tooltip, write (tooltip {:className "foo"}) instead of #js {:className "foo"}
;;; You can simplify this and just show what you need: #js {:title (pr-str (om/...))}.

;;; testfoo.core (cljs)

(ns testfoo.core
  (:require-macros [testfoo.macros :refer (tooltip)])
  (:require [om.core :as om :include-macros true]
            [om.dom :as dom :include-macros true]
            [cljs.reader :as reader]))

(enable-console-print!)

(def app-state (atom {:text "Hello world!"}))

(defn tt [n m cursor attrs]
  (clj->js
   (merge attrs
          {:title (pr-str
                   {:displayname n
                    :local-state m
                    :cursor cursor})})))

(defn bar-component
  [cursor owner]
  (.log js/console owner)
  (reify
    om/IDisplayName
    (display-name [_]
      "Displayname")
    om/IRender
    (render [_]
      (dom/p (tooltip {}) "Hello"
             ))))

(defn baz-component
  [cursor owner]
  (om/component
   (dom/p (tooltip nil) "baz")))

(defn foo-component
  [cursor owner]
  (reify
    om/IInitState
    (init-state [_]
      {:foo 1})
    om/IRenderState
    (render-state [_ {:keys [] :as m}]
      (dom/div
       (tooltip {:className "foo"})
       (dom/p nil "Hello, I'm div")
       (om/build bar-component (:bar cursor)
                 {:state {:apple "not a pear"}})
       (om/build baz-component (:bar cursor))))))

(om/root
 (fn [app owner]
   (reify om/IRender
     (render [_]
       (om/build foo-component app))))
 app-state
 {:target (. js/document (getElementById "app"))})

;;; testfoo.macros (clj)

(ns testfoo.macros)

(defmacro tooltip [attrs & cursor-name]
  (let [foo# (or (first cursor-name) 'cursor)]
    `(~'tt
      ~'(.getDisplayName owner)
      ~'(om/get-state owner)
      ~foo#
      ~attrs)))