December 1st, 2020

• This is an "Orphan" page. Its core content has not been shared: what you see below is a loose collection of pages and page snippets that mention this page, as well as snippets of this page that were quoted elsewhere.

• {{roam/cljs-render:

  (ns async-stuff
    (:require
     [datascript.core :as d]
     [roam.datascript.reactive :as dr]))
  
  (defn test [{:keys [block-uid]} & args]
    (let [*b (dr/f-entity d/touch [:block/uid block-uid])]
      (js/console.log args)
      (fn [& args]
        [:div "helo"
          (pr-str @*b)
          (with-out-str (prn @*b))])))
  
  

  a b c}}

• {{TODO}} Put this at the top of your file

  • Code

    • (ns starting-point-for-custom-roam
        (:require
         [reagent.core :as r]
         [datascript.core :as d]
         [roam.datascript.reactive :as dr]))
      

    • (defn *page-with-children-by-node-title [name] 
          (dr/pull '[{:block/children ...}
                     :block/string 
                     :block/uid 
                     :block/props
                    ]
                   [:node/title name])
        )
      

    • (defn block-with-children-by-uid [name] 
          (dr/pull '[
                     {:block/children ...}
                     {:block/path ...}
                     :block/string 
                     :block/uid 
                     :block/props
                    ]
                   [:block/uid name])
        )
      

    • 
      (defn all-children [ent]
          (:block/children ent)
        )
      
      (defn controlled-input [my-local-string]
         [:div 
                    "My local string is controlled by the input" 
                    [:li  @my-local-string]
                    
                   [:input {:value @my-local-string
                            :on-change 
                            (fn [event] 
                              (reset! my-local-string 
                                   (.. event -target -value)))}]
                   
                   ]
        )
      
      (declare color)
      
      (defn counter [my-local-number]
                     [:div "I have been clicked"
                   [:button {:on-click 
                             (fn [e] (swap! my-local-number inc))}
                     @my-local-number]
                    " times"]
        )
      
      

    • 
      (def color ["#2EE115" "rgb(0,244,255)" "#F44336"])
      
      ``` [*](((oYL_2lm6B)))
      

    • (defn all-descendents-as-cards [block-entity]
      [:div 
          (doall (for [block (rest (tree-seq :block/uid :block/children block-entity))]
                [:button.bp3-card
                  {:style {:background-color (rand-nth color)}
                   :on-click (fn [e] (js/alert (:block/uid block)))}
                 (:block/string block)]))
              ]
      )
      ``` [*](((Fv9oJp3HV)))
      

    • 
      
      (defn test [{:keys [block-uid]} & args]
        (let [*my-children (dr/pull '[{:block/children ...} 
                            :block/string 
                            :block/uid] 
                                    [:block/uid block-uid])]
          (js/console.log args)
          (fn [& args]
            [:div 
              (doall (for [block (rest (tree-seq :block/uid :block/children @*my-children))]
                [:button.bp3-card
                  {:style {:background-color (rand-nth color)}
                   :on-click (fn [e] (js/alert (:block/uid block)))}
                 (:block/string block)]))
              ])))
      
      (defn test2 [{:keys [block-uid]} & args]
        (let [*my-children (dr/pull '[{:block/_refs ...}
                                      {:block/children ...} 
                            :block/string 
                            :block/uid] 
                            [:node/title "TODO"])]
          (js/console.log args)
          (fn [& args]
            [:div 
              (doall (for [block (rest (tree-seq :block/uid :block/_refs @*my-children))]
                [:button.bp3-card.green
                  {:style {:background-color (rand-nth color)}
                   :on-click (fn [e] (js/alert (:block/uid block)))}
                 (:block/string block)]))
              ])))
      

    • (defn page-by-node-title [name] 
          (dr/pull '[{:block/_refs ...}
                     {:block/refs ...}
                     {:block/children ...}
                     {:block/path ...}
                     :block/string 
                     :block/uid 
                     :block/props
                    ]
                   [:node/title name])
        )
      ``` [*](((N5iOmzEp3)))
      

    • 
      (defn my-view [{:keys [:block/uid] :as this-block}]     
        (let [my-local-string (r/atom "hello")
                my-local-number (r/atom 0)]
            (fn [this-block]
                  [:div.bp3-card 
                   "I am a div"
      
                   ""
                   (pr-str color)
                   (for [x (range 2)]
                   [counter my-local-number])
                   [controlled-input my-local-string]
                   [controlled-input my-local-string]])))
      
      
      (defn last-render [{:keys [:block/uid] :as this-block}]     
        (let [my-local-string (r/atom "hello")
                my-local-number (r/atom 0)]
            (fn [this-block]
                  [:div.bp3-card 
                   "I am a div"
      
                   ""
                   [all-descendents-as-cards 
                    @(*page-with-children-by-node-title "roamhacker")]
                  ])))
      
      

    • (defn random-n-refs [n ent]
          (take n (set (:block/_refs ent))
        ))
      

    • (defn *pull-refs [block-uid]
          (dr/pull '[{:block/_refs ...}
                     :node/title
                     :block/string
                     :block/uid]
                   block-uid)
          
        )
      

    • 
      (defn show-refs [component n x]
      [:div  
       (doall (for [y (take @n (:block/_refs @x))]
        [component y]))]
        )
      
      (defn my-item [data]
          [:div.bp3-card (:block/string data)]
        )
      
      (defn my-random-generator [{:keys [:block/uid] :as this-block} n v]     
        (let [my-local-string (r/atom v)
                my-local-number (r/atom (js/parseInt n))]
            (fn [this-block n v]
                  [:div.bp3-card 
                   "I am a div"
      
                   ""
                   (pr-str v)
                   [counter my-local-number]
                   [controlled-input my-local-string]
                  
                   [show-refs my-item 
                    my-local-number 
                    (*pull-refs [:node/title @my-local-string])]
                   ])))
      
      

  • r/atom gives you a local variable
  • Final function in your namespace is what gets called with roam-render
    • {{roam/render:

      
      (defn my-view [{:keys [:block/uid] :as this-block}]     
        (let [my-local-string (r/atom "hello")
                my-local-number (r/atom 0)]
            (fn [this-block]
                  [:div.bp3-card 
                   "I am a div"
      
                   ""
                   (pr-str color)
                   (for [x (range 2)]
                   [counter my-local-number])
                   [controlled-input my-local-string]
                   [controlled-input my-local-string]])))
      
      
      (defn last-render [{:keys [:block/uid] :as this-block}]     
        (let [my-local-string (r/atom "hello")
                my-local-number (r/atom 0)]
            (fn [this-block]
                  [:div.bp3-card 
                   "I am a div"
      
                   ""
                   [all-descendents-as-cards 
                    @(*page-with-children-by-node-title "roamhacker")]
                  ])))
      
      

      }}
      • a
      • {{TODO}} Show how to hide all child blocks
      • {{TODO}} Inline components?

• Code

  • (ns starting-point-for-custom-roam
      (:require
       [reagent.core :as r]
       [datascript.core :as d]
       [roam.datascript.reactive :as dr]))
    

  • (defn *page-with-children-by-node-title [name] 
        (dr/pull '[{:block/children ...}
                   :block/string 
                   :block/uid 
                   :block/props
                  ]
                 [:node/title name])
      )
    

  • (defn block-with-children-by-uid [name] 
        (dr/pull '[
                   {:block/children ...}
                   {:block/path ...}
                   :block/string 
                   :block/uid 
                   :block/props
                  ]
                 [:block/uid name])
      )
    

  • 
    (defn all-children [ent]
        (:block/children ent)
      )
    
    (defn controlled-input [my-local-string]
       [:div 
                  "My local string is controlled by the input" 
                  [:li  @my-local-string]
                  
                 [:input {:value @my-local-string
                          :on-change 
                          (fn [event] 
                            (reset! my-local-string 
                                 (.. event -target -value)))}]
                 
                 ]
      )
    
    (declare color)
    
    (defn counter [my-local-number]
                   [:div "I have been clicked"
                 [:button {:on-click 
                           (fn [e] (swap! my-local-number inc))}
                   @my-local-number]
                  " times"]
      )
    
    

  • 
    (def color ["#2EE115" "rgb(0,244,255)" "#F44336"])
    
    ``` [*](((oYL_2lm6B)))
    

  • (defn all-descendents-as-cards [block-entity]
    [:div 
        (doall (for [block (rest (tree-seq :block/uid :block/children block-entity))]
              [:button.bp3-card
                {:style {:background-color (rand-nth color)}
                 :on-click (fn [e] (js/alert (:block/uid block)))}
               (:block/string block)]))
            ]
    )
    ``` [*](((Fv9oJp3HV)))
    

  • 
    
    (defn test [{:keys [block-uid]} & args]
      (let [*my-children (dr/pull '[{:block/children ...} 
                          :block/string 
                          :block/uid] 
                                  [:block/uid block-uid])]
        (js/console.log args)
        (fn [& args]
          [:div 
            (doall (for [block (rest (tree-seq :block/uid :block/children @*my-children))]
              [:button.bp3-card
                {:style {:background-color (rand-nth color)}
                 :on-click (fn [e] (js/alert (:block/uid block)))}
               (:block/string block)]))
            ])))
    
    (defn test2 [{:keys [block-uid]} & args]
      (let [*my-children (dr/pull '[{:block/_refs ...}
                                    {:block/children ...} 
                          :block/string 
                          :block/uid] 
                          [:node/title "TODO"])]
        (js/console.log args)
        (fn [& args]
          [:div 
            (doall (for [block (rest (tree-seq :block/uid :block/_refs @*my-children))]
              [:button.bp3-card.green
                {:style {:background-color (rand-nth color)}
                 :on-click (fn [e] (js/alert (:block/uid block)))}
               (:block/string block)]))
            ])))
    

  • (defn page-by-node-title [name] 
        (dr/pull '[{:block/_refs ...}
                   {:block/refs ...}
                   {:block/children ...}
                   {:block/path ...}
                   :block/string 
                   :block/uid 
                   :block/props
                  ]
                 [:node/title name])
      )
    ``` [*](((N5iOmzEp3)))
    

  • 
    (defn my-view [{:keys [:block/uid] :as this-block}]     
      (let [my-local-string (r/atom "hello")
              my-local-number (r/atom 0)]
          (fn [this-block]
                [:div.bp3-card 
                 "I am a div"
    
                 ""
                 (pr-str color)
                 (for [x (range 2)]
                 [counter my-local-number])
                 [controlled-input my-local-string]
                 [controlled-input my-local-string]])))
    
    
    (defn last-render [{:keys [:block/uid] :as this-block}]     
      (let [my-local-string (r/atom "hello")
              my-local-number (r/atom 0)]
          (fn [this-block]
                [:div.bp3-card 
                 "I am a div"
    
                 ""
                 [all-descendents-as-cards 
                  @(*page-with-children-by-node-title "roamhacker")]
                ])))
    
    

  • (defn random-n-refs [n ent]
        (take n (set (:block/_refs ent))
      ))
    

  • (defn *pull-refs [block-uid]
        (dr/pull '[{:block/_refs ...}
                   :node/title
                   :block/string
                   :block/uid]
                 block-uid)
        
      )
    

  • 
    (defn show-refs [component n x]
    [:div  
     (doall (for [y (take @n (:block/_refs @x))]
      [component y]))]
      )
    
    (defn my-item [data]
        [:div.bp3-card (:block/string data)]
      )
    
    (defn my-random-generator [{:keys [:block/uid] :as this-block} n v]     
      (let [my-local-string (r/atom v)
              my-local-number (r/atom (js/parseInt n))]
          (fn [this-block n v]
                [:div.bp3-card 
                 "I am a div"
    
                 ""
                 (pr-str v)
                 [counter my-local-number]
                 [controlled-input my-local-string]
                
                 [show-refs my-item 
                  my-local-number 
                  (*pull-refs [:node/title @my-local-string])]
                 ])))
    
    

