From 3144cf2418ac50b7ff4c5610ec7e9d1a350bc467 Mon Sep 17 00:00:00 2001 From: Borys_Levytskyi Date: Sun, 20 Nov 2016 19:24:05 +0200 Subject: [PATCH] Add images folder. Migrate input controller into InputBox component --- src/app/components/InputBox.jsx | 47 ++++++++++++++++++++++++++++++++ src/{ => app}/index.jsx | 4 +-- src/img/feedback-dark.png | Bin 0 -> 1108 bytes src/img/feedback-light.png | Bin 0 -> 1108 bytes src/img/github-dark.png | Bin 0 -> 470 bytes src/img/github-light.png | Bin 0 -> 605 bytes src/img/twitter-dark.png | Bin 0 -> 1108 bytes src/img/twitter-light.png | Bin 0 -> 1108 bytes webpack.config.js | 2 +- 9 files changed, 50 insertions(+), 3 deletions(-) create mode 100644 src/app/components/InputBox.jsx rename src/{ => app}/index.jsx (91%) create mode 100644 src/img/feedback-dark.png create mode 100644 src/img/feedback-light.png create mode 100644 src/img/github-dark.png create mode 100644 src/img/github-light.png create mode 100644 src/img/twitter-dark.png create mode 100644 src/img/twitter-light.png diff --git a/src/app/components/InputBox.jsx b/src/app/components/InputBox.jsx new file mode 100644 index 0000000..bea2e37 --- /dev/null +++ b/src/app/components/InputBox.jsx @@ -0,0 +1,47 @@ +import React from 'react'; + +export default class InputBox extends React.Component { + history = []; + historyIndex = 0; + render() { + return this.onKeyUp(e)} + onKeyDown={e => this.onKeyDown(e)} + className="expressionInput mono" + placeholder="type expression like '1>>2' or 'help' "/>; + } + + onKeyUp(e) { + var input = e.target; + if (e.keyCode != 13 || input.value.trim().length == 0) { + return; + } + + var value = input.value; + console.log(value); + this.history.unshift(value); + input.value = ''; + console.log(this.history); + } + + onKeyDown(args) { + if(args.keyCode == 38) { + + if (this.history.length > this.historyIndex) { // up + args.target.value = this.history[this.historyIndex++]; + } + + args.preventDefault(); + return; + } + + if(args.keyCode == 40) { + + if(this.historyIndex > 0) { // up + args.target.value = this.history[--this.historyIndex]; + } + + args.preventDefault(); + } + } +} \ No newline at end of file diff --git a/src/index.jsx b/src/app/index.jsx similarity index 91% rename from src/index.jsx rename to src/app/index.jsx index b37acea..bac32f0 100644 --- a/src/index.jsx +++ b/src/app/index.jsx @@ -1,6 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom'; - +import InputBox from './components/InputBox.jsx'; var rootView =

BitwiseCmd

@@ -19,7 +19,7 @@ var rootView =
- + [em] diff --git a/src/img/feedback-dark.png b/src/img/feedback-dark.png new file mode 100644 index 0000000000000000000000000000000000000000..c693b65b7bcab34a92c9886b081ed1a5614b264c GIT binary patch literal 1108 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4(FKV3GE8aSX8#WE5a|{~IVe7{Je; zKl}gu`E!#L4Aip{?Dii&e)xR*_KoZB-@p6+6A6H7FMs*+MGR<&4a2{G|Na6QNk9RR zA$tj#0aSDG^XJbZzkdC40qXtA0MY<6 zZjcxthBfw~045Rm4tU%v{$oDEV711JW71Yw2%y~6?2xE+X3rGNHP|r%R+XVy!d?Y0$xmZ|O_5%g}6N8zVnJNxtf&v%N8#oOCYCeyq8Kf8PY>*)-N=ix~ zLv|yHgS~}AGl~H)mtYtI(hT&o5R$XOhC(fYy8tE#a|s8~CEJ0TPvg;y;Q|yxjE#+% z%*@PKaM%n}i{S#81jr>Bz^L+qhBizboyKVZx>ApYG7 U*&lb8a)4an>FVdQ&MBb@0P&2tsQ>@~ literal 0 HcmV?d00001 diff --git a/src/img/github-dark.png b/src/img/github-dark.png new file mode 100644 index 0000000000000000000000000000000000000000..07ecd24763f7c65802598086ab0743c407b615d6 GIT binary patch literal 470 zcmV;{0V)28P)TOS_S*Yj=ZB_HC)AR9u0F>(SJ%|> zW`4S{Q(adZ>XBMdm*Nxxds8cF$4|`%>Z3aM$B?<;?0*qaH=;18cKx&EP;kot8Fd0U z0TzJ^;1bvZwt)el4Y&m+ffZm1=mn}ko-pSqCXD!hOa`~67PG)?r~yp>>hfpIM6Lp} zS)dQN3UIjvfrN7n^k)HqOn^Nt2y{oz0A_)EAQ#|i3j$}6bHH6R%xk+eDEvjc>Xg$7HKkl50cT3U8&P_aB7XSbN M07*qoM6N<$g6Dg>-2eap literal 0 HcmV?d00001 diff --git a/src/img/github-light.png b/src/img/github-light.png new file mode 100644 index 0000000000000000000000000000000000000000..8df17f1cc321a1b65b1323d3d223376b784aa8d1 GIT binary patch literal 605 zcmV-j0;2tiP)598NV$C6v<{>7YClbH0Wfs~5y$a{WIq2taRqJdrzA-(0Wbmp zx>2+$g;>&Bua^f0HwJ0C#X_89qFv`);(%bc-@jdsMt7z>@3a(RVcPdk75n?Ipp=@Q z?e*Mjuje|Q&g1cr0KiObXi%l?bUKeKzEWzQeJNLtqG|nXT zI2Vp<#}4=j0D`C;$MLmE>M#tK1ak|AlYg-QHmq~l>GzG*`ehUZ7yl)Wl)4~=cv@?{ z<5KHKqw)aGIg<^C!@MXyFms`lny*;C?_Xi&-Kj?7qhLN!^{urJInVPip6@-G?e(TY zDHof~=CTTc&&<42GuUgjTHSgYZSDOuO}`%fg*b}d6Z2VP?Kx}hFwgU>##h}q-WJR= z0AP%H-5(6DAKvH~Nt!N#XiYGG_oV!W>Uj^*ti)RDyOkIKL_Jnf6mO;*jeQVxJ>DjYqEa;NYpFd~%^XJdjfB*jd{q^hD;?JKy^P#H& z^MC*TUGVqs-^W13bzi=G5rHWJil_ZY0w6U%fBsa1$-`-&Gx>m;FM`wpZTk$=SoQMd zOE#c}`$+o1OrY3dxJDQQXe%GcbY#Uq{$*r7j19ElKhPB^-@ktkfawR*KmiA!rq3{i z_-LTI*T8_SK`{X2H=x8ppbbCqX$H9f7@#R%zkZcKF#yB?#)cG7!Eby904+g;!J9X4 zWYA3kx@0;o1AvBq2g)14^?*3Q5MK_Afkq&11)6>u4 zfeQZO(D)lDzZMv1nDGxY1Vn>UBhWP&K*bY*crFlk1Nm`S0}EN>fU?(HA2)c)I;|Vz N2v1i(mvv4FO#q_j*AxH% literal 0 HcmV?d00001 diff --git a/src/img/twitter-light.png b/src/img/twitter-light.png new file mode 100644 index 0000000000000000000000000000000000000000..ee35e405f7a35f2da73ef190f3a49db989cc0c37 GIT binary patch literal 1108 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!61|;P_|4(FKV3GE8aSX8#WE5a|{~IVe6o7() z0+*1GP=u(cs9$VsEE85Yi;IgZSy))Gpi5d=SuwG)vTkK$Wc%>0<0oxM&%LP7+lh?A2u4aoiv!%R#}kNNre)nM{)T3K0{4`|axkV2qspMeHe znV6Wc0S&zm(+s0oSXd6jHNqIu($ah&7r+#OXrO_Yk@?7M9v+?)K|#R)pcn!G1ss5e zd