Code-Inside Blog International

Mono as a game platform? With Unity 3D you can create games and even publish it on the Wii or the iPhone/iPod Touch. First mono-based games are now in the stores.

Read the rest of this entry »

I just found that video on the Microsoft Surface Blog:

The pen demo is very cool – and a great idea how you could interact with such devices.

ScottGu wrote (I know – I´m late ) a blogpost about the release candidate of ASP.NET MVC and the  MVC Design Gallery.

Read the rest of this entry »

Microsoft released last week a ASP.NET MVC demo project called "Oxite" and many Newssites wrote things like "MS launched open source blogging plattform". It´s great that Microsoft released the source code, but on the other handside, there are many criticisms from the alpha geeks. The question is: Should source code only released if it is "perfect"?
Read the rest of this entry »

The Photosynth Team released today a Silverlight Viewer (which has some bugs) for Photosynth:

If you ever played with Silverlight you know, that there is no real built-in 3D support (WPF has some 3D features). The phtotosynth team describe there solution on the “About Page”:

Geek Stuff

Silverlight 2 does not support 3D, so in order to achieve the 3D effects used in this viewer we are utilizing a technique called Affine Texture Mapping where the images are drawn from many triangles, and then we are approximating the texture mapping. If you want to see the triangles we are drawing, press the ‘t’ key and navigate around in the viewer. Hit ‘t’ again to turn off the triangles.

(Look at Wikipedia for more information).
If you press "t" you will see the triangles:

There are some other nice 3D samples with Silverlight 2:

3D Submarine

And of course QuakeLight.

I really hope Silverlight 3 comes with some nice 3D features to create some incredible UIs.

Microsoft released today a new feature for ASP.NET – free chart controls (which are based on the Dundas Chart Controls). There are many nice looking charts in this download included:

The best thing is: It should work with ASP.NET MVC!

Download links for the ASP.NET Charts (free) :

• Download the free Microsoft Chart Controls
• Download the VS 2008 Tool Support for the Chart Controls
• Download the Microsoft Chart Controls Samples
• Download the Microsoft Chart Controls Documentation

Edit the Web.Config
To enable the controls you have to edit the web.config file.
Add this under the controls tag (path: "<system.web><pages><controls>") :

<add tagPrefix="asp" namespace="System.Web.UI.DataVisualization.Charting" assembly="System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

And add this httpHandler (under "<httpHandlers>") :

<add path="ChartImg.axd" verb="GET,HEAD" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>

Via: Combining ASP.NET MVC and ASP.NET Charting Controls

Add a chart control to a view:

Option A: ASP.NET Control + Code behind

If you use this option, you will have to add some code lines in the code behind file of your view. This shouldn´t be a big problem, because the controller is still responsible for the logic.

I took the "GettingStarted" Control from the samples:

Index.aspx:

<asp:chart id="Chart1" runat="server" Height="296px" Width="412px" Palette="BrightPastel" imagetype="Png" BorderDashStyle="Solid" BackSecondaryColor="White" BackGradientStyle="TopBottom" BorderWidth="2" backcolor="#D3DFF0" BorderColor="26, 59, 105">
	<Titles>
		<asp:Title Text="With datasource in code behind" />
	</Titles>
	<legends>
		<asp:Legend IsTextAutoFit="False" Name="Default" BackColor="Transparent" Font="Trebuchet MS, 8.25pt, style=Bold"></asp:Legend>
	</legends>
	<borderskin skinstyle="Emboss"></borderskin>
	<series>
		<asp:Series Name="Column" BorderColor="180, 26, 59, 105">
		</asp:Series>
	</series>
	<chartareas>
		<asp:ChartArea Name="ChartArea1" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid" BackSecondaryColor="White" BackColor="64, 165, 191, 228" ShadowColor="Transparent" BackGradientStyle="TopBottom">
			<area3dstyle Rotation="10" perspective="10" Inclination="15" IsRightAngleAxes="False" wallwidth="0" IsClustered="False"></area3dstyle>
			<axisy linecolor="64, 64, 64, 64">
				<labelstyle font="Trebuchet MS, 8.25pt, style=Bold" />
				<majorgrid linecolor="64, 64, 64, 64" />
			</axisy>
			<axisx linecolor="64, 64, 64, 64">
				<labelstyle font="Trebuchet MS, 8.25pt, style=Bold" />
				<majorgrid linecolor="64, 64, 64, 64" />
			</axisx>
		</asp:ChartArea>
	</chartareas>
