The Web Design & Development Megathread

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

«‹›361 »

Dominoes: Sep 20, 2007

Question about keeping web page information up-to-date. I have a web site made using Django that initially takes a datetime input on one page/view, then displays another page/view after pulling info from an API, based on the user input. I'd like the results page to stay up-to-date as info from the API changes, ie reload it once a minute. How can I do this?

This performs the refresh, but causes a post-data warning popup. I've heard there's a way to spoof it into a get request, or hard-set a URL, but I need the post data, ie the input datetime.

code:

setTimeout(function(){
   window.location.reload(true);
}, 5000);

Javascript and its libraries can make dynamic content, but I have enough Python code the page runs that re-coding it in JS isn't viable.

I've heard a Django addon called comet can do this, but I've no idea how to do it: Searching pulls up StackOverflow pages of people being confused.

I've heard of a Post-Redirect-Get architecture, but don't know how to implement it.

Dominoes fucked around with this message at 01:04 on Apr 17, 2016

# ? Apr 17, 2016 01:01

Adbot: ADBOT LOVES YOU

# ? May 8, 2024 11:10

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

Post redirect get is the pattern you want. Essentially all you need to do is accept the POST and use that information to set session information which is trivial with Django's sessions support. Once you've done that just redirect them to a page that uses that session information to render.

A simple example is a checkout:

POST, process the order and set a session variable saying their receipt is no 5 or 6 or whatever.

REDIRECTS to the receipt page.

GET the receipt page, with the server using the session variable to retrieve the correct receipt.

It'll be trivial to use this same pattern to render your Django views. Just restrict the POST view to JUST handling the setting of the session variable and then redirecting to the GET page.

# ? Apr 17, 2016 01:13

Forseeable Fuchsia: Dec 28, 2011

Mock and Droll posted:

I've been commissioned to work on a couple projects for some mates, and I've got a couple Qs for you guys.

Sort of a cross-post from the Wordpress thread, I've been working on an online survey to collect research data for a mate in Sweden that needs to be essentially a multipage form with required fields being checked on each page instead of at the end like my current Ninja Forms plugin does, with ideally data being saved each time the 'next' button is pressed, so if something happens to a user while they're filling out the form, we still capture the data. Would have used Google Forms, but we can't let people go back to previous pages in the survey. My current set up is a Wordpress website using Ninja Forms plugin for the actual forms. It does most of what we need, but it's not the greatest solution. What would be my other options for this? I've got some experience in HTML coding and all that, but haven't done anything of this scale from scratch before.

Separate question: I've also got to make an interactive learning tool that shows a human cell, and the parts that make it up. When a student hovers over, or clicks on one of the components, it will pop up in a modal or something giving the info about it. The brief suggests an image map would be one solution for this - are imagemaps even still things? And wouldn't there be problems making a responsive imagemap? Alternatively, are there any better ways of doing something similar (having a central interactive image that students can 'explore', I guess?) without an imagemap?

I've played around with this imagemap thing, and it's...not entirely horrible. I am a little confused as to why the imagemap is what the person wants, but it works and is even responsive using jQuery-rwdImageMaps. Works fine messing around with the browser and across my phone and tablet. However, it doesn't seem to work with iOS devices. Is there something I'm missing that's special about iOS with regards to imagemaps?

e: poo poo, I should have just done a tiny amount of extra work and done stuff with SVG.

Forseeable Fuchsia fucked around with this message at 09:09 on Apr 17, 2016

# ? Apr 17, 2016 08:55

Dominoes: Sep 20, 2007

Maluco Marinero posted:

Post redirect get is the pattern you want. Essentially all you need to do is accept the POST and use that information to set session information which is trivial with Django's sessions support. Once you've done that just redirect them to a page that uses that session information to render.

A simple example is a checkout:

POST, process the order and set a session variable saying their receipt is no 5 or 6 or whatever.

REDIRECTS to the receipt page.

GET the receipt page, with the server using the session variable to retrieve the correct receipt.

It'll be trivial to use this same pattern to render your Django views. Just restrict the POST view to JUST handling the setting of the session variable and then redirecting to the GET page.

Hey so, I'm an idiot; how do I do that? Here's what my view looks like, paraphrased; Django boilerplate standard.

Python code:

def index(request):
    if request.method == 'POST':
        form = LandForm(request.POST)
        if form.is_valid():
            land_date = form.cleaned_data['land_date']
            # More form processing here
     
            # Python code that needs to run every refresh; uses API calls.
            alt_required, decoded, possible_alts, alt_names, decoded_alts = \
                alternate_code.process(land_dt)

            context = {...}
            return render(request, 'alternate/index.html', context)
        else:
            return HttpResponseRedirect('/not quite!/')
    else:
        form = LandForm()
        return render(request, 'alternate/form.html', {'form': form})

