<commit_before>;; copyright (c) 2014 <NAME>
;;
;; small demo to show Om / Sente playing together
;;
;; no claim is made of best practices - feedback welcome

(ns om-sente.core
  (:require-macros [cljs.core.async.macros :refer [go]])
  (:require [om.core :as om :include-macros true]
            [om.dom :as dom :include-macros true]
            [sablono.core :as html :refer-macros [html]]
            [taoensso.sente :as s]
            [cljs.core.async :as async :refer [<! >! chan]]))

#_(enable-console-print!)

;; create the Sente web socket connection stuff when we are loaded:

(let [{:keys [chsk ch-recv send-fn]}
      (s/make-channel-socket! "/ws" {} {:type :auto})]
  (def chsk       chsk)
  (def ch-chsk    ch-recv)
  (def chsk-send! send-fn))

(defn field-change
  "Generic input field updater. Keeps state in sync with input."
  [e owner field]
  (let [value (.. e -target -value)]
    (om/set-state! owner field value)))

(defn send-text-on-enter
  "When user presses ENTER, send the value of the field to the server
  and clear the field's input state."
  [e owner state]
  (when (== (.-keyCode e) 13)
    (chsk-send! [:test/echo (:text state)])
    (om/set-state! owner :text "")))

(def text-length 32)

