text: (this.webpackJsonpclient=this.webpackJsonpclient||[]).push([[0],{107:function(e,a){},110:function(e,a,t){},144:function(e,a,t){},145:function(e,a,t){},146:function(e,a,t){},147:function(e,a,t){},148:function(e,a,t){},149:function(e,a,t){"use strict";t.r(a);var n,c=t(0),r=t.n(c),s=t(54),l=t.n(s),o=t(18),m=t(6),i=t(5),u=(t(67),function(){var e=Object(c.useState)(""),a=Object(i.a)(e,2),t=a[0],n=a[1],s=Object(c.useState)(""),l=Object(i.a)(s,2),m=l[0],u=l[1];return r.a.createElement("div",{className:"joinOuterContainer"},r.a.createElement("div",{className:"joinInnerContainer"},r.a.createElement("h1",{className:"heading"},"Lett Chat"),r.a.createElement("div",null,r.a.createElement("input",{type:"text",placeholder:"nome",className:"joinInput",onChange:function(e){return n(e.target.value)}})),r.a.createElement("div",null,r.a.createElement("input",{type:"text",placeholder:"sala",className:"joinInput mt-20",onChange:function(e){return u(e.target.value)}})),r.a.createElement(o.b,{onClick:function(e){return t&&m?null:e.preventDefault()},to:"/chat?name=".concat(t,"&room=").concat(m)},r.a.createElement("button",{className:"button mt-20 ripple",type:"submit"},"Acessar")),r.a.createElement("div",{className:"howToContainer"},r.a.createElement("h3",null,"Sobre:"),r.a.createElement("p",null,"Este projeto foi contru\xeddo com as tecnologias: React e Socket.io e trata-se de um prot\xf3tipo de sala de bate papo"),r.a.createElement("h3",null,"Utiliza\xe7\xe3o:"),r.a.createElement("p",null,"Escolha um nome de usu\xe1rio e crie um nome para a sua sala. Em seguida, clique em Acessar."),r.a.createElement("p",null,"Caso queira acessar uma sala j\xe1 existente, informe exatamente o nome da sala."))))}),A=t(61),E=t(57),p=t.n(E),f=t(58),g=t.n(f),d=t(13),v=t.n(d),h=t(19),N=t.n(h),j=(t(110),function(e){var a=e.users,t=e.room;return r.a.createElement("div",{className:"textContainer"},r.a.createElement("div",null),a?r.a.createElement("div",null,r.a.createElement("h1",null,"Usu\xe1rios ativos na sala ",r.a.createElement("span",null,v.a.emojify(t)),":"),r.a.createElement("div",{className:"activeContainer"},r.a.createElement("h2",null,a.map((function(e){var a=e.name;return r.a.createElement("div",{key:a,className:"activeItem"},a,r.a.createElement("img",{alt:"Online Icon",src:N.a}))}))))):null)}),b=t(59),C=t.n(b),O=(t(144),t(145),function(e){var a=e.message,t=a.text,n=a.user,c=!1,s=e.name.trim().toLowerCase();return n===s&&(c=!0),c?r.a.createElement("div",{className:"messageContainer justifyEnd"},r.a.createElement("p",{className:"sentText pr-10"},s),r.a.createElement("div",{className:"messageBox backgroundBlue"},r.a.createElement("p",{className:"messageText colorWhite"},v.a.emojify(t)))):r.a.createElement("div",{className:"messageContainer justifyStart"},r.a.createElement("div",{className:"messageBox backgroundLight"},r.a.createElement("p",{className:"messageText colorDark"},v.a.emojify(t))),r.a.createElement("p",{className:"sentText pl-10 "},n))}),I=function(e){var a=e.messages,t=e.name;return r.a.createElement(C.a,{className:"messages"},a.map((function(e,a){return r.a.createElement("div",{key:a},r.a.createElement(O,{message:e,name:t}))})))},x=t(60),S=t.n(x),y=(t(146),function(e){var a=e.room;return r.a.createElement("div",{className:"infoBar"},r.a.createElement("div",{className:"leftInnerContainer"},r.a.createElement("img",{className:"onlineIcon",src:N.a,alt:"online"}),r.a.createElement("h3",null,a)),r.a.createElement("div",{className:"rightInnerContainer"},r.a.createElement("a",{href:"/"},r.a.createElement("img",{src:S.a,alt:"close"}))))}),k=(t(147),function(e){var a=e.message,t=e.setMessage,n=e.sendMessage;return r.a.createElement("form",{className:"form"},r.a.createElement("input",{className:"input",type:"text",placeholder:"Digite sua mensagem",value:a,onChange:function(e){return t(e.target.value)},onKeyPress:function(e){return"Enter"===e.key?n(e):null}}),r.a.createElement("button",{className:"sendButton ripple",onClick:function(e){return n(e)}},"Enviar"))}),U=(t(148),function(e){var a=e.location,t=Object(c.useState)(""),s=Object(i.a)(t,2),l=s[0],o=s[1],m=Object(c.useState)(""),u=Object(i.a)(m,2),E=u[0],f=u[1],d=Object(c.useState)(""),v=Object(i.a)(d,2),h=v[0],N=v[1],b=Object(c.useState)(""),C=Object(i.a)(b,2),O=C[0],x=C[1],S=Object(c.useState)([]),U=Object(i.a)(S,2),B=U[0],R=U[1],w="https://lett-chat-app.herokuapp.com/";Object(c.useEffect)((function(){var e=p.a.parse(a.search),t=e.name,c=e.room;n=g()(w),f(c),o(t),n.emit("join",{name:t,room:c},(function(e){e&&alert(e)}))}),[w,a.search]),Object(c.useEffect)((function(){return n.on("message",(function(e){R([].concat(Object(A.a)(B),[e]))})),n.on("roomData",(function(e){var a=e.users;N(a)})),function(){n.emit("disconnect"),n.off()}}),[B]);return r.a.createElement("div",{className:"outerContainer"},r.a.createElement("div",{className:"container"},r.a.createElement(y,{room:E}),r.a.createElement(I,{messages:B,name:l}),r.a.createElement(k,{message:O,setMessage:x,sendMessage:function(e){e.preventDefault(),O&&n.emit("sendMessage",O,(function(){return x("")}))}})),r.a.createElement(j,{users:h,room:E}))}),B=function(){return r.a.createElement(o.a,null,r.a.createElement(m.a,{path:"/",exact:!0,component:u}),r.a.createElement(m.a,{path:"/chat",component:U}))};l.a.render(r.a.createElement(B,null),document.getElementById("root"))},19:function(e,a){e.exports="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAAXNSR0IArs4c6QAAAExJREFUCB1jbPh/le3lx5tNDIwMcQwg8J9hkTi/eh0LWJCBoRwoAAPlQDEGJrhKmDCIBupmQuYjs5lAZiILgNlAMRaQRSAz4UZCLQcAIwYaiAejKoYAAAAASUVORK5CYII="},60:function(e,a){e.exports="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAAHBJREFUGBmNkAEKwCAMA2VfGP2mrx3sOV2us6IymIXQGlNTW9zdhCqcZQm4dmelFUp+CZZa6sYpeUVIFyIixMqjCO51Wy5unQExuYSbSF5JASLqPsqRM21lOoWc89tagr3PSMgOiWlwnUeXWA/E78IfuAX270S3ydAAAAAASUVORK5CYII="},62:function(e,a,t){e.exports=t(149)},67:function(e,a,t){}},[[62,1,2]]]);
  //# sourceMappingURL=main.6ed73e91.chunk.js.map