SparkViewEngine, Dexter, ViewEngine, ASP.NET, Exception, Windows Communication Foundation, IIS, Certification, Exam, MVC, CodeContracts, C#, Async, JQuery, Temi

Già nel post precedente ho introdotto SparkViewEngine; in questo voglio mostrare un’interessante feature che apre diversi scenari di mantenibilità e di “servizio”, come nel caso di Dexter che mostrerò più avanti.

Sicuramente ci sarà capitato molto spesso di dover “hostare” le nostre applicazioni all’interno di una virtual directory, e magari di doverle spostare successivamente sulla root di un sito e viceversa: spesso questo risulta scomodo in quanto può comportare alcune modifiche ai percorsi dei file di risorse (immagini, css, javascript, etc). Se proviamo a guardare il lato pratico, un codice html simile a questo:

<link type="text/css" rel="stylesheet" href="/Styles/Site.css" />

non sarebbe più valido nel caso il sito fosse spostato all’interno di una virtual directory, e dovrebbe diventare una cosa del tipo:

<link type="text/css" rel="stylesheet" href="/MyVirtualDirectory/Styles/Site.css" />

Ovviamente il problema è risolvibile sfruttando un helper che effettua il resolve dell’url, con il conseguente svantaggio di aggiungere codice all’interno del markup, rendendo difficile un eventuale refactoring; a questo si aggiunge la perdita in leggibilità del codice html. Un’altra soluzione è far gestire i percorsi delle risorse a Spark (devo dire che lo fa egregiamente e con estrema semplicità) : in primis è necessario modificare il web.config aggiungendo la sezione di Spark, come mostrato di seguito:

    <section name="spark" type="Spark.Configuration.SparkSectionHandler, Spark" requirePermission="false"/>
</configSections>

<spark>
    <compilation debug="false"/>
    <pages automaticEncoding="true">
        <namespaces>
            <add namespace="System" />
            <add namespace="System.Web" />
            <add namespace="System.Web.Mvc" />
            <add namespace="System.Web.Mvc.Ajax" />
            <add namespace="System.Web.Mvc.Html" />
            <add namespace="System.Web.Routing" />
            <add namespace="System.Linq" />
        </namespaces>
        <resources>
            <add match="~/Scripts" location="/Resource/Scripts" />
            <add match="~/Styles" location="/Resource/Styles" />
            <add match="~/Images" location="/Resource/Images" />
            <add match="~/Media" location="/Resource/Media" />
        </resources>
    </pages>
</spark>

Come potete intuire la sezione resource è quella più interessante, e ci permette di specificare dove sono presenti i files delle risorse: quindi, lato view, è sufficiente utilizzare il tilde per indicare il percorso iniziale dell’applicativo, poi ci penserà spark in fase di rendering a sostituirlo con quanto specifica nel file di configurazione.
Se proviamo a renderizzare questo codice html con i settaggi sopra specificati, il rendering finale dovrebbe essere questo:

<link type="text/css" rel="stylesheet" href="~/Styles/Site.css" />

<link type="text/css" rel="stylesheet" href="/Resouce/Styles/Site.css" />

Ovviamente questo può aprire un ulteriore scenario, ossia offrire la possibilità a chi sviluppa la parte html di utilizzare alcune CDN (google, Microsoft, etc) senza doverne conoscere il percorso; di fatto, chi vuole sviluppare una skin per dexter e vuole utilizzare la cdn di Microsoft per jQuery, può semplicemente scrivere questo:

<script src="~/Scripts/CDN/jQueryTools/1.2.2/jquery.tools.min.js" type="text/javascript" language="javascript"></script>

Così facendo si può cambiare in un qualsiasi momento la CDN da utilzzare, o scegliere di hostare il file con la libreria su un proprio server.
Di seguito riporto il blocco di configurazione di spark in dexter, che mostra le varie CDN supportate:

