vendredi 29 mars 2013

New App using ASP.NET with some fancy frameworks …


One of my colleague (Tomislav Babic) has created a long but perfectly built article about creating an ASP.Net application.
He started from the database with Entity Framework, going on with Breeze.Net for the glue between client & server and close the article with Knockout JS & KOGrid for the client presentation layer.
If you want to learn from scratch how to setup a solution or if you want to discover some new frameworks, read it !

Windows Phone 7 Coding Dojo


Here is a video showing how to create a simple but useful Windows Phone 7 application. This application allowDevoteam Luxembourg’s consultant to add and follow their time off requests.
This application use web services based on Object Client for SharePoint. We will only see the Blend 4 part and the Visual Studio for windows phone development.
I only use MVVM Light (as usual :p) as external framework. I have already done the link between the “enum application state” and the “data state mechanism” (see previous coding dojo for more details). I have set up MVVM Light with NuGet :) (see details on NuGet)
The first video show how you can set up the project and create quick content (approx 1h). The second video show the capability of the application, on normal usage.


Video directly available on my blog : http://www.alphablog.org/2011/10/22/windows-phone-coding-dojo/

Blend 5 and Visual Studio 11 feedback, the Windows 8 development future


Here is a little feedback on Visual Studio 11 & Blend 5…

1 – Visual Studio 11

Visual Studio 11 is provided in the Windows 8 Developer Version. It is provided with some “Metro Application Style” templates. One first thing we can notice is that VS11 is very similar to VS10… Microsoft added usefull features detailed below. I am quite disapointed about Microsoft political point of view about Xaml Language and Html5/JavaScript…

Fast file preview

File preview in Visual Studio 11
File preview in Visual Studio 11
You may know that Visual Studio is multi-tab layered. But, when you “simple-click” on a file in the file treeview, a new tab stacked on the left will appear. It will provide you a quick preview of the file content.

Quick search in Solution

Visual Studio 11 research in project
Visual Studio 11 research in project
Visual studio embed now a search field just above the file treeview. You can now look for a file, a class, a method or a field in few seconds. It will enhance our productivity incredibly.

Quick Search Command

Visual Studio 11 research commands
Visual Studio 11 research commands
You can also search for a command through the search field in the Visual Studio Toolbar and access quickly for all available commands.

Some “Metro Style Application” samples

Metro Style 1Metro Style 2
Metro Style 3Metro Style 4
Visual Studio provide us few templates and show us how “Metro Style Application” can be.

2 – Blend 5

Blend 5 is provided for testing JavaScript/Html5 solution for Windows 8. I used to work with Blend 4 for Silverlight and lots of features that was available and allow me to produce a fast/clean solution is not available for Html5/JavaScript solution… For example, binding states to an enum property… But in the JavaScript/Html5, there is no state or even storyboard. Blend is a JavaScript/Html5 WYSIWYG editor in this specific case …

Where are my tools ?

Blend tools
Blend tools
This is the only tools you have in the JavaScript/Html5 version of Blend :(

Assets, generated parts & Javascript

Blend static and generated parts
Blend static and generated parts
Here is a sample of a rating “control” in Blend 5. As you can see, the rating control will create a div and “generate elements inside” (elements with a lightning near the eye). You can access the div and do your stuff on the JavaScript side.

Long long long CSS train …

CSS big world
CSS big world
Once unfolded, CSS properties are numerous…

Plateform testing

Blend platform testing
Blend platform testing
Your application can be tester under multiple format. This is a good point of Blend 5. You can also activate an emulator for directly seeing the result. Here is the result in the emulator :
Blend emulator
Blend emulator

Files created in a new Html5/Javascript

JavaScript project files
JavaScript project files
Here is the project content created for an Html5/JavaScript project.

Good features nevertheless …

CSS identification
CSS identification
Some good features are added inside Blend 5… You can fly over a CSS Style and see where it is applied.

 Conclusion

I am worry about Silverlight/WPF/Xaml-Based future for many reasons.
  1. I have seen lots of Silverlight developers that doesn’t know how to use Blend… (too many …)
  2. Microsoft only talk about Html5 and JavaScript in their meetings…
But, we have a big advantage. True Silverlight developers can create more shiny application in a shorter time than with Html5/JavaScript … And C# will always be smarter than JavaScript

Single web service for multiple devices (IPhone, Windows Phone, Silverlight, Windows 8)


At Devoteam Luxembourg, our goal was to develop a cross platform application.
We have developed a set of application based on a single “web services server”.
  • An IPhone, IPad, Android version with Sencha Touch
  • A Windows Phone 7 native version
  • A Silverlight version
  • A Windows 8 based on winRT version
This article will only talk about consuming web services on this 4 versions.  We add some constraints like activating HTTPS for enhancing security, taking care of enhancing speed for mobile devices, etc … What is the conclusion of the adventure ?! :)
Global architecture
Global architecture