• (ns starting-point-for-custom-roam
    (:require
     [reagent.core :as r]
     [datascript.core :as d]
     [roam.datascript.reactive :as dr]))
  

• (defn *page-with-children-by-node-title [name] 
      (dr/pull '[{:block/children ...}
                 :block/string 
                 :block/uid 
                 :block/props
                ]
               [:node/title name])
    )
  

• (defn block-with-children-by-uid [name] 
      (dr/pull '[
                 {:block/children ...}
                 {:block/path ...}
                 :block/string 
                 :block/uid 
                 :block/props
                ]
               [:block/uid name])
    )
  

• 
  (defn all-children [ent]
      (:block/children ent)
    )
  
  (defn controlled-input [my-local-string]
     [:div 
                "My local string is controlled by the input" 
                [:li  @my-local-string]
                
               [:input {:value @my-local-string
                        :on-change 
                        (fn [event] 
                          (reset! my-local-string 
                               (.. event -target -value)))}]
               
               ]
    )
  
  (declare color)
  
  (defn counter [my-local-number]
                 [:div "I have been clicked"
               [:button {:on-click 
                         (fn [e] (swap! my-local-number inc))}
                 @my-local-number]
                " times"]
    )
  
  

• 
  (def color ["#2EE115" "rgb(0,244,255)" "#F44336"])
  
  ``` [*](((oYL_2lm6B)))
  

• (defn all-descendents-as-cards [block-entity]
  [:div 
      (doall (for [block (rest (tree-seq :block/uid :block/children block-entity))]
            [:button.bp3-card
              {:style {:background-color (rand-nth color)}
               :on-click (fn [e] (js/alert (:block/uid block)))}
             (:block/string block)]))
          ]
  )
  ``` [*](((Fv9oJp3HV)))
  

