Archive for the 'Uncategorized' Category

Node Eval: Evaluate Javascript using V8

December 6, 2009

Just realeased “Node Eval”, whiche allows arbitrary javascript to be evaluated using V8.

This is mostly useful for other servers to evaluate javascript, without needing a direct bridge. I’m using it in Ruby instead of Johnson (which seems to have problems with GC) which provides a nice degree of separation.

Use:

/eval?js=12*12 => {“success”:true,”result”:144}

/eval?js=12*a => {“success”:false,”exception”:”ReferenceError: a is not defined”}

Context is maintained

/eval?js=this.a=9 => {“success”:true,”result”:null}

/eval?js=12*a => {“success”:true,”result”:108}

It’s also possible to supply a source file on disk and a context name:

/eval?js=func()&file=/abs/path/to/file => {“success”:true,”result”: “func output ok”}

Note that to be able to call functions, you’ll need to expose them using the CommonJS “exports” declaration.

Github Page

http://github.com/weepy/node_eval

Crazy worm bookmarklet

October 8, 2009

Can you handle the crazy worm ?



If you think you can go =>=>here <=<=

Bezier Curves and Arcs in jQuery

September 22, 2009

The animation engine in jQuery is focussed on single dimensional animation – hence it’s difficult to animate two variables along a path.

jQuery.path provides a method of multidimensional animation, and in particular provides a method for animating along bezier curves and arcs.

Bezier

Example: animate along a bezier path. See demo

var bezier_params = {
    start: {
      x: 185,
      y: 185,
      angle: 10
    },
    end: {
      x:540,
      y:110,
      angle: -10,
      length: 0.25
    }
  }

$("my_elem").animate({path : new $.path.bezier(bezier_params)})

Bezier curves are made form a start point, an end point each with a control point

  • start is starting point
  • end is the final point
  • x,y indicate the coordinates at that point. Required
  • angle is the angle of the control point from the line joining the start and end. Optional, default is 0
  • length is the distance from the point to it’s control point as a ratio of the distance from start to end. Optional, default is 1/3

Arc

Exampe: animate along an arc. See demo

var arc_params = {
    center: [285,185],
        radius: 100,
        start: 30,
        end: 200,
        dir: -1
  }

$("my_elem").animate({path : new $.path.arc(arc_params)})
  • center is the coords of the centre of an imaginary circle that contains the start and end point
  • radius is the radius of this circle
  • start is the angle of the start point. 0 is “North”, measured clockwise
  • end is the angle of the start point. 0 is “North”, measured clockwise
  • dir is the direction to move in. Only required if not obvious from start and end (e.g. if start is 100, end is 30, but you want to animate clockwise)

Other Paths

It is trivial to create other paths, or even animate other parameters. E.g:

var SineWave = function() {
  this.css = function(p) {
    var s = Math.sin(p*20)
    var x = 500 - p * 300
    var y = s * 50 + 150
    var o = ((s+2)/4+0.1)
    return {top: y + "px", left: x + "px", opacity: o}
  }
};

$("my_elem").animate({path : new SineWave})

Links

Hello world!

September 10, 2009

Welcome to our new blog. Focus will be on Javascript, jQuery, Ruby, Rails, perhaps some C#