
Txtbirds - jsvine
http://www.jsvine.com/txtbirds/
======
jgv
What about txtpeople tho? <http://asdf.us/vortex/>

~~~
gosub
The effect of infinite audio tone descent is a Shepard tone
<http://en.wikipedia.org/wiki/Shepard_tone>

------
pfortuny
I thought it was an angry birds for the command-line. Even though it is
beautiful, I feel a bit disappointed... :)

~~~
xvolter
Aw, now that I've read this you got my hopes up.

------
nicklovescode
Not a critique of this in particular, but does JS styling inconsistency not
drive everyone else mental? I'm not a big fan of camelCase, but when I see
veer_coefficient_horizontal next to setTimeout, I get itchy.

------
polyfractal
I was really hoping that clicking the birds would shoot them down ala
duckhunt.

Fun little demonstration :)

~~~
swohns
I tried the duckhunt click too, could be a nice mod into a HTML5 game!

------
chao-
Getting all sorts of text artifacts remaining smeared across my browser. Not
this site's fault, and is something I've experienced before. It does make me
wonder where the blame lies, though: Linux, Firefox or my graphics card?

~~~
xvolter
The most likely would be Firefox. As Linux has nothing to do with graphics, so
I assume you mean your X Server - like Gnome or XFCE or KDE - none of which
have much affect into major browsers, which are designed to render themselves
entirely separate from the system's window manager to be multi-platform. It's
also not likely to be your graphics card, otherwise it would happen outside of
your browser too. It could be the browser attempting to "accelerate" web pages
by using your GPU - in which case you can find out by disabling GPU
Accelerated Rendering - both Firefox and Chrome have settings for this.

~~~
chao-
Sorry, I should have specified better. By "Linux" I meant the overall mix of
Xorg and whatever display or GUI toolkits are in use, and instead of "graphics
card", I should have said "graphics card drivers". If the card itself were
having issues, I'm sure more than Firefox would have problems. Alternatively,
I always hear about how "Linux has bad font rendering!" but since I'm not much
of a font guy, I'm not sure if they're referring to how the fonts look, or
some deeper part of the process which displays the fonts.

I recently had to switch to the radeon (open source) drivers instead of fglrx
(AMD's proprietary) drivers due to some incompatibility with a kernel upgrade.
It makes sense that the problem would exist somewhere between Firefox and its
use of those drivers.

~~~
xvolter
That does sound like it could easily cause problems. Graphics drivers are bad
in all Linux systems. NVIDIA's I've seen tend to work better - just hope Steam
does well with Linux and pushes ATI to finally make some good drivers.

------
jofo25
I liked this little trick for going over and over an array:

this.flaps = [ '------', '/â€¾\\\/â€¾\\\', 'â€¾â€¾\\\/â€¾â€¾' ]; ...
this.el.innerHTML = this.flaps[this.flap_i++ % this.flaps.length];

------
DanBC
I like this.

What next, 3d ascii boids, with text size to show near or farness?

------
sequoia
Is there a blog post about this? I get most of it but a couple things, namely
how the css transitions interact with the property updates in in the veer &
fly functions and how opacity is governed. Good show, nice example of a tidy
little JS object!

~~~
jsvine
Hey, thanks! I haven't written anything about txtbirds yet, but might soon. In
the meantime, a brief explanation about those transitions and property
updates:

\- With the exception of the `margin` transition, all the transitions are set
to 10 seconds — roughly each bird's lifespan.

\- The `left` and `top` transitions move the bird toward the center from a
randomly-assigned position on the screen.

\- The `font-size` and `color` transitions create the impression that the bird
is receding into the distance, getting smaller and more lightly-colored.

\- The `margin` transition governs the veering. Every half-second, the bird is
given new, randomish left- and top-margins. The transition (set to slightly
less than a second in duration, after some trial-and-error) smooths that
shift.

~~~
sequoia
haha the text is faded to BG color, not alpha 0%... not sure why this
possibility didn't occur to me. Thanks!

------
ilanco
Any reason you close your <html> tag with a </div> ?

~~~
jsvine
Nope, just an oversight. Thanks for flagging. Fixed:
[https://github.com/jsvine/txtbirds/commit/b1fbf84560c1b2ad30...](https://github.com/jsvine/txtbirds/commit/b1fbf84560c1b2ad300e6ec6a8162268f442b43b)

------
vignesh_vs_in
Works only on chrome, Firefox(15 on XP) just shows a blank screen.

Edit: Apparently it doesn't work on FF 15. It worked on FF16 XP. and it also
works on Safari

~~~
mcherm
Works fine for me on Firefox 16.0.2 (Win).

~~~
PostOnce
Didn't work in 15.0.1(Win7), updated, works in 16.0.2

------
Gigablah
I was expecting the page title to animate as well :)

------
nickthemagicman
Any way to get this as a screensaver?

~~~
jonalexr
If you're on a Mac check out <https://github.com/liquidx/webviewscreensaver>
\- Works well but you might not always have an internet connection so I just
saved the HTML/CSS/JS into a folder and linked directly to that (and it
works!)

------
programminggeek
I instantly tried to play duck hunt with this. It's broken.

------
jentulman
A flock of CSSGulls?

------
shiftins
pass gyre into your constructor, and reference the local variable. kudos, i
love scripts for the sake of scripts.

~~~
jsvine
Good idea. Done:
[https://github.com/jsvine/txtbirds/commit/207480cae2823dd57a...](https://github.com/jsvine/txtbirds/commit/207480cae2823dd57a73062c933295cfdd0a8631)

------
antirez
small little piece of art, great.

------
bootz15
not impressed. doesn't even work in opera :(

~~~
forrestkyle
Yeah, I'm not very impressed with Opera either. ;)

