« first day (3422 days earlier)      last day (1520 days later) » 

user12582392
8:00 PM
?
 
@JBis its using JSDelivr links to CodeMirror, didnt you say you had a proxy?
 
user12582392
And the second one is. why gulp functions do not accept parameters like this:
 
user12582392
    function(parameter1, parameter2){console.log(parameter1*parameter2}
 
user12582392
(with proper closing parenthesis)
 
Drastic color changes
Darkened colors, brightened syntax
https://codepen.io/SkylerSpark/full/GRJmoKq

Tell me if any issues arise
If it takes a second to load, its downloading codemirror, which Ill have to start making it cache them in localstorage to decrease that latency
 
8:13 PM
 
feed your so spammy
i know its a bot, shush
Not funny feeds, I didnt laugh.

Cool story though :L
Aw dangit, someone made a localstorage DB before me, eh I got one I made on my own though: github.com/webpgr/cached-webpgr.js
 
That seems like it shouldn't be necessary
Your browser should already be caching JS files served with correct headers
 
no, codepen resets the project every load
so they arent cached
run my project and refresh it, youll see what I mean
and yes I have a timeout
 
codepen doesn't stop browser caching
 
\but its slow, so i cant place text before the script loads
else it gets an error
 
8:18 PM
it's a tool
that you are using
 
technically Im making the delay on purpose, but only to solve latency
 
if you don't like it, find another tool
 
I like it, its fine, it just takes a bit to load sometimes
 
Codepen isn't meant to be your sole development environment
 
> The library is so simple that you can read and understand all of its code!
wow, someone has balls
 
8:19 PM
who posted that
 
oh
Just arrogant dev
 
wow that library only has like 60 lines of actual code
 
er, Ive been optimizing the code since earlier when I first made the syntaxer just for js, so im going to try something
No timeout
 
I'm going to be honest, they're not wrong
 
8:21 PM
depending on how you write code, it may be true or false, but it also depends on what context the code is written for
 
Forest, its just a localstorage db, I made a similar one, but its more like 90 lines
and I cant require scripts from it like this one
 
wietlol - sure
 
at work, we dont really write documentation because the code is self documenting, but you do have to know our tech stack and business to understand it
 
of course
@TaylorS why write a personal 90L library for yourself
just make it a file in your codebase
 
Because its fun..
If you just made shortcuts for everything in life, its boring
I try to make it harder on purpose
cuz why not
and also because if I make something dynamic, IF anyone ACTUALLY wanted to use it, itd work for them too
/shrug
sigh, i forgot this isnt discord
 
8:23 PM
This library also makes it impossible to use subresource integrity
 
forget about sri
 
Like, you really really shouldn't screw around with something as fundamentally basic as how <script> tags work. You don't need to make them work better than they already do, they work exactly as they are supposed to.
 
@forresthopkinsa how will you share the file in your projects?
 
@TaylorS wheres my damn caret?
 
I didn't get the impression that it was being used across projects
 
8:26 PM
@JBis its a bug from the library, I posted the issue
I tried it on a raw div
same issue
might be because of using VW and VH, which Im actually removing rn cuz it looks like shit
 
hmm... I have my own libraries based on responsibility
but none of them are <=90 lines tho
 
JBis, I hate not seeing selection boxes or carets, but apparently this is the only live code syntaxer supported by most editing sites, used by codepen and jsfiddle, and its free
So either its a bug, or my code is just shitty
or both
 
Okay aside from.. all that, someone tell me I'm not crazy: in a React functional component you should be able to do something like this, right?
 
if its used by everyone and i have carets on everyones site....
 
const component = () => {
  const [foo, setFoo] = React.useState(0);
  const [bar, setBar] = React.useState(10);
  const foobar = foo && foo + bar;
  return <span>{foobar}</span>;
}
 
8:28 PM
Then my code is shitty ik, thats why im reworking things
thats how life is
 
I'm getting an infinite render loop from that const foobar
 
fixing things over and over until its unflawed
which usually never happens
theres always a flaw
 
which is crazy because I swear I've done this a million times before
@Wietlol right
 
> foo && foo + bar
 
...
yeah
thats some funky code right there, what is it even doing
 
||> var foo = 2, bar = 3, a = foo && foo + bar; return a;
 
@TaylorS 5 Logged: ``
 
give me a break
that part is fine
 
.-.
if its just an addition formula, whats the point of "foo &&"
if you want a default value, use || instead
 
It'll short-circuit if foo is falsy
 
8:31 PM
tf?
 
ok..
 
` const foobar = foo && foo + bar;`
 
This is a simplification of the actual code, of course
 
is equal to let foobar; if (foo) { foobar = foo + bar }
 
8:32 PM
and else?
 
let foobar is the else
 
oh
 
no, wait. No. let foobar = foo
 
undefined?
 
I wasnt understanding the &&, thats simple then
 
8:32 PM
"short-circuiting" means it won't evaluate the right side at all, it'll assign it to the left side
 
oh
 
let foobar = foo ? foo + bar : foo
 
but Guys you're missing the forest for the trees here, I'm not asking about the boolean operator
 
This is why boolean operators for flow control is not a good idea :p
 
I'm asking about React functional component rendering
 
8:33 PM
I think it is time for me to appreciate my tech stack, which does not contain JS
 
Three smart people required to walk through it and I still got it wrong on the first try
 
oh gosh, it works fine, come on
I'm trying to figure out why React is getting stuck in a render loop
 
code...
 
Client: Can we do it x way?
Me: Yes, but we should probably use y because it will be better...
Client: Ok. Lets do it that way>
Me: Here's how you do it----
Client: I know how to do it.
<--- Couple Days Later -->
Client: We couldn't figure out how to do it y way so we just went with x.
 
@forresthopkinsa It's probably confused by your use of boolean operators
 
8:34 PM
I'm gonna kill you
aaaggghhh
 
That shouldnt effect it considering the JS is compiled and the value is the same
Lol forest is sociopathing
chill in the freezer for a few
;)
 