Iphone, IPad and Android

we had set up JSON for the first time for IPhone and it was easy in IPhone side. But WCF was a bit more lazy …
Here is a sample of service header :

[OperationContract]  [WebInvoke(Method = "POST", UriTemplate = "SendRequest", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]  public string SendRequest(Stream multipartData)  {

we had to parse the multipartData stream and transform the JSON string with the JavaScriptSerializer…

Windows Phone

WCF setup was more easy.

[OperationContract]
  public string SendRequest(string login, string password, int requestType, string startDate, string endDate, int startAM, int stopAM)  {

but we had to develop an “automatic certificate installer” for windows phone, based on http://wp7certinstaller.codeplex.com. If the phone does not have the certificate, it will be redirected on a website. We can’t use not trusted webservices without installing the certificate. Same as silverlight and windows 8 behavior, we do not have access to the ServicePointManager :
ServicePointManager.CertificatePolicy = delegate { return true; };

Silverlight

The silverlight consume the same web service than windows phone. Otherwise, it was mandatory to install the client certificate.

Windows 8

Due to close timeline, we have give up installing https for Windows 8. We use Http binding over the windows phone web service. It only use an other endpoint on the Windows Phone.

Summary

The sheet below describe what we can do and with predefined configurations :

Summary
For information here is the web.config :

<?xml version="1.0"?>    <configuration>      <system.web>  <system.serviceModel>  <bindings>  <wsHttpBinding>  <binding name="IPhoneBinding">  <security mode="Transport">  <transport clientCredentialType="None" />
  </security>  </binding>  </wsHttpBinding>    <basicHttpBinding>  <binding name="WP7Binding">  <security mode="Transport"/>
  </binding>  <binding name="WP7BindingNoHttps">  </binding>  </basicHttpBinding>  </bindings>    <behaviors>  <endpointBehaviors>  <behavior name="WebBehavior">  <webHttp />
  </behavior>  </endpointBehaviors>    <serviceBehaviors>  <behavior name="TimeOffServiceBehaviors">  <serviceMetadata httpsGetEnabled="true" />
  <serviceDebug includeExceptionDetailInFaults="true" />
  </behavior>    <behavior name="TimeOffApp.TimeOffServiceWP7Behavior">  <serviceMetadata httpsGetEnabled="true" />
  <serviceDebug includeExceptionDetailInFaults="true" />
  </behavior>  </serviceBehaviors>  </behaviors>    <serviceHostingEnvironment aspNetCompatibilityEnabled="true" />
    <services>  <service behaviorConfiguration="TimeOffServiceBehaviors" name="TimeOffApp.TimeOffService">  <endpoint address="" behaviorConfiguration="WebBehavior" binding="wsHttpBinding" bindingConfiguration="IPhoneBinding"  name="IPhoneEP" contract="TimeOffApp.TimeOffService" />
  </service>  <service behaviorConfiguration="TimeOffApp.TimeOffServiceWP7Behavior" name="TimeOffApp.TimeOffServiceWP7">  <endpoint address="" binding="basicHttpBinding" bindingConfiguration="WP7Binding" contract="TimeOffApp.TimeOffServiceWP7" />
  <endpoint address="" binding="basicHttpBinding" bindingConfiguration="WP7BindingNoHttps" contract="TimeOffApp.TimeOffServiceWP7" />
  </service>  </services>  </system.serviceModel>  </system.web>  </configuration>


Original article available at http://www.alphablog.org

Silverlight 5 and Tasks : strange behavior ! (Updated)


This blog post aims to talk about a strange behavior of Silverlight when using TPL (Tasks parallel library) .

Context


You may need to integrate OData service in Silverlight. In this context, you could add your business code in the Silverlight part. It can result a sequence of asynchronous call in Silverlight (like Russian doll) :
When server raises an exception it must be propagated to the client (with or without message).
In my future example, I will try to create an address in AdventureWorks database, without filing mandatory fields, and asynchronously save it. The save MUST raise an exception. I will describe all methods used to do this.

Acknowledgement

Version 1 

The first version is fully functional and raises an exception in the callback. In a single call, we can’t see the difference but, in multiple and sequenced call, the process can be heavy.
Thanks to task parallel library, a new call system can be developed with Silverlight 5, based on Task.

Version 2, with TPL – ContinueWith 

The code below is also functional. We receive the exception and we can manage it.

Version 3 – TPL Wait & Result 

With or without the t.Wait(), t.Result must wait and block thread until result arrives. But this code is not functional. The test is a success without exception but it blocks when server raises an exception. I have done the same test in WPF (same server, same service, OData reference generated asynchronously) and WPF does not have this strange behavior.

Version 4 – TPL Explicit exception 

This version allow us to catch the exception on the Wait() call. This code is functional.

Conclusion

This peaces of code show us that a service exception is not caught/raised properly by Silverlight if you use Wait() or Result() without ContinueWith instruction…
Have you already experienced this strange behavior?

PS : Here is the source code for my tests : SilverlightApplicationTPL.zip (you may need AdventureWorks database and a local IIS)

Update

One of my collegues ask me to check some points for the working and the non-working scenario :
OData request : The OData request is perfectly send is both cases. Here is the fiddle traces :
In debug mode, it is clear that ContinueWith version will raise an exception …
…  and t.Result version has not any exception before calling t.Result and before program hangs :
Output window : in both cases, we see that the version 2 perfectly raises exceptions :
But version 3 does not :
There is still no response :)

Simple Plugin System based on Ninject and MVVM Light

My goal was to develop a simple but useful plugin system for my future developments. I wanted to keep/to have:
  • Blendability
  • Ninject power and flexibility
  • Smooth animations
  • Modularity (development & code)
  • Fast "menu" system
This sample rely on a solution available here : PluginSystem.zip

Solution


 The PluginSystem assembly contains the plugin base class, the view model base class and an animated content control. PluginBase class :
 This class force plugins to expose a user interface, an name (for menu printing in this case) and force overriding OnActivate and OnDeactivate methods. PluginViewModelBase class :
 This class is a simple layer over ViewModelBase defined in MVVM Light. The main difference is that it embeds the reference of the parent plugin. With this reference, the plugin can easily access to injected values for example. AnimatedContentControl class : This usercontrol works like a commn ContentControl. There is one difference : if you change the content, it will animate it.
 You can set AnimatedContent for the content, Delay, EasingFunction and Transition properties to customize the transition when you change the content.

Main application side

You can use the plugin system to get a dynamic menu:
  1. You can create a Ninject module for declaring plugin bindings.
  2. Once done, we get all registered plugins by using Ninject Kernel
  3. You set the list in your viewmodel
  4. You bind the list to the view
Last step is to bind the selected item's user control to a content control (or an animated content control). You can also use the plugin system to get static region system.

Defining a new Plugin

You need to create a new class library. Include some WPF libraries (System.Xaml, PresentationCore, PresentationFramework) and create a plugin definition file and a pluginVM file. In this plugin file sample, you can set the "MainPart" property, create the view model and set it to the datacontext. Here is a sample:

Blendability

With this system you can keep "blendability" by using "Sample data" system from Blend. You will have your view model with design mode detection and capability to set custom data.

Ninject power and flexibility

Based on Ninject system, you keep all the power of Ninject. For example : This module defines 3 plugins but also define sorting parameters based on "Name" You can use this module for extracting only "FirstScreenable" plugins
 (Plugin3 is a dependency for Plugin2 it must not be printed on the first screen) On the other hand, you can rely on Ninject to inject something else than plugins.

Smooth animations

Thanks to the AnimatedContentControl, if you change the "AnimatedContent" property, you automatically start an animation. You can also see/try these animations inside Blend.

Modularity (development & code)


 As you can see, the main application is perfectly separated from plugins. Each team can work on a plugin without interact with other plugins.

Why not using PRISM

I have tried Prism during 20 minutes and I was not able to create a simple plugin system based on it. Moreover Prism4 documentation pdf file is more than 352 pages (too much to read for a simple modularity system). One of the best practice is KISS, keep it stupid simple! By the way, this simple plugin system took me less than 30 minutes to create !

Associated files

All sources are available for WPF here : PluginSystem.zip Contact me if you need a port in Silverlight :)

Original article available at http://www.alphablog.org

Blend 5 and Visual Studio 11 feedback, the Windows 8 development future

Here is a little feedback on Visual Studio 11 & Blend 5...

1 - Visual Studio 11

Visual Studio 11 is provided in the Windows 8 Developer Version. It is provided with some "Metro Application Style" templates. One first thing we can notice is that VS11 is very similar to VS10... Microsoft added usefull features detailed below. I am quite disapointed about Microsoft political point of view about Xaml Language and Html5/JavaScript...

Fast file preview

[caption id="attachment_466" align="alignnone" width="708"]File preview in Visual Studio 11 File preview in Visual Studio 11[/caption] You may know that Visual Studio is multi-tab layered. But, when you "simple-click" on a file in the file treeview, a new tab stacked on the left will appear. It will provide you a quick preview of the file content.

Quick search in Solution

[caption id="attachment_467" align="alignnone" width="349"]Visual Studio 11 research in project Visual Studio 11 research in project[/caption] Visual studio embed now a search field just above the file treeview. You can now look for a file, a class, a method or a field in few seconds. It will enhance our productivity incredibly.

Quick Search Command

[caption id="attachment_468" align="alignnone" width="344"]Visual Studio 11 research commands Visual Studio 11 research commands[/caption] You can also search for a command through the search field in the Visual Studio Toolbar and access quickly for all available commands.

Some "Metro Style Application" samples

Metro Style 1Metro Style 2 Metro Style 3Metro Style 4 Visual Studio provide us few templates and show us how "Metro Style Application" can be.

2 - Blend 5

Blend 5 is provided for testing JavaScript/Html5 solution for Windows 8. I used to work with Blend 4 for Silverlight and lots of features that was available and allow me to produce a fast/clean solution is not available for Html5/JavaScript solution... For example, binding states to an enum property... But in the JavaScript/Html5, there is no state or even storyboard. Blend is a JavaScript/Html5 WYSIWYG editor in this specific case ...

Where are my tools ?

[caption id="attachment_475" align="alignnone" width="50"]Blend tools Blend tools[/caption] This is the only tools you have in the JavaScript/Html5 version of Blend :(

Assets, generated parts & Javascript

[caption id="attachment_476" align="alignnone" width="392"]Blend static and generated parts Blend static and generated parts[/caption] Here is a sample of a rating "control" in Blend 5. As you can see, the rating control will create a div and "generate elements inside" (elements with a lightning near the eye). You can access the div and do your stuff on the JavaScript side.

Long long long CSS train ...

[caption id="attachment_477" align="alignnone" width="373"]CSS big world CSS big world[/caption] Once unfolded, CSS properties are numerous...

Plateform testing

[caption id="attachment_478" align="alignnone" width="413"]Blend platform testing Blend platform testing[/caption] Your application can be tester under multiple format. This is a good point of Blend 5. You can also activate an emulator for directly seeing the result. Here is the result in the emulator : [caption id="attachment_479" align="alignnone" width="577"]Blend emulator Blend emulator[/caption]  

Files created in a new Html5/Javascript

[caption id="attachment_474" align="alignnone" width="312"]JavaScript project files JavaScript project files[/caption] Here is the project content created for an Html5/JavaScript project.

Good features nevertheless ...

[caption id="attachment_480" align="alignnone" width="579"]CSS identification CSS identification[/caption] Some good features are added inside Blend 5... You can fly over a CSS Style and see where it is applied.  

 Conclusion

I am worry about Silverlight/WPF/Xaml-Based future for many reasons.
  1. I have seen lots of Silverlight developers that doesn't know how to use Blend... (too many ...)
  2. Microsoft only talk about Html5 and JavaScript in their meetings...
But, we have a big advantage. True Silverlight developers can create more shiny application in a shorter time than with Html5/JavaScript ... And C# will always be smarter than JavaScript :)


Original article available at http://www.alphablog.org