Sounds like I need to research sessions. The only thing that needs to stay the same between refreshes is the user input datetime. (Or let them readjust the input from the results page, but that's a stretch goal!)

Dominoes fucked around with this message at 10:21 on Apr 17, 2016

# ? Apr 17, 2016 09:31

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

So I could probably structure this better, but I wanted to avoid changing the code structure too much, hopefully you can follow whats happening here,
this one view is doing a lot but the gist of it is:

- get land_date currently in session
- if the request is a POST process the form and update the session, then redirect to get us back to a GET
- if the request is a GET and there is no land_date in session, just show the form
- if the request is a GET and there IS a land_date in session, use that variable to render the data

Once the session variable is set, every refresh will just end up showing the rendered data (the final else block) unless the user clears their cookies

Dominoes posted:

Hey so, I'm an idiot; how do I do that? Here's what my view looks like, paraphrased; Django boilerplate standard.

Python code:

def index(request):
    land_date = request.session.get('land_date', None)
    # check the session data, defaulting to None

    if request.method == 'POST':
        # its a post so process the form, updating the session if valid
        form = LandForm(request.POST)
        if form.is_valid():
            land_date = form.cleaned_data['land_date']
            # set session data, finish processing form and then direct back to this page
            request.session['land_date'] = land_date
            # More form processing here ( if more form data is used save that to the session too)
            return HttpResponse(reverse(index)) # redirecting to this page as a get
        else:
            return render(request, 'alternate/form.html', {'form': form})
            # form was invalid so return with validation errors

    elif land_date is None:
        form = LandForm()
        return render(request, 'alternate/form.html', {'form': form})
        # no date found in the session so just give the form
  
    else:
        # Python code that needs to run every refresh. 
        alt_required, decoded, possible_alts, alt_names, decoded_alts = (
            alternate_code.process(land_date)
        )

        context = {...}
        
        # actual view with data rendered, make sure the form is provided
        # so they can update the view if necessary
        return render(request, 'alternate/index.html', context)

And yeah, sessions is what you're using.

# ? Apr 17, 2016 10:29

Dominoes: Sep 20, 2007

Thanks! Working through that now.

edit: Works great; thank you! Had to serialize the datetime as a tuple to make it work with the [JSON] session. Is there a way to make it so I can then send info back to the web page when it refreshes? Ie Now once I set the datetime, I'm stuck with that one indefinitely. Ie could put a JS date/time picker on the web page and send that back as post data, but am not sure how. Like a reverse of the context dictionary.

Dominoes fucked around with this message at 11:56 on Apr 17, 2016

# ? Apr 17, 2016 11:01

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

Yeah, if the form isn't on the infinitely refreshing page, how bout set it up as a new view that you can click through to. On that view you just render the form like normal, and then on post update the session and then redirect back to your main view.

# ? Apr 17, 2016 13:12

Dominoes: Sep 20, 2007

Boom; that worked.

When I submit the form (either initially, or from the separate view), I receive a blank page that just says '/alternate'. No idea why; seems to have to due with the reverse command. Manually entering the URL from this page solves it.

Dominoes fucked around with this message at 13:23 on Apr 17, 2016

# ? Apr 17, 2016 13:15

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

The reverse command is just a way to turn your view intro the correct url. You should read into Django's url resolvers and make sure it points to the right url.

# ? Apr 17, 2016 14:15

Dominoes: Sep 20, 2007

Fixed by replacing the reverse line with return HttpResponseRedirect('/alternate')

Thanks again; you saved me a lot of aggravation.

# ? Apr 17, 2016 14:39

RobertKerans: Aug 25, 2006; There is a heppy lend
Fur, fur aw-a-a-ay.

Mock and Droll posted:

Separate question: I've also got to make an interactive learning tool that shows a human cell, and the parts that make it up. When a student hovers over, or clicks on one of the components, it will pop up in a modal or something giving the info about it. The brief suggests an image map would be one solution for this - are imagemaps even still things? And wouldn't there be problems making a responsive imagemap? Alternatively, are there any better ways of doing something similar (having a central interactive image that students can 'explore', I guess?) without an imagemap?

If at all possible, get the images converted to SVGs and dump them inline; then the image has a standard DOM structure. Attach pop-ups/modals/whatever to the bits of that. Seperating out the XML is always a bit of a faff, attaching classes or whatnot, but once that's done it works better than anything else.

# ? Apr 17, 2016 15:20

nexus6: Sep 2, 2011; If only you could see what I've seen with your eyes

We have a client that is forwarding every single spam form submission to us as if they are utterly amazed that they could be receiving spam despite having Google reCaptcha validated on the client side. They are not allowing us to do any kind of server side processing on the form but insist that all spam must be stopped

# ? Apr 18, 2016 15:26

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

nexus6 posted:

We have a client that is forwarding every single spam form submission to us as if they are utterly amazed that they could be receiving spam despite having Google reCaptcha validated on the client side. They are not allowing us to do any kind of server side processing on the form but insist that all spam must be stopped

Take the form off the site. Done.

# ? Apr 18, 2016 16:18

kedo: Nov 27, 2007

What's the term for when you're conducting a survey on a site, but it waits to give you the survey until you finish doing whatever it was you came to the site to do?

# ? Apr 19, 2016 19:43

Spatulater bro!: Aug 19, 2003; Punch! Punch! Punch!

kedo posted:

What's the term for when you're conducting a survey on a site, but it waits to give you the survey until you finish doing whatever it was you came to the site to do?

An exit survey?

# ? Apr 19, 2016 21:39

kedo: Nov 27, 2007

caiman posted:

An exit survey?

Works for me, that's what I've been calling it. I was wondering if there was something more web jargon-y, but :shrug:

# ? Apr 19, 2016 21:46

nexus6: Sep 2, 2011; If only you could see what I've seen with your eyes

Lumpy posted:

Take the form off the site. Done.

"We got a spam submission but the form fields have the HTML required attribute. How is this possible?!?"

:fuckoff:

# ? Apr 20, 2016 16:38

DarkLotus: Sep 30, 2001; Lithium Hosting
Personal, Reseller & VPS Hosting
30-day no risk Free Trial &
90-days Money Back Guarantee!

nexus6 posted:

"We got a spam submission but the form fields have the HTML required attribute. How is this possible?!?"

You can use the dev console to remove the required attribute...
You can also post from a remote form to the endpoint of your form, without serverside validation, you cannot prevent spam submissions.

# ? Apr 20, 2016 16:50

nexus6: Sep 2, 2011; If only you could see what I've seen with your eyes

DarkLotus posted:

You can use the dev console to remove the required attribute...
You can also post from a remote form to the endpoint of your form, without serverside validation, you cannot prevent spam submissions.

I know that, it's just getting it through my client's skull that's the hard part.

# ? Apr 20, 2016 17:06

pipebomb: May 12, 2001; Dear God, what is it like in your funny little brains?
It must be so boring.

Hey nerds - can you help me determine who made this site (it looks internal to me), and what/if any pre-built framework it may be using (it looks custom)?

http://www.pbslearningmedia.org/standards/0

# ? Apr 20, 2016 20:16

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

pipebomb posted:

Hey nerds - can you help me determine who made this site (it looks internal to me), and what/if any pre-built framework it may be using (it looks custom)?

http://www.pbslearningmedia.org/standards/0

In terms of look & feel, it looks to be Bootstrap, with Backbone & JQuery for the actual code. You can see the libraries loaded in Chrome Dev tools

# ? Apr 20, 2016 20:25

McGlockenshire: Dec 16, 2005; GOLLOCKS!

pipebomb posted:

Hey nerds - can you help me determine who made this site (it looks internal to me), and what/if any pre-built framework it may be using (it looks custom)?

http://www.pbslearningmedia.org/standards/0

Yeah, looks quite custom. The only frameworky thing I see there is Backbone.

e: ^^ that too

# ? Apr 20, 2016 20:25

The March Hare: Oct 15, 2006; _{Je r�ve d'un}
Wayne's World 3; Buglord

# ? Apr 20, 2016 20:27

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

The March Hare posted:

That's an even fancier image... where did you get that?

# ? Apr 20, 2016 20:29

Depressing Box: Jun 27, 2010; Half-price sideshow.

Skandranon posted:

That's an even fancier image... where did you get that?

That looks like Wappalyzer.

# ? Apr 20, 2016 20:36

Skandranon: Sep 6, 2008; fucking stupid, dont listen to me

Depressing Box posted:

That looks like Wappalyzer.

Interesting, it's able to pick up libraries even when they are bundled together. That's handy.

# ? Apr 20, 2016 20:43

The March Hare: Oct 15, 2006; _{Je r�ve d'un}
Wayne's World 3; Buglord

Yep, Wappalyzer, it's good.

# ? Apr 20, 2016 20:44

pipebomb: May 12, 2001; Dear God, what is it like in your funny little brains?
It must be so boring.

Ok, thanks. I don't feel as dumb now. Also, neat tool, The March Here.

# ? Apr 20, 2016 21:33

kedo: Nov 27, 2007

Okay, I feel like I'm going crazy here and could use some unbiased opinions.

I have a series of sites I coded awhile ago for Client X which run on a platform created by Vendor Y. At some point between launch and now, the sites suddenly and dramatically changed how they display in IE 9 as opposed to IE 9+. They now look super broken even though they were tested and working in IE 9 at launch. I got in touch with Vendor Y about it and they claim it's because Microsoft deprecated support for IE 9. Client X got all annoyed about it and contacted Vendor Y who told them the same thing. Client X was placated, but I was not.

I've been building websites for a heck of a long time and I have never seen a site which previously worked in a version of IE suddenly and magically stop working in that same version of IE just because Microsoft deprecated support. What's more, I've checked the markup of the exact same page in both IE 9 and IE 10 and Vendor Y's platform is delivering extremely different HTML to both browsers.

I've had dozens of emails with Client X and Vendor Y and I want to make sure I have my facts straight (and that I'm not actually going crazy) before I start pointing fingers:

Am I correct that Microsoft deprecating a browser makes no changes to said browser?
Assuming that's true, can anyone think of any reason why Vendor Y's platform would, through no fault of their own, suddenly start serving different markup?

I'm at wit's end here. I simply cannot fathom a scenario where Vendor Y's platform would somehow know Microsoft deprecated support for IE 9 and say, "lol oh well, let's break these sites," without Vendor Y knowing and/or causing the breakage. I feel like Vendor Y is just covering their rear end and Client X is suffering because of it.

Help. :smith:

e: The whole reason why I care about this is because Client X has a significant amount of traffic coming from developing countries where IE 9 is still used widely enough that a good portion of their user base is seeing a broken site.

kedo fucked around with this message at 03:21 on Apr 21, 2016

# ? Apr 21, 2016 03:19

bartkusa: Sep 25, 2005; Air, Fire, Earth, Hope

Check if it looks bad in IE9 Standards Mode, works Mode, Compat Mode, all the bullshit modes.

# ? Apr 21, 2016 03:33

kedo: Nov 27, 2007

It looks (unsurprisingly) terrible in compat mode, but I can't edit the HTML directly so I don't believe I can force it into any other mode.

# ? Apr 21, 2016 03:40

kloa: Feb 14, 2007

kedo posted:

It looks (unsurprisingly) terrible in compat mode, but I can't edit the HTML directly so I don't believe I can force it into any other mode.

Can't you just use the console emulation to swap versions?

# ? Apr 21, 2016 03:44

Ghostlight: Sep 25, 2009; maybe for one second you can pause; try to step into another person's perspective, and understand that a watermelon is cursing me

My first place to start would be the Emulation tab in IE's F12 Console.
If Vendor Y's platform wraps the site in anything then what could very likely have happened is they're no longer declaring an IE9 recognised Document Mode, or conversely it was designed with specific IE9 hacks that are no longer being recognised in the document because it's served in 11 mode.

Beyond that, it's going to start needing specifics about what the platform is and how different the code being served is to track down the issue.

# ? Apr 21, 2016 06:04

Spatulater bro!: Aug 19, 2003; Punch! Punch! Punch!

kedo posted:

Okay, I feel like I'm going crazy here and could use some unbiased opinions.

I have a series of sites I coded awhile ago for Client X which run on a platform created by Vendor Y. At some point between launch and now, the sites suddenly and dramatically changed how they display in IE 9 as opposed to IE 9+. They now look super broken even though they were tested and working in IE 9 at launch. I got in touch with Vendor Y about it and they claim it's because Microsoft deprecated support for IE 9. Client X got all annoyed about it and contacted Vendor Y who told them the same thing. Client X was placated, but I was not.

I've been building websites for a heck of a long time and I have never seen a site which previously worked in a version of IE suddenly and magically stop working in that same version of IE just because Microsoft deprecated support. What's more, I've checked the markup of the exact same page in both IE 9 and IE 10 and Vendor Y's platform is delivering extremely different HTML to both browsers.

I've had dozens of emails with Client X and Vendor Y and I want to make sure I have my facts straight (and that I'm not actually going crazy) before I start pointing fingers:

Am I correct that Microsoft deprecating a browser makes no changes to said browser?

Assuming that's true, can anyone think of any reason why Vendor Y's platform would, through no fault of their own, suddenly start serving different markup?

I'm at wit's end here. I simply cannot fathom a scenario where Vendor Y's platform would somehow know Microsoft deprecated support for IE 9 and say, "lol oh well, let's break these sites," without Vendor Y knowing and/or causing the breakage. I feel like Vendor Y is just covering their rear end and Client X is suffering because of it.

Help.

e: The whole reason why I care about this is because Client X has a significant amount of traffic coming from developing countries where IE 9 is still used widely enough that a good portion of their user base is seeing a broken site.

I feel very confident that MS dropping support for IE9 has absolutely nothing to do with this issue. If it did, then a third of the web would be broken right now. Your vendor is lying about their lovely code.

# ? Apr 21, 2016 17:38

kedo: Nov 27, 2007

Ghostlight posted:

My first place to start would be the Emulation tab in IE's F12 Console.

If Vendor Y's platform wraps the site in anything then what could very likely have happened is they're no longer declaring an IE9 recognised Document Mode, or conversely it was designed with specific IE9 hacks that are no longer being recognised in the document because it's served in 11 mode.

Amusingly enough, emulating 9 in IE 11 shows the appropriate styles and markup. Opening the site in an actual IE 9 is when it gets mucked up.

Ghostlight posted:

Beyond that, it's going to start needing specifics about what the platform is and how different the code being served is to track down the issue.

Until I know for sure it's the vendor's fault, I don't really want to throw them under the bus on a public forum. However the code is extremely different. Checking the homepage markup on diffchecker.com, there are 295 removals and 179 additions (IE 9 compared to IE 10). There are some pieces that are similar, such as the content the client inserted, but other parts that are extremely different. For example, in IE 10 they plop a whole bunch of helper classes into the body tag (eg. [vendor prefix]-msie10 [vendor prefix]-user-anonymous [vendor prefix]-page-home, etc), while none of the same classes exist in IE 9. In short, all of the structural HTML that's wrapped around the content is different. I haven't even checked the CSS or JS yet because there are way too many files for each and the HTML is seemingly telling me enough.

caiman posted:

I feel very confident that MS dropping support for IE9 has absolutely nothing to do with this issue. If it did, then a third of the web would be broken right now. Your vendor is lying about their lovely code.

Thank you for making me feel less crazy!

# ? Apr 21, 2016 18:04

Thermopyle: Jul 1, 2003; ...the stupid are cocksure while the intelligent are full of doubt. �Bertrand Russell

caiman posted:

I feel very confident that MS dropping support for IE9 has absolutely nothing to do with this issue. If it did, then a third of the web would be broken right now. Your vendor is lying about their lovely code.

Yes, this is exactly right. Either someone is extremely ignorant or outright lying to you at your vendor.

Or, it might be something like "our internal policies mean that when a browser maker deprecates a version of their browser, we flip switches X, Y, and Z and this makes our poo poo product break".

# ? Apr 21, 2016 18:36

ufarn: May 30, 2009

Anyone know what I'm doing wrong when I get a `CssSyntaxError` when linting SCSS with stylelint? It seems like it's trying to parse whatever's inside my // SCSS comments.

# ? Apr 21, 2016 19:09

The March Hare: Oct 15, 2006; _{Je r�ve d'un}
Wayne's World 3; Buglord

ufarn posted:

Anyone know what I'm doing wrong when I get a `CssSyntaxError` when linting SCSS with stylelint? It seems like it's trying to parse whatever's inside my // SCSS comments.

Ah, yeah, if you are using SCSS comments you should run all of your CSS through YARP after you compile it down to CSS and then print all of that out, run it through your washing machine, scan it with a GoPro run some OCR on it and push that output directly to live from there.

# ? Apr 21, 2016 19:17

ufarn: May 30, 2009

The March Hare posted:

Ah, yeah, if you are using SCSS comments you should run all of your CSS through YARP after you compile it down to CSS and then print all of that out, run it through your washing machine, scan it with a GoPro run some OCR on it and push that output directly to live from there.

I do that in the CI already, this is just for the CLI on my laptop.

# ? Apr 21, 2016 19:18

Adbot: ADBOT LOVES YOU

# ? May 8, 2024 11:10

The March Hare: Oct 15, 2006; _{Je r�ve d'un}
Wayne's World 3; Buglord

ufarn posted:

I do that in the CI already, this is just for the CLI on my laptop.

Oh, my bad, just do the above but in reverse then.

# ? Apr 21, 2016 19:21

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

«‹›361 »