• 
  
  (defn test [{:keys [block-uid]} & args]
    (let [*my-children (dr/pull '[{:block/children ...} 
                        :block/string 
                        :block/uid] 
                                [:block/uid block-uid])]
      (js/console.log args)
      (fn [& args]
        [:div 
          (doall (for [block (rest (tree-seq :block/uid :block/children @*my-children))]
            [:button.bp3-card
              {:style {:background-color (rand-nth color)}
               :on-click (fn [e] (js/alert (:block/uid block)))}
             (:block/string block)]))
          ])))
  
  (defn test2 [{:keys [block-uid]} & args]
    (let [*my-children (dr/pull '[{:block/_refs ...}
                                  {:block/children ...} 
                        :block/string 
                        :block/uid] 
                        [:node/title "TODO"])]
      (js/console.log args)
      (fn [& args]
        [:div 
          (doall (for [block (rest (tree-seq :block/uid :block/_refs @*my-children))]
            [:button.bp3-card.green
              {:style {:background-color (rand-nth color)}
               :on-click (fn [e] (js/alert (:block/uid block)))}
             (:block/string block)]))
          ])))
  

• (defn page-by-node-title [name] 
      (dr/pull '[{:block/_refs ...}
                 {:block/refs ...}
                 {:block/children ...}
                 {:block/path ...}
                 :block/string 
                 :block/uid 
                 :block/props
                ]
               [:node/title name])
    )
  ``` [*](((N5iOmzEp3)))
  

• 
  (defn my-view [{:keys [:block/uid] :as this-block}]     
    (let [my-local-string (r/atom "hello")
            my-local-number (r/atom 0)]
        (fn [this-block]
              [:div.bp3-card 
               "I am a div"
  
               ""
               (pr-str color)
               (for [x (range 2)]
               [counter my-local-number])
               [controlled-input my-local-string]
               [controlled-input my-local-string]])))
  
  
  (defn last-render [{:keys [:block/uid] :as this-block}]     
    (let [my-local-string (r/atom "hello")
            my-local-number (r/atom 0)]
        (fn [this-block]
              [:div.bp3-card 
               "I am a div"
  
               ""
               [all-descendents-as-cards 
                @(*page-with-children-by-node-title "roamhacker")]
              ])))
  
  

• (defn random-n-refs [n ent]
      (take n (set (:block/_refs ent))
    ))
  

• (defn *pull-refs [block-uid]
      (dr/pull '[{:block/_refs ...}
                 :node/title
                 :block/string
                 :block/uid]
               block-uid)
      
    )
  

• 
  (defn show-refs [component n x]
  [:div  
   (doall (for [y (take @n (:block/_refs @x))]
    [component y]))]
    )
  
  (defn my-item [data]
      [:div.bp3-card (:block/string data)]
    )
  
  (defn my-random-generator [{:keys [:block/uid] :as this-block} n v]     
    (let [my-local-string (r/atom v)
            my-local-number (r/atom (js/parseInt n))]
        (fn [this-block n v]
              [:div.bp3-card 
               "I am a div"
  
               ""
               (pr-str v)
               [counter my-local-number]
               [controlled-input my-local-string]
              
               [show-refs my-item 
                my-local-number 
                (*pull-refs [:node/title @my-local-string])]
               ])))
  
  

• r/atom gives you a local variable

• Final function in your namespace is what gets called with roam-render

  • {{roam/render:

    
    (defn my-view [{:keys [:block/uid] :as this-block}]     
      (let [my-local-string (r/atom "hello")
              my-local-number (r/atom 0)]
          (fn [this-block]
                [:div.bp3-card 
                 "I am a div"
    
                 ""
                 (pr-str color)
                 (for [x (range 2)]
                 [counter my-local-number])
                 [controlled-input my-local-string]
                 [controlled-input my-local-string]])))
    
    
    (defn last-render [{:keys [:block/uid] :as this-block}]     
      (let [my-local-string (r/atom "hello")
              my-local-number (r/atom 0)]
          (fn [this-block]
                [:div.bp3-card 
                 "I am a div"
    
                 ""
                 [all-descendents-as-cards 
                  @(*page-with-children-by-node-title "roamhacker")]
                ])))
    
    

    }}
    • a
    • {{TODO}} Show how to hide all child blocks
    • {{TODO}} Inline components?

• {{roam/render:

  
  (defn my-view [{:keys [:block/uid] :as this-block}]     
    (let [my-local-string (r/atom "hello")
            my-local-number (r/atom 0)]
        (fn [this-block]
              [:div.bp3-card 
               "I am a div"
  
               ""
               (pr-str color)
               (for [x (range 2)]
               [counter my-local-number])
               [controlled-input my-local-string]
               [controlled-input my-local-string]])))
  
  
  (defn last-render [{:keys [:block/uid] :as this-block}]     
    (let [my-local-string (r/atom "hello")
            my-local-number (r/atom 0)]
        (fn [this-block]
              [:div.bp3-card 
               "I am a div"
  
               ""
               [all-descendents-as-cards 
                @(*page-with-children-by-node-title "roamhacker")]
              ])))
  
  

  }}
  • a
  • {{TODO}} Show how to hide all child blocks
  • {{TODO}} Inline components?

• a

• {{TODO}} Show how to hide all child blocks

• {{TODO}} Inline components?