<spark>
    <compilation debug="false"/>
    <pages automaticEncoding="true">
        <namespaces>
            <add namespace="System" />
            <add namespace="System.Web" />
            <add namespace="System.Web.Mvc" />
            <add namespace="System.Web.Mvc.Ajax" />
            <add namespace="System.Web.Mvc.Html" />
            <add namespace="System.Web.Routing" />
            <add namespace="System.Linq" />
            <add namespace="Dexter.Web.Site.Models.Blog" />
            <add namespace="System.Collections.Generic" />
            <add namespace="Dexter.Web.Mvc.Helpers" />
            <add namespace="Dexter.Core.Configuration" />
            <add namespace="Dexter.Core.Concrete" />
            <add namespace="Dexter.Web.Mvc.Controls" />
        </namespaces>
        <resources>
            <add match="~/Scripts/CDN/Microsoft" location="http://ajax.microsoft.com/ajax"/>                 <!-- http://www.asp.net/ajaxlibrary/cdn.ashx -->
            <add match="~/Scripts/CDN/Google" location="http://ajax.googleapis.com/ajax/libs"/>                 <!-- http://code.google.com/apis/ajaxlibs/documentation/#AjaxLibraries -->
            <add match="~/Scripts/CDN/jQueryTools" location="http://cdn.jquerytools.org"/>                    <!-- http://flowplayer.org/tools/download/index.html -->
            <add match="~/Scripts" location="~/Scripts" />
            <add match="~/Styles" location="~/Styles" />
            <add match="~/Images" location="~/Images" />
            <add match="~/Media" location="~/Media" />
        </resources>
    </pages>
</spark>

Ciauz

This entry was posted on Monday, 05 July, 2010 and is filed under MVC . You can follow any responses to this entry through here . You can leave a response.

Già nel post precedente avevo annunciato una serie di contenuti riguardanti SparkViewEngine. Per approfondire l’utilizzo di questo engine ho cominciato il porting della skin del mio blog: devo dire che, man mano che lo utilizzo, rimango colpito dalla sua produttività e potenza, a partire dalle cose più semplici fino ad arrivare a funzioni un po’ più avanzate che permettono di creare delle vere e proprie funzioni e/o ottimizzazioni.

Per chi non abbia voglia di aspettare e voglia vedere un utilizzo un po’ più “spinto” di Spark, consiglio di dare un’occhiata al codice di Dexter e, nello specifico, alla cartella Themes/Fusion, dove si trova il porting della mia skin che è abbastanza ricca di html.

Come preannuncia il titolo, questo post ha lo scopo di mostrare come utilizzare da subito per una semplicissima applicazione SparkViewEngine, quindi configurarlo e capirne un po’ la logica.

Una volta scaricato il codice da qui, basta referenziare le due Assembly che ne permettono l’utilizzo in ASP.NET MVC, Spark.dll e Spark.Web.Mvc.Dll e registrare il nuovo ViewEngine allo startup dell’applicativo; quindi nel global.asax.cs basta inserire il seguente codice:

protected void Application_Start(object sender, EventArgs e)
{
    RegisterRoutes(RouteTable.Routes);
    SparkEngineStarter.RegisterViewEngine();
}

A questo punto l’applicazione è abile ed arruolata a sfruttare tutte le potenzialità di Spark, ma prima di scrivere un po’ di codice nella view è importante sapere che:

• La struttura delle folder contenente le View è esattamente la stessa che si avrebbe senza spark.
• Tutti I files delle view, partial view, master, etc devono avere estensione .spark;
• All’interno della cartella shared normalmente va creato un file “_global.spark” contenente tutti i vari using ed eventuali macro necessari alla costruzione della vista;
• La master page di default (anch’essa presente nella cartella shared) si chiama “Application.spark”;

A questo punto dovrebbe esser ben chiaro il fatto che abbiamo una cartella Views/Shared ed al suo interno abbiamo la nostra master page “Application.spark”; salvo forzature esplicite, tutte le viste erediteranno da questa master, e, se lo si vuole, resta comunque possibile specificare una master differente, ma lo vedremo più avanti.

Il codice seguente mostra una master page realizzata con spark:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title><use content="title">${Model.Title}</use></title>
        <meta name="description" content="${Model.Description}" /> 
        <meta name="keywords" content="${Model.KeyWords}" /> 
        <meta name="author" content="${Model.Author}" />
        <link rel="SHORTCUT ICON" href="~/images/favicon.ico" type="image/x-icon" />
        <link type="text/css" rel="stylesheet" href="~/Styles/Site.css" />
        <script src="~/Scripts/jquery.watermark.js" type="text/javascript" language="javascript"></script>
        <script src="~/Scripts/jquery.fancybox-1.3.1.pack.js" type="text/javascript" language="javascript"></script>
    </head>
    <body>
        <use content="MainContent"></use>
        qualcosa ......
    </body>
</html>

