The Web Design & Development Megathread

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

Sedro: Dec 31, 2008

Thermopyle posted:

My question is, how should I allow the consumer to request this optional output? I can do URLs like:

1. http://blahblah.com/place/1/special_output/
2. http://blahblah.com/place/1?special_output=true

or what?

If it's just personal preference I think I'll go with #1 as I prefer the cleaner look of urls without query parameters, but if there's a standard for REST API's (that I can't seem to find right now), I'll stick to the standard.

I think the best practice (standards, ha) is to use query parameters for this.

Normally your API would return relations as references

JavaScript code:

GET /place/1
{
    "id": 1,
    "name": "Fake Acres",
    "address1": "123 Fake Street",
    "address2": "",
    "city": "Faketown",
    "zip": "12345",
    "things_here": [ 1, 2, 3 ]
}

You could add a generalized way to select which fields you want

JavaScript code:

GET /place/1?fields=id,address1
{
    "id": 1,
    "address1": "123 Fake Street"
}

You could also have a parameter to embed related objects

JavaScript code:

GET /place/1?embed=things_here.id,things_here.name
{
    "id": 1,
    "name": "Fake Acres",
    "address1": "123 Fake Street",
    "address2": "",
    "city": "Faketown",
    "zip": "12345",
    "things_here": [
        {
            "id": 1,
            "name": "red truck"
        },
        {
            "id": 2,
            "name": "yellow screwdriver"
        },
        {
            "id": 3,
            "name": "white seagull"
        }
    ]
}

This ends up being a ton of work and you're over-engineering unless the API is your main product. There are server and client side technologies which can pick up some of the work but they won't agree on a convention.

# ¿ Aug 8, 2014 19:46

Adbot: ADBOT LOVES YOU

# ¿ May 19, 2024 22:37

Sedro: Dec 31, 2008

Munkeymon posted:

And can't think of a way to do this without integrating bits of the FA CSS into my own, which strikes me as a bad idea.

I think the proper way is to reference their LESS or SASS, so you can use their styles without copying and pasting them.

# ¿ Sep 3, 2014 20:13

Sedro: Dec 31, 2008

http://stackoverflow.com/questions/13392872/why-does-accessing-the-localstorage-object-in-internet-explorer-throw-an-error

# ¿ Oct 10, 2014 23:14

Sedro: Dec 31, 2008

See their API docs. You can change the max after the widget is created:

JavaScript code:

var mySlider = $("#slider-range-min").slider({ ... });
mySlider.slider("option", "max", newMax);

# ¿ Oct 22, 2014 02:44

Sedro: Dec 31, 2008

jackpot posted:

I'm getting incrementally better at building my jqueryui sliders, but I've run into a new snag. In this particular slider I want to fix the first handle in place (because its starting value was derived from a previous slider) but let the second handle still be moveable. So like this:

You can cancel events from the slider you want fixed (see bolded)

pre:

  $(function() {
    $( "#slider-range" ).slider({
      range: true,
      min: 0,
      max: 500,
      values: [ 75, 300 ],
      slide: function( event, ui ) {
          if ($(ui.handle).is('#slider-range .ui-slider-handle:first')) {
                return false;
          }

          if (ui.value < 75) {
              $( "#slider-range" ).slider( "values", 0, 75 )
                return false;
            }
          
         $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
      }
    });
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
      " - $" + $( "#slider-range" ).slider( "values", 1 ) );
  });

# ¿ Oct 31, 2014 02:41

Sedro: Dec 31, 2008

1. Compile your LESS with modifications
2. Compare the compiled CSS to the original bootstrap CSS to generate a CSS patch file
3. Serve up the original bootstrap CSS and your patch

_{step 2 left as an exercise for the reader}

# ¿ Nov 27, 2014 05:21

Sedro: Dec 31, 2008

Ahz posted:

Thanks. I am having a little trouble though. I have everything setup but the NOT selector doesn't seem to work as expected.

I went ahead and marked my chart/report DIVs with the class printable, added print stylesheet, reference in head etc. But it doesn't work.

