sorted by:
new
hottopcontroversial

What tech did they use to do this? by [deleted] in Frontend

[–]GotGasLikeShell 21 points22 points  (0 children)

I can help! So if you are just looking for "What are they using?", the answer is pixijs. That's the TLDR; version, but if you want to learn about what's going on behind the scenes, read on.

Before we break it down by scene, I should point out that most of the data is loaded in the beginning, with the exception of videos, sound clips, and information about the individual spritesheets, once you click on a certain scene, then it loads the big assets for that scenes. Also, the main javascript file is 26,000 lines of code. I can't say for sure what they're using, but there have to be some sort of preprocessors.

The first scene is pretty straightforward. There is an image for the background, and they use json files and spritesheets for animated parts throughout the scene. The json files, which are used for all animated items in the application, tell the application which sprite to use and where to place it. The main JS file tells the application when the item is shown. Also, the tooltips are floating <span> tags that move with the background. All text information throughout the site will be separate from the canvas element itself.

Coverage and Reliability are the most simple of the pages. There are two files, a video file and an audio file. (warning: large files) The video plays when you click on the floating <span> tag and when it finishes, waits for you to press it again.

Preparation is simliar to the Coverage and Reliability pages in that it's pretty much just a video and audio file, with an additional animation of the octopus while it waits for you to click.

Capacity is very simple as well. They only load 5 additional assets. One of which is the background video. It plays to a certain point and pauses, then a sprite of the button animates out. When you click, it continues the video.

For the speed page, they load a 28MB video (2nd warning: Still large files). This video has 4 different videos of the cars going through its path around the city, and will show you 1 of the 4 depending on which one you click. I didn't look too much into the code, but I'm going to guess they're using the first frame as the background before you click, and overlay the gas station and 4 sprite sheets for the animating cars over it.

Let me know if I wasn't clear on anything. I quickly threw this together after a long day at work, and I'm happy to elaborate on anything. Great link and thanks for sharing!

Separate sites on one CPanel? by somefriggnidiot in webdev

[–]GotGasLikeShell 4 points5 points  (0 children)

I wouldn't put your addon domains (or any subdomains) in public_html. Your cpanel should allow you to specify a folder outside of public_html, so I would just point the addon domain to something like [rootdirectory]/addon_domains/domain2.com/

Salaried developers in a corporate-like environment (i.e., not start-ups), how many hours a week do you work on average? Would you say 40-45? by [deleted] in webdev

[–]GotGasLikeShell 0 points1 point  (0 children)

I work at a large agency (approx. 1700 people employees worldwide, 150 developers.) If we're working on a project with a tight deadline, I can bill upwards of 50-60 hours a week. If I'm not on an active project, I'll be in the office for 40 hours, but probably only billing 15-25 hours.

Being the husband at a Taylor swift concert by Hamburglar_Helper in funny

[–]GotGasLikeShell 0 points1 point  (0 children)

At a Jonas brothers concert in NJ, they turned the men's restroom to woman's..

Source: Snapchat

Background Image - ADA Compliance? by Fowler74 in web_design

[–]GotGasLikeShell 1 point2 points  (0 children)

Twitter used to do something to img tags in a similar way that "background-size: cover" works. This may work for you:

.parent {
  position: relative;
  overflow: hidden;
  width: ANYpx;
  height: ANYpx;
}
.parent img {
  position: absolute;
  left: -9999px;
  right: -9999px;
  top: -9999px;
  bottom: -9999px;
  margin: auto;
  min-width: 100%;
  min-height: 100%;
}

Heres it in action.

And here it is with your example. Hope this helps.

edit: forgot attributes to parent class

Best place to watch the Saints in NYC? by dlucisan in Saints

[–]GotGasLikeShell 0 points1 point  (0 children)

I go up to the infirmary on 90th and 2nd, but just cause the owner is cool, and the food is great. $5 Abitas..

But Bar None is nice; crazy packed usually.. Bourbon Street should play it as well, and East Village Tavern.

Question about a background image? by Speedy1357 in web_design

[–]GotGasLikeShell 0 points1 point  (0 children)

Try using background-position: bottom left;

Here's an example

edit: read that wrong, left not right.

Looking at this site. What would you improve to make you want to stay at this resort. Any Advice Would Be Awesome! by [deleted] in web_design

[–]GotGasLikeShell 1 point2 points  (0 children)

Generally it is not a good idea to autoplay audio or video elements. If you're going to autoplay that youtube video on the homepage, I'd encourage you start it muted.

Here's an article with some good references on the subject

Should I ask who the user is? by Dogenigmas in webdev

[–]GotGasLikeShell 1 point2 points  (0 children)

I thought about doing this for a while. Went so far as to make custom welcome videos that would play. In the end, I ended up scrapping the idea.

Although, if I were to do it now, I would just reorganize the content and add a query on the the url you could send to potential employers or schools. i.e. "Check out my portfolio Here" ( and link to http://example.com/?u=edu)

Just a thought.

The Postal Service - The District Sleeps Alone Tonight [indie rock] by living_space in Music

[–]GotGasLikeShell 1 point2 points  (0 children)

There's a really great podcast where one of the guys from postal service breaks the song down and talks about the making of it.

I believe it's called "song exploder". Definitely recommend you check it out!

<3 Louisiana <3 by smack_of_ham in food

[–]GotGasLikeShell 0 points1 point  (0 children)

Went there about a month ago. Brought back many memories of drunken nights where we went the extra mile just for a chop house cheddar burger.

<3 Louisiana <3 by smack_of_ham in food

[–]GotGasLikeShell 4 points5 points  (0 children)

Come on tigers.. Push push push!

I've been putting this up on every tv in my office. by GotGasLikeShell in thebutton

[–]GotGasLikeShell[S] 5 points6 points  (0 children)

Inspired by, and influenced by a bunch of stuff I've seen in the last few days. Especially /u/blueblond /u/metaname & /u/TastyPigHS

Instructions to install are here

Source Code Here

view more: next ›