Come potete vedere non è presente nessun codeblock a inizio pagina e le risorse tipo css, img, etc. posso essere specificate con il prefisso tilde ~/  , che verrà sostituito dall’engine di spark con la root del sito o con quello che ci è più congeniale.

Per ora ci basta creare la nostra master page e specificare i placeholder tramite il tag Use, che andremo a riutilizzare nel vista in questo modo:

<content name="MainContent">
    Benvenuto Spark!
</content>

Anche qui, come potete vedere, tutti i codeblock sono spariti a vantaggio della leggibilià e del numero ridotto di righe presenti all’inteno della view (fidatevi, questo non è nulla ).

This entry was posted on Tuesday, 29 June, 2010 and is filed under MVC . You can follow any responses to this entry through here . You can leave a response.

Ne avevo già parlato durante una sessione alla V UgiAlt.Net Conference, poi un lettore mi ha consigliato di inserirlo in Dexter e di parlarne un po’, così ho deciso di realizzare una serie di post su SparkViewEngine. Prima di partire con dei post tecnici su come utilizzare Spark e quali vantaggi offre, è giusto fare qualche premessa spiegando cos’è e a cosa serve :).

Spark View Engine è un template engine per ASP.NET MVC (sia versione 1.0 che versione 2.0) e Castle Project MonoRail che ha lo scopo di semplificare e potenziare la stesura del markup da parte dello sviluppatore o di colui che andrà a realizzare la “skin” della propria applicazione web.
Uno degli aspetti sicuramente più interessanti consiste nella possibilità di avere “View” miste, metà spark e metà MVC classiche e quindi ci permette di adottarlo anche in progetti già esistenti.
Con i post seguenti vedremo come Spark affronta il problema della realizzazione di codice HTML dinamico e capiremo il perchè Luis De Jardin lo ha definito un DSL; per ora ci basti pensare che è possibile ridurre, in alcuni casi anche dimezzare, il numero di righe di codice HTML/C# presenti all’interno delle nostre View, e di avere delle funzioni molto spinte come la renderizzazione di una View in formato PDF.

Stay tuned!

This entry was posted on Thursday, 17 June, 2010 and is filed under MVC . You can follow any responses to this entry through here . You can leave a response.

Tempo fa avevo parlato qui di come realizzare un ViewEngine Custom per ASP.NET MVC che permettere di gestire diversi temi per la stessa applicazione, ossia offre la possibilità di cambiare la folder dove andare a “pescare” le nostre Views, Master, etc. a runtime, ma il tutto su ASP.NET MVC 1.0.

Con la nuova release di MVC è stata aggiunta una comodissima novità, ossia il supporto alle “Aree”, che non sono altro che dei “sottositi” che hanno lo scopo di semplificare la struttura dei Controllers e delle Views presenti nella struttura principale.
L’immagine seguente rende meglio l’idea di cosa siano le Aree e di come si collochino all’interno del nostro progetto:

Cambiando un po’ la struttura delle folders ho dovuto modificare mio “vecchio” ViewEngine in modo che “digerisca” questa nuova feature.
Il codice è più o meno lo stesso del ViewEngine precedente, fatta eccezione per alcune classi (come AreaHelpers, già presente nel framework ma di tipo internal e quindi inutilizzabile).

Di seguito riporto il codice:

public partial class WebFormThemeViewEngine : WebFormViewEngine
{
    private static readonly string[] masterLocationFormats = new[]
                                                         {
                                                             "~/Themes/{2}/Views/{1}/{0}.master" , "~/Themes/{2}/Views/Shared/{0}.master"
                                                         };

    private static readonly string[] viewLocationFormats = new[]
                                                       {
                                                           "~/Themes/{2}/Views/{1}/{0}.aspx" , "~/Themes/{2}/Views/{1}/{0}.ascx" , "~/Themes/{2}/Views/Shared/{0}.aspx" , "~/Themes/{2}/Views/Shared/{0}.ascx"
                                                       };

    public WebFormThemeViewEngine ()
    {
        MasterLocationFormats = masterLocationFormats;
        ViewLocationFormats = viewLocationFormats;
        PartialViewLocationFormats = viewLocationFormats;
    }

    protected override bool FileExists ( ControllerContext controllerContext , string virtualPath )
    {
        try
        {
            return File.Exists ( controllerContext.HttpContext.Server.MapPath ( virtualPath ) );
        }
        catch ( HttpException exception )
        {
            if ( exception.GetHttpCode () != 404 )
                throw;
        
            return false;
        }
        catch
        {
            return false;
        }
    }
    
