picture home | art | events | music | rack extensions | downloads | pixel blog

omino pixel blog

pixels, motion, and scripting
david van brink // Thu 2008.12.25 00:11 // {after effects extendscript}

AE: Mask Vertices from ExtendScript

We’ll take it as axiomatic that scripting After Effects is pretty keen. But sometimes you can get lost in the nest of properties, property groups, values, attributes, and the subtle differences in nomenclature for properties and attributes used by After Effects and the JavaScript.

It is definitely possible to access and manipulate each vertex on a layer mask. Below is a script which displays some mask points, and then modifies a vertex. It will show this alert:

verticesGot.png

And this is the script which displays the dialog, and then modifies the 4th vertex of the mask. It demonstrates the recipe to navigate the Masks, Mask, Mask Path, and so on.

One thing first. Many sites and blogs show only very, very short scripts. I take a slightly different approach. I think code should tell a story. I try to build things up as simply as possible. Despite its apparent length, I think you’ll find the script easy to follow. Just go 1 line at a time.


// Utility to find a comp by name.
function findComp(name)
{
	for(var i = 1; i <= app.project.numItems; i++)
	{
		var item = app.project.item(i);
		if(item != null && item.name == name)
			return item;
	}
	return null;
}

// Show the vertices of the first mask of comp1/layer1.
function main()
{
	var comp = findComp("comp1");
	var layer = comp.layer("layer1");
	var masks = layer.Masks;

	var firstMask = masks.property(1);

	if(firstMask == null)
		return;
	
	var maskPathProperty = firstMask.property("Mask Path");
	var maskPath = maskPathProperty.value; // or valueAtTime(t) if  you like

	var sm = "Vertices\n";
	var vertices = maskPath.vertices; // array of [x,y] pairs
	for(var i = 0; i < vertices.length; i++)
	{
		var p = vertices[i];
		var x = p[0];
		var y = p[1];
		sm += "v[" + i + "] = " + x + "," + y + "\n";
	}

	alert(sm); // Show the vertices.

    // Now, we change a point.
	var p = vertices[3];
	p[1] = 300;
	
	// Must be "put back" bit by bit.
	maskPath.vertices = vertices;
	maskPathProperty.setValue(maskPath);

}

main();

A few notes:

  • To change the vertex, we need to assign it back to the Mask Path and then into the Mask property; changing it "in place" won't alter the actual mask.
  • Chris-g notices that you must assign the vertices before assigning closed to true or false; assigning the vertices "automagically" sets closed to true. Thanks Chris!

Hope that's useful.

oh, i dont know. what do you think?


david van brink // Mon 2008.12.15 06:59 // {extendscript illustrator}

Two Illustrator Scripts

Here’s a pair of Illustrator scripts I’ve had up for a while, but this is the first time I’ve posted examples. Also, Javier Enciso of www.formaestudio.com in Uruguay spotted a bug in the triangle script, which is now fixed.

Both available at http://omino.com/sw/ominoAdobeScriptsSuite/.

Circular Gauge (circularGauge.jsx)

circularGauge.jpg

This script draws numbers and tick-marks to resemble a circular gauge. It lands up in its own layer, and the text and ticks are in their own group, ready for tweaking. I use it to make pretty machines in Second Life. A bit of emboss and off you go.

Triangle By Sides (triangleBySides.jsx)

triangleBySides.jpg

I can’t remember what I needed this for, but it was exactly what I needed at the time. Self explanatory!

oh, i dont know. what do you think?


david van brink // Sun 2008.12.14 01:59 // {graphic design}

Found Graphic Design, Penang

Hello from balmy Penang, Malaysia!

My Northern California employer, a well-known FPGA vendor, has an office here in Penang Malaysia. I got permission to “telecommute” from here for a couple of months. Today is just cooling down, it’s 5pm and about 80F outside, with a chance of rain. Same weather year round.

Not much in the way of pixels going on in this part of the world… but I did stumble upon this bit of remarkable graphic design work, on some signage atop Penang Hill, showing roads, hiking trails, and such.

Penang Hill Map Detail

Just look at that! That amazing plotter-font, and what’s that OR gate doing there? And lovingly aged by time, itself. This is the real deal.

here’s the whole sign.

Penang Hill map

oh, i dont know. what do you think?


david van brink // Fri 2008.11.28 21:53 // {off topic}

Flex: Simple Visualizer

Well I’ve gone way off target, and presently am having a little fun with Flex*. Here’s an audio player experiment. Just for fun. Terrible code. You know how it is. I think you need to click it to start it. Yeah.

Source code follows.

*If I’ve got the nomenclature right, Flex refers to ActionScript code which uses MXML code structure and is compiled by Adobe’s freely available MXMLC compiler and is playable by the Flash browser plugin. But maybe not. I’m a bit confused by the names. Anyway, it’s fun to code.

oh, i dont know. what do you think?



Deprecated: Function the_block_template_skip_link is deprecated since version 6.4.0! Use wp_enqueue_block_template_skip_link() instead. in /home/polyomino/omino.com/pixelblog/wp-includes/functions.php on line 6121

0.0221s
(c) 2003-2023 omino.com / contact poly@omino.com