James Revillini

Say 'no' to styrofoam.

Tag: 100 Days (page 1 of 4)

Experiment 20090618

Experiment 20090618

Just like Experiment 20090616 except now pulling in from the 100 Days blogs (the wordier ones – sorry, graphical people!) as Steve had suggested. I had to figure out where to split phrases, so I’m doing so on the following characters:

  • .
  • ,
  • !
  • ?
  • – (these are tricky because there are many ways to code a hyphen – I don’t account for any variations, just he stock keyboard hyphen)
  • \n (which is a ‘new line’ character, meaning the ‘end of a line’)

Experiment 20090616

Experiment 20090616

A fun, pointless script which plays a lot with randomness: random start/end color, start/end position, start/end size, number of objects, time before beginning animation, length of animation, selection of verbiage.

Experiment 20090615

Experiment 20090615

A simple podcast player. Makes use of jw player from longtail video.  Also experiments with linking to jquery ui resources hosted at googleapis.  Using CDNs for commonly used javascript and css resources is cool because a) you don’t have to host it yourself, b) people’s browsers cache it, so it loads much more quickly, and c) google knows what the hell they’re doing, so they serve it in the best way possible.  The only down side is that if their site ever gets bogged down or they go offline, you’re kinda screwed.  Still, Google is pretty safe to bet on, so we web developers do.

Experiment 20090614 Placeholder

This is a placeholder for my 2009-06-14 project.

Experiment 20090613 Placeholder

This is a placeholder for my project for 2009-06-13.

“Simple Spy” Wrapper

“Simple Spy” Wrapper

No time to explain right now.  Gotta run!

[UPDATE 2009-06-14] I just looked at this again and it had some bugs in it, which I fixed, plus it turns out I forgot to tag it 100 Days, so no one has seen it yet, most likely.  I’m also going to take this opportunity to explain the script a little bit.  I guess there was this site called ‘Simple Spy’ which used some sort of rotating script to achieve this effect in their side bar.  jqueryfordesigners.com, which looks to be an excellent resource for attractive jquery demos and tutorials, did a little demo and tutorial on how to ajaxify it to pull content in from whatever source one desired.  But I didn’t follow the tutorial to create mine.  I rolled my own wrapper.  ‘Wrappers’ are pieces of code which abstract the functionality of some other code.  Simply put, a wrapper usually makes life easier for the next programmer, because it handles the inner working for you and gives you just an easy-to-use subset of tools or configuration options.

In this case, my wrapper gives the user one configuration option, FEED_URL.  Since I plugged in Maggie‘s feed URL, the demo features her content.  If we provide my feed URL, we’d get content loading from my web site.  Of course, a lot more documentation and use cases would need to be written to make this useful to anyone, but it’s a dandy start.

Based on demo here: http://jqueryfordesigners.com/ajax-spy/

Understanding Trigonometry

Understanding Trigonometry

This animation plots sin, cos, and tan.  Tan is cool because it has asymptotes (loosely: straight lines that the equation approaches but never reaches – kind of like the Cooper situation).  This is because for angle a, tan a = opposite/adjacent = sin a / cos a … but WAIT!  cos a sometimes comes out to 0!  We see that in the graph whenever the cosine line touches the x-axis.  Well, as you probably recall from algebra, you can’t divide by 0.  The answer is just undefined.  So when cos a hits 0, you’ll see the tan line jump to a remote y coordinate – in other words, it appears again at the edge.

Tan is sexy like that.  Just wait til we get to secant, cosecant, cotangent, arcsine, arccosine, and arctangent!!!!

Storyboard: The Robber or The Image

Storyboard: The Robber or The Image

This isn’t the final storyboard – it just gets the concept across.  It begins to tell the story of The Robber or The Image by Steve Ersinghaus.  I wanted to use phpthumb to do some image resizing as I’d done in Rose Clouds, but didn’t have enough time.  Maybe it will make it into version 2.

Understanding Cosine

Understanding Cosine

This experiment graphs a sine and a cosine wave on the same grid so you can see how they vary, given degree and hypotenuse length (circle radius).

Understanding Sine

i understand this sign

i understand this sign

Understanding Sine

A couple days ago when I was working on the spiral experiment, I needed to read up a little bit on trigonometry because I realized that to calculate the x’s and y’s that I needed to plot, I needed to visualize a right triangle with point A at origin, B at my x coordinate, and C at my y coordinate.  Given angle and a hypotenuse length, I could calculate my adjacent and opposite angles using the cosine and sine functions, respectively.  Then, increase the hypotenuse length at the same rate as lines are drawn, et voila, you get a spiral.

But I wanted to understand sine better.  I saw an animated diagram at the Wikipedia article that showed me how the sine function produced the typical sine wave graph, and how it related to the circle.  But I still wanted more.  I wanted to be the line and find out how given one number, the other number could be circumscribed either on the circumference of a circle, or transposed(?) onto the positive-x quadrants of a graph.  Hence my experiment today.

Questions still lingering

  1. As I increased angle, my red line was moving clockwise on the circle.  I thought increasing angle would move in a counter-clockwise direction.  Is this just a move on the part of programming engines to try to be more logical than traditional math?
  2. As angle approached 90°, the y-coordinate decreased – why? I thought it should increase as angle approaches 90, then fall as it approaches 180, repeat.
Older posts

© 2017 James Revillini

Theme by Anders NorenUp ↑