The Web Design & Development Megathread

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > The Web Design & Development Megathread

«‹›362 »

Tei: Feb 19, 2011; Can't post for 5 days!

kedo posted:

ssh:

truth

# ? Mar 31, 2021 16:50

Adbot: ADBOT LOVES YOU

# ? Jun 5, 2024 17:49

Empress Brosephine: Mar 31, 2012; by Jeffrey of YOSPOS

Quick accesability question and best use for mobile...

I have a "table" of data thats 3 rows and 13 columns. I'd like to make a nice way of presenting the data, and was considering using a table. Are tables still web design taboo though? Are they accesable and work on mobile devices?

Thanks for your help goons

# ? Apr 3, 2021 14:01

smackfu: Jun 7, 2004

Tables are fine for tabular data, but there�s no way to make 11 columns work on a phone. We usually end up making a single cell row that has all the data that would normally be spread across the columns.

# ? Apr 3, 2021 14:24

Gildiss: Aug 24, 2010; Grimey Drawer

Maybe splitting it into a few tables that contain somewhat related columns in each.

# ? Apr 3, 2021 14:35

Empress Brosephine: Mar 31, 2012; by Jeffrey of YOSPOS

Wait I had that backwards 11 rows 3 columns lmao.

# ? Apr 3, 2021 15:35

The Merkinman: Apr 22, 2007; I sell only quality merkins. What is a merkin you ask? Why, it's a wig for your genitals!

For large enough screens, a table is fine, since it's tabular data. For smaller screens I've done something like this: https://medium.com/allenhwkim/mobile-friendly-table-b0cb066dbc0e

# ? Apr 3, 2021 15:40

Empress Brosephine: Mar 31, 2012; by Jeffrey of YOSPOS

sweet ill try that, thanks

# ? Apr 3, 2021 20:02

Violator: May 15, 2003

Finally building out my first big project with tailwind css. Feels kind of dirty just throwing 10 classes on every element since I spent most of my career writing custom css for everything, but drat I�m moving fast and getting relatively fancy results without much headache. I used bootstrap on a few projects but like tailwind better since it feels like I have more freedom to customize.

# ? Apr 10, 2021 15:46

Empress Brosephine: Mar 31, 2012; by Jeffrey of YOSPOS

I like tailwind but I almost exclusively use bulma.

I was looking at job listings and I've noticed a large usage of Java...is it worth learning Java at all still?

# ? Apr 12, 2021 15:22

The Fool: Oct 16, 2003

I mean yes?

By most reports Spring / Spring boot is good and won�t be going away anytime soon.

I�ve never gotten past a hello world app in Java, but I don�t see the language going away anytime soon.

It�s not ruby after all.

# ? Apr 12, 2021 15:26

Empress Brosephine: Mar 31, 2012; by Jeffrey of YOSPOS

Heh rip ruby

Rust seems co too but maybe flavor of the month?

# ? Apr 12, 2021 15:31

prom candy: Dec 16, 2005; Only I may dance

Tailwind rules.

I still use Ruby every day, but I wish I didn't. It was amazing in 2005-2006 when I picked it up. In today's landscape it kinda sucks bigtime.

# ? Apr 12, 2021 19:04

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

prom candy posted:

Tailwind rules.

I still use Ruby every day, but I wish I didn't. It was amazing in 2005-2006 when I picked it up. In today's landscape it kinda sucks bigtime.

Having never used either, is it Ruby the language that is awful, or is it because it's effectively a synonym for "Rails"?

# ? Apr 12, 2021 19:08

The Fool: Oct 16, 2003

Ruby now I feel like is synonymous with Ruby on Rails just because those are the projects that survived.

When ruby was new it seemed to occupy the same kind of space as Perl and python but python won that war.

# ? Apr 12, 2021 19:39

Impotence: Nov 8, 2010; Lipstick Apathy

the web framework Rails is/was a massive walking vulnerability, from everything file uploads to activerecord to headers to whatever the gently caress else, it was super popular for a while, but it had almost no bearing on actual Ruby.

