Hi Manny,

My last take on using latest material-ui (0.8.0) with latest om and react
that required to setting the theme is something like below:

(def ^:dynamic *mui-theme*
  (.getCurrentTheme (js/MaterialUI.Styles.ThemeManager.)))

(defn mui-root [component]
  (fn [data _owner]
    (reify
      om/IDisplayName
      (display-name [_] "muiroot")
      om/IRender
      (render [_]
        (let [ctor (js/React.createFactory
                    (js/React.createClass
                     #js
                     {:getDisplayName (fn  [] "muiroot-context")
                      :childContextTypes #js {:muiTheme
js/React.PropTypes.object}
                      :getChildContext (fn  [] #js {:muiTheme *mui-theme*})
                      :render (fn [] (component data))}))]   ;; <--- THIS
PART IS THAT MAKE IT WORK
          (ctor. nil))))))

(defn rce
  ([type] (rce type {} nil))
  ([type opts & childs]
   (js/React.createElement type (clj->js opts) childs)))

(defcomponentk login [data owner]
  (did-mount
   [_]
   (let [c (aget (.-refs owner) "username")]
     (.focus c)))
  (render
   [_]
   (dom/div
    {:class "login block-group"}
    (dom/h3 {:class "block"} "Member Login")
    (dom/div
     {:class "block"}
     (dom/form
      {}
      (rce js/MaterialUI.TextField
           {:ref "username"
            :floatingLabelText "User Name"
            :className "login-form-group"})
      (rce js/MaterialUI.TextField
           {:floatingLabelText "Organization"
            :className "login-form-group"})
      (rce js/MaterialUI.TextField
           {:type "password"
            :floatingLabelText "Password"
            :className "login-form-group"})
      (dom/br {:style {:line-height "1em"}})
      (rce js/MaterialUI.RaisedButton
           {:type "submit"
            :primary true
            :label "Sign in"}))))))

...

(defn main []
  (om/root
   (mui-root ->login)
   app-state
   {:target (. js/document getElementById "app")}))



To my limited knowledge, as of react 0.13.3, "context" can be accessed by
child by owner-based, not parent-based. This will planned to be changed in
react 0.14.

With owner-based, mui component childs have to be owned (--*or rendered*)
in react class that specify childContextTypes and getChildContext.


Best regards,
Ridho.



On Thu, Jun 11, 2015 at 4:40 AM, Manny Singh <manny.fresh.1...@gmail.com>
wrote:

> This is great but can anyone tell me the best way of setting the theme?
>
> Thanks
>
> On Tuesday, 20 January 2015 23:55:10 UTC, Timothy Washington  wrote:
> > Bloody hell, just tried it out. Working like a charm (at least for a
> simple text input). I'm even using mui/input mixed in with sablono. Tip: If
> you get the error, Uncaught ReferenceError: MaterialUI is not defined, make
> sure material.js (where window.MaterialUI = MaterialUI is assigned) is
> getting included successfully.
> >
> >
> >
> >
> >   (reify
> >
> >     om/IRenderState
> >
> >     (render-state [owner state]
> >
> >
> >
> >
> >       (sablono.core/html
> >
> >         ...
> >
> >         [:div {:horizontal true :layout true}
> >
> >          (dom/div nil "thing")     ;; ok
> >
> >          (mui/input {:placeholder "Placeholder" :description "I am a
> description"})]     ;; ok
> >
> >
> >
> >
> >         ...)))
> >
> >
> >
> >
> > This is awesome. Cheers.
> >
> >
> >
> >
> >
> >
> > Tim
> >
> >
> >
> > On Sat, Jan 17, 2015 at 11:04 PM, Taylor Sando <taylor...@gmail.com>
> wrote:
> > I made a clojars release and put it up on github:
> >
> >
> >
> > https://github.com/taylorSando/om-material-ui
>
> --
> Note that posts from new members are moderated - please be patient with
> your first post.
> ---
> You received this message because you are subscribed to the Google Groups
> "ClojureScript" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to clojurescript+unsubscr...@googlegroups.com.
> To post to this group, send email to clojurescript@googlegroups.com.
> Visit this group at http://groups.google.com/group/clojurescript.
>

-- 
Note that posts from new members are moderated - please be patient with your 
first post.
--- 
You received this message because you are subscribed to the Google Groups 
"ClojureScript" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to clojurescript+unsubscr...@googlegroups.com.
To post to this group, send email to clojurescript@googlegroups.com.
Visit this group at http://groups.google.com/group/clojurescript.

Reply via email to