Skip to content

Commit 155a357

Browse files
krausestkrausest
committed
Merge branch 'lucywang000-add-helix'
2 parents c71a8b1 + 51f9fe4 commit 155a357

File tree

8 files changed

+229
-0
lines changed

8 files changed

+229
-0
lines changed

‎frameworks/keyed/helix/.clj-kondo/config.edn

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{:lint-as {helix.core/defnc clojure.core/defn}}

‎frameworks/keyed/helix/.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
out
2+
.shadow-cljs
3+
dist
4+
dev

‎frameworks/keyed/helix/index-dev.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Helix</title>
6+
<link href="/css/currentStyle.css" rel="stylesheet"/>
7+
</head>
8+
<body>
9+
<div id='main'></div>
10+
<script src='dev/main.js'></script>
11+
</body>
12+
</html>

‎frameworks/keyed/helix/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Helix</title>
6+
<link href="/css/currentStyle.css" rel="stylesheet"/>
7+
</head>
8+
<body>
9+
<div id='main'></div>
10+
<script src='dist/main.js'></script>
11+
</body>
12+
</html>

‎frameworks/keyed/helix/package.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"private": true,
3+
"js-framework-benchmark": {
4+
"frameworkVersion": "0.0.10"
5+
},
6+
"scripts": {
7+
"watch": "shadow-cljs watch :app",
8+
"build-dev": "shadow-cljs compile :app",
9+
"build-prod": "shadow-cljs release :app"
10+
},
11+
"devDependencies": {
12+
"shadow-cljs": "2.8.100",
13+
"ws": "^7.1.2"
14+
},
15+
"dependencies": {
16+
"react": "^16.13.1",
17+
"react-dom": "^16.13.1",
18+
"react-refresh": "0.8.1"
19+
}
20+
}

‎frameworks/keyed/helix/shadow-cljs.edn

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{:source-paths
2+
["src"
3+
"resources"
4+
"checkouts/helix/src"]
5+
6+
:dependencies [[lilactown/helix "0.0.10"]
7+
[lucywang000/hashp "0.1.2"]
8+
[binaryage/devtools "1.0.0"]]
9+
10+
:nrepl {:port 6666
11+
:cider true
12+
:init-ns user}
13+
14+
:builds {:app {:target :browser
15+
16+
:dev
17+
{:output-dir
18+
"dev"
19+
20+
:asset-path
21+
"/frameworks/keyed/helix/dev/"}
22+
:devtools {:after-load demo.main/after-reload
23+
24+
:watch-dir "resources/demo/styles"
25+
:watch-path "/styles"
26+
27+
:preloads [devtools.preload
28+
hashp.core]}
29+
30+
:release {:output-dir "dist"
31+
:compiler-options {:optimizations :advanced
32+
:infer-externs true}}
33+
34+
:modules {:main {:init-fn demo.main/init!}}}}}