Anecdotally, I still see some Ruby use (directly, without rails) seemingly mostly in Germany and Japan; Rails was really only a thing in the west?

# ? Apr 12, 2021 19:39

marumaru: May 20, 2013

Biowarfare posted:

Anecdotally, I still see some Ruby use (directly, without rails) seemingly mostly in Germany and Japan

Job postings in Japan are wild. It's often Ruby, Java (JSP!!!) and sometimes even Perl.

# ? Apr 12, 2021 19:54

Impotence: Nov 8, 2010; Lipstick Apathy

marumaru posted:

Job postings in Japan are wild. It's often Ruby, Java (JSP!!!) and sometimes even Perl.

Some of the JP people I've worked with are like wtf when they encounter the "Rails is omakase" ecosystem, half the gems are bizarrely named unrelated single-word Japanese characters like nokogiri, etc.

# ? Apr 12, 2021 20:11

marumaru: May 20, 2013

Biowarfare posted:

Some of the JP people I've worked with are like wtf when they encounter the "Rails is omakase" ecosystem, half the gems are bizarrely named unrelated single-word Japanese characters like nokogiri, etc.

As someone who's never writtena single line of Rails, would you care to elaborate. That sounds pretty amusing.

marumaru fucked around with this message at 22:23 on Apr 12, 2021

# ? Apr 12, 2021 20:38

Good Sphere: Jun 16, 2018

edit: Maybe it's as easy as getting values like this? They are all appearing in the console successfully. I'll have look into the proper ways of actually using them. ~~I figure the ID could be the unique identifier on my database to authenticate the user.~~ Never mind it's telling me to get a token.

code:

    function onSuccess(googleUser) {
      console.log('Logged in as: ' + googleUser.getBasicProfile().getName());
      var profile = googleUser.getBasicProfile();
      console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
      console.log('Name: ' + profile.getName());
      console.log('Image URL: ' + profile.getImageUrl());
      console.log('Email: ' + profile.getEmail()); 
    }

I'm very confused about Google's Token Service API. I have a test Google login working for my site. I'm on Google Cloud Platform, and added Token Service API. I see a link for "Tutorials and documentation", because I want to know how to actually get a token ID from the client working, but it leads to a page that says June 30, 2020, the SDKs documented on this page and the API setting page will stop functioning. But I want to know how to use the Token Service API, and that's on the Google Cloud Platform, but the documentation leads to a page saying that it's no longer supported. What gives?

Good Sphere fucked around with this message at 22:31 on Apr 12, 2021

# ? Apr 12, 2021 22:17

Just-In-Timeberlake: Aug 18, 2003

so I've got an odd problem (at least I think it is)

I've got this code:

code:

$(document).ready(function () {
    $("#select option:first").remove();
    
})

that just removes the first element of a select dropdown when the page is done loading. It's a Swagger generated page, so while I don't have control on what gets populated in there initially, I figure I can just remove this particular option by injecting some JS and nobody is the wiser.

Here's the thing, it works fine in everything but Chrome. I've even tried plain vanilla JS, and still no go.

If I debug it, Chrome tells me the number of items in that <select> is zero, all other browsers give me the right number of options.

Kinda stumped here, Chrome never throws me a curve like this.

# ? Apr 12, 2021 22:38

kedo: Nov 27, 2007

Throw the whole thing within a settimeout and see what it does. Maybe for some reason there are no options present when the JS fires?

# ? Apr 13, 2021 02:37

ModeSix: Mar 14, 2009

Just-In-Timeberlake posted:

so I've got an odd problem (at least I think it is)

I've got this code:
code:
$(document).ready(function () {
    $("#select option:first").remove();
    
})
that just removes the first element of a select dropdown when the page is done loading. It's a Swagger generated page, so while I don't have control on what gets populated in there initially, I figure I can just remove this particular option by injecting some JS and nobody is the wiser.

Here's the thing, it works fine in everything but Chrome. I've even tried plain vanilla JS, and still no go.