</asp:chart>

I don´t know the exactly meaning of each line (read the documentation to lern more about it), but the important point is that we have a "Serie" with name " "Column" – this will represent your data as a bar in your bar chart.

Index.aspx.cs:

    public partial class Index : ViewPage
    {
        protected void Page_Load(object sender, System.EventArgs e)
        {
            foreach (int value in (List<int>)this.ViewData["Chart"])
            {
                this.Chart1.Series["Column"].Points.Add(value);
            }
        }
    }

Result:

Option B: Inline ASP.NET Control

You could also create the control without a code behind file, just create the control on the fly via inline code:

        <p>
        <%
						System.Web.UI.DataVisualization.Charting.Chart Chart2 = new System.Web.UI.DataVisualization.Charting.Chart();
                        Chart2.Width = 412;
                        Chart2.Height = 296;
                        Chart2.RenderType = RenderType.ImageTag;

                        Chart2.Palette = ChartColorPalette.BrightPastel;
                        Title t = new Title("No Code Behind Page", Docking.Top, new System.Drawing.Font("Trebuchet MS", 14, System.Drawing.FontStyle.Bold), System.Drawing.Color.FromArgb(26, 59, 105));
                        Chart2.Titles.Add(t);
                        Chart2.ChartAreas.Add("Series 1");

						// create a couple of series
                        Chart2.Series.Add("Series 1");
                        Chart2.Series.Add("Series 2");

						// add points to series 1
                        foreach (int value in (List<int>)ViewData["Chart"])
                        {
                            Chart2.Series["Series 1"].Points.AddY(value);
                        }

                        // add points to series 2
                        foreach (int value in (List<int>)ViewData["Chart"])
                        {
                            Chart2.Series["Series 2"].Points.AddY(value + 1);
                        }

                        Chart2.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
                        Chart2.BorderColor = System.Drawing.Color.FromArgb(26, 59, 105);
                        Chart2.BorderlineDashStyle = ChartDashStyle.Solid;
                        Chart2.BorderWidth = 2;

                        Chart2.Legends.Add("Legend1");

						// Render chart control
                        Chart2.Page = this;
						HtmlTextWriter writer = new HtmlTextWriter(Page.Response.Output);
						Chart2.RenderControl(writer);

                     %>
        </p>

Result:

Both controls together:

I think this is a very nice feature (and play well together with ASP.NET MVC) and you could add nice charts without buy a 3rd party licence.

[ Download Source Code ]

I received a very interesting link of an "Minority Report" alike operation environment: oblong.com – take a look at the demo:

g-speak overview 1828121108 from john underkoffler on Vimeo.

In my last post I wrote about why you should take a look at ASP.NET MVC. With this blogpost I want to go a little bit deeper into the MVC universe.

The project template
After the installation of ASP.NET MVC (currently beta) you will find a new project template in Visual Studio:

Right after you click ok you get another dialog:

ASP.NET MVC is very testable and ask you if you want to create a unit test project. I recommend you to do that (or create your own unit test project) – unit tests are a great way to produce high quality.
The default test framework is MSTest, other frameworks will be added later (hopefully ).

Project structure:
Now you should see a solution like this (i added another project to this solution, but you don´t need to care about it):

The "ReadYou.WebApp" shows the typical ASP.NET MVC folder structure:

• Controller: Logic
• Models: Business data / application model
• Views: simple ASPX / ASCX / masterpage (or other) views

Views, Controller & Models in detail
The project template include 2 controller and 3 view folders:

