Stupid Href Question

Jul 10, 2011 at 4:20 PM

Ya I'm new... ;)

I've created a custom shape for the image field that I'm using in a containable content type (similar to a blog post)... My question is how do I assign the details route/path as the href url to the image?  I tried wrapping an "a" tag around the image and using @Model.ContentPart.Path, but it renderes nothing so obviously I'm cluless as to what I'm doing. the goal is to use the image from image field as a clickable thumb on the summary listings page.

Thanks for any assistance!

Coordinator
Jul 10, 2011 at 5:09 PM

I don't really understand what you are trying to modify. But if I had to a link to the content item itself in the summary view, then I would override the alternate for this field/content type, and use Html.ItemDisplayLink extension method, which could take Model.ContentPart.ContentItem as an argument.

In order to see all available alternates and create them, you should use the Shape Tracing module.

Jul 10, 2011 at 5:55 PM

Neither do I... LOL
I've been understanding and using the alternates for most of my theme layout, but I don't understand how to use the Html.ItemDisplayLink properly (because I am truly clueless).
 I see in the RoutableTitle.Summary the title gets defined in lines 1-4 and is called as a variable in line 6, but I guess I'm confused on how to replace the title, with the image if that's what I'm supposed to do for the image shape. The shape alternate I'm trying to modify is Fields.Contrib.Image-MyInstanceName.cshtml. But now that I think of it, this alternate would be the same on the details page unless I hide it in the palcement.info so I'm probably going about this all wrong.

@using Orchard.Utility.Extensions;

@{
  Style.Include("contrib-imagefield.css");
  string name = Model.ContentField.Name;
}


@if (!String.IsNullOrWhiteSpace(Model.ContentField.FileName)) {
<p class="image-field">
//this is where I thought I could wrap an a tag.
<img src="@Url.Content(Model.ContentField.FileName)" alt="@Model.ContentField.AlternateText" width="@Model.ContentField.Width" height="@Model.ContentField.Height"/>
// end a tag

</p>
}

Should I be modyfying a different alternate?

Just assume this is a thumbnail for a blogpost summary. I created an "ArticleThumb" part that only has an image field and is added to say a blog post / containable content type. All of which I did in the admin section. Maybe I should be making this a module instead... ultimately I'm just making a listing and detail page for puppies for sale.. oh how cute I know... no deadline, no requirements, perfect for testing my orchard skillz.

Thanks Sebastien! Come to Whistler BC and I'll either buy you a beer or send you down somethign steep in the winter.

Coordinator
Jul 10, 2011 at 6:11 PM

Ok, I see what you want to do, and there are two different solutions:
- hide the field in placement, and change the template for Routable
- or create a completely new template for the summary view of your content type (using an alternate named Content-CONTENTTYPE.Summary.cshtml)

If you had to change more than the title, I would suggest you to override the alternate for the summary view of your content type. But I will just explain the first solution.

First you need to override the alternate for the title, which is in routable. Create an alternate for it, and try to get a reference for the field, using shape tracing. It should be something lile:

var contentItemm = Model.ContentPart.ContentItem;
var imageField = contentItem.CONTENTYPE.FIELDNAME; // here, CONTENTTYPE is used because its own part has the same name by design
var fileName = imageField.FileName;

This fileName will be used to render the image.

Now to create a link to the content item,

var url = Html.ItemDisplayUrl(contentItem);

Jul 10, 2011 at 6:26 PM

I think u understood me about 98%... or I'm misinterpreting what you just wrote. I still want the title to function as it does... I was just looking at the title because it has the link to the item. So i want the title and the thumb to link to the item.

I'll try what you just submitted so i fully comprehend it, but I have a feeling this would replace the title, correct?

Thanks for helping on a Saturday! I wish I had a more interesting question for you, but that might take a few months. I review the documentation a lot, but there are some core C# and MVC3 skills I am seriously lacking. Been trying to teach myself to expand from HTML CSS, and jquery to C# so any suggestions you think might help would be greatly appreciated!

Coordinator
Jul 10, 2011 at 6:56 PM

Then you do not need to change the routable template, just update the image field alternate, using the Html.ItemDisplayUrl example.

BTW it's sunday, not saturday ;)

Jul 10, 2011 at 7:01 PM