If I debug it, Chrome tells me the number of items in that <select> is zero, all other browsers give me the right number of options.

Kinda stumped here, Chrome never throws me a curve like this.

kedo posted:

Throw the whole thing within a settimeout and see what it does. Maybe for some reason there are no options present when the JS fires?

Absolutely what kedo said. I've had the exact thing happen because somehow in Chrome (and only Chrome) the js fires before the DOM is done rendering. Delay it by 250 or 500ms and you should be good to go.

# ? Apr 13, 2021 03:03

Data Graham: Dec 28, 2009; 📈📊🍪😋

The hell's the point of $(document).ready() then

It had one job

# ? Apr 13, 2021 11:47

Just-In-Timeberlake: Aug 18, 2003

kedo posted:

Throw the whole thing within a settimeout and see what it does. Maybe for some reason there are no options present when the JS fires?

That did the trick, thanks.

Data Graham posted:

The hell's the point of $(document).ready() then

It had one job

Which is why it never occurred to me to consider it as the problem :eng99:

# ? Apr 13, 2021 12:58

Data Graham: Dec 28, 2009; 📈📊🍪😋

I mean if we can't rely on it that's going to gently caress up an immense number of (my) websites.

# ? Apr 13, 2021 13:15

Bruegels Fuckbooks: Sep 14, 2004; Now, listen - I know the two of you are very different from each other in a lot of ways, but you have to understand that as far as Grandpa's concerned, you're both pieces of shit! Yeah. I can prove it mathematically.

Data Graham posted:

I mean if we can't rely on it that's going to gently caress up an immense number of (my) websites.

google chrome is the ie6 of 2021.

# ? Apr 13, 2021 13:57

marumaru: May 20, 2013

Does

code:

document.addEventListener('DOMContentLoaded', (event) => {
  //the event occurred
})

not work?

Bruegels Fuckbooks posted:

google chrome is the ie6 of 2021.

That's Safari.

# ? Apr 13, 2021 14:11

MrMoo: Sep 14, 2000

Data Graham posted:

The hell's the point of $(document).ready() then

It had one job

It's jQuery, it has baggage and bugs. It is supposed to be equivalent to HTML 5's 'DOMContentLoaded' event, try sticking to vanilla JS. It looks like you probably managed to get the 'load' event by accident instead.

# ? Apr 13, 2021 17:52

bigperm: Jul 10, 2001; some obscure reference

I am a beginner who is working on a Django app and I have a model called Log:

code:

class Log(models.Model):
    unit = models.ForeignKey(Unit, on_delete=models.CASCADE)
    status = models.ForeignKey(StatusField, on_delete=models.CASCADE)
    photo = models.ImageField(blank=True, null=True)
    created_on = models.DateTimeField(auto_now_add=True)
    last_modified = models.DateTimeField(auto_now=True)
    room = models.ForeignKey(Room, on_delete=models.CASCADE)

All I want to do is update the status. Here is the view for that:

code:

def log_update_status(request, log_id):
    thisLog = get_object_or_404(Log, pk=log_id)

    if request.method == 'POST':
        form = LogForm(request.POST, request.FILES)
        if form.is_valid():
            thisLog.status = form.cleaned_data['status']
            thisLog.save()
            return reverse('inspection:unit', kwargs={'unit_id': self.object.unit.pk})
    else:
    
        form = LogForm(instance=thisLog)
        context = {
            "form": form,
            "log_id": log_id
        }
        return render(request, 'inspection/log_update_form.html', context)

Whenever I try, instead of just updating the 'status' of the log, it creates a new log exactly like the one I am trying to update but with the 'photo' field blank, and then complains that there isn't a photo there. If anyone has any clue what I have to do to just update the field (which works fine in the admin) I would really appreciate it.

# ? Apr 13, 2021 22:16

Violator: May 15, 2003

What the gently caress, you guys weren't lying about modern JS. I'm working on this project and decided not to install any JS libraries and it turns out modern JS is great for the basic stuff I need it for. I should have given up jQuery a long time ago.

# ? Apr 13, 2021 22:36

