Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 57f7c42

Browse files
krausestkrausest
committed
Merge branch 'L3P3-master'
2 parents c3878d7 + e881f6d commit 57f7c42

File tree

5 files changed

+277
-0
lines changed

5 files changed

+277
-0
lines changed

‎frameworks/keyed/lui/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>lui</title>
6+
<link rel="stylesheet" href="/css/currentStyle.css" />
7+
</head>
8+
<body>
9+
<script src="src/lui.js"></script>
10+
<script src="src/app.js"></script>
11+
</body>
12+
</html>

‎frameworks/keyed/lui/package-lock.json

Lines changed: 5 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frameworks/keyed/lui/package.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"name": "js-framework-benchmark-lui",
3+
"version": "1.0.0",
4+
"description": "Benchmark for lui",
5+
"js-framework-benchmark": {
6+
"frameworkVersion": "1.1.1"
7+
},
8+
"scripts": {
9+
"build-dev": "echo 0",
10+
"build-prod": "echo 0"
11+
}
12+
}

‎frameworks/keyed/lui/src/app.js

Lines changed: 230 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,230 @@
1+
const {
2+
hook_dom,
3+
hook_reducer,
4+
hook_static,
5+
init,
6+
node,
7+
node_dom,
8+
node_map,
9+
} = lui;
10+
11+
12+
/// STORE ///
13+
14+
const 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'];
15+
const colors = ['red', 'yellow', 'blue', 'green', 'pink', 'brown', 'purple', 'brown', 'white', 'black', 'orange'];
16+
const nouns = ['table', 'chair', 'house', 'bbq', 'desk', 'car', 'pony', 'cookie', 'sandwich', 'burger', 'pizza', 'mouse', 'keyboard'];
17+
18+
const pick = options => (
19+
options[
20+
Math.round(
21+
Math.random() *
22+
(options.length - 1)
23+
)
24+
]
25+
);
26+
27+
let id_counter = 0;
28+
29+
const item_generate = () => ({
30+
id: ++id_counter,
31+
label: `${pick(adjectives)} ${pick(colors)} ${pick(nouns)}`,
32+
});
33+
34+
const ACTION_RESET = 0;
35+
const ACTION_CREATE = 1;
36+
const ACTION_ADD = 2;
37+
const ACTION_REMOVE = 3;
38+
const ACTION_SELECT = 4;
39+
const ACTION_UPDATE = 5;
40+
const ACTION_SWAP = 6;
41+
42+
const actions = [
43+
// RESET
44+
() => ({
45+
data: [],
46+
selected: null,
47+
}),
48+
49+
// CREATE
50+
(state, count) => ({
51+
...state,
52+
data: (
53+
new Array(count)
54+
.fill(null)
55+
.map(item_generate)
56+
),
57+
selected: null,
58+
}),
59+
60+
// ADD
61+
(state, count) => ({
62+
...state,
63+
data: [
64+
...state.data,
65+
...(
66+
new Array(count)
67+
.fill(null)
68+
.map(item_generate)
69+
),
70+
],
71+
}),
72+
73+
// REMOVE
74+
(state, id) => ({
75+
...state,
76+
data: state.data.filter(item => item.id !== id),
77+
selected: (
78+
state.selected === id
79+
? null
80+
: state.selected
81+
),
82+
}),
83+
84+
// SELECT
85+
(state, id) => ({
86+
...state,
87+
selected: id,
88+
}),
89+
90+
// UPDATE
91+
(state, mod) => ({
92+
...state,
93+
data: state.data.map((item, index) =>
94+
index % mod > 0
95+
? item
96+
: {
97+
...item,
98+
label: item.label + ' !!!',
99+
}
100+
),
101+
}),
102+
103+
// SWAP
104+
(state) => ({
105+
...state,
106+
data: (
107+
state.data.length > 998
108+
? [
109+
state.data[0],
110+
state.data[998],
111+
...state.data.slice(2, 998),
112+
state.data[1],
113+
...state.data.slice(999),
114+
]
115+
: state.data
116+
),
117+
}),
118+
];
119+
120+
121+
/// COMPONENTS ///
122+
123+
const Jumbotron = ({
124+
dispatch,
125+
}) => (
126+
hook_dom('div[className=jumbotron]'),
127+
[
128+
node_dom('div[className=row]', null, [
129+
node_dom('td[className=col-md-6]', null, [
130+
node_dom('h1[innerText=lui]'),
131+
]),
132+
node_dom('td[className=col-md-6]', null,
133+
[
134+
{
135+
id: 'run', label: 'Create 1,000 rows',
136+
click: () => dispatch(ACTION_CREATE, 1e3),
137+
}, {
138+
id: 'runlots', label: 'Create 10,000 rows',
139+
click: () => dispatch(ACTION_CREATE, 1e4),
140+
}, {
141+
id: 'add', label: 'Append 1,000 rows',
142+
click: () => dispatch(ACTION_ADD, 1e3),
143+
}, {
144+
id: 'update', label: 'Update every 10th row',
145+
click: () => dispatch(ACTION_UPDATE, 10),
146+
}, {
147+
id: 'clear', label: 'Clear',
148+
click: () => dispatch(ACTION_RESET),
149+
}, {
150+
id: 'swaprows', label: 'Swap Rows',
151+
click: () => dispatch(ACTION_SWAP),
152+
},
153+
].map(item =>
154+
node_dom('div[className=col-sm-6 smallpad]', null, [
155+
node_dom('button[type=button][className=btn btn-primary btn-block]', {
156+
id: item.id,
157+
innerText: item.label,
158+
onclick: item.click,
159+
}),
160+
])
161+
)
162+
),
163+
]),
164+
]
165+
);
166+
167+
const Row = ({
168+
I: {
169+
id,
170+
label,
171+
},
172+
dispatch,
173+
selected,
174+
}) => (
175+
hook_dom('tr', {
176+
F: {
177+
danger: selected === id,
178+
},
179+
}),
180+
[
181+
node_dom('td[className=col-md-1]', {
182+
innerText: id,
183+
}),
184+
node_dom('td[className=col-md-4]', null, [
185+
node_dom('a', {
186+
innerText: label,
187+
onclick: hook_static(() => {
188+
dispatch(ACTION_SELECT, id);
189+
}),
190+
}),
191+
]),
192+
node_dom('td[className=col-md-1]', null, [
193+
node_dom('a', {
194+
onclick: hook_static(() => {
195+
dispatch(ACTION_REMOVE, id);
196+
}),
197+
}, [
198+
node_dom('span[className=glyphicon glyphicon-remove][ariaHidden]'),
199+
]),
200+
]),
201+
node_dom('td[className=col-md-6]'),
202+
]
203+
);
204+
205+
init(() => {
206+
const [
207+
{
208+
data,
209+
selected,
210+
},
211+
dispatch,
212+
] = hook_reducer(actions);
213+
214+
return [null, [
215+
node_dom('div[className=container]', null, [
216+
node(Jumbotron, {
217+
dispatch,
218+
}),
219+
node_dom('table[className=table table-hover table-striped test-data]', null, [
220+
node_dom('tbody', null, [
221+
node_map(Row, data, {
222+
dispatch,
223+
selected,
224+
}),
225+
]),
226+
]),
227+
node_dom('span[className=preloadicon glyphicon glyphicon-remove][ariaHidden]'),
228+
]),
229+
]];
230+
});

‎frameworks/keyed/lui/src/lui.js

Lines changed: 18 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)