• The "Shared" folder contains all viewelements that could be used by other views, like the masterpage or some common controls.
• Each controller has it´s own view folder ("AccountController" – "Account" / "HomeController" – "Home")
• This "path"-configuration can be modified by using the diverent interfaces, hier are 2 good examples "Partitioning an ASP.NET MVC application into separate "Areas"" and Rob Conerys version.
• The "model" folder contains only the application data classes (normal CRL classes)

A short look on the default website:
The default MVC website is great to get a first look how MVC is working. There is masterpage, a simple membershipsystem and some simple form stuff (the login and register page) :

The request Flow:
Justin Etheredge create a great overview of the request flow and where the extensibility points are: ASP.NET MVC Request Flow

Communication between the controller and the view:

You can use the "ViewData"-dictionary to send data from the controller (the request will be routed to an action method of a controller) :

public ActionResult Index()
        {
            ViewData["Title"] = "Home Page";
            ViewData["Message"] = "Welcome to ASP.NET MVC!";

            return View();
        }

The data in the dictionary  will be send to a view called "Index" in the "Home" folder, because the action method is a method of the "HomeController". You can specify a view in the "View(YOURVIEW)" method, but if you just use the "View()" method the MVC framework will route the data to a view namend like the action method itself e.g. "Index".

Source code of the "Index.aspx" (~/Views/Home/):

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="ReadYou.WebApp.Views.Home.Index" %>

<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">
    <h2><%= Html.Encode(ViewData["Message"]) %></h2>
    <p>
        To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
    </p>
</asp:Content>

The data in the "ViewData"-dictionary are rendered though the inline code. There is no code behinde file, it´s similar to PHP/JSP or classic ASP.

As you can see: ASP.NET MVC is still MVC. You can still use the masterpage files and the content placeholder and use the "ViewData" in the masterpage:

...
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title><%= Html.Encode(ViewData["Title"]) %></title>
</head>
...

Strongly typed ViewData:

The dictionary isn´t very great in bigger applications, but you can use a strongly typed ViewData class to send data from the controller to the view. If you take a look at the code behinde file of the viewpage, than you see a partial class which is inherited from ViewPage:

namespace ReadYou.WebApp.Views.Home
{
    public partial class Index : ViewPage
    {
    }
}

You can pass in your own "ViewData" class to the ViewPage<T>:

Index.aspx.cs:

namespace ReadYou.WebApp.Views.Home
{
    public class IndexViewData
    {
        public string Text { get; set; }
    }

    public partial class Index : ViewPage<IndexViewData>
    {
    }
}

Index.aspx:

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="ReadYou.WebApp.Views.Home.Index" %>

<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">
    <h2><%= Html.Encode(ViewData.Model.Text) %></h2>
    <p>
        To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
    </p>
</asp:Content>

HomeController.cs:

        public ActionResult Index()
        {
            ViewData["Title"] = "Home Page";
            IndexViewData data = new IndexViewData();
            data.Text = "Hi strongly typed viewdatat";
            ViewData.Model = data;
            return View();
        }

The benefit of this approach is, that you get a more robust application and have a "contract" between the view and the controller.

Warning: The "ViewData["Title"]" is still in use, because the masterpage needs this data. In the MVC universe the controller is responsible to send all data to the view (there are some ideas how you can create an get an independent control).

You finde more information in this great blogpost of Scott Guthrie (it´s an older one, but the concepts are still in use):

ASP.NET MVC Framework (Part 3): Passing ViewData from Controllers to Views

Communication between the view and the controller

The view talks to the controler via normal HTML links or forms (GET/POST data).

The template included some examples:

Option 1: Via GET or the "ActionLink"

If you want to go to the register page, you just click on this link:

You just use the HTML "ActionLink" helper:

<p>
        Please enter your username and password below. If you don't have an account,
        please <%= Html.ActionLink("register", "Register") %>.
    </p>

The request will be routed to the "Register" action method on the "AccountController", because this view is inside the "Account"-folder and the second ActionLink parameter contains the name of the specific action method.

Option 2: Via POST

