Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Template Questions

Image.SetWidth(150) Link


Go to End
Reply

10 Posts   5462 Views

Avatar
Ben Gribaudo

25 February 2009 at 9:38am Community Member, 181 Posts

Hello,

How do I get the link to a resized image in a template? It would be nice to be able to do something like:

Image.SetWidth(150).Link


However, I can't do that as Image.SetWidth(150) always returns HTML.

(In case you're wondering, I'm building a desktop background download page where the background image needs to be offered in several resolutions. I would like to auto-generate those variations using image resizing functionality.)

Thank you,
Ben

Avatar
Ben Gribaudo

25 February 2009 at 11:45am Community Member, 181 Posts

More on this....
It is possible to extend Image by adding convenience methods to provide the desired data. Example:

class WallpaperResourceImage extends Image {
   public function ResizedURL($width) {
      return $this->SetWidth($width)->URL();
   }
}

The downside with this approach is that referencing the resized image to retrieve different pieces of data in the template becomes cumbersome. Instead of being able to do something simple like this --

Image.SetWidth(150).Link
Image.SetWidth(150).getHeight


-- we have to add a method to our Image extension (in this case, WallpaperResourceImage) for every piece of data we want.

Avatar
alirobe

25 February 2009 at 7:45pm (Last edited: 25 February 2009 7:46pm), Community Member, 35 Posts

Strangely, I came across this very same problem today, trying to set some page-specific CSS.

Writing a class is a very messy solution because it also means the theme and mysite folders are more coupled. This syling information should definitely be in the themes directory. If anyone can offer any ideas, I would also love to hear them.

Avatar
Ben Gribaudo

5 March 2009 at 12:07pm Community Member, 181 Posts

More on this:

The template parser (in sapphire\core\SSViewer.php) uses regular expressions to convert template method/property calls into PHP. These regexes look for a fixed combination of call signatures--i.e. "Property.Subproperty", "Property(one_argument).Subproperty", "Property.Subproperty(one_argument)", etc. The signature of "Image.SetWidth(150).Link " does not match any of the defined call signatures. However, the signature of "Image.SetWidth(150)" does match one of the signatures. So, the parser converts "Image.SetWidth(150)" into PHP (which then is rendered as HTML) and then outputs ".URL" after it.

A [url=http://groups.google.com/group/silverstripe-dev/browse_thread/thread/7842ab97f687cd1e#]draft patch[/url] has been proposed which will remove the limitation of having a fixed list of allowed call signatures.

Avatar
Willr

5 March 2009 at 4:24pm Forum Moderator, 5511 Posts

This is a bit clumsy but should work

<% control Image %>
<% control SetWidth(150) %>
<a href="$Link"><img src="$URL" alt="$Title" /></a>
<% end_control %>
<% end_control %>

Avatar
Ben Gribaudo

6 March 2009 at 7:01am Community Member, 181 Posts

Thanks, Will!

Avatar
Ben Gribaudo

19 March 2009 at 8:21am Community Member, 181 Posts

The above-mentioned patch is attached to ticket [url=http://open.silverstripe.com/ticket/3738]#3738[/url]. Testers are needed to try it out.

Avatar
Willr

19 March 2009 at 1:27pm Forum Moderator, 5511 Posts

Nice work bgribaudo looks patch sounds like an awesome addition to the SSViewer!

Go to Top