Thursday, February 24, 2011

Umbraco 4.7 Razor Feature Walkthrough – Part 2

Part 2 of the feature walkthrough continues with features available in the TAFKA 4.6.2 release.
Today, i'm covering Macro Parameters, some fetching node helpers, and how to access media

Macro Parameters

You can now access parameters defined on the macro which invokes the macro.
Just like XSLT, if you define a macro parameter, you can then pass it from the Template to the Macro.

Please excuse the references to cats in the upcoming examples, cat pictures are ridiculously easy to find online and they make good examples when testing.

Given a parameter defined on the macro called animalName, you can access it in Razor like this:
@Parameter.Animalname => "cat"

The casing makes no difference here.

Culture specific strings are available too with @Dictionary

DynamicNode Constructors [string | int | object]

We've added constructors to DynamicNode that allow you to look up a node.
There's 3 overloads which take different types depending on what you have available to you at the time:

//a node that has it's id passed by QueryString
new DynamicNode(HttpContext.Current.Request.QueryString["id"]) //a node from a known hardcoded ID
new DynamicNode(1046)

When you define variables like this, you must declare them with the type dynamic:
e.g.

dynamic node = new DynamicNode(1046) 

if you don't do this, Razor won't be able to find properties or methods on the new type

DynamicMedia vs Media Properties

In 4.6.1, working with media was a little difficult.
While it was easy to get the nodeId of the media item, you couldn't easily get access to the data of the media.

You could execute the new Media() constructor from the API but the readability wasn't quite right.

We've added a new type called DynamicMedia which can be used in two ways.

You can instantiate a DynamicMedia item with an id:

dynamic mediaItem = new DynamicMedia(1054); @mediaItem.umbracoFile // => /path/tohttps://shop.umbraco.com/media/item.jpg 

or, from a DynamicNode, you can call the shorthand helper, .Media
There's two overloads for .Media
one just takes a property name for the property to return as DynamicMedia. You should use this syntax when you need to access multiple properties on the Media item

dynamic mediaItem = @item.Media("catPicture"); @mediaItem.umbracoFile @mediaItem.comment //(assuming comment is defined as a property on your media type) 

the second, allows you to quickly access a single property:

@item.Media("catPicture","umbracoFile") 

Here's an example:

@ForEach(var item in @Model.Children) { <img src="@item.Media("catPicture","umbracoFile")" /> 

DynamicMedia ctor string,int,object)

Just like DynamicNode, there's a constructor that takes string, int or object and returns you a DynamicMedia
Internally, the method just takes whatever you give it and attempts to treat it as an int.
If an int is successfully obtained, you get a DynamicMedia instance.

DynamicNode .NodeById & .MediaById

As a shorthand, a slightly more readable syntax is available if you already have a DynamicNode
You can call .NodeById or .MediaById to get a DynamicNode or DynamicMedia.

These are just helpers on DynamicNode so that you don't have to remember to put them in dynamic to access properties.
Here's an example:

@Model.NodeById(1046).Name 

Follow me at @agrath on twitter, and here's a few links:
The new Razor forum on our.umbraco
Github for any feature requests or bugs

Read more from the Umbraco Razor walkthrough series

Umbraco Razor Feature Walkthrough - Part 1
Umbraco Razor Feature Walkthrough - Part 2
Umbraco Razor Feature Walkthrough - Part 3
Umbraco Razor Feature Walkthrough - Part 4
Umbraco Razor Feature Walkthrough - Part 5
Umbraco Razor Feature Walkthrough - Part 6
Umbraco Razor Feature Walkthrough - Part 7
Umbraco Razor Feature Walkthrough - Part 8

Want to be updated on everything Umbraco?

Sign up for the Umbraco newsletter and get the latest news and special offers send directly to your inbox