The Web Design & Development Megathread

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

«‹›2 »

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

FuriousAngle posted:

That's great! It's exactly what I want it to do! And you're right, I definitely need to get more familiar with Javascript. I'm trying to run before I can walk. In the meanwhile, where do I place that JS code so it works? I've tried copying it directly in <SCRIPT> brackets in the HEAD and BODY sections and that doesn't work so I'm fairly certain I'm doing that wrong too.

You need to include jQuery first, and I recommend putting both at the very bottom of the page, just before the closing </body> tag, like so. Loading scripts last keeps them from slowing down the initial page load, and makes it so you don't (or very rarely) need to wait for the window.onload event.

# ¿ Jul 12, 2016 19:46

Adbot: ADBOT LOVES YOU

# ¿ May 8, 2024 23:54

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

stoops posted:

I need some recommendations on some text editing software.

[...]

I'll throw in a recommendation for PhpStorm, my go-to IDE. I use it alongside a code editor for quick edits and edge cases (I use Sublime Text for that, but Visual Code/Brackets/Atom/etc. should all work too).

# ¿ Jul 25, 2016 15:57

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

ModeSix posted:

Sirs. My Google-Fu is failing me and I can't figure this out on my own.

You're all going to laugh and tell me to go to the Visual Basic thread to die or something equally heinous I am sure, because I am positive this is a very simple thing to do and I can't see the light.

I'm using Angular + Bootstrap, so you know what resources I have at my disposal.

All I am trying to do is set the navbar position on page load to be at the bottom of the viewport, I don't want it to stick there, I want it to scroll with the page, and when it reaches the top of the page to stick there as a fixed top navbar until the person scrolls back down again.

I can get the part where it sticks to the top to work and unsticks when the page is scrolled down again, I however cannot for the life of me figure out how to position it dynamically at the bottom of the viewport on render.

As I said, it's probably dead simple and I should just start stabbing myself with pencils and learn Visual Basic so that I can be made fun of eternally for my inability to grasp simple concepts.

For an example of what I want the navbar to do, you can look at this site (which is not mine): http://www.ianposton.com/

Please help.

Toggling the stickiness will still need to be in JS, but you can use vh units to position it at the bottom of the window, like so.

EDIT: And if you don't want the navbar to be a child of the header element, you can combine vh with calc() (example).

Depressing Box fucked around with this message at 14:44 on Aug 3, 2016

# ¿ Aug 3, 2016 14:40

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

Alternatively, if you just need the data you're assigning to the element you can use currying to pass it directly:

JavaScript code:

<input 
  type="checkbox"
  ref={this.setIndeterminate('red')}
/>

...

setIndeterminate = (id) => (checkbox) => {
  // logic, with both the id and the checkbox element available
}

You can also do it with bind() if you don't like class properties/currying/etc.:

JavaScript code:

<input 
  type="checkbox"
  ref={this.setIndeterminate.bind(this, 'red')}
/>

...

setIndeterminate(id, checkbox) {
  // logic, with both the id and the checkbox element available
}

# ¿ Aug 24, 2016 00:35

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

Currying is just writing a function with multiple arguments as a series of nested single-argument functions. It lets you start calling a function before you know all the arguments (known as partial application, and very useful for things like event handlers).

For example, let's say you have a function like this:

JavaScript code:

function speak(name, words) {
  return name + ' says, "' + words + '"';
}

But if you're in a situation where you know the user's name but not what they're going to say (maybe they fill out a prompt) you're out of luck. If you write it like this, though:

JavaScript code:

function speak(name) {
  return function(words) {
    return name + ' says, "' + words + '"';
  }
}

// Or with arrow functions, which look cleaner...
const speak = (name) => (words) => {
  return name + ' says, "' + words + '"';
}

You can do something like this:

JavaScript code:

const johnSpeaks = speak('John'); // returns a function

// Later, when you have their input...

johnSpeaks('Hello!') // returns "John says, "Hello!""

Depressing Box fucked around with this message at 20:35 on Aug 24, 2016

# ¿ Aug 24, 2016 19:49

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

I don't know about Rollbar specifically, but we've been using Bugsnag at work and it's been invaluable.

Rather than having to work backwards from user reports, I get a notification with a link to the error report, a full stack trace (resolved with the source map), a bunch of user/device/session data, and one click to create a linked issue in our issue tracking system.

# ¿ Sep 7, 2016 15:36

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

Trying to add an annotation and inspecting the POST request seems to give some hints:

JavaScript code:

{
  "song":{
    "id":118560,
    "updated_by_human_at":1474771844
  },
  "referent":{
    "previous_context":"ndedbythelightRevveduplikeadeuce",
    "text":"Another runner in the night",
    "next_context":"Somesiliconesisterwithamanagermi",
    "total_offset":677
  },
  "community":true
}

# ¿ Sep 27, 2016 05:35

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

Knifegrab posted:

I've never understood this. Can you call a function callback with however member parameters as you expect in this way instead of using an anonymous function (or arrow expression here to maintain the this scope)?

A callback can be any function, anonymous or named. Example:

https://jsbin.com/zeloca/edit?js,console

# ¿ Oct 3, 2016 18:34

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

awesomeolion posted:

I'm thinking it might be fun to make an Elm thread? Any other Elmers out there interested in commiserating?

I'd be interested too, I've also just started learning Elm.

# ¿ Oct 10, 2016 01:13

Adbot: ADBOT LOVES YOU

# ¿ May 8, 2024 23:54

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

McGlockenshire posted:

I'm looking for modern, maintained Javascript libraries to perform data binding (the synchronization of an object with HTML elements or values) and related UI-centric operations. I'm not looking for tools to build a single-page application.

Right now it looks like my only sane options are Rivets and Vue.

The library must stand alone. No external library requirements. No build tools. No package managers. The project lead doesn't want to add additional tooling right now. If I can't commit the complete library to our source control, I'm not going to be able to use it.

For what it's worth, you can use React in plain JS, without JSX/ES6/compiling/etc.

# ¿ Nov 19, 2016 04:58

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

«‹›2 »