The login mask (username / password) use a standard HTML form:

    <form method="post" action="<%= Html.AttributeEncode(Url.Action("Login")) %>">
        <div>
            <table>
                <tr>
                    <td>Username:</td>
                    <td><%= Html.TextBox("username") %></td>
                </tr>
                <tr>
                    <td>Password:</td>
                    <td><%= Html.Password("password") %></td>
                </tr>
                <tr>
                    <td></td>
                    <td><input type="checkbox" name="rememberMe" value="true" /> Remember me?</td>
                </tr>
                <tr>
                    <td></td>
                    <td><input type="submit" value="Login" /></td>
                </tr>
            </table>
        </div>
    </form>

The Url.Action Helper create the action URL for the form. The form values will be submitted to the "Login" action method of the "AccountController", beacuse this view is inside the "Account"-folder.

The source code of the "Login" action method:

        public ActionResult Login(string username, string password, bool? rememberMe)
        {

            ViewData["Title"] = "Login";

            // Non-POST requests should just display the Login form
            if (Request.HttpMethod != "POST")
            {
                return View();
            }

            // Basic parameter validation
            List<string> errors = new List<string>();

            if (String.IsNullOrEmpty(username))
            {
                errors.Add("You must specify a username.");
            }
...
        }

The form values are automatically mapped to the method parameters. This mapping could be modified. Stephen Walther wrote a nice blogpost about this. And there is a great screencast how the binding in ASP.NET MVC works on Dimecasts.net.

Many helpers are overloaded and take strongly typed data – just try it out

"Best Practices", tips and information

The MVC framework is currently a beta version, that´s why you need to search at different blogs or websites to learn more about the framework. Here are my recommendations:

• Stephen Walthers Blog
• Rob Conerys MVC Storefront
• Scott Hanselman
• Scott Guthrie
• ASP.NET MVC Seite
• ASP.NET MVC Forum
• ASP.NET MVC Videos
• DotNetKicks – MVC

Feedback

Feel free to comment this blogpost (and my english )

A while ago I blogged about some ASP.NET MVC stuff, but why should I (and you) care about ASP.NET MVC?
ASP.NET MVC is a great and extensible framework for building web applications and is a alternative to the ASP.NET WebForms model.

Tell me more about "MVC"! 
MVC stands for "Model-View-Controller", which is a very old (but still very useful) design pattern. This design pattern will split your application in 3 different parts ("model", "view", "controller"). "Seperation of concern" is one of it´s main benefits.

Short description of these parts:

• "Model": Represents your application data/model and has no(!) business logic
• "View": Just display the given viewdata (this could be a normal HTML page or JSON/RSS data)
• "Controller": The controller represents the business logic and create the view data and send it to a view.

A good example of an MVC application is the web browser.

What is so "bad" about ASP.NET WebForms?
ASP.NET WebForms include many abstractions for the web development. If you are a WinForms developer, you will feel comfortable with it, but if you started with PHP/JSP or just pure HTML and Javascript you will feel very uncomfortable.
The "viewstate" is one feature to hide the stateless nature of HTML, but it can make your web application very slow and makes you crazy. The "WebForms" model include a very complex lifecycle and it´s  important to understand this to work with ASP.NET WebForms.
In my opinion it is too complex and the framework should embrace the nature of HTTP and don´t hide it.

Disclaimer: If you feel comfortable with WebForms, you have no reason to change to MVC – MVC is only on option.

What are the benefits of ASP.NET MVC
MVC is a very testable framework and you get full control of the rendering process. You can add functionality if you want, because MVC is very extensible and you can create a clean, DRY, testable web application.
Phil Haack (the program manager of ASP.NET MVC) did a great presentation at the PDC.

Things that you´ll maybe missing in MVC
Many ASP.NET controls use the postback-functionality. This function will not work well together with the MVC framework. Phil Haack did also 2 podcasts on HerdingCode and tell some thought about "the control story in MVC":
Part 1
Part 2

If you have questions, please add a comment (and if my english really suck please let me know ). This blogpost should only provide basics – other posts are planned.

