Last Thursday i did a presentation on ASP.Net WebMatrix in the .Net User Group meeting held in Colombo.  so thought of  sharing the presentation with you all. there were some code demos also, but unfortunately i couldn’t upload them. if anyone is interested you can download and view the presentation in the link below or view it in the Scribd document.

I must thank Joe Stagner from microsoft for his ScreenCasts and Presentation on WebMatrix, which were very helpful for me to prepare my presentation too.

Introduction to ASP.Net Webmatrix

Download the Slide Deck here

Thanks,

Aneef

THIS POST IS UPDATED TO WORK WITH WEBMATRIX BETA 2

ASP.Net WebMatrix is a lightweight web development tool that contains IIS Express, SQL CE 4.0 and ASP.Net Web Pages with Razor Syntax. to learn more about ASP.Net WebMatrix read this excellent tutorial.

The ASP.Net Web pages ships with some really cool helpers like easy database access, Twitter profile, & Facebook like button.  and it also allows us to create our own helpers. in the current beta release of the WebMatrix there are 2 ways to create a helper:

1. Using a visual studio class library (Recommended).
2. Use .cs file in the App_Code directory in the WebMatrix project folder.

In this post I’m going to show you how to create a Helper to add Youtube Videos to your WebMatrix pages. as you know a helper needs to be a static class. here is the code:

using System;
using System.Web;
using System.Web.Mvc; 
using System.Web.WebPages;
using System.Web.Helpers;
 
public static class MyHelpers
{
    public static IHtmlString Youtube(string link, int width = 480, int height = 385, bool allowFullScreen = true)
    {
        string innerHtml = string.Empty;
        var url = "http://www.youtube.com/v/{0}?fs=1&hl=en_US";
 
        //prepare video embed URL
        var uri = new Uri(link);
        var querystring = uri.Query;
        var videoCode = HttpUtility.ParseQueryString(querystring).Get("v");
 
        url = string.Format(url, videoCode);
 
        //prepare HTML
        var html = new TagBuilder("object");
        html.MergeAttribute("width", width.ToString(), true);
        html.MergeAttribute("height", height.ToString(), true);
 
        var param1 = new TagBuilder("param");
        param1.MergeAttribute("name", "movie", true);
        param1.MergeAttribute("value", url, true);
 
        var param2 = new TagBuilder("param");
        param2.MergeAttribute("name", "allowFullScreen", true);
        param2.MergeAttribute("value", allowFullScreen.ToString(), true);
 
        var param3 = new TagBuilder("param");
        param3.MergeAttribute("name", "allowscriptaccess", true);
        param3.MergeAttribute("value", "always", true);
 
        var embed = new TagBuilder("embed");
        embed.MergeAttribute("src", url, true);
        embed.MergeAttribute("type", "application/x-shockwave-flash", true);
        embed.MergeAttribute("allowscriptaccess", "always", true);
        embed.MergeAttribute("allowfullscreen", allowFullScreen.ToString(), true);
        embed.MergeAttribute("width", width.ToString(), true);
        embed.MergeAttribute("height", height.ToString(), true);
 
        innerHtml += param1.ToString(TagRenderMode.SelfClosing);
        innerHtml += param2.ToString(TagRenderMode.SelfClosing);
        innerHtml += param3.ToString(TagRenderMode.SelfClosing);
        innerHtml += embed.ToString(TagRenderMode.SelfClosing);
 
        html.InnerHtml = innerHtml;
 
        return new HtmlString(html.ToString(TagRenderMode.Normal));
    }
 
}

Few things to note in the above code.  i have referenced System.Web.Mvc to use the TagBuilder to create safe html, and System.Web.Helpers to create the helper. the second one, you can find in C:\program files\Microsfoft ASP.Net (or ASP.net installation directory).

And I’m using the System.Web.HttpUtility here to extract a query string from a Uri.

        //prepare video embed URL
        var uri = new Uri(link);
        var querystring = uri.Query;
        var videoCode = HttpUtility.ParseQueryString(querystring).Get("v");

I use the above code to convert the Youtube public link to the actual video link.

And since my code needs to return an html which should not be html encoded again. my methods return type is IHtmlstring. using this tells the ASP.Net pages not to encoded this html again, as this is already encoded.

Now create the folder App_Code in your WebMatrix Project, and create a file named MyHelpers.cs and paste the code above in that.

Now you can use this in your WebPages like this to embed youtube videos in your pages:

  @MyHelpers.Youtube("http://www.youtube.com/watch?v=ulzLU3At3lA");