@forresthopkinsa have you tried turning it off and on again?
 
LOl
 
you guys are so helpful
 
Or maybe try vue.js
 
8:35 PM
I've used Vue plenty
 
ironically, my comment is quite serious
 
Vue? nty
 
try adding dummy values for foo and bar (turning it off)
and then filling in the foo (turning it on)
 
it's not about foo and bar
 
const foobar = foo && foo + bar;
 
8:36 PM
and then filling in the bar (turning it on)
 
yeah thats terrible
 
it's a pretty common construction in prod code
 
between each step, test it
 
ik, i have seen it before and i hate it
 
@forresthopkinsa foobar is based on foo and bar, ofcourse it is about foo and bar
 
8:37 PM
place console.logs in every line of code to see whats wrong

;)
 
It's basically a null coalescing operator, guys
 
EVERY SINGLE LINE! GOT IT?
 
until JS gets a real null coalescing operator this is what we have
 
you mean ::?
 
stub null coalesce is || no?
 
8:38 PM
|| mdn nullish coalescing operator
 
Yeah || does it one way, && inverts it
 
&& is like ?.
 
it's not a null chaining op
 
foo?.plus(bar)
 
8:39 PM
I'm gonna kill myself you guys are impressively dodging the actual question
 
(ofcourse it doesnt work with infix operators tho)
 
have you considered a career in politics
 
Forrest just create the function Coal and emulate the effect in it if you want a coal operator, and allow the input to contain ??..

Pain in the arse but it works
 
@forresthopkinsa I still think my suggestion stands
 
@forresthopkinsa yes
but then i relized this chat would be found and i would be done
 
8:40 PM
removing code until it works to find out where it is broken
 
Okay okay listen. I'll just show you the ACTUAL code. Maybe you can figure out the problem.
 
thats what I asked earlier tho bro
 
Line 57
 
@forresthopkinsa oh, this fucker again
 
That's right
I actually filed a Chrome bug and they've patched the bug and they're backporting it to m80
Until then I'm trying to use a workaround
 
