MLq*f184f74~bqjJrg!%gT;Z?&lkR;=(V4EnGL26P{spDMTRW0=m
zzjMHz2J-u4LPJBPLlva`aUL>qDk>^6vhp(W@=_o}3Lowlz3aF-xq6XV5Pr{+T&A5(m`!8D3RAoSQ2a
z9F!Cn#J9l6U@<}dF5V;(67gHaRCVxpw;+_h22y3OikzH^ypkf(D(+%!D={XKl#eo9?H*a_?5r$LMuxGYEnnCz}DsxCM;ryzfvCMl&c
zZh_w#K3L6tZnz-N;0SdYVqSv%Zw(Sd=HGf?+x4F;{-&83~@L8pu%M3AnukoG|}!?jRJTWdUVf6dDF2o!6c`P;-Ftdus4N
z!vNL){gvc_`T?AO+fmzNfF3|iNeQQWFPH6G
z023VQ3UwueFab~|2pJP(y9?L_KFpwG5C|zM-zstn2oy#}34*M@$Vuq-C_qaFsxXo<
zg3rM=!oT$X|7iBta7lS+|J@e|1tys4nW;&BO3*q6`z%ht-ryG_#2O{`~pLHNsZh-!OpoORN%7hTn;96
z#?IB$swZX8LvSJ;JCgwF0c+VP){nqYJ=+J0s>;T{(17zf0a3J{0q%5R>!G0{>A%^d
zes+km|4{%StDi%5w-a%M!EtAUl5TeVy5I{Jr!sZmJ;ym2qrdPjusKG-<^h0~r&~FV
z!n93dM{^K6iH>!u#~>D#gXH1Pg+}g3V|#p-p_Eq}#QN*mCOvIvY|?k)fi#-65fFjY
zK@X&$QMd)a9ceFXX;z*R5m|jUmb;x#kE9ZI;E{)&g>Hn90Kt2puODTM!gipsf!5|n
zNdQk3=qgQ}{0=P1S7scyuaE%BL`#9r*N06Jf6~Y!>ta5I5=a0yTg-I^`HsU6zIFdi
zhC?f9o=tp{&>2H7czL37V~76DAhlr-OY*rNf$F5UN)yDC-YnMsod4Xb?7gNAr
zmf$(%kMtsbr@^Q!$R{&@NCUG!5ISGmqxydcetaTK5~OGHD6|1Gk_4Y4kLY}9dkXbq
z9zS?+WGPLX2yx$$h-7!`b3RZes@kJL$-fH(W(5fmChbpJqMSh66GyRQx7#1V6ZWgd^kC`?yQoh8n&}zt<3Ij81?^2dPJN
zc_>A4MyGa{keC!8
zQO8~x*rO<7ib9Y?|5R}2JeojdQnW#jk<^`CkXXy0CSJ#XD5MsYvl=?OFQ3$g5WFmn
zI~;o*ch_kDMgyQcRWVQZlOc$52m#Jq?by5OLfWIhFkvdD#8#d
z&QqH2KyD+t
z8vcC^|IvXemlGhbLr+_J-UWDsf!@asDIEY{#EPMqef<0G1Sk_flsfij@9wGvCv1f5
z^cB?x08b1&tLqvIsP$_(cvtWGrQ%6Y$mGWQbWtY019VcXio2L{AejJ4|18v0w`ekC
z!3%Lj?j_pX2=pqo9dtGy22kp^^r7|i2vHV5+|oYf^^Rx<&$
zGmm=BVy`ewUAiOS$S7>~LHPckiAYi$TI+r7dOZ`|D1f>N)59=+w5s-w7Rf!&afzHF
z03EM77l96nN}c_C)c2QV?raY@Ks}Wi){&vB@~NJ=#9FEq%#$eE{P
z6ogCcvEY*brRcH7>QUCY?5?@;7Xl~_%ZQ)J{}24{n*SFd#CLK@MgT$v78v-_{_XXg
z418S&$QhXw&6!zb5dsR@tn!X>NJ2XJstyMk5OU}?Fcn*rjJ;5EG&V$mRg~-52Kw2!
z>@qS_Mc^S%^)|p1{-yEl6P-4J_Jr$OC2=OP`1viq59^bGvZ1XAGOp=DH&|Y-Cdd9Ug
zvlsdK$d=cuZe!D91Bz{}R30T%NYXwGSy`FnXSks6&Rav)v1pWOoR%VlJNfX4=5C`e
z>J&64&*XS{1LW0VCsi`X9!!v=GR_*pw=6uyFT~>XK7^*7WNO(G_G^}>$hWFh(oi|q
zb35UhKX-MrJcGT2X#+@g!d3v%7
zeX&6QAQy20z)X_yz`ff%_i3p`$M;
z2H$W>3A%O%aKJCHOg=v>tUPw}3HxTvldyqa3FcE0NvELm!*|9%<+Uzp-Yz_E8k@Vf
z)NaV?iC|XJwIw;f(WqP{+guvrQq(Bf#%ZkBAusj4^cyof+;Rq-R}K>?8j``ak9!$2
zs^~Gwr&=DdkJpS@jZ_+8Z3EQltI(c?Le6?cz38d8W9o-P&IEdvd5?)m5}NAJ_!D0^
z*zfM+UTW-a#C|SOw94nW)YSa8yVYzXBcRo{M5@r?>bWY$C1=z82|xDp)OAX6*L)hh
zM>m_TOm?59qYK0hmdsuV9yuRiMRjXD#JYLu=DjxN6j|pAJHGV;holb-^Nl0X2CeZ*
z48hNwpR}wm%$TT8rKTuXUi>^TY_Wu6uvi+HUQx0?Ep<5h>;=Ptw`9ERPNs7s&4-ckI(TC^uBE%S5NDhl0eW?=fRb*
z^^C|v2(Noq!&1zuGsop?&hxasJh;>HkHv&Nbq_DkKyGsoR@`b_RX>zhT0i$Ey$fT
zm!}m`atka82^N7*G~%VSF7Ua_G2qKN<5nB^4za6DzaELE{#tccRZ3%zsd~!c9=jIK
zW(}sUOu4cPUQO@SPvzK)=_c600dM87qVicyTZ&>X|STgRuwBFiLch*ktu}Q>HTcO}nDJ2D+tLHMr
z7+rg7KV71HBFmq_CC784LT((rY|0Si@EXbG(raKO%6Tx9Y|G>9ao@~{G`}?d?m$ZS
zBT_YQ_>cFVwIdtbqj}y^t>MeFky)l~AXd)mAWro-Ez?FWd>hDM(|BB-+Z1xqGEC&;
zRc>2CbWhg9hm_OzyRUC{hVhgP>WylsJ@c)3XE-Yz_;mm?F2Quo$Y5BVrSmzRgxBd_
z-b9|o(k;b$9i<>m%9^H2pZ1$>1JZ%R=1koU#SCiZ+a(+rW>NHz+95zAgEz+0TdK%z8DcWA%
zITwq$tRMGi`3
zaG|~SXnl4dUjH!t`&x+j{Oce+Q@|&W7DQ$Le=wjw8A{;e3Id~~AcsL<;2RKFz+X3gdR^gzZMHv9+;W-eE6qXnAjYOu(wIUZheECF9PN`JF-7`I73i{Zwi
z(ZW=m{o&W&OvR+TGnCmaIA;u;Yu%gK{@m+4#Za@7yUTQcYOow*dFitn<-wp}u9hVe
z_L_dbU^%7?Iuu*YO98(JY!sz8p0sPm1dp>W4hCsd$XPhPS)k3qHLlWJn5#jb^{jJ{
zLJB$aYAG1p>#e4}qxt5l_@JM2mHUvDkc<91)%zkeA$757s&A8mCXJhNwx&^R)vK?E
zii-`c-&~lh*hibaOL3N;X&{5-P^#M7B*iJ?_{yZg6~;;~u_F_^#-E%44|0$xtfV*Q
zsJfn2zETslVpwGRW8@nXp(SRlS+apAiDK;2`q8Agz>VTU%c1f7WcwG97BzhOiaCoe
z=x0Ojg9fcNyKQ(u-idGHKFgppIDAq55t|Xn6GU=ns<$&$W+6FMqb=X6yi9nPq&PEw
zm2V94WQh9$#?09m6uc5gRz)@?WTa3QKHTDzqHugEPLz5$H+o4h%bjgH!d=+7bQ)2z
z!isw=xD9ZdT%P9kyMMs)-9A2|>^;({#!DeZ$z6XB`P=Jjx3eaYCC+!M-!{FB2
ziKw-!Lt};KZhe*n64VfM9IN6#p^z(f4%MuI}~1o?EIpw=YH5y>WkNNKh>1Omx5ZaO^!SNsh`qrk8MJ6
zxb9$|k3~>S`OwX>=(Dz`nqX54Lk70*D^FqUEaTSPhwLkbg1QdWCN;lG^1BK#%W-h(
zI<&;*-PIarW_u>#i%ElZ(q{SjuszMqEpO+rgTgT
zU3X2V`ON{QoG&Y6_pWxi`tnFzKU=Sx1&NU8!7?aZeJL-cNtIJqZ)kYiq9^;^S6?&3
zNTl?h1oZLiR)H^A!;3czQ|?V!vRAxRq)R%-i+F0|molR3!$4(x54g;c*JHW4x4NRz
z)8m#ZyoOioKoYZ?>Y-10N+dm{~V02q^?BJ7htZ0yrSz1eB
z;77FsNwoH7hw`<>>^fq($c$ILJyQ#r=}@0uYMq8_r}Gg^SD&6uc8?hmZq02FN<3XS
zJ(YaXx9iZ_t|(ZI`zPrUA;Vz~tb_)4?vO;LT}=&{dS$6ko7K0rY1+G=k^56eIZk0ZK+eK?Z=A{-o2J36NtH0FQ2`z_Mk8
ztoHGY2FK0;!qm#ouNztd+rVx3x{58Hj=R^q(H==o#$i4C#j^9ULv%gz%6fd!aG&*)c5`dJSWfM}c3Vm$q@ih6S137ca{N??dOGvO=}U?M>7`l066E+>
z$7r6mI#aT0Fg}1|&4mZp%J0QHgL&oxEjK8vG`+Ln!
zMx6`M(3CVwT}LZfb+!30#|ug+zS^Lvi*gwVqrGiXf?qr5I$6g=Ba)-&&EV(X5z+c2
z0}yjn=t$TDUIbVUrzJ288^#atn-BS9OlDXLONASbF`WQRkw{0I^HMu=9
zvMdX+^>@s|gqV)hToa7C`Zmm^Up;3A{2np))|s1O`H3cEeXMvJppEd)UNwF^f3+Hk
zn}t|d%w3JXIrjF8%fQBE*~c|STV791i;Gv^#3;SJfNDAVmUC507N)4cO>f7+1H+gG
z1zU|3=#TN9q~tsEx^hS=!%H|>b@D{*5wC3^j=mtW(4lE^x_{$qpJ%QFi`$~I&~S3I
zFKUV6hmV%yb3H@_D({0_+0hv|l@vn85e;
zHbq1a&dQSGBIWyo}z!MvsSSe=Y9S~7hy)57}e1MY{M
zE#c3vOb4dvL{)$JI(^CD@hb8v{Sz+_Wipz@>3s
zBO$mW4xJdfd-&EKKc7PDGv4n;fQM!8kgIWz>uox^86zaLGG0WVzT2EK(tfN7W#)E6
zLi1tk#}nCH#;zu;ckW3IX&q}5$%D>$AL5smdP-F$dFx=PzjEOx)5EVf*QeTQrqo6?
z9CN%A3NCjTO}p52H9UADow6_Xo#myog`a!asI%e^W_GEcj=yu`S&5eSu$`@-SSUxG
zwPty)j^`74b
z*f<3OTlV|CNO@tVu(wK?I;%%;5>b0nm{7aLh5urHi$Qhq=7aXZq)tWj{Y#bnWC=3n
ziKRe~X%+=xll=TrET6=p-pFAOw#~G`5*Z|hbxyO`a7`rBq`5SyzG&FT+atqebM}C;
zm9L6F)E9?;j}kg)w<6Xk{bAJ
zp!(7LqegZbb}v^C)%;Sk%w_TiM!gqeCn`1*H)_)##z^YF_I;Q`U8K$vpuLJOmus83
zwCM7}gjGPGx+&T{*M@6vsM%M!65;DuF1H(z92CV5RiLHCSDWeccEiGu`}@21u05OS
zV`H~*?IIQnMLF}$Mv!OWhqQkG)Ix?^jDXn0?qw$^(RI?
zcXaK_$va$fSS`Zxa&EYd0FQ-ftV#-h*1PLnu&`&1f}igPXKGesFyd
z2HdjnW|}E+5-zd&I-VJj=vP6q6z|NmG!{^&!RVDDT4B6;AVw
z6`5#iIAUyc7rhmq{vD1?jHP0cG@Z#ZTKM7q^=@Ibj-;N*xKgy(sWHk)M(@R-DiJQT
zce@l5U|)wvQ|=hDXj{^ZcA#}PhV|rc%ub?J*3^n64$!l7Dw3n&{b+3+yhFh>`$80W
zOLh0z`=CjzBYi4+ho%5EwywXBY~KA&9?Bi5MSds+|=907PLie?duM|F0VvyIXD&iuiE#e8c~3B_n5
zexDEIJBt|w`(fmV9soeUqcEs3K=?=et@UFOQ9=ac-!T9#L?FpBcS@mj&;_ti3H|N`
zQHo#&t-%3sKIz2nuLVq60Ko|67;&%tR$yQb5Wu~FLd3v-gNR+?9-$J-)D~j=0|X7G
zLttQ%fXn>{h+xzPGL2zicKsP2Ku0JO{MRV}@t1vs_&yfo&)EV5(nw&Q
z2A?QLK()bo=kjM-e&-QWWv4|U!Qj?|8p8Mab!wz^Eu$qj@V=+bQ$a#8
z#`NMNi={2m0?NjZxeOTcoBVZ+VjLo)%WDnVR3crD;8qx}3!bPUHALFS9EqRC4I567fwY_TTkFyDRE
zk!*N?ddM?~@$|!!k(;2IoTG~y=2UxlpVl3JaC3D%9zt~sk>i1||FkC}i3%!;7>eAO
zs9m-!)Iu<3Ux~HW;5ET*#&`vYFndn;mR#&nm7qg9HCD8qiTZRlOvS#vfGPqHd%m)_
zQu46prL{2v+-vjBLeI*?iHXy9B1AtwLN85hNgQ6{gY%osi?dILs54{Vy)-Lkk-t>S
zF>y7`U;X1Y5T(w#c|S~dK!Dk>VTTZ;Ip
zX;iWeP#YkTHau5Yb>lh{kJMWBuYDdl0b{z7zxJqqd_TFCZchS1sCKK{jNbQi&8jSX
z9}}!b*!s@Qg726~HmpSdLu{xUy*kh4Q9dy^sw$p(U~U1EwM0>o-1g!E)A8EC$(py;
zD=THHx%_y;oD4tmPXR)MN3m?FV*_)i-%z|eSqKlDoL#WqWDa7C(XYpxV_V~4PM1gN
z?t#93Jtm!2@j7NxFO5&29DrM{`4g@N;JSal!Ap^ycouG0ATi7XZ$
zG*Z=B-)r{FH&XXKRlx^^)?Al`8=VlB$=Z+MG<&-tCcbfQQ7t_2n(=h!e(|OC)Z>C^
z06H*VTkY|b&PXAafJQ<6>!W$+YH1hIEPa|4Cd$kB^?I1l;B)eoJ2l;&Ld=gIKBpJT
z%!euI>GxIKrTBoyWA1M?l6aj$H+bqzJ}Y87#E(Z60RlBE=61sHQk`5uBfkmz&$bpl
zu_cG!eWh%0w50CIl)H(Eq0+aWN7mEXNj1KDVap`s8ritigaujc*S<m#5(X`(Kmx@eE2JybVW}+xe<*VGWkpvv}CEXysd+O@vcnJJ48lL&E
zDVk|)yzF!Ro0rZ_W@jY6j?aT;quag)o~Smaa_#Xo5H0EOQpp}!Efx!%Jr0Dw9j+?yB%l8WfY%Qp1?TYLvqr3skdhon1nG#$?3SZ`cM-Zr$;J
z?&*vwx5*8(O-0-5F6H@_RVSBQP5UsWuncKWM)Ee^@7>y3o$lN;dvRq@TR@Dbl3Txq
z>!omN#TpuZqS7&uscy}ku1B))NWq%YIOvbe`NGe()Y=tO_`n&fWu~kUCkg|_ewxQ4
zU23S$^b_ch5rb*us|wM+6|U6BOa=UAFqe*b_gB-jwN)3$AIvgOK;~x$N@}$gp?lplskf-FvCcGxRcaI;HIGqV-<50pzClg%UQw9l
zn~xB7au}eHjJBtS>-QzTp8diiCgxPYc#X9$C%o(RWW?~PY?+{oui7!yMPbs@YwJmd
z64VY7w;#jziQJ1xt-+-{5iFLvf}Yz@8@aBj^g1wNEqv~1MBwD2-zTkuuf_e<)80{>
zUX*jb%Y7S>E*g3$wC`9e+IjN)+fQ0n!@(5QZiYUXg-erFr^>l4caxPqs$+1FQ)pOv
z!$IyH+8WPpzH4ZTSDiIeLIO9T;J^UI$d~YT7cqRqx8`k96m)k!8(*5Njx{yaYRlQJ
z;E}c|#;t2w9(=0`!u$n!TyNN%^#yzNelJhEyxqOMRYMIF=&bfUuCem&PTQ}ouYD4^
z4#cTBhX&L@Bi~#f^}8RM`W3Oc{smkRz5OXvANwXX$}fpumxgVf%+oMpJ-AhWY_}n;
zf1GX&y%l{s>w^BXZJ^oc<-Co0-@W6dT+6OAB^MYXBm~Yy&DZVGpebaQz)e<16A
z-y)C2v$4ehb7AMixI}A-r3seS-pV#bAJt>fyKLt^2+{l5W3{gWq6X~TVKyU}LGZxc
zU^0Rw+26F4jVKZkWPauJuzRR;@$>r+dm1~=R8lQy-3w(OP7_qcy3X)Y4@lCuWPG7R
z92m9|=XvE7$b(9sO=Z_yTKZSbhs_*FKyQS`L=aOaDfPU
zS@G+JPL5_%mytMGgLn3Jsz!<77yMrGqSUP1eZJVD7+!y_RJ|3+Qk+)WwO}boMP)c$
zj4ab0o*sQ<0_ZU7KYDc3FgdqBN-*V>+=Kn=%YIHu)ZlLyMf+B#jF=AC(6harJzA{(
zv0BkddM2dZM3!q=#Ibxfx5xGtVt;J186|6PM>=*kH?XNFLiY2Aer+ZJo_P}{_a$EG
zph*d)6ITW%V<=v0X~L}^x?ohDo(PYxpyyRoZqQmj2%*t1exn(2dGu+wLwCt4LRn0^
zV`i;_N9YWsjn2eupPS3riQ~p{PPoa}@BD5?kXs*wr{~CX_!b6_oybc_%)%TtALv`Q
z)Gt>(tLqeXwryV5#Bf)G_+uaIxyA*}h|f8V1wN}$b70^*;S8#)%=1wz&q*^_nF!V+nbDxfB
z7#FP!|76|3F^Fl_Q)j=UJW=!M1k`bh%$Sw2YE}LX#?ae-_iV1o0kLzz_^NsXle^5z
z{h?8{;Fmfw8BH^yT`t<>Vtk|Dc?3cD`&Z3C0sd*T(K_Cu{EC&G{?g6(d#Ix*f5sp)Rt
zh~aoJveZW)mikQvit4lXik>J{Wlo+&q_7I+
zGVcsW30dXva3-PzcWsMRSBLNR>Pd+xL40a;^((#O=jD&yAv@2#c*i^VOKADb({vdn
mj*DMXr0@FRaMj2o=9>pkW^(U$OEc-bqfe=~6%xJu?0*0?93^D{
literal 0
HcmV?d00001
diff --git a/src/data/layers/factory.tsx b/src/data/layers/factory.tsx
index 8cf3ca4..bb85b59 100644
--- a/src/data/layers/factory.tsx
+++ b/src/data/layers/factory.tsx
@@ -3,43 +3,34 @@ import { createLayer } from "game/layers";
import { Application } from "@pixi/app";
import { Sprite } from "@pixi/sprite";
import { Graphics } from "@pixi/graphics";
+import { Assets } from "@pixi/assets";
import Factory from "./Factory.vue";
import Modal from "components/Modal.vue";
import conveyor from "./factory-components/conveyor.png";
-import { reactive, Ref, ref, watchEffect } from "vue";
+import cursor from "./factory-components/cursor.jpg";
+import { computed, reactive, Ref, ref, watchEffect } from "vue";
import { Direction } from "util/common";
import { persistent } from "game/persistence";
import player from "game/player";
+import "./styles/factory.css";
+import { globalBus } from "game/events";
+import { Container } from "@pixi/display";
const id = "factory";
// what is the actual day?
-
-enum FactoryTypes {
- conveyor,
- conveyor1
-}
-
-interface FactoryComponent {
- type: FactoryTypes | undefined;
- directionIn: Direction | undefined;
- directionOut: Direction | undefined;
-}
const day = 20;
-const size = {
- width: 1000,
- height: 400
-};
// 20x20 block size
// TODO: unhardcode stuff
-const blockAmts = {
- w: 50,
- h: 20
+const size = {
+ width: 1000,
+ height: 340
+};
+export const blockAmts = {
+ w: 50,
+ h: 17
};
-
-const blockWidth = Math.floor(size.width / blockAmts.w);
-const blockHeight = Math.floor(size.height / blockAmts.h);
function roundDownTo(num: number, multiple: number) {
return Math.floor(num / multiple) * multiple;
@@ -51,6 +42,40 @@ function getRelativeCoords(e: MouseEvent) {
y: e.clientY - rect.top
};
}
+
+interface FactoryComponent {
+ directionIn: Direction | undefined;
+ directionOut: Direction | undefined;
+ imageSrc: string;
+ name: string;
+ description: string;
+ type: string;
+ sprite: Sprite;
+}
+const FACTORY_COMPONENTS = {
+ cursor: {
+ directionIn: undefined,
+ directionOut: undefined,
+ imageSrc: cursor,
+ name: "Cursor",
+ description: "Use this to move."
+ },
+ conveyor: {
+ directionIn: Direction,
+ directionOut: Direction,
+ imageSrc: conveyor,
+ name: "Conveyor",
+ description: "Moves 1 item per tick."
+ },
+ someOtherComponent: {
+ directionIn: Direction.Down,
+ directionOut: undefined,
+ imageSrc: conveyor,
+ description: "Accepts anything and produces nothing."
+ }
+};
+
+type FactoryCompNames = keyof typeof FACTORY_COMPONENTS;
const factory = createLayer(id, () => {
// layer display
const name = "The Factory";
@@ -62,41 +87,38 @@ const factory = createLayer(id, () => {
y: 0
});
const isMouseHoverShown = ref(false);
- const isFactoryShown = ref(false);
- // create a Array filled with th
- const components: Ref = persistent(
- Array(blockHeight)
+ const whatIsHovered = ref("");
+ const compSelected = ref("");
+ const components: Ref = persistent(
+ Array(blockAmts.h)
.fill(undefined)
- .map(() =>
- Array(blockWidth)
- .fill(undefined)
- .map(() => ({
- type: undefined,
- directionIn: undefined,
- directionOut: undefined
- }))
- )
+ .map(() => Array(blockAmts.w).fill(undefined))
);
// pixi
const app = new Application(size);
const graphicContainer = new Graphics();
- app.stage.addChild(graphicContainer);
+ const spriteContainer = new Container();
+ let blockWidth = 0;
+ let blockHeight = 0;
+ app.stage.addChild(graphicContainer, spriteContainer);
+
+ globalBus.on("update", () => {
+ blockWidth = app.screen.width / blockAmts.w;
+ blockHeight = app.screen.height / blockAmts.h;
+ });
// draw graphics
function updateGraphics() {
- // factory not shown, no point in rerendering stuff
- if (isFactoryShown.value) {
- graphicContainer.clear();
- if (isMouseHoverShown.value) {
- graphicContainer.beginFill(0x808080);
- graphicContainer.drawRect(
- roundDownTo(mouseCoords.x, blockWidth),
- roundDownTo(mouseCoords.y, blockHeight),
- blockWidth,
- blockHeight
- );
- }
+ graphicContainer.clear();
+ if (isMouseHoverShown.value) {
+ graphicContainer.beginFill(0x808080);
+ graphicContainer.drawRect(
+ roundDownTo(mouseCoords.x, blockWidth),
+ roundDownTo(mouseCoords.y, blockHeight),
+ blockWidth,
+ blockHeight
+ );
}
}
watchEffect(updateGraphics);
@@ -108,8 +130,25 @@ const factory = createLayer(id, () => {
mouseCoords.x = x;
mouseCoords.y = y;
}
- function onClick(e: MouseEvent) {
- // placeholder
+ async function onClick(e: MouseEvent) {
+ if (compSelected.value === "") {
+ console.warn("You haven't hovered over anything, trickster!");
+ return;
+ }
+ let { x, y } = getRelativeCoords(e);
+ x = roundDownTo(x, blockWidth) / blockWidth;
+ y = roundDownTo(y, blockHeight) / blockHeight;
+ const basicData = structuredClone(
+ FACTORY_COMPONENTS[compSelected.value]
+ ) as FactoryComponent;
+ basicData.type = compSelected.value;
+ const sheet = await Assets.load(basicData.imageSrc);
+ basicData.sprite = new Sprite(sheet);
+ basicData.sprite.x = x;
+ basicData.sprite.y = y;
+ basicData.sprite.width = blockWidth;
+ basicData.sprite.height = blockHeight;
+ spriteContainer.addChild(basicData.sprite);
}
function onMouseEnter() {
isMouseHoverShown.value = true;
@@ -118,7 +157,13 @@ const factory = createLayer(id, () => {
isMouseHoverShown.value = false;
}
function goBack() {
- player.tabs.splice(0, Infinity, "main")
+ player.tabs.splice(0, Infinity, "main");
+ }
+ function onComponentHover(name: FactoryCompNames | "") {
+ whatIsHovered.value = name;
+ }
+ function onCompClick(name: FactoryCompNames) {
+ compSelected.value = name;
}
return {
name,
@@ -128,14 +173,56 @@ const factory = createLayer(id, () => {
minimizable: false,
display: jsx(() => (
-
-
+
+
+
+
+
+ {whatIsHovered.value === ""
+ ? undefined
+ : FACTORY_COMPONENTS[whatIsHovered.value].description}
+
+ |
+
+
+
+ Components
+
+ {Object.entries(FACTORY_COMPONENTS).map(value => {
+ const key = value[0] as FactoryCompNames;
+ const item = value[1];
+ return (
+ onComponentHover(key)}
+ onMouseleave={() => onComponentHover("")}
+ onClick={() => onCompClick(key)}
+ >
+ );
+ })}
+
+ |
+
+
+ |
+
+
)),
components
diff --git a/src/data/layers/styles/factory.css b/src/data/layers/styles/factory.css
new file mode 100644
index 0000000..a47a172
--- /dev/null
+++ b/src/data/layers/styles/factory.css
@@ -0,0 +1,16 @@
+.container {
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+}
+.factoryDisp {
+ border-left: 1px solid white;
+ border-bottom: 1px solid white;
+}
+.info {
+ border-bottom: 1px solid white;
+}
+.comps {
+ border-bottom: 1px solid white;
+}
\ No newline at end of file
diff --git a/src/lib/pixi.ts b/src/lib/pixi.ts
index 9db8382..d76c5fd 100644
--- a/src/lib/pixi.ts
+++ b/src/lib/pixi.ts
@@ -1,7 +1,4 @@
-import { Application } from "@pixi/app";
-import { BatchRenderer, Renderer } from "@pixi/core";
+import { BatchRenderer, extensions } from "@pixi/core";
import { TickerPlugin } from "@pixi/ticker";
-Application.registerPlugin(TickerPlugin);
-
-Renderer.registerPlugin("batch", BatchRenderer);
+extensions.add(TickerPlugin, BatchRenderer);
\ No newline at end of file
diff --git a/src/main.css b/src/main.css
index 5c65197..dbf5062 100644
--- a/src/main.css
+++ b/src/main.css
@@ -137,6 +137,15 @@ ul {
background: #070710;
}
+.layer-container {
+ min-width: 100%;
+ min-height: 100%;
+ margin: 0;
+ flex-grow: 1;
+ display: flex;
+ isolation: isolate;
+}
+
.goBack {
position: sticky;
top: 10px;
@@ -158,11 +167,3 @@ ul {
transform: scale(1.1, 1.1);
text-shadow: 0 0 7px var(--foreground);
}
-.layer-container {
- min-width: 100%;
- min-height: 100%;
- margin: 0;
- flex-grow: 1;
- display: flex;
- isolation: isolate;
-}
\ No newline at end of file