69d6d0e55fe4fe442ee4f9284576d17f6020a472 — Dimakakos Dimos 3 years ago fc8f9a6
Add: some early work on graphing a tree out of response
2 files changed, 79 insertions(+), 5 deletions(-)

M project.clj
M src/wikisophy/core.cljs
M project.clj => project.clj +2 -1
@@ 9,7 9,8 @@
  :dependencies [[org.clojure/clojure "1.10.1"]
                 [org.clojure/clojurescript "1.10.597"]
                 [reagent "0.9.0-rc3"]
                 [cljs-ajax "0.8.0"]]
                 [cljs-ajax "0.8.0"]
                 [metasoarous/oz "1.6.0-alpha6"]]

  :plugins [[lein-cljsbuild "1.1.7"]
            [lein-figwheel "0.5.19"]]

M src/wikisophy/core.cljs => src/wikisophy/core.cljs +77 -4
@@ 1,6 1,7 @@
(ns wikisophy.core
    (:require [reagent.core :as r]
              [ajax.core :refer [GET POST]]))
              [ajax.core :refer [GET POST]]
              [oz.core :as oz]))

(def path (r/atom []))

@@ 13,12 14,18 @@
   [:h2 "Do all paths lead to "
    [:a {:href "https://wikipedia.org/wiki/Philosophy"} "Philosophy"] "?"]])

(defn response-handler [response]
  (map-indexed (fn [i v] {:id (inc i)
                          :value v
                          :parent (if (= i 0) nil i)})

(defn get-query! [query]
  (GET "http://localhost:4242/wikisophy"
       {:content-type :json
        :api (js/XMLHttpRequest.)
        :url-params {:query query}
        :handler #(reset! path %)}))
        :handler #(reset! path (response-handler %))}))

(defn input []
  (let [query (r/atom "Search wikipedia..")]

@@ 31,6 38,73 @@
       [:input {:type "submit"
                :on-click #(do (reset! path "waiting") (get-query! @query))}]])))

(defn path-tree [path]
  {:$schema "https://vega.github.io/schema/vega/v5.json"
   :width 600
   :height 600
   :padding 5
   :autosize {:type "fit-x"
              :resize true}
   :signals [{:name "labels"
              :value true}
             {:name "layout"
              :value "tidy"}
             {:name "links"
              :value "diagonal"}
             {:name "separation"
              :value false}]
   :data [{:name "path",
           :values path
           [{:type "stratify",
             :key "id",
             :parentKey "parent"}
            {:type "tree",
             :method {:signal "layout"},
             [{:signal "height"}
              {:signal "width - 100"}],
             :separation {:signal "separation"},
             :as ["y" "x" "depth" "children"]}]}
          {:name "links",
           :source "path",
           [{:type "treelinks"}
            {:type "linkpath",
             :orient "horizontal",
             :shape {:signal "links"}}]}]
   :marks [{:type "path",
     :from {:data "links"},
      {:path {:field "path"},
       :stroke {:value "#ccc"}}}}
    {:type "symbol",
     :from {:data "path"},
      {:size {:value 100},
       :stroke {:value "#fff"}
       :fill {:value "#000"}},
      {:x {:field "x"}
       :y {:field "y"}}}}
    {:type "text",
     :from {:data "path"},
      {:text {:field "value"},
       :fontSize {:value 9},
       :baseline {:value "middle"}},
      {:x {:field "x"},
       :y {:field "y"},
       :dx {:signal "datum.children ? -7 : 7"},
        "datum.children ? 'right' : 'left'"},
       :opacity {:signal "labels ? 1 : 0"}}}}]})

(defn graph []
  (fn []
    (if (= @path "waiting")

@@ 38,8 112,7 @@
       [:img {:src "img/loading.svg"}]
       [:p "Please wait while crawling through Wikipedia."]]
       [:ol (for [node @path]
              ^{:key node} [:li node])]])))
       [oz/vega (path-tree @path)]])))

(defn front-page []
  [:body [header]