8:41 PM
jesus, too many libraries, out of my league, goodbye
 
hence line 57
taylor there are like two libraries in this pen
 
I see 5 js references
I struggle with 1
 
and the only one that matters here is React
 
@forresthopkinsa cool, send me a link i'll put it on my resume
 
Okay okay my bad there's React, Dexie, Video.js, and Axios. but none of them matter except React because it's a react question
@JBis gl
lmao
 
8:43 PM
@forresthopkinsa I still think you need to isolate your problem
 
ok
 
let me elaborate on my question
 
ok
 
You would not expect assigning a variable to state values inside a functional component to cause a render loop
Right?
 
true
 
8:44 PM
im no help with big gun js issues, ima pop out for a bit, cyall
 
obai
 
Okay. Because the entire function re-runs on every update. So the value should stay in sync with the state values without causing re-renders
But it is causing re-renders
I'm asking in here for a sanity check before I go and disassemble my program
 
in that case, go and disassemble your program
imho, that should be step 1
 
Oh never mind I don't think I need to. I think I figured it out
Looking over the code another time, I'm constructing a new Blob object on every render, so naturally the child components are going to think they need to re-render
 
naturally I always hit the delete button on a dead code, then find the solution 10 minutes later simply BECAUSE I rage-quit
oh yeah im back
 
8:47 PM
come on guys
const blob = activeVideo && (useWorkaround ? new Blob([activeVideo.blob]) : activeVideo.blob);
this is why I come here, y'all should've caught that in an instant
 
oh shit
Even i can see that, my blind ass
 
@forresthopkinsa why?
 
@forresthopkinsa considering I havent used JS in 5 years... no, I think I wouldnt be able to see that
 
8:48 PM
why am I doing it or why is it causing re-renders
 
why is it causing re renders
 
@Wietlol I'll allow it this time
 
you are just creating a new blob
 
@JBis React does equality checks to know if it needs to rerender
new blob instances won't pass equality checks
 
are you sure tho?
 
8:48 PM
so it re-renders and then on re-render it creates a new instance again
No I'm not sure but it definitely looks like it
 
jeez
 
solution is to store in state?
 
Can't store in state because that'll have the same problem
I need to cache the new blob somehow
 
but you can reuse the blob from your state
instead of making a new blob every render
 
@forresthopkinsa are you using the blob var in your jsx?
 
8:50 PM
But I'll end up setting the state again each time
 
base64 string stored in localStorage
 
@DaneBrouwer Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
 
@JBis line 120
 
only if the state wasnt set
get from state, if not found, load new blob and put into state (which will be reused next render)
 
@forresthopkinsa reasons why i don't use react++
 
8:51 PM
@Wietlol If I do that then I won't be able to update when props change
@JBis This would be so much harder in vanilla lol
Okay I am going to put it in state, but importantly I'll have to set it from an effect hook
 
maybe my React is different than yours then
 
I thought you hadn't touched js in five years
 
I havent
 
checkmate
 
I use React-but-not-js
 
8:53 PM
gah
 
@forresthopkinsa debatable
 
you're killing me man
This code is functional and pretty clean and it was easy to write
It would be a nightmare if I'd written it imperatively
 
do people ever start react on an inner element instead of the first and only element in the body
 
sure
you can initialize it wherever you want
 
Fuck viewport height: https://codepen.io/SkylerSpark/full/GRJmoKq

Viewport width aint horrid though, Ill keep it for a bit
 
8:55 PM
@forresthopkinsa yeah i know, react much better for this
@forresthopkinsa i know you can, i didn't know if people actually do
 
@JBis only if you also want some stuff around your react managed ui to be handled without react
 
also, comments for socratic answers is almost done!
 
@SterlingArcher also post in Java/C# chat perhaps?
 
JBis, could I see the site again
or do you not have a baseplate up yet
 
@forresthopkinsa so whatz ya makin dis 4?
 
8:59 PM
@JBis I think it's probably only used when people want a nav bar outside react
@JBis I think I've told you before that I've been contributing to a gif generator project, just for fun
 