In nearly every application you can install and use plugins (Firefox, Outlook, IE…). With .NET 4.0 you get a new feature to create extensible applications called "Managed Extensibility Framework" in short "MEF". You can today play with a preview of this upcoming framework.
Microsoft itself will use it in Visual Studio 2010 (take a look at the PDC Keynote from Scott Guthrie). A very nice demo of MEF was in the PDC session of Scott Hanselman and his "BabySmash". But there are a lot of other great MEF PDC Sessions.

Addins? .NET? System.Addin? 
The "System.AddIn" Namespace was introduced in .NET 3.5, but it was very hard to create addins. But MEF and System.AddIn should play well together.

What´s needed to play with MEF?
Everything you needed to start you can download at the Codeplex Site. Just download the newest release and copy the 2 DLLs in your project directory (Disclaimer- it´s still in development, everything might be changed until the release).

Hello World! Hallo Welt! Hello MEF! – Preparation

Projectstructure:

We have a simple service interface called "IHelloService":

    public interface IHelloService
    {
        string GetHelloMessage();
    }

In the HelloMEF.English / German Project we have the following code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using HelloMEF.App;
using System.ComponentModel.Composition;

namespace HelloMEF.English
{
    [Export(typeof(IHelloService))]
    public class EnglishHelloService : IHelloService
    {
        public string GetHelloMessage()
        {
            return "Hello World!";
        }
    }
}

Important for MEF is the "Export" attribut from the "System.ComponentModel.Composite" (MEF) Namespace.

Export means: This is a "IHelloService" plugin.

Both projects need only the reference to the HelloMEF.App because of the IHelloService interface.

The HelloMEF.App doesn´t know anything about these projects!

Plugin dictionary

Your application needs to know where plugins are placed, that´s why we create a "PlugIns" dictionary:

HelloMEF.App – HelloProgram:

    public class HelloProgram
    {
        [Import(typeof(IHelloService))]
        public List<IHelloService> Services { get; set; }

        public HelloProgram()
        {
	...
        }

        public void WriteHelloGreetings()
        {
            Console.WriteLine();
            Console.WriteLine("Writing Greetings...");

            foreach (IHelloService srv in Services)
            {
                Console.WriteLine(srv.GetHelloMessage());
            }

            Console.WriteLine("... powered by MEF");
        }
    }

Inside the "HelloProgram" class is a "IHelloServices" list, which is decorated with the "Import" attribute from the MEF namespace.

Import means: I took everything of type IHelloService.

The "WriteHelloGreeting" just iterate over the services list and write the message to the console.

HelloMEF.App – search & found plugins:

        public HelloProgram()
        {
            this.Services = new List<IHelloService>();

            if (!Directory.Exists("PlugIns"))
            {
                Directory.CreateDirectory("PlugIns");
            }

            AggregatingComposablePartCatalog catalog = new AggregatingComposablePartCatalog();
            catalog.Catalogs.Add(new AttributedAssemblyPartCatalog(Assembly.GetExecutingAssembly()));
            catalog.Catalogs.Add(new DirectoryPartCatalog("PlugIns"));

            CompositionContainer container = new CompositionContainer(catalog.CreateResolver());
            container.AddPart(this);
            container.Compose();
        }

At first we search for the "PluginIns" directory and create it if it it´s necessary. Now – pure MEF action:

Plugins are manged with parts and catalogs. We tell our catalog to search for plugins in this assembly:

            catalog.Catalogs.Add(new AttributedAssemblyPartCatalog(Assembly.GetExecutingAssembly()));

… and to look at this directory:

            catalog.Catalogs.Add(new DirectoryPartCatalog("PlugIns"));

We can also observe the directory, to add plugins while the application is running:

Through the container we tell MEF that here is a plugin interface (the list with the import attribute) and start the "compose" process.

HelloMEF.App – Plugins inside the assembly:

namespace HelloMEF.App
{
    public class HelloProgram
    {
	...
    }

    [Export(typeof(IHelloService))]
    public class MEFHelloService : IHelloService
    {
	...
    }

}

The plugins could be placed inside the assembly. MEF find these plugins through this catalog: "AttributeAssemblyPartCatalog"

The result:

 [ Download Source Code ]