Other parameters such as width,height are optional as you can notice we have used optional parameters.

UPDATES for beta 2:

1. In beta 1 WebPages were in Microsoft.WebPages. but in WebMatrix beta 2 its moved to System.Web.WebPages
2. I had to copy System.Web.Mvc.dll to the bin directory of WebMatrix project to make this workin in WebMatrix beta 2.

I Hope it helps

Aneef

Well This issue has been bugging alot of people around the net it seems. I’m one of the victim too *sigh*.. anways bianchi007, a member in the CKSource Site forums had posted a solution. thought it would be worth to share.

Here is the solution which was posted in this thread.

This is for the .net assembly 2_6_3. I based it on the help file http://dev.fckeditor.net/attachment/tic … 2115.patch

Steps:

Open the FredCK.FCKeditorV2.vs2005.csproj in Visual Studio 2005

Open the file FileBrowser > FileWorkerBase.cs

Go to line 119

Replace:
[sourcecode language="csharp"]
Response.Write( @"(function(){var d=document.domain;while (true){try{var A=window.top.opener.document.domain;break;}catch(e) {};d=d.replace(/.*?(?:\.|$)/,”);if (d.length==0) break;try{document.domain=d;}catch (e){break;}}})();" );
[/sourcecode]

Replace with:
[sourcecode language="csharp"]
Response.Write(@"(function(){var d=document.domain;while (true){try{var A=window.parent.OnUploadCompleted;break;}catch(e) {};d=d.replace(/.*?(?:\.|$)/,”);if (d.length==0) break;try{document.domain=d;}catch (e){break;}}})();");
[/sourcecode]
Compile the project and then reference the new dll file in your project.

I hope it helps .

one of the coolest control in ASP.Net 3.5 is its Listview Control. its too CSS friendly, and we can use it to achieve many great content presentations. if you go to scottgu’s blog you can find some good articles on how to use the listview control.

recently I did such an implementation. its using the javascript bookflip. a great work by Will (very kind of him to share this to the world). I used the his code, and ListView to achieve a dynamic bookflip.  apart from the javascript changes,  here is the change I did for the Listview markup.

 <asp:ListView id="ImageFlip" runat="server" ItemPlaceholderID="ItemContainer">
   <LayoutTemplate>
      <div id="myBook" style="width: <%# flipWidth*2 %>px; height:

 <%# flipHeight %>px; position: relative; z-index: 5;">
        <asp:PlaceHolder ID="ItemContainer"  runat="server" />
        <div style="border: 0px solid #ddd;
    text-align: center;
    padding-top: 100px;
    margin: 0px;
    height: 0px;
    text-align:inherit;
    background-color: #ffffff;
 color: #cf0000;vertical-align:bottom" Name="Back" > 

<img src="spongebob300/bk.jpg"  border="0" usemap="#Map" />
</div>

      </div >
   </LayoutTemplate>
   <ItemTemplate>

   <div style="background:#ffffff ;color:#ffffff;

 cursor:url(ajax/zoom-in.cur),auto; z-index:-<%#Eval("PAGENO") %>;" 

name="Page <%#Eval("PAGENO") %>" >
    <a href="Javascript:getFullImage(<%#Eval("ID") %>)" >

<img src="<%#Eval("FlipImage") %>" alt="Page <%#Eval("PAGENO") %>" 

  border="0" style="cursor:url(ajax/zoom-in.cur),auto;" /></a>
    </div>
   </ItemTemplate>
   </asp:ListView>

And the Data Retrieval is just as simple as the following 3 lines:

DataTable dt = db.getFlipPage(catid);

ImageFlip.DataSource = dt;

ImageFlip.DataBind();

And that’s all. very easy isn’t it. for the real implementation of this go to www.catalogues4u.com.au and click on a catalogue.In that site I have also implemented a carousel using Listview.  hope it helps.

these days I’m just playing around with Visual studio 2008 and its new features, C# 3.0 LINQ, Windows Presentation Foundation, Silverlight, ASP.Net 3.5 and much more. And trust me last few months, I have received a lot of emails regarding How to’s of these and requesting resources to learn these language improvements. well may be you wonder why I get these requests while there are a lot of geek’s outs there.. well trust me I do have some fans!!.

so I decided to help them all out, but I don’t want to fill the blogsphere with another post of LINQ, WPF or WCF, because its already filled with a lot of articles on them by geek’s and various people around the world.so what I’m going to do is post some valuable links on where you can give a kick start on learning these.

