|
Empress Brosephine posted:This works and it rocks, thank you so so much. That was way easier than I expected. Make a mapping of body field to attrib_id and iterate that.
|
# ? Mar 10, 2021 19:57 |
|
|
# ? May 16, 2024 17:21 |
|
This Node.JS stuff is weeeeeird. I'm toying around with React Router and dropping both a <Link to="/"> and an <a href="/"> into the document. Within the HTML code they look exactly the same (both plain <a href="/">), yet clicking the one generated by <Link> navigates immediately whereas the manually written <a> reloads the whole page. How does that even happen?
|
# ? Mar 10, 2021 21:25 |
|
Combat Pretzel posted:This Node.JS stuff is weeeeeird. The one made with Link has an event handler attached to it that captures your click and handles it as an app state change instead.
|
# ? Mar 10, 2021 21:33 |
|
Ola posted:Using tables for layout is also hell on accessibility, it makes it harder to navigate with screen readers, which reads tables expecting tabular data where they can read the column header for every cell etc. Again, if your product design is cool with that, go ahead. But you've surfed past thousands of sites that have successfully used proper layout elements without noticing, there are heaps and heaps of tooling and tutorials to help you learn it. And while I kind of agree about tables being worse for adapting to different sized screens, that's more in theory than in practice, because every modern website except Amazon is a loving hideous frustrating travesty in every screen size, and would have been more usable made with Livejournal-era markup. (Because then on your phone screen or whatever you can zoom in if you want, whereas the poo poo people make now is like "oh you tried to zoom in? Just gonna rescale everything so the thing you were trying to zoom in on gets smaller then! Happy to help!") It's not the modern tools I hate, it's the stupid poo poo people think is a good idea to do with them.
|
# ? Mar 11, 2021 05:51 |
|
barkbell posted:sounds like you need a grid
|
# ? Mar 11, 2021 05:54 |
|
roomforthetuna posted:Yes, I was arguing with the idea that a series of flexboxes provides most of the same capabilities as a table. I agree that grid is similar to table. There's a lot of weird poo poo involved in getting the behavior to be similar to a simple table, for example the column template I want was "auto auto 1fr auto" which wasn't a feature mentioned in the cheatsheet that was linked earlier. And now I'm stuck with, what I want is for the div grid element to be the size of the specified grid area, but for its text content to be vertically centered. The only way I've found to do this that works is to put another div or span inside the grid div, which seems like quite the balls solution (and even getting that to work is painful) - is there something better? Messing with margins on the grid element makes the box shrink, so the text is vertically centered but without the padding any more. Adding vertical-align:middle doesn't do anything.
|
# ? Mar 11, 2021 06:55 |
|
align-items: center;justify-content: center; ?
|
# ? Mar 11, 2021 06:59 |
|
Biowarfare posted:align-items: center;justify-content: center; ? (Making the cell "display:flex" and the sub-element "margin: auto" does what I want.) I think tables achieved this behavior by secretly being two elements per cell under the hood.
|
# ? Mar 11, 2021 07:30 |
|
I suppose no one here knows an npm package to deal with a DB2 on z/OS, that a) doesn't involve wrapping jt400 and b) doesn't make Webpack poo poo itself like it does with the current odbc npm package I'm using for development (because of requires with a path set during runtime).
|
# ? Mar 11, 2021 18:19 |
|
Look this is all very simple: tables for layout = bad for accessibility tables for tabular data = good for accessibility to complicate things: table markup comes with default aria (role=table) and default css (display: table;). Both can be used separately from table tags. You can have something with table markup that is not a table and something without table markup that looks like a table. to complicate things: browsers need to deal with old sites that used tables for layouts so they apply heuristics to detect these and remove the table role so they're presented to screenreaders and the like the same as a bunch of divs, negating the part about tables being bad for accessibility. Sometimes this is overcorrective, negating the part about tables being good for accessibility, and you have to add the roles back if no really it's a table, I swear. (If you change the display property on small viewport breakpoints you trigger this and have to add the roles back, fun) Biowarfare posted:align-items: center;justify-content: center; ? place-items: center;
|
# ? Mar 11, 2021 18:45 |
|
Say if I were to work on two Node.JS packages concurrently, because one is dependent on another, and I used npm-link (which the Internet suggests I should) to set things up, would the fswatcher in the main project, that kicks off a compile/webpack on file changes, also pick up on file changes in the dependency project? Also, is the Javascript Map just a flat key value store, or does it internally some hash map or binary tree things to aid performance?
|
# ? Mar 11, 2021 19:41 |
|
Combat Pretzel posted:Also, is the Javascript Map just a flat key value store, or does it internally some hash map or binary tree things to aid performance? Per the Javascript spec, Map must be implemented in some way to provide performance better than O(n) -- for instance, like a hashmap; but it doesn't specify *exactly* how it should be implemented to reach that goal: quote:Map object must be implemented using either hash tables or other mechanisms that, on average, provide access times that are sublinear on the number of elements in the collection. The data structures used in this Map objects specification is only intended to describe the required observable semantics of Map objects. Map does have some other required behaviors that mean it's not just a hashmap under the covers (its required to retain the insertion order of items, for example); but regardless it should in all cases be better than abusing an object property list as a map instead. biznatchio fucked around with this message at 16:19 on Mar 12, 2021 |
# ? Mar 12, 2021 16:16 |
|
Oh good, thanks. I'm currently abusing(?) a bunch of Maps as look-up tables to reconstruct a history graph of amount of active manufacturing per day per priority level. I'd rather not have computation time scale exponentially when extending the date range.
|
# ? Mar 12, 2021 17:06 |
|
Question for anyone using NestJS/Express, or really any server-side framework & PassportJS. So, I create a standard auth system which spits out a JWT for use moving forward when someone has successfully logged in, but I don't know how to like set the auth as the permanent header for all requests on the client side moving forward? I know how to, for example, set up some sort of client side JS to make post/gets, etc using the JWT as an access path into the back-end, but I just want to like: Post login details to server -> Server says OK, hands out JWT. -> JWT is assigned to all header requests moving forward on the client-side for the duration of the session, or until such time as the token expires. As I said I know you can make HTTP requests to the server via stuff like fetch() and pass it the JWT there, but like, surely I don't need to like build an entire SPA to hold, store, and manage the JWT for the entire duration of the session? I don't wan to build my admin pannel as an SPA (not yet anyway).
|
# ? Mar 14, 2021 23:15 |
|
Ape Fist posted:Question for anyone using NestJS/Express, or really any server-side framework & PassportJS. generally easiest thing to do is put the jwt in a cookie and have server middleware for passport auth using the cookie.
|
# ? Mar 14, 2021 23:23 |
|
Bruegels Fuckbooks posted:generally easiest thing to do is put the jwt in a cookie and have server middleware for passport auth using the cookie. yeah I'm gonna try cookie it up. edit: Yea you can set it & get it all from the server side with cookies. lovely. Ape Fist fucked around with this message at 23:59 on Mar 14, 2021 |
# ? Mar 14, 2021 23:25 |
|
I'm not a huge backend JS guy so I don't know if it's enabled by default these days but note you'll need to implement some form of CSRF protection if you're going to be handling auth that way. Here's a weird one: At work we have this ancient system that allows users to preview custom CSS changes in real time. It works by loading the home page with an iframe and then injecting a style element into it which it updates. So if I visit www.clientsite.com/style-editor it will try to load www.clientsite.com/ in an iframe. Since these are the same origin, normally this works. However, on one site in particular this is broken, with browsers throwing a DOMException and complaining about cross-origin frames when we try to access the iframe contents. This little snippet run in the console works fine elsewhere but is broken only for one client: code:
|
# ? Mar 15, 2021 21:51 |
|
I have something that should be easy but i do not know enough to be able to implement it. I want to write a tampermonkey script so when I click on an etsy image with a filename like this il_1140xN.2908605725_n4m5.jpg It downloads the unresized version with a filename like this il_fullxfull.2908605725_n4m5.jpg Obviously replacing the name is just a regex but i do not know enough about javascript and web design to do the UI part (creating a button next to the image or whatever would be fine too). Is there a good guide on how to do tampermonkey scripts, or some template i can rip off? It seems like this should be easy.
|
# ? Mar 15, 2021 23:01 |
|
Tunicate posted:I have something that should be easy but i do not know enough to be able to implement it. I want to write a tampermonkey script so when I click on an etsy image with a filename like this Very much off the top of my head (you'll probably have to mess with it a bunch depending on page details), you'd be looking at something like this: JavaScript code:
* The wrapping array/spread syntax is because of weird legacy stuff: the return value of querySelectorAll is array-like, but is missing a bunch of actual array stuff like forEach, so that converts it into a real array you can use normally for everything.
|
# ? Mar 15, 2021 23:32 |
|
Roadie posted:* The wrapping array/spread syntax is because of weird legacy stuff: the return value of querySelectorAll is array-like, but is missing a bunch of actual array stuff like forEach, so that converts it into a real array you can use normally for everything. Huh? I've done this for years
|
# ? Mar 16, 2021 01:05 |
|
Biowarfare posted:Huh? I've done this for years Oh, right, I was thinking of map, not forEach. Still might as well do it so you don't have to go back and change it if you do whatever that takes a real array.
|
# ? Mar 16, 2021 01:17 |
|
The gotcha is that it's a live NodeList, not an array. Doesn't matter in one shots like that, but if you save the query selector call to a variable and reuse it the list of nodes may not be the same on future iterations.
|
# ? Mar 16, 2021 01:21 |
|
Biowarfare posted:Huh? I've done this for years It's only worked that way the last few years
|
# ? Mar 16, 2021 01:47 |
|
Hi goons. So, I'm a junior front end dev. I've had a total of 3 months of training, then managed to score a job right after, so feel free to explain things to me as if I'm stupid. I am trying to get rid of a React warning, and I've managed to do it but I feel like my fix doesn't qualify as "good code", so I wanted to ask for advice. The problem: code:
If I add fetchGroups to the dependency array (and I add a silly console.log to the fetchGroups function) then I see that the function is triggered on every render, because although the function might be unchanged, its ref isn't. This can be fixed with: code:
The in my mind best way to do this would be, because fetchGroups truly never changes, to move fetchGroups to a separate module and import it in (because that makes it non-mutable). Problem with this is I am using notistack to report whether the fetch has been successful, and notistack needs to be inside a component. This is also what's stopping me from moving the fetchGroups function inside the useEffect hook, because then I'd have to also add notistack's enqueueSnackbar as a dependency, and I feel like that would cause pure chaos in my app's memory, and would trigger who knows how many re-renders at weird times.
|
# ? Mar 16, 2021 15:20 |
Dancer posted:Hi goons. It depends a bit on context, but I think the case might be that there actually are dependencies that your useEffect should be relying on. If it's a completely stateless fetch, the current implementation is fine, but it's not all that necessary to fetch it in the component every time, and you might as well provide it from a context higher up. Either way, I found this discussion on the linter rule pretty helpful when thinking about such things: https://github.com/facebook/react/issues/14920#issuecomment-471070149
|
|
# ? Mar 16, 2021 16:27 |
|
drat 3 months to a job, congrats man, how'd you pull that off
|
# ? Mar 16, 2021 18:26 |
|
Random question, and I'm not the frontend eng just looking for advice to pass along. We have a video player app where the clips are snippets from a longer video. We're refactoring our pipeline so instead of generating thousands of little clips, we will pretend they are separate clips in the frontend but really just play the correct portion of the video. The problem is the video scrubber (the timeline of the video for seeking). It seems there are lots of ways to modify it, show the start and end points of the clip, disable the other portions, but for a 20 second clip in a 2 hour video, it's not ideal. One of the devs is saying "scrubber takes ALL the video length, not the clip. that’s something we cannot avoid since its calculations (native player or vimejs) are based in the video metadata." Anyone have any idea if there's a way to fake that? (we're using vimejs as the quote indicates)
|
# ? Mar 16, 2021 18:43 |
|
Do you really need a plug-in for that? Never heard of vimejs, but if you roll your own player, you can completely hide controls, and just draw your own scrubber based on start and end time. Calculations to know the percentage of playback based on video.currentTime is trivial.
|
# ? Mar 16, 2021 18:51 |
|
Guess I have to ask: why are you structuring the video clips this way? At first blush, that sounds like a recipe for disaster. You'd be forcing the user to load a larger video than they need and building out a complicated, bespoke scrubber/video player that will need to accept a set of sort of non-standard parameters.
|
# ? Mar 16, 2021 19:16 |
|
edit: lol didn't read the thread, this is identical to a question further up
oh no computer fucked around with this message at 19:40 on Mar 16, 2021 |
# ? Mar 16, 2021 19:21 |
|
go play outside Skyler posted:Do you really need a plug-in for that? Never heard of vimejs, but if you roll your own player, you can completely hide controls, and just draw your own scrubber based on start and end time. Calculations to know the percentage of playback based on video.currentTime is trivial. Yeah we could probably implement our own controls, I'll see if that's an option. fsif posted:Guess I have to ask: why are you structuring the video clips this way? At first blush, that sounds like a recipe for disaster. Because generating literally thousands of clips in the backend (most of them overlapping, some nearly identical) is expensive and takes a long time. We transcode our videos to a chunked streaming format which allows us to avoid loading the whole video (although it might try to load the rest of the video, it doesn't load the earlier part). Anways all the clips are from the same longer video so once that's loaded I would hope it's cached for any clips, although I don't know the low-level details. We're only at the POC stage and it seems to work pretty well, minus the scrubber thing. I think it solves more problems than it creates, but we'll be able to validate that soon enough.
|
# ? Mar 16, 2021 19:50 |
|
WHERE MY HAT IS AT posted:I'm not a huge backend JS guy so I don't know if it's enabled by default these days but note you'll need to implement some form of CSRF protection if you're going to be handling auth that way. Self-quoting because I figured this out and it's as dumb as you think it is: The client added their own tracking script to the page which was silently updating document.domain after the initial load, thus breaking the same-origin policy.
|
# ? Mar 16, 2021 19:59 |
|
SurgicalOntologist posted:Because generating literally thousands of clips in the backend (most of them overlapping, some nearly identical) is expensive and takes a long time. Gotcha. Yeah, obviously you know your project better than I do so take what I say with whatever appropriate amount of salt. BUT I'd just caution that the solution of "rolling your own" scrubber might not be that easy. There's no native way to do it with Vime as far as I can tell. If your team is comfortable ditching Vime and want to use a low-level <video> tag to program it, there are still a lot of responsive and accessibility hurdles you'll want to make sure to clear. Also don't know if your chunking solution is in some ways dependent on Vime. Should also note that in my (not particularly robust, but still existent!) experience with trying to pause a longer video at a certain spot to bring about an artificial end, the native JavaScript events weren't that precise. The clip would stop within a 1+ second range. So you know, totally unsolicited and underinformed opinion here, but in the abstract a project like this could end up being one where you end up spending more developers and technical debt than you do just running the servers, heh.
|
# ? Mar 16, 2021 21:13 |
|
Appreciate the advice! Probably we don't go too far beyond this POC any time soon anyway, we got bigger priorities before we would attempt to implement our own scrubber (if we do go that way).
|
# ? Mar 16, 2021 21:43 |
|
fsif posted:Gotcha. Yeah, obviously you know your project better than I do so take what I say with whatever appropriate amount of salt. Not to derail, but I think what you experienced might be due to keyframes. Not sure you can just seek to any random position in the video like that, it might snap to h264 keyframes. Come to think about it, I'd also suggest generating the clips on the server-side!
|
# ? Mar 16, 2021 21:59 |
|
If you have a chunked format already, and your server can already pick out which exact chunks are needed when there user wants a clip from 1:16:37 to 1:15:37, you could probably even do it live on the server by generating a header and then appending the relevant chunks from the master file. No need to be storing each individual clip or anything.
|
# ? Mar 17, 2021 01:06 |
|
SurgicalOntologist posted:Because generating literally thousands of clips in the backend (most of them overlapping, some nearly identical) is expensive and takes a long time. Going to say this out loud because nobody else has and I've had worse blind spot misses myself, but: if you split your source video into individual images per frame then ffmpeg will be able to spit out bespoke clips pretty quickly.
|
# ? Mar 17, 2021 04:23 |
|
Jabor posted:If you have a chunked format already, and your server can already pick out which exact chunks are needed when there user wants a clip from 1:16:37 to 1:15:37, you could probably even do it live on the server by generating a header and then appending the relevant chunks from the master file. No need to be storing each individual clip or anything. Aha, thanks! That should be an easy solution. Newf posted:Going to say this out loud because nobody else has and I've had worse blind spot misses myself, but: if you split your source video into individual images per frame then ffmpeg will be able to spit out bespoke clips pretty quickly. Yeah, it's what we're doing. But still, encoding the clips (at several bitrates) is slower than we'd like. If it were on demand, maybe, but we get them all at once and it seemed an easy part of our pipeline to get rid of. The clips increase the total video to process and store by as much as 20x, and that's only going to increase as we detect more and more types of clips (basically, we detect events from the video). It doesn't seem very scalable. The clips aren't even the main use case (primary one is a timeline view where it makes sense that the scrubber shows the whole video, and clicking on a "clip" in the timeline just seeks to wherever you clicked) so if we have to sacrifice a little usability of the player it's not a big deal. Anyways, it's only POC stage so maybe we change our mind still.
|
# ? Mar 17, 2021 09:26 |
|
Comedy option: deliver video video an mjpeg stream
|
# ? Mar 17, 2021 11:40 |
|
|
# ? May 16, 2024 17:21 |
|
Empress Brosephine posted:drat 3 months to a job, congrats man, how'd you pull that off 90% of getting a job is based on who you know. Being good at that job is just a helpful bonus. Please note that I am not implying that Dancer is not good at their job, just pointing out that all forms of success are frequently based on luck or connections.
|
# ? Mar 17, 2021 16:08 |