@TaylorS socraticanswers.com
@forresthopkinsa Hmm. Don't recall. But cool.
:)
 
opt in button in signup page is like 2px
 
someone on /r/disney was asking for javascript developers to help them with a gif generator and I was like, how weird that someone is asking for devs in a disney sub
yeah it's a fun project, I personally don't think anyone will ever use it but that's not my responsibility lol
 
that poor checkbox
it SHRUNk
 
oops, lmao. Make sure people opt in
@TaylorS can't reproduce
what browser you on?
 
9:05 PM
chrome
 
hmm, one sec
 
Found another off center one in profile but it isnt shrunk
ill log off and reload, see if effect in signup is the same
Found issue I think
display: inline-block;
maybe
probs not though
@JBis btw, you should make a github organization for Socratic, I did that for FunctFlow, and Im owner so I can still have full control, but trusted peers can join and coop with projects, while others can join just to recieve updates
 
@TaylorS try now
 
Fixed the off center on both, but the signup one is still "tiny"
 
cant reproduce the tiny issue
 
9:12 PM
I'm seeing it too, Chrome 82 still
Disabling the width: 20px & 27px rules fix it, but that messes up part of your styling
 
then selectively disable it just for the checkbox
those width sizes should actually increase the size
thats wierd
if you go into inspect, click the checkboxes next to the 20px and 27px
it should turn them off
turn off 20px and set 27px to 60
 
resizing checkboxes are a pain the ass
 
best I can get it to look
Basically set its width to 60px and ignore every other width style
turning them all off is wierd, because it causes a bunch of mystery whitespace not defined by padding or margin
so wierd
it doesnt look bad like that
set the 60 back to 27... and the text and everything is pushed to the right
its like an invisible UV box
 
are you both on windows?
 
Yes
 
9:23 PM
odd
 
what are you running on
 
mac
 
rip
safari has lots of issues/changes rendering inputs
 
ok i'll get to it
can you create an issue on the repo?
 
Im actually trying to find the file to make a pull request XD
Ill post an issue
posted
took a sec to reproduce the changes I made
and take screens
 
9:32 PM
wheres that height coming from
 
check it out, it's all working now
 
JBis, Im honestly not sure
Ill keep lookin
 
@JBis btw 50px on the input looks even better
60px actually causes whitespace errors
but, either way, looks normal now
 
@JBis spot on
 
9:37 PM
@JBis all your hover buttons are setting custom background colors and colors.

use a relative value like `filter: brightness(80%);` on the :hover
or if you want them to shine, do filter: brightness(120%);
etc
just my personal liking
 
@TaylorS alright i fixed it
try clearing cache and reload
 
yuppers
Beautiful
those things are a pain to size correctly
since ya used a flex box, it probably made the box-sizing model of it a little funky
anyways, flex is probably better than what I'd do, like a container, and children have display: inline-block; and vertical-align: top;
Profile input is good too, no more off center :D
gj
 
thanks
 
that button or whatever it is up top looks misaligned
 
its only off by a couple pixels
 
9:48 PM
JBis, in my personal opinion, you could make a container, place all 4 inputs in it, and forget the bullets entirely :D
or add the username input to the bullet list
either way, Misalignment can be a pain
Im anal, all my sites need to either be perfectly centered, or look clean and flush
 
i'll fix it later
 
else it annoys me
 
comments are bit more important
 
ah you do it too then
yeah
 
you are free to make a pr if you want
 
9:49 PM
Im actually still trying to figure that out
never done it before
if I want to collab, I have to fork the latest version every time a new version appears, and then make changes, and compare branches
sounds painful
 
you just fork it everytime you want to make a change
 
yeah i guess that makes a bit more sense
 
unless you want to full collab in which case there are other options
 
thats why github organization is nice, you can moderate specific people who join to collab on one project
and all the latest updates get sent to github desktop, so if you make a change, it hits up everybody, they pull changes, then send their changes.

Changes can then be pulled back if needed
 

« first day (3422 days earlier)      last day (1520 days later) »