‎frameworks/keyed/helix/src/demo/main.cljs

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
(ns demo.main
2+
(:require [helix.core :as hx :refer [defnc $]]
3+
[helix.dom :as d]
4+
[helix.hooks :as hooks :refer [use-state use-effect]]
5+
["react-dom" :as rdom]
6+
[demo.utils :as u]))
7+
8+
(defnc row [{:keys [data selected? on-select on-delete]}]
9+
(d/tr {:class (if selected? "danger")}
10+
(d/td {:class "col-md-1"}
11+
(:id data))
12+
(d/td {:class "col-md-4"}
13+
(d/a {:on-click (fn [e] (on-select (:id data)))}
14+
(:label data)))
15+
(d/td {:class "col-md-1"}
16+
(d/a {:on-click (fn [e] (on-delete (:id data)))}
17+
(d/span {:class "glyphicon glyphicon-remove"
18+
:aria-hidden "true"})))
19+
(d/td {:class "col-md-6"})))
20+
21+
(defonce id-atom (atom 0))
22+
23+
(defnc main []
24+
(js/console.log "re-render")
25+
(let [[data set-data] (use-state [])
26+
[selected set-selected] (use-state nil)
27+
run
28+
(fn run [_]
29+
(set-data (vec (u/build-data id-atom 1000)))
30+
(set-selected nil))
31+
run-lots
32+
(fn run-lots [_]
33+
(set-data (vec (u/build-data id-atom 10000)))
34+
(set-selected nil))
35+
add
36+
(fn add [_]
37+
(set-data u/add id-atom))
38+
update-some
39+
(fn update-some []
40+
(set-data u/update-some))
41+
clear
42+
(fn clear []
43+
(set-selected nil)
44+
(set-data []))
45+
swap-rows
46+
(fn swap-rows []
47+
(set-data u/swap-rows))
48+
select
49+
(fn select [id]
50+
(set-selected id))
51+
delete
52+
(fn delete [id]
53+
(set-data u/delete-row id))]
54+
(d/div
55+
{:class "container"}
56+
(d/div
57+
{:class "jumbotron"}
58+
(d/div
59+
{:class "row"}
60+
(d/div {:class "col-md-6"}
61+
(d/h1 (str "Helix")))
62+
(d/div {:class "col-md-6"}
63+
(d/div {:class "row"}
64+
(d/div {:class "col-sm-6 smallpad"}
65+
(d/button {:class " btn btn-primary btn-block"
66+
:type "button"
67+
:id "run"
68+
:on-click run}
69+
"Create 1,000 rows"))
70+
(d/div {:class "col-sm-6 smallpad"}
71+
(d/button {:class "btn btn-primary btn-block"
72+
:type "button"
73+
:id "runlots"
74+
:on-click run-lots}
75+
"Create 10,000 rows"))
76+
(d/div {:class "col-sm-6 smallpad"}
77+
(d/button {:class "btn btn-primary btn-block"
78+
:type "button"
79+
:id "add"
80+
:on-click add}
81+
"Append 1,000 rows"))
82+
(d/div {:class "col-sm-6 smallpad"}
83+
(d/button {:class " btn btn-primary btn-block"
84+
:type "button"
85+
:id "update"
86+
:on-click update-some}
87+
"Update every 10th row"))
88+
(d/div {:class "col-sm-6 smallpad"}
89+
(d/button {:class "btn btn-primary btn-block"
90+
:type "button"
91+
:id "clear"
92+
:on-click clear}
93+
"Clear"))
94+
(d/div {:class "col-sm-6 smallpad"}
95+
(d/button {:class "btn btn-primary btn-block"
96+
:type "button"
97+
:id "swaprows"
98+
:on-click swap-rows}
99+
"Swap rows"))))))
100+
(d/table {:class "table table-hover table-striped test-data"}
101+
(d/tbody
102+
(for [{:keys [id] :as d} data]
103+
($ row {:key id
104+
:data d
105+
:selected? (identical? id selected)
106+
:on-select select
107+
:on-delete delete}))))
108+
(d/span {:class "preloadicon glyphicon glyphicon-remove"
109+
:aria-hidden "true"}))))
110+
111+
(defn init! []
112+
(rdom/render ($ main) (.getElementById js/document. "main")))
113+
114+
(defn after-reload []
115+
(init!))

‎frameworks/keyed/helix/src/demo/utils.cljs

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
(ns demo.utils)
2+
3+
(def adjectives ["pretty", "large", "big", "small", "tall", "short", "long", "handsome", "plain", "quaint", "clean", "elegant", "easy", "angry", "crazy", "helpful", "mushy", "odd", "unsightly", "adorable", "important", "inexpensive", "cheap", "expensive", "fancy"])
4+
(def colours ["red", "yellow", "blue", "green", "pink", "brown", "purple", "brown", "white", "black", "orange"])
5+
(def nouns ["table", "chair", "house", "bbq", "desk", "car", "pony", "cookie", "sandwich", "burger", "pizza", "mouse", "keyboard"])
6+
7+
(defrecord Data [id label])
8+
9+
(defn build-data [id-atom count]
10+
(repeatedly count (fn []
11+
(->Data (swap! id-atom inc) (str (rand-nth adjectives) " " (rand-nth colours) " " (rand-nth nouns))))))
12+
13+
(defn add [data id-atom]
14+
(into data (build-data id-atom 1000)))
15+
16+
(defn update-some [data]
17+
(reduce (fn [data index]
18+
(let [row (get data index)]
19+
(assoc data index (assoc row :label (str (:label row) " !!!")))))
20+
data
21+
(range 0 (count data) 10)))
22+
23+
(defn swap-rows [data]
24+
(if (> (count data) 998)
25+
(-> data
26+
(assoc 1 (get data 998))
27+
(assoc 998 (get data 1)))
28+
data))
29+
30+
(defn delete-row [data id]
31+
(vec (remove #(identical? id (:id %)) data)))

0 commit comments

Comments
 (0)