1. To get visual studio 2008 read the post here.
2. The first and best place I would recommend to learn is reading Scott Guthrie’s web blog. he had written some excellent articles on these new technologies. I would recommend you to subscribe his blogs feeds or book marking his blog for future reference. here is are some valuable articles by him.
   1. Using LINQ with ASP.Net in VS 2008.
   2. Scott Guthrie – First Look at ORCAS.
   3. New “ORCAS” C# 3.0 Language Features: Automatic Properties, Object Initializers and Collection Initializers.
   4. New “ORCAS” Language Features : Extension Methods.
   5. New “ORCAS” Language Features : Lambda Expressions.
   6. New “ORCAS” Language Features : Query Syntax.
   7. New “ORCAS” Language Features : Anonymous Types.
   8. and the following are Scott’s posts on LINQ
      • • Part 1: Introduction to LINQ to SQL
        • Part 2: Defining our Data Model Classes
        • Part 3: Querying our Database
        • Part 4: Updating our Database
        • Part 5: Binding UI using the ASP:LinqDataSource Control
        • Part 6: Retrieving Data Using Stored Procedures
        • Part 7: Updating our Database using Stored Procedures
        • Part 8: Executing Custom SQL Expressions
        • Part 9: Using a Custom LINQ Expression with the Control
3. Another Place to Learn About LINQ is LINQ in Action . this site with its popularity has been written as a book also for more information visit here.
4. And now for WPF. here are the web sites which helped me to build my WPF knowledge.
   1. Windows Client official web site WPF Video Tutorials
   2. The Content Presenter
   3. The WPF Blog
5. And so far to lean Silverlight would recommend the official Silverlight web site.
6. and below are some more links which you might be interested in:
   1. Parallel Language Integrated Query (PLINQ)
   2. ASP.Net 3.5 Video Tutorials.
   3. 101 LINQ Samples.
   4. Xceed WPF Data Grid Component -Free full Version (1 Developer Licence ).
7. And finally The Official Visual studio 2008 training kit by Microsoft

Well These are the sites which I visit often to learn about these new technologies. I’m just sharing these with you to make it easy to find about these and learn them easily without spending much time to search for these.

I hope it helped you, Enjoy!!.

Recently one of my Friend Asked me, how do I display both the title and the description of the SiteMapNode in the ASP.Net menu control ? well unfortunately by default ASP.Net Menu doesn’t support this.because the menu binds directly to a MenuItem object. and the MenuItem does expose a DataItem Property,but when it is added to the menu, it has no longer reference to the SiteMapNode which is used to populate it.

But we can write our own custom methods in your classes to Achieve this requirement, by looking at the SiteMapNode based on its title or URI. a sample is given below:

   1:  private string menuDescription=string.Empty;

   2:   

   3:  protected string GetDescriptionByTitle(string title)

   4:  {

   5:  /*this assumes that there is only one node with this title.

   6:  which is a standard in asp.net SiteMap Development*/

   7:   

   8:  SiteMapNode node = SiteMap.RootNode;

   9:  SearchForDesc(node, title);

  10:  return menuDescription;

  11:  }

  12:   

  13:  private void SearchForDesc(SiteMapNode node,string title)

  14:  {

  15:  if (node.Title == title)

  16:  {

  17:  menuDescription = node.Description;

  18:  return;

  19:  }

  20:  else

  21:  {

  22:  foreach (SiteMapNode childnode in node.ChildNodes)

  23:  {

  24:  //search within childnodes

  25:  SearchForDesc(childnode, title);

  26:  }

  27:  }

  28:  }

And we can use the StaticItemTemplate and the DynamicItemTemplate to Display this information and use the GetDescriptionByTitle() method inside the templates as given below:

<asp:Menu ID="Menu1" runat="server" Height="24px"
Width="109px" DataSourceID="SiteMapDS1" StaticDisplayLevels="2"
StaticSubMenuIndent="0px">
<StaticItemTemplate>    <%# Eval("Text") %> <br />
<small>
<%# GetDescriptionByTitle(((MenuItem)Container.DataItem).Text) %>
</small></StaticItemTemplate><DynamicItemTemplate>
<%# Eval("Text") %> <br />   <small>
<%# GetDescriptionByTitle(((MenuItem)Container.DataItem).Text) %>
</small></DynamicItemTemplate></asp:Menu>

And here is the output:

Hope it helps!.