(defn text-sender
  "Component that displays a text field and sends it to the server when ENTER is pressed."
  [app owner]
  (reify
    om/IInitState
    (init-state [this]
                {:text ""})
    om/IRenderState
    (render-state [this state]
                  (html [:input {:type "text" :value (:text state) :size text-length :max-length text-length
                                 :on-change #(field-change % owner :text)
                                 :on-key-press #(send-text-on-enter % owner state)}]))))

(defn make-color
  "Given a value (height) make a color for it. Returns #hex string."
  [v]
  (let [r v
        g (Math/round (- 150 (/ v 3)))
        b (Math/round (/ v 2))
        hex (fn [n] (.substring (str (when (< n 16) "0") (.toString n 16)) 0 2))]
    (str "#" (hex r) (hex g) (hex b))))

(defn make-target
  "Turn a string into a sequence of its characters' ASCII values."
  [s]
  (take text-length (concat (map #(.charCodeAt %) s) (repeat 0))))

(def animation-tick 75)
(def animation-factor 15)
(def graph-scale 3)
(def graph-bar-width 30)
(def graph-height 400)

(defn animated-bar-graph
  "Component that displays the data (text) returned by the server after processing."
  [app owner]
  (reify
    om/IWillMount
    (will-mount [this]
                (js/setTimeout (fn tick []
                                 (let [target-data (make-target (:data/text @app))
                                       next-data   (or (om/get-state owner :data) (vec (take text-length (repeat 0))))]
                                   (om/set-state! owner :data
                                                  (mapv (fn [d y]
                                                          (if (< d y)
                                                            (min y (+ (/ y animation-factor) d))
                                                            (max y (- d (max animation-factor (/ d animation-factor))))))
                                                        next-data
                                                        target-data))
                                   (js/setTimeout tick animation-tick)))
                               animation-tick))
    om/IRenderState
    (render-state [this {:keys [data]}]
                  (let [s (:data/text app)
                        t (make-target s)]
                    (html [:div {:style {:height (+ 100 graph-height)}}
                           [:p (str "The string '" s "' represented as a bar chart:")]
                           (into [:svg {:id "display" :width "100%" :height graph-height}]
                                 (map (fn [v1 v2 o]
                                        (let [h (* graph-scale v1)]
                                          [:rect {:fill (make-color (max v1 v2))
                                                  :width graph-bar-width
                                                  :height h
                                                  :x (* (inc graph-bar-width) o)
                                                  :y (- graph-height h)}]))
                                      data
                                      t
                                      (range)))])))))

(defmulti handle-event
  "Handle events based on the event ID."<commit_msg>Made gap in bar graph configurable<commit_after>;; copyright (c) 2014 <NAME>
;;
;; small demo to show Om / Sente playing together
;;
;; no claim is made of best practices - feedback welcome

(ns om-sente.core
  (:require-macros [cljs.core.async.macros :refer [go]])
  (:require [om.core :as om :include-macros true]
            [om.dom :as dom :include-macros true]
            [sablono.core :as html :refer-macros [html]]
            [taoensso.sente :as s]
            [cljs.core.async :as async :refer [<! >! chan]]))

#_(enable-console-print!)

;; create the Sente web socket connection stuff when we are loaded:

(let [{:keys [chsk ch-recv send-fn]}
      (s/make-channel-socket! "/ws" {} {:type :auto})]
  (def chsk       chsk)
  (def ch-chsk    ch-recv)
  (def chsk-send! send-fn))

(defn field-change
  "Generic input field updater. Keeps state in sync with input."
  [e owner field]
  (let [value (.. e -target -value)]
    (om/set-state! owner field value)))

(defn send-text-on-enter
  "When user presses ENTER, send the value of the field to the server
  and clear the field's input state."
  [e owner state]
  (when (== (.-keyCode e) 13)
    (chsk-send! [:test/echo (:text state)])
    (om/set-state! owner :text "")))

(def text-length 32)

(defn text-sender
  "Component that displays a text field and sends it to the server when ENTER is pressed."
  [app owner]
  (reify
    om/IInitState
    (init-state [this]
                {:text ""})
    om/IRenderState
    (render-state [this state]
                  (html [:input {:type "text" :value (:text state) :size text-length :max-length text-length
                                 :on-change #(field-change % owner :text)
                                 :on-key-press #(send-text-on-enter % owner state)}]))))

(defn make-color
  "Given a value (height) make a color for it. Returns #hex string."
  [v]
  (let [r v
        g (Math/round (- 150 (/ v 3)))
        b (Math/round (/ v 2))
        hex (fn [n] (.substring (str (when (< n 16) "0") (.toString n 16)) 0 2))]
    (str "#" (hex r) (hex g) (hex b))))

(defn make-target
  "Turn a string into a sequence of its characters' ASCII values."
  [s]
  (take text-length (concat (map #(.charCodeAt %) s) (repeat 0))))

(def animation-tick 75)
(def animation-factor 15)
(def graph-scale 3)
(def graph-bar-width 30)
(def graph-height 400)
(def bar-gap 1)

(defn animated-bar-graph
  "Component that displays the data (text) returned by the server after processing."
  [app owner]
  (reify
    om/IWillMount
    (will-mount [this]
                (js/setTimeout (fn tick []
                                 (let [target-data (make-target (:data/text @app))
                                       next-data   (or (om/get-state owner :data) (vec (take text-length (repeat 0))))]
                                   (om/set-state! owner :data
                                                  (mapv (fn [d y]
                                                          (if (< d y)
                                                            (min y (+ (/ y animation-factor) d))
                                                            (max y (- d (max animation-factor (/ d animation-factor))))))
                                                        next-data
                                                        target-data))
                                   (js/setTimeout tick animation-tick)))
                               animation-tick))
    om/IRenderState
    (render-state [this {:keys [data]}]
                  (let [s (:data/text app)
                        t (make-target s)]
                    (html [:div {:style {:height (+ 100 graph-height)}}
                           [:p (str "The string '" s "' represented as a bar chart:")]
                           (into [:svg {:id "display" :width "100%" :height graph-height}]
                                 (map (fn [v1 v2 o]
                                        (let [h (* graph-scale v1)]
                                          [:rect {:fill (make-color (max v1 v2))
                                                  :width graph-bar-width
                                                  :height h
                                                  :x (* (+ bar-gap graph-bar-width) o)
                                                  :y (- graph-height h)}]))
                                      data
                                      t
                                      (range)))])))))

(defmulti handle-event
  "Handle events based on the event ID."
{'fraction_non_alphanumeric': 0.12509643998677394, 'fraction_numerical': 0.009588890113523641, 'mean_word_length': 1.318344404701073, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 70, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '93494', 'n_tokens_mistral': 2601, 'n_tokens_neox': 2442, 'n_words': 841}