LMAO Oh ya it is Sunday isn't it?
See what happens when you drop a bunch of cash on an automatic espresso machine! LOL

I'm pickin up what yer putting down and it looks like i got it working.

Thanks Again!!!

Jul 11, 2011 at 5:43 PM

So I took yesterday off after I thought I had this working, but it appears I was palying with a cached version of a hard coded alternate... ()

I'm getting and error for

 var url = Html.ItemDisplayLink(contentItem);
Error 32 'System.Web.Mvc.HtmlHelper<dynamic>' has no applicable method named 'ItemDisplayLink' but appears to have an extension method by that name. Extension methods cannot be dynamically dispatched. Consider casting the dynamic arguments or calling the extension method without the extension method syntax. f:\Websites\TestWebsite\Orchard\Themes\Dogs\Views\Fields.Contrib.Image-PuppyThumb.cshtml 8 13 Dogs
Here's the alternate for my image field:
@using Orchard.Utility.Extensions;
 
 
@{
  Style.Include("contrib-imagefield.css");
  string name = Model.ContentField.Name;
  var contentItem = Model.ContentPart.ContentItem;
  var url = Html.ItemDisplayLink(contentItem);
}
 
@if (!String.IsNullOrWhiteSpace(Model.ContentField.FileName)) {
<p class="image-field pup-thumb">
 
    <a href="@url"><img src="@Url.Content(Model.ContentField.FileName)" alt="@Model.ContentField.AlternateText" width="@Model.ContentField.Width" height="@Model.ContentField.Height"/></a>
 
</p>
}

I got the same error when I tried to recreate the MY-THEME/CONTET-TYPE-Sumary.cshtml alternate and replace the Title as in your first example.

I know I'm missing some key concepts here so maybe u can point me in the directin of what I need to study too? (I just started playing with C# and MVC3 a few weeks ago and Orchard only about a week ago, so I know nothing really)

Coordinator
Jul 11, 2011 at 5:45 PM

You misread something, it should be ItemDisplayUrl in this case, not ItemDisplayLink

Jul 11, 2011 at 5:47 PM

I actually tried both and get the same error

Coordinator
Jul 11, 2011 at 5:51 PM

Sorry, it’s not on the Html helper, it’s Url actually for this one:

Url.ItemDisplayUrl

Jul 11, 2011 at 5:51 PM

Might this have anything to do with the way I made the field a part first and then attached it to my containable content type? Rather than just adding it as a field to the Content-Type?

Jul 11, 2011 at 5:51 PM

ok I'll try it

Jul 11, 2011 at 5:58 PM

Same error:

CS1973: 'System.Web.Mvc.UrlHelper' has no applicable method named 'ItemDisplayUrl' but appears to have an extension method by that name. Extension methods cannot be dynamically dispatched. Consider casting the dynamic arguments or calling the extension method without the extension method syntax.

Coordinator
Jul 11, 2011 at 6:01 PM

Also, this:

var contentItem = Model.ContentPart.ContentItem;

Should be

ContentItem contentItem = Model.ContentPart.ContentItem;

Or

var contentItem = (ContentItem)Model.ContentPart.ContentItem;

Or

var contentItem = Model.ContentPart.ContentItem as ContentItem;

Because otherwise the value is typed as dynamic, which extension methods won’t understand.

Jul 11, 2011 at 6:29 PM

So if I use your examples (any of them) I get this error:

The type or namespace name 'ContentItem' could not be found (are you missing a using directive or an assembly reference?)

When I use:

Orchard.ContentManagement.ContentItem contentItem = Model.ContentPart.ContentItem;

I get more errors on line 8 for the var url... System.NullReferenceException: Object reference not set to an instance of an object.
And a huge stack trace

I thought I was getting it, but now I'm more confused. Do I need to change the var url = to something else as well?

Thanks for your patience and your help! Looks like I may owe u at least a six pack ;)

Coordinator
Jul 11, 2011 at 6:44 PM

This was a bug in the module, I fixed it. You can update to the latest version and try again.

Jul 11, 2011 at 6:53 PM

Sweet... It works perfectly!!!

I understand what's going on here now and despite the hiccup(s) I learned a few valuable things.

I really appreciate your help and glad I could assist in finding a bug in the process ;)

Stay Awesome!

Coordinator
Jul 11, 2011 at 6:54 PM

Thanks, glad I helped.