Topic: programming

All posts related to some form of programming.

Numbered header using flexbox with fallback

One of the designs I recently had to work on needed a narrow width header in a sidebar with a large number on the left side of it and the header text vertically centered to the right.

If you've worked with CSS for awhile you've probably ran into the same issue as everyone else. Vertical alignment with universally supported css is not easy. There are multiple techniques you can use to make something vertically aligned but there are drawbacks to…

Tags:
  • programming
  • css
  • browser
  • css3
  • code
READ MORE

<input type="number"> and iOS' numeric keypad

You probably already know about HTML5's <input type="number">. Which if supported by a browser displays a form input optimized for inputting numbers. Whether that means an up/down spinner or an optimized keyboard.

However iOS' standard behavior for the number input isn't that ideal. By default iOS will display a standard keyboard slightly modified with a row of numbers at the top. This isn't ideal as you don't need the alphabetic keys…

READ MORE

css3 border-radius and vendor prefix fud

The state of most uses of css3's border-radius around the web has been bothering me for awhile now. Though now I've found something else to be annoyed at.

The earliest common use of border-radius was -moz-border-radius in Gecko based browsers. Later on the WebKit implementation came into common play. When and where things were actually implemented isn't really important, that's just the order that people started to know about them as common knowledge.

As a result there are plenty of…

READ MORE

HTML5 <input type=number> Implementation Flops

Back on HTML5, section 4.10.7.1.13 defines a number state for inputs. The traditional input for numbers you see inside of OS is a spinbox, a text box containing a number with a set of up and down arrows beside it which allow you to use your mouse to change the input (iirc some OS even let you use the up and down arrow keys).

So far there are two implementations of the number input, in Opera in and WebKit.

Opera…

READ MORE

A HTML5 Browser maze, oninput support

While I was working on version 3 of Kommonwealth I got back to a part of our interface which makes use of live input events (ie: Events that fire as you type into the input) to offer a preview before the onchange event is used to actually change the data by sending an ajax post to the server.

For those who haven't heard of the oninput event, it's part of the html5 spec. You know those older ui parts such…

READ MORE

A Look Over RaphaƫlJS

RaphaëlJS is a JavaScript Vector Library. It uses SVG as a backend in browsers that support it (most modern browsers), and uses VML in IE. It provides a fairly easy to use API that allows you to programmably generate Vector graphics inline in a HTML document. The result is a vector canvas with dynamically generated content which can be made interactive using the mouse and keyboard handling built into the browser already for HTML, and includes animation functionality built into…

READ MORE

JavaScript; A beauty, the mistake we made about libraries

I realized one of the old reasons why some don't consider server-side JS ready could actually already be considered a fun little mistake.

One of the old cited reasons why server side js isn't ready is "Lack of libraries". Ya, io needs some standardization (and perhaps more clean APIs), and there are various low-level things which need building. However there is one thing I think we can actually nicely tick of as mistake.

General libraries for different types of markup…

READ MORE

with(obj) { ... } a necessary evil.

For those who haven't seen the statement yet, the with() statement in JavaScript allows an object to be pushed onto the scope chain.

In short the common reason for it to be useful is if you had something like foo.bar.baz.a and foo.bar.baz.b then instead of typing that over and over you could use something like with(foo.bar.baz) { a; b; }.

Unfortunately nearly every example people show is a poor example of how to use it, and then Crockford went…

READ MORE

Writing in Rack with a complete error catch

Man, forgetting to add my little error catching trick inside of one app I was writing made me realize how much I take such a simple trick for granted.

I basically write all my rack code in a way similar to that. Normally I'll probably throw in another error catching level that catches special formated ErrorPage classes for things like NoPage to generate a 404. But this here is…

READ MORE

.erb, the buffer?

This one is a little bit old, but if any of you are familiar with rails' views you'll probably have seen bits of view code like:

And if you've ever jumped into erb in your own ruby you've probably made an attempt at doing something similar trying to put something into the buffer without the use of =. This is of course because ERB doesn't let you use blocks…

READ MORE