To test, i removed the not (intentionally selecting the printable class) but keeping display:none, and my charts successfully vanished from the print page (showing that the print stylesheet was set right and doing its job). I guess I could go around my html adding no-print to the classes but maybe there is something I need to do.

the 'not' will match html and body so you probably have to tag those as printable.

# ¿ Jan 18, 2015 21:48

Sedro: Dec 31, 2008

What's the preferred way these days to dynamically load scripts? I'm not using RJS/AMD/etc.

I have a SPA which needs to load some rather large scripts if the user navigates to a particular place. I basically want a LoadScript('foobar.js') which returns a promise that downloads the script the first time I call it and is immediately fulfilled thereafter.

# ¿ Jan 30, 2015 19:24

Sedro: Dec 31, 2008

Set the Content-Disposition in Apache (here's a guide or just google it)

# ¿ Feb 9, 2015 03:31

Sedro: Dec 31, 2008

Lumpy posted:

Since NoSQL covers a HUGE gamut of things from document stores (Mongo and pals) to Key-Value Stores (Redis & co.) to graph DBs, there's no "best practice for NoSQL". Duplicated data is sometimes the correct thing to do in document based versions....

This. Every database is a unique snowflake. Mongo and Elasticsearch are totally different, and they are both document databases. Also many no-squeals support SQL.

Find the best database for your goal. Here's a good list

# ¿ Feb 10, 2015 20:49

Sedro: Dec 31, 2008

Zero The Hero posted:

Also, what do people think about two-way data binding? That was one of the main draws of Angular / Ember, but it seems it won't be included in future versions of either technology. It sounds so useful, though, is there any particular reason it's falling out of favor?

I haven't heard anything like that about ember. Source?

# ¿ Feb 17, 2015 07:08

Sedro: Dec 31, 2008

JSON.stringify(obj)

# ¿ Feb 24, 2015 02:52

Sedro: Dec 31, 2008

It's weird that refreshing the page takes me to the top. I looked at the other examples on the Isotope website and they have the same problem.

# ¿ Mar 1, 2015 00:50

Sedro: Dec 31, 2008

You could use a window function:

SQL code:

select *, count(1) over() as total
from table
where ...
offset 100 limit 20

The total will be repeated for every row.

If the query is expensive this will likely be faster than running it twice.

# ¿ Mar 5, 2015 17:06

Sedro: Dec 31, 2008

Let postgres into your life~

# ¿ Mar 5, 2015 17:24

Sedro: Dec 31, 2008

Lumpy posted:

It didn't three years ago.

They had a key-value store for a while and just added a document store in 9.4

# ¿ Mar 12, 2015 16:48

Sedro: Dec 31, 2008

Sauer posted:

Assuming the data you want to store between pages isn't sensitive information wouldn't it be easier to just use localstorage? It seems to be supported on everything these days.

I am not a web developer.

Until you want to use more than a few MB. Then you run into browser specific size limits, inconsistent UIs nagging the user to increase the limit, no clear way to change those per-site limits...

# ¿ Jun 2, 2015 02:11

Sedro: Dec 31, 2008

Gmaz posted:

What is the use case where you would ever want to use a few MB locally?

I can't recall off hand which sites hit that limit, but they do.

Sites use localstorage to cache dynamic content, either to make the site more responsive or to make it available offline.

# ¿ Jun 2, 2015 16:30

Sedro: Dec 31, 2008

revmoo posted:

Has the Famous JS framework improved since its stillborn release last year? I've got someone wanting me to work with it but I remember it being a hot mess at release. I noticed scrolling works now so there's evidently been some work done on it. Is it worth using these days?

There's your answer

http://techcrunch.com/2015/11/06/nopen-source/

# ¿ Nov 6, 2015 19:16

Sedro: Dec 31, 2008

The Merkinman posted:

Use code from StackOverflow? Know someone who does? You may have to provide attribution .

I think you always had to give attribution though. Everyone will continue not to do that.

Edit: nevermind. the poster had to request attribution before

Sedro fucked around with this message at 22:16 on Jan 15, 2016

# ¿ Jan 15, 2016 22:11

Sedro: Dec 31, 2008

Data Graham posted:

Speaking of Font Awesome -- I've never used them, but drat if it doesn't look like they at least have a ton of good icons. Except is it actually a trap, because the people behind it doesn't really seem to know what they're doing?

Spin is implemented with trivial CSS transforms. If they're guilty of anything it's not working around browser bugs.

# ¿ Feb 8, 2016 17:16

Sedro: Dec 31, 2008

Leshy posted:

On the earlier topic of CSS variables, I actually have a site that is the perfect use case for them, but I am not quite sure on the best method to implement them with a proper fallback.

It is a site with multiple sections, which each have their own accent colour; this affects the font colour of some elements, the background colour of some others, as well as a few border colours here and there. It is currently set up so that the PHP template inserts a <link> tag to a small secondary stylesheet that sets the appropriate colours for that specific section. Works perfectly fine, but it does add several requests and a downloads (albeit very small) when navigating through various sections, and it requires the maintenance of several of these stylesheets in addition to the main one.

With CSS variables, I can simply have the PHP template insert "<style> :root{ --accent-color: [section-colour];} </style>" into the page to replace all of that, which is of course a very enticing prospect. However, as of course wide-spread support of CSS variables is still a while off, I'd like to keep the above method as a fallback for browsers that do not support CSS variables, for the time being. That means I can't rely on the built-in CSS variables fallback.

I essentially need to build in a "Do you support CSS variables? If so, here is <style> --accent-color: [blah] </style>. If not, here is <link src='accent-color.css'>." check. The most straightforward way of doing this that I can see, is doing some browser sniffing and checking the useragent for browser version, then presenting the appropriate solution. However, as browser sniffing is it's own , I could use some input on whether this is a good idea or not or whether there is a better way of approaching this.

You could use CSS.supports('--accent-color', 'blah') but that won't work in IE. If you care about IE you can create some DOM using CSS variables and examine the output with getComputedStyle.

# ¿ Feb 15, 2016 17:50

Sedro: Dec 31, 2008

Mecca-Benghazi posted:

Why VirtualBox over Hyper-V, which is built in to Windows?

Either one works. VirtualBox has more support from the community. For comparison, here's the most popular vagrant boxes for the two providers:

quote:

Virtualbox
ubuntu/trusty64 Official Ubuntu Server 14.04 LTS (Trusty Tahr) builds
12,441,795 downloads | 20160303.0.0 | last release 3 days ago

Hyper-v
hashicorp/precise64 A standard Ubuntu 12.04 LTS 64-bit box.
4,790,146 downloads | 1.1.0 | last release 2 years ago

# ¿ Mar 7, 2016 19:07

Sedro: Dec 31, 2008

22 Eargesplitten posted:

I asked this in the Java thread but didn't get a response, so I'm hoping it will get one here. I'm having a lot of trouble installing Spring Roo on Windows. I've been doing exactly what several different sets of instructions on the spring.io site say. I've unzipped it to a location, set ROO_HOME to that location, added %ROO_HOME\bin to the user and system Path variables, because I wasn't sure which one it needed to be in. I also tried %ROO_HOME%\bin. I even put the ROO_HOME variable into both user and system variables.

This document says that adding the variable is all you need to do. I'm completely lost here. I'm making a new directory, going in there, and trying to start roo. Do I need to have an existing java project with a pom.xml and everything? If I start the roo.bat file, it works just fine, but I can't do anything from the command line.

I also installed Spring STS in hopes that adding the Spring Roo extension would work for command line, no luck.

The environment variable syntax on windows is %ROO_HOME% not %ROO_HOME

You probably need to restart explorer.exe (or logout/reboot) for environment variables to stick, although it depends on the version of windows.

You can shift-right click on the new directory, "Open command window here", then type "echo %PATH%" and see if the value is correct

# ¿ May 31, 2016 04:43

Sedro: Dec 31, 2008

Unity Gain posted:

Yes, because these calls are supposed to be (a) stateless; and (b) atomic.

What state, and how is it not atomic? The PATCH either happens or doesn't; there is no half-PATCHed state.

Sure, the resource is not consistent with respect to the timing of HTTP requests, but isn't that true in general? Does REST demand this of your protocol? Many popular databases don't even offer consistency.

The API is fine. Status code 202 exists for this purpose.

# ¿ Jun 10, 2016 05:47

Sedro: Dec 31, 2008

xpander posted:

I have what is probably a simple question about Ember: I've got a model with a handful of attributes, but most of them are computed server-side(things like creation/update timestamps, other generated properties, etc). I want, say, property 'email' to be sent to the server when saving the record, but not the others. Is this possible? I couldn't really find anything in the docs. I can certainly handle it sending over a larger payload with blank fields, but I'm thinking ahead to when an application scales up, and you might want to keep those payloads as small as possible.

You can customize the adapter and serializer for that model. By default, the serializer will serialize all attributes and the adapter will use a PUT request when you save().

There's an active community on slack https://ember-community-slackin.herokuapp.com/

# ¿ Aug 11, 2016 14:59

Sedro: Dec 31, 2008

argondamn posted:

Running into some problems with javascript dates and timezones. Basically the client runs a report that takes a date(s) as a parameter that is month/year. The client picks these dates via a datepicker and we are sending the resulting date.getTime() across to our service which runs the report. The problem occurs when the client is in a different timezone than the server, if the client picks September 2016, then what is sent across is 01-Sep-2016 in millis for his timezone, and if the client is in EST and the server CST and then since the report that's being ran truncates the date for month, it ends up running for August instead of September.

My initial thought was just to stop sending the ms timestamp and just send month and year across as parameters, but most of what I read has suggested using UTC timestamps like we are. We could also remove the truncation, but that would probably confuse the client when he runs reports for September, which give him September data but are labeled for August.

You could send the dates in ISO 8601 format, with UTC offset to preserve the user's time zone.

# ¿ Sep 22, 2016 05:56

Sedro: Dec 31, 2008

XML code:

<style>
  .parent {
    display: inline-flex;
    flex-direction: column;
  }
</style>

<span class="parent">
  <span class="child1">child1</span>
  <span class="child2">child2</span>
</span>

Given that I can only modify the inline style on child2, is there some hack I could use to align child1 and child2 horizontally?

# ¿ Jun 30, 2017 01:16

Sedro: Dec 31, 2008

JavaScript code:

let promise = value ? Promise.resolve(value) : grabValueFromAPI();
promise.then(function(value) {
  doStuffWith(value); 
  doMoreStuffWith(value);
})

# ¿ Jul 8, 2017 00:25

Sedro: Dec 31, 2008

Munkeymon posted:

Think it's the other way 'round, technically. Actually, WebStorm might Just Work, but they've got to be having a hard time keeping up with flavors of the week.

IntelliJ Ultimate is the full IDE. The minor IDEs like WebStorm, PyCharm are subsets at a lower price point.

# ¿ Sep 7, 2017 00:17

Sedro: Dec 31, 2008

Nested dropdown menus can gently caress right off, on desktop, mobile or otherwise

# ¿ Nov 14, 2017 19:22

Adbot: ADBOT LOVES YOU

# ¿ May 19, 2024 22:37

Sedro: Dec 31, 2008

Boosh! posted:

JS question: I have an array of objects I am trying to filter by the "tags" value. Tricky thing is, the CMS spits out "tags" as a string of semicolon-delimited values.

data = [ { tags: "fashion;beauty;audio"}, { tags: "fashion;beauty"}, { tags: "rocks;audio"} ]

I will have another array that I have complete control of, that can have any # of values that I can use as a filter.

let filters = ['fashion', 'beauty'];

How can I filter each object in the "data" array with the values in the "filters" array? The above filters (fashion or beauty) should return the first two objects in my example.

JavaScript code:

data.filter(x => filters.some(filter => x.tags.split(';').includes(filter)))

# ¿ May 9, 2018 22:52

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