Impotence: Nov 8, 2010; Lipstick Apathy

all/most browsers already alias $ to querySelector and $$ to querySelectorAll

# ? Apr 13, 2021 22:42

Ima Computer: Oct 28, 2007; Stop all the downloading!

Help computer.

Biowarfare posted:

all/most browsers already alias $ to querySelector and $$ to querySelectorAll

This only works while you're in the console.

# ? Apr 13, 2021 23:00

Impotence: Nov 8, 2010; Lipstick Apathy

fireraiser posted:

This only works while you're in the console.

huh, so it is. I blame way too much console use for this

# ? Apr 13, 2021 23:12

minato: Jun 7, 2004; cutty cain't hang, say 7-up.; Taco Defender

bigperm posted:

Whenever I try, instead of just updating the 'status' of the log, it creates a new log exactly like the one I am trying to update but with the 'photo' field blank, and then complains that there isn't a photo there. If anyone has any clue what I have to do to just update the field (which works fine in the admin) I would really appreciate it.

I don't actually know, but I can see a few issues with your code.

code:

from shortcuts import redirect

def log_update_status(request, log_id):
    thisLog = get_object_or_404(Log, pk=log_id)

    if request.method == 'POST':
        form = LogForm(request.POST, request.FILES)
        if form.is_valid():
            thisLog.status = form.cleaned_data['status']
            thisLog.save()
            return redirect(reverse('inspection:unit', unit_id=self.object.unit.pk))
    else:
        form = LogForm(instance=thisLog)

    context = {
        "form": form,
        "log_id": log_id
    }
    return render(request, 'inspection/log_update_form.html', context)

Changes here:

1. the first "return" should be returning a HttpResponseRedirect() object, not the results of `reverse` which is just a string. (although I dunno, maybe Django is smart enough to recognize that you just returned a string and will auto-wrap it in a HttpResponseRedirect. Either way, best to be explicit). You can either return a HttpResponseRedirect(...some_url...) or call shortcuts.redirect(...some_url...), it's the same thing.

2. you don't need to specify "some_func(kwargs ={'foo': bar}"), just write "some_func(foo=bar)". This is Python syntactic sugar; when you define a function "def blah(abc, *args, **kwargs):" then you can call "blah(123, 4, 5, x=7, y=8)" then inside blah(), Python will auto-populate the variables "abc=123", "args=[4,5]" and "kwargs={'x': 7, 'y': 8}". It's just a way for a call-site to pass an arbitrary set of parameters to a method, and for the method to easily access them.

3. The "context = ..." and "return render(...)" should always be called, except when the form is POST'd + valid. So I moved the indent out. With your code, if the form was POST'd but failed to validate then it would skip over the "if form.is_valid()" part, skip past the next "else:", and fall off the end of the function. In that situation the function would run out of code so it will implicitly return None, which Django won't know what to do with; I don't actually know what behavior it will do, possibly some Internal Server Error.

The rest of it seems to be ok, but it's hard to tell without more info. At least by fixing the problems above, you can start injecting logger.debug() calls to see which code paths are being taken.

# ? Apr 14, 2021 00:09

frogbs: May 5, 2004; Well well well

Has anyone here switched to Google Analytics 4 (GA4) yet? I was looking for 'pageviews' everywhere, but I guess now it's automatically added as an event labeled "page_view"... I guess as SPA's become more common the pageview isn't going to be a great metric, but I think it's going to confuse a lot of web yokels like myself at first.

# ? Apr 14, 2021 00:24

Data Graham: Dec 28, 2009; 📈📊🍪😋

bigperm posted:

I am a beginner who is working on a Django app and I have a model called Log:
code:
class Log(models.Model):
    unit = models.ForeignKey(Unit, on_delete=models.CASCADE)
    status = models.ForeignKey(StatusField, on_delete=models.CASCADE)
    photo = models.ImageField(blank=True, null=True)
    created_on = models.DateTimeField(auto_now_add=True)
    last_modified = models.DateTimeField(auto_now=True)
    room = models.ForeignKey(Room, on_delete=models.CASCADE)