    /// <summary>
    ///     Finds the view.
    /// </summary>
    /// <param name = "controllerContext">The controller context.</param>
    /// <param name = "viewName">Name of the view.</param>
    /// <param name = "masterName">Name of the master.</param>
    /// <param name = "useCache">if set to <c>true</c> [use cache].</param>
    /// <returns>The page view.</returns>
    public override ViewEngineResult FindView ( ControllerContext controllerContext , string viewName , string masterName , bool useCache )
    {
        string[] strArray;
        string[] strArray2;
        
        if ( controllerContext == null )
            throw new ArgumentNullException ( "controllerContext" );
        
        if ( string.IsNullOrEmpty ( viewName ) )
            throw new ArgumentException ( "viewName must be specified." , "viewName" );
        
        
        string themeName = DexterEnvironment.Instance.Context.CurrentTheme();
        
        string requiredString = controllerContext.RouteData.GetRequiredString ( "controller" );
        
        string viewPath = this.GetPath(controllerContext, this.ViewLocationFormats, this.AreaViewLocationFormats , viewName, requiredString, "View", useCache, out strArray, themeName);
        string masterPath = this.GetPath(controllerContext, this.MasterLocationFormats, this.AreaMasterLocationFormats , masterName, requiredString, "Master", useCache, out strArray2, themeName);
        
        if ( !string.IsNullOrEmpty ( viewPath ) && ( !string.IsNullOrEmpty ( masterPath ) || string.IsNullOrEmpty ( masterName ) ) )
            return new ViewEngineResult ( CreateView ( controllerContext , viewPath , masterPath ) , this );
        
        ViewEngineResult view = new ViewEngineResult ( strArray.Union ( strArray2 ) );
        
        if (view.View == null)
            throw new HttpException(404, "File Not Found");
        
        return view;
    }

    /// <summary>
    ///     Finds the partial view.
    /// </summary>
    /// <param name = "controllerContext">The controller context.</param>
    /// <param name = "partialViewName">Partial name of the view.</param>
    /// <param name = "useCache">if set to <c>true</c> [use cache].</param>
    /// <returns>The partial view.</returns>
    public override ViewEngineResult FindPartialView ( ControllerContext controllerContext , string partialViewName , bool useCache )
    {
        string[] strArray;
        if ( controllerContext == null )
            throw new ArgumentNullException ( "controllerContext" );
        
        if ( string.IsNullOrEmpty ( partialViewName ) )
            throw new ArgumentException ( "partialViewName must be specified." , "partialViewName" );
        
        string themeName = DexterEnvironment.Instance.Context.CurrentTheme();
        
        string requiredString = controllerContext.RouteData.GetRequiredString ( "controller" );
        
        string partialViewPath = this.GetPath(controllerContext, this.PartialViewLocationFormats, this.AreaPartialViewLocationFormats , partialViewName, requiredString, "Partial", useCache, out strArray, themeName);
        
        if ( string.IsNullOrEmpty ( partialViewPath ) )
            return new ViewEngineResult ( strArray );
        
        return new ViewEngineResult ( CreatePartialView ( controllerContext , partialViewPath ) , this );
    }


    private string GetPath( ControllerContext controllerContext , string[] locations , string[] areaLocations , string name , string controllerName , string cacheKeyPrefix , bool useCache , out string[] searchedLocations , string themeName )
    {
        searchedLocations = new string[0];
        
        if (string.IsNullOrEmpty(name))
            return string.Empty;
        
        string areaName = AreaHelper.GetAreaName(controllerContext.RouteData);
        bool flag = !string.IsNullOrEmpty(areaName);
        
        List<ViewLocation> viewLocations = GetViewLocations(locations, flag ? areaLocations : null);
        
        if (viewLocations.Count == 0)
            throw new InvalidOperationException("locations must not be null or emtpy.");
        
        bool flag2 = IsSpecificPath(name);
        string key = this.CreateCacheKey(cacheKeyPrefix, name, flag2 ? string.Empty : controllerName, areaName,themeName);
        
        if (useCache)
        {
            string viewLocation = ViewLocationCache.GetViewLocation(controllerContext.HttpContext, key);
        
            if (viewLocation != null)
                return viewLocation;
        }
        
        return !flag2
                   ? this.GetPathFromGeneralName ( controllerContext , viewLocations , name , controllerName , areaName , key , ref searchedLocations, themeName )
                   : this.GetPathFromSpecificName(controllerContext, name, key, ref searchedLocations);
    }

