From 2713630f64c944d50cf50df8e785149dabb2c7b5 Mon Sep 17 00:00:00 2001 From: "chris (daiyi)" Date: Thu, 14 Sep 2017 16:58:52 +0200 Subject: [PATCH] First pass at rendering jsonML to dom --- project.clj | 3 ++- src/day8/re_frame/trace/app_state.cljs | 29 ++++++++++++++++++++++++-- 2 files changed, 29 insertions(+), 3 deletions(-) diff --git a/project.clj b/project.clj index c0b6b55..6e72900 100644 --- a/project.clj +++ b/project.clj @@ -6,7 +6,8 @@ [org.clojure/clojurescript "1.9.227"] [reagent "0.6.0"] [re-frame "0.9.0"] - [cljsjs/d3 "4.2.2-0"]] + [cljsjs/d3 "4.2.2-0"] + [binaryage/devtools "0.9.4"]] :plugins [[lein-less "1.7.5"]] :deploy-repositories {"releases" :clojars "snapshots" :clojars} diff --git a/src/day8/re_frame/trace/app_state.cljs b/src/day8/re_frame/trace/app_state.cljs index bcd2b12..0c04a31 100644 --- a/src/day8/re_frame/trace/app_state.cljs +++ b/src/day8/re_frame/trace/app_state.cljs @@ -1,10 +1,10 @@ (ns day8.re-frame.trace.app-state (:require [reagent.core :as r] [clojure.string :as str] + [devtools.formatters.core :as cljs-devtools] [cljs.pprint :refer [pprint]])) - (defn css-munge [string] (str/replace string #"\.|/" "-")) @@ -30,13 +30,38 @@ [:div {:class (str (namespace-css "collection") " " (namespace-css (css-munge (type-string data))))}] [:span {:class (str (namespace-css "primative") " " (namespace-css (css-munge (type-string data))))} (str data)])) +(defn jsonml-style + [style-map] + ; {:style (get style-map "style")} + {:style {:background "rgba(0,0,0,0.1)"}}) + +(defn str->hiccup + [string] + ; (println string) + (cond (= string "span") :span + (= string "style") :style + ; (= string "}") nil + ; (= string "{") nil + ; (= string " ") nil + ; (= string ", ") nil + :else string)) + + (defn crawl [data] (if (coll? data) (into (view data) (mapv crawl data)) (view data))) +(defn jsonml->hiccup + [data] + (cond + (vector? data) (mapv jsonml->hiccup data) + (map? data) (jsonml-style data) + :else (str->hiccup data))) + (defn tab [data] [:div {:style {:flex "1 0 auto" :width "100%" :height "100%" :display "flex" :flex-direction "column"}} [:div.panel-content-scrollable - (crawl data)]]) + (jsonml->hiccup (js->clj (cljs-devtools/header-api-call data)))]]) + ; (crawl data)]])