All I want to do is update the status. Here is the view for that:
code:
def log_update_status(request, log_id):
    thisLog = get_object_or_404(Log, pk=log_id)

    if request.method == 'POST':
        form = LogForm(request.POST, request.FILES)
        if form.is_valid():
            thisLog.status = form.cleaned_data['status']
            thisLog.save()
            return reverse('inspection:unit', kwargs={'unit_id': self.object.unit.pk})
    else:
    
        form = LogForm(instance=thisLog)
        context = {
            "form": form,
            "log_id": log_id
        }
        return render(request, 'inspection/log_update_form.html', context)
Whenever I try, instead of just updating the 'status' of the log, it creates a new log exactly like the one I am trying to update but with the 'photo' field blank, and then complains that there isn't a photo there. If anyone has any clue what I have to do to just update the field (which works fine in the admin) I would really appreciate it.

What does your LogForm look like?

Also I'd recommend moving your followups to the Django thread, you'll get more specialized eyeballs there.

https://forums.somethingawful.com/showthread.php?threadid=2790475

# ? Apr 14, 2021 01:19

bigperm: Jul 10, 2001; some obscure reference

minato posted:

very helpful help

Thank you.

Turns out I was posting the form to the CreateView url the whole time because I just copy/pasted the template without changing anything. :bravo:

Data Graham posted:

What does your LogForm look like?

Also I'd recommend moving your followups to the Django thread, you'll get more specialized eyeballs there.

https://forums.somethingawful.com/showthread.php?threadid=2790475

I did not know there was a Django thread! Thank you.

bigperm fucked around with this message at 02:30 on Apr 14, 2021

# ? Apr 14, 2021 02:28

Skyarb: Sep 20, 2018; MMMPH MMMPPHH MPPPH GLUCK GLUCK OH SORRY I DIDNT SEE YOU THERE I WAS JUST CHOKING DOWN THIS BATTLEFIELD COCK DID YOU KNOW BATTLEFIELD IS THE BEST VIDEO GAME EVER NOW IF YOULL EXCUSE ME ILL GO BACK TO THIS BATTLECOCK

I have an element that is nested in some containers on my page. I nee the element to maintain a 1:1 aspect ratio. I have been using the padding-top trick to make it maintain that aspect ratio and it works great.

But the problem is, if it grows too big I need to pin the max-height, however apparently because of hte nature of padding top I don't know how to make it respect any max-height (as the container has really no height itself, its all dynamic padding).

So what I need is: a div container that maintains a 1:1 aspect ratio, expands as the container its in grows in width, but can stop at a certain size (ideally 100% of the viewport).

Any ideas?

# ? Apr 16, 2021 21:35

HappyHippo: Nov 19, 2003; Do you have an Air Miles Card?

Can you achieve this with a media query?

# ? Apr 16, 2021 22:14

Adbot: ADBOT LOVES YOU

# ? Jun 5, 2024 17:49

The Merkinman: Apr 22, 2007; I sell only quality merkins. What is a merkin you ask? Why, it's a wig for your genitals!

Skyarb posted:

I have an element that is nested in some containers on my page. I nee the element to maintain a 1:1 aspect ratio. I have been using the padding-top trick to make it maintain that aspect ratio and it works great.

But the problem is, if it grows too big I need to pin the max-height, however apparently because of hte nature of padding top I don't know how to make it respect any max-height (as the container has really no height itself, its all dynamic padding).

So what I need is: a div container that maintains a 1:1 aspect ratio, expands as the container its in grows in width, but can stop at a certain size (ideally 100% of the viewport).

Any ideas?

Aspect Ratio, screw every browser that's not Chrome/Edge.
~~Seriously though, could you put a max-width, yes width, on the container?~~ nevermind, that doesn't work, sorry.

The Merkinman fucked around with this message at 22:43 on Apr 16, 2021

# ? Apr 16, 2021 22:39

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > The Web Design & Development Megathread

«‹›362 »