    private static bool IsSpecificPath(string name)
    {
        char ch = name[0];
        if (ch != '~')
        {
            return (ch == '/');
        }
        return true;
    }
    
    private string CreateCacheKey(string prefix, string name, string controllerName, string areaName,string themeName)
    {
        return string.Format(CultureInfo.InvariantCulture, ":ViewCacheEntry:{0}:{1}:{2}:{3}:{4}:{5}:", new object[] { GetType().AssemblyQualifiedName, prefix, name, controllerName, areaName ?? "nullArea", themeName });
    }

    private static List<ViewLocation> GetViewLocations(string[] viewLocationFormats, string[] areaViewLocationFormats)
    {
        List<ViewLocation> list = new List<ViewLocation>();
        if ( areaViewLocationFormats != null )
            list.AddRange ( areaViewLocationFormats.Select ( str => new AreaAwareViewLocation ( str ) ).Cast<ViewLocation> () );
        
        if ( viewLocationFormats != null )
            list.AddRange ( viewLocationFormats.Select ( str2 => new ViewLocation ( str2 ) ) );
        
        return list;
    }

    private string GetPathFromGeneralName(ControllerContext controllerContext, List<ViewLocation> locations, string name, string controllerName, string areaName, string cacheKey, ref string[] searchedLocations, string themeName)
    {
        string virtualPath = string.Empty;
        searchedLocations = new string[locations.Count];
        for (int i = 0; i < locations.Count; i++)
        {
            string str2 = locations[i].Format(name, controllerName, areaName,themeName);
            if (this.FileExists(controllerContext, str2))
            {
                searchedLocations = new string[0];
                virtualPath = str2;
                this.ViewLocationCache.InsertViewLocation(controllerContext.HttpContext, cacheKey, virtualPath);
                return virtualPath;
            }
            searchedLocations[i] = str2;
        }
        return virtualPath;
    }

    private string GetPathFromSpecificName(ControllerContext controllerContext, string name, string cacheKey, ref string[] searchedLocations)
    {
        string virtualPath = name;
        if (!this.FileExists(controllerContext, name))
        {
            virtualPath = string.Empty;
            searchedLocations = new[] { name };
        }

        this.ViewLocationCache.InsertViewLocation(controllerContext.HttpContext, cacheKey, virtualPath);
        return virtualPath;
    }
}

//Classe introdotta per il supporto alle aree
internal class ViewLocation
{

    protected readonly string VirtualPathFormatString;
    
    public ViewLocation ( string virtualPathFormatString )
    {
        this.VirtualPathFormatString = virtualPathFormatString;
    }
    
    public virtual string Format ( string viewName , string controllerName , string areaName , string themeName )
    {
        return string.Format ( CultureInfo.InvariantCulture , this.VirtualPathFormatString , new object[]
                                                                                                  {
                                                                                                      viewName ,     controllerName,themeName
                                                                                                  } );
    }
}

//Classe introdotta per il supporto alle aree
internal static class AreaHelper
{
    public static string GetAreaName ( RouteData routeData )
    {
        object obj2;
        if ( routeData.DataTokens.TryGetValue ( "area" , out obj2 ) )
        {
            return ( obj2 as string );
        }
        return GetAreaName ( routeData.Route );
    }

    public static string GetAreaName ( RouteBase route )
    {
        IRouteWithArea area = route as IRouteWithArea;
        if ( area != null )
        {
            return area.Area;
        }
        Route route2 = route as Route;
        if ( ( route2 != null ) && ( route2.DataTokens != null ) )
        {
            return ( route2.DataTokens [ "area" ] as string );
        }
        return null;
    }
}

//Classe introdotta per il supporto alle aree
internal class AreaAwareViewLocation : ViewLocation
{
    public AreaAwareViewLocation(string virtualPathFormatString)
        : base(virtualPathFormatString)
    {
    }

    public override string Format( string viewName , string controllerName , string areaName , string themeName )
    {
        return string.Format(CultureInfo.InvariantCulture, VirtualPathFormatString, new object[] { viewName, controllerName, areaName });
    }

}

Ciauz

.u

This entry was posted on Thursday, 27 May, 2010 and is filed under MVC . You can follow any responses to this entry through here . You can leave a response.