ASP.NET doesn’t provide a native way of donut output caching, so we must resort to a great NuGet package called MVCDonutCaching. You can read all about it here: http://www.devtrends.co.uk/blog/donut-output-caching-in-asp.net-mvc-3.

Since Umbraco is built on top of ASP.NET MVC, we can easily use this package on our websites. There are, however, some caveats, because Umbraco doesn’t use the native MVC routing.

For Umbraco, every page that uses the same document type is processed through the same route, therefore, if we have 100 news articles that use the NewsItem document type, from the moment we open one news article page, every other news item page will display the same information, despite having a different URL!

The way to bypass this issue is the following:

Create a Global.cs file that includes the logic to cache a page based on their url and not the document type

namespace CreateIT.Web
{
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using Umbraco.Web;

    public class Global : UmbracoApplication
    {
        public override string GetVaryByCustomString(HttpContext context, string custom)
        {
            if (custom.ToLower() == "url")
            {
                return "url=" + context.Request.Url.AbsoluteUri;
            }

            return base.GetVaryByCustomString(context, custom);
        }
    }
}

Then, instruct Umbraco to use this class when launching the UmbracoApplication by changing the Global.asax file:

<%@ Application Codebehind="Global.cs" Inherits="CreateIT.Web.Global" Language="C#" %>

Finally, setup an Output Cache profile in your Web.config:

<system.web>
    (...)
    <caching>
      <outputCacheSettings>
        <outputCacheProfiles>
          <add enabled="true" name="CreateIT.Actions" duration="900" location="Server" varyByCustom="url" varyByParam="*" />
        </outputCacheProfiles>
      </outputCacheSettings>
    </caching>
</system.web>

And decorate the chosen controllers (that you used to hijack the Umbraco routes) with the Donut Output Cache attribute:

[DonutOutputCache(CacheProfile = "CreateIT.Actions")]
public class HomepageController : Umbraco.Web.Mvc.RenderMvcController
{

If you wish to exclude a certain part of your page from the cache, just create a Surface Controller action that returns a partial view and use the extension method provided by MVCDonutCaching for @Html.Action().

The post Umbraco and Donut Output Cache appeared first on Blog IT.

If you need to find which part of your Umbraco application is slowing the site down, follow these steps:

1. Set the debug property of the compilation section of your Web.config to true: <compilation defaultLanguage=”c#” debug=”true” batch=”false” targetFramework=”4.5″>
   • If you’re using an older version of Umbraco, you also probably need to set the umbracoDebugMode app setting to true in the same config file: <add key=”umbracoDebugMode” value=”true” />
2. Add the query string ?umbdebug=true to your Umbraco page URL
3. Thats it!

It uses Mini Profiler, so you can add your own profile stops, but out-of-the-box it already analyses the time it takes to render each view.

Happy profiling!

The post Umbraco profiler appeared first on Blog IT.

The Visual Studio resx editor was slow and using it to change resources that were more than a single line of text was a pain. I still have nightmares where I’m trying to edit complete email templates on a single field of a resx file…

The biggest problem with resource files, however, is that they are included in the project. This creates a problem for both the developers and the content managers, since the content managers are not able to change resources themselves, and the developers need to be changing resources files when they could be doing something productive.

The following will show a way to handle resource items in a MVC website project, where the resources can be stored wherever they are more easily handled by content managers: a SharePoint list, a database table, an excel file, or something completely different.

The process is really simple:

1. Select every resource item key needed to render the current page
2. Fetch the resources associated with the keys provided at the end of the current action
3. Populate a ViewModel property with the resource items
4. Use the resource items in their respective places in the markup

1 – Compile a list of resource keys

Typically in a website, there are certain areas of the layout that are common across all pages, the header and the footer being the most prominent candidates. There are, however, other areas that can be reused across a smaller subset of pages such as a common banner in the FAQ pages. Taking this into account, we split the resource keys by groups, where each group (a list of strings) contains every resource key needed for that area and load them on each action, like so:

model.ContentResourceKeys = new List<string>();
model.ContentResourceKeys.AddRange(ResourceHelper.SOCIALNETWORK_RESOURCE_KEYS);
model.ContentResourceKeys.AddRange(ResourceHelper.HOTEL_BANNER_RESOURCE_KEYS);
model.ContentResourceKeys.AddRange(ResourceHelper.DOCUMENTS_RESOURCE_KEYS);
model.ContentResourceKeys.AddRange(ResourceHelper.GENERAL_FOOTER_BANNERS_RESOURCE_KEYS);
model.ContentResourceKeys.AddRange(ResourceHelper.LANDING_PAGE_SEARCH_AREA_RESOURCE_KEYS);
model.ContentResourceKeys.AddRange(ResourceHelper.LANDING_PAGE_MODULES_RESOURCE_KEYS);

The ContentResourceKeys property is defined in a MasterModel that is extended by every View Model used across the site, as can be seen here: http://blogit.create.pt/andresantos/2014/11/07/pre-set-common-viewmodel-preperties-before-action-result/. That post also describes the Action Filter that is executed after every action on the site and it’s the place where we append the footer and header resources to the ContentResourceKeys list:

List<string> resourceKeys = new List<string>();
resourceKeys.AddRange(ResourceHelper.HEADER_RESOURCE_KEYS.ToList());
resourceKeys.AddRange(ResourceHelper.LOGIN_RESOURCE_KEYS.ToList());
resourceKeys.AddRange(ResourceHelper.FOOTER_RESOURCE_KEYS.ToList());
resourceKeys.AddRange(ResourceHelper.LOADING_RESOURCE_KEYS.ToList());
resourceKeys.AddRange(ResourceHelper.HEADER_COOKIES_RESOURCE_KEYS.ToList());

if (model.ContentResourceKeys != null && model.ContentResourceKeys.Count > 0)
{
    resourceKeys.AddRange(model.ContentResourceKeys);
}

2 – Fetch the resources

After compiling the resource keys needed, we go on and fetch the associated resource items. The project where this was implemented used a WebAPI to serve all the page content and the resource items were no exception. So, we send a POST request to the resource WebAPI method and fetch the needed resources, for the user language, from the available backoffice (we used a SharePoint list).

model.Resources.AddRange(ResourceFacade.ListResources(model.CurrentLanguageCode, resourceKeys));

3 – Add them to the View Model

The Resources property available in the View Model where we added the result of the call to the resources WebAPI method is a string Dictionary. Since C# Dictionaries don’t provide an AddRange method, we create an extension method that enables us to append resources to a dictionary that’s not empty. Moreover, with this extension method we are able to scrap duplicate keys:

public static class IDictionaryExtensions
{
    public static void AddRange<T, S>(this IDictionary<T, S> source, IDictionary<T, S> collection)
    {
        if (collection == null)
        {
            throw new ArgumentNullException("Collection is null");
        }

        foreach (var item in collection)
        {
            if (!source.ContainsKey(item.Key))
            {
                source.Add(item.Key, item.Value);
            }
        }
    }
}

4 – Use the resources in the views

Since every View Model extends the MasterModel, we are able to use the same property everywhere:

<footer id="footer">
  <div class="container">
    <div class="newsletter">
      <h2>@Model.Resources["Footer.Newsletter.Title"]</h2>

This way, we are able to manage the resource keys in a SharePoint list, or any other backoffice solution.

The post Remote resource handling in a MVC website project appeared first on Blog IT.

AngularJS is a MVC javascript framework mainly mantained by Google which primary goal is to aid in the development of single-page applications. It’s use on the Umbraco backoffice was the most notable change when Umbraco 7 was first released.

When the content manager selects one node pending approval we want him to be able to take three quick actions:

• get some information about that node;
• quickly access it in the content section;
• quickly publish it.

New Angular controllers and views must be placed in a specific Umbraco directory, following a specific directory structure:

• the main directory must reside at ~\App_Plugins\ApproveIt – the plugin name
• the views and controllers must reside at App_Plugins\ApproveIt\backoffice\approvalTree\ – the tree controller name

First things first:

Create a package manifest so that Umbraco knows there are new javascript files available, and place it in the root of App_Plugins\ApproveIt directory.

{
	javascript: [
		'~/App_Plugins/ApproveIt/backoffice/approvalTree/edit.controller.js',
		'~/App_Plugins/ApproveIt/approval.resource.js'
	]
}

Then we must create the javascript files referenced by the manifest and the respective angular view.

angular.module("umbraco.resources")
	.factory("approvalResource", function ($http) {
	    return {
	        getById: function (id) {
	            return $http.get("backoffice/ApproveIt/ApprovalApi/GetById?id=" + id);
	        },
	        publish: function (id) {
	            return $http.post("backoffice/ApproveIt/ApprovalApi/PostPublish?id=" + id);
	        }
	    };
	});

This javascript file provides a new Angular Service that can then be used by Angular controllers. This service is no more than a facade for the ApprovalApiController created on Part II. The methods it connects to are created further on.

angular.module("umbraco").controller("Approval.ApprovalEditController",
	function ($scope, $routeParams, approvalResource, notificationsService, navigationService) {

	    $scope.loaded = false;

	    if ($routeParams.id == -1) {
	        $scope.node = {};
	        $scope.loaded = true;
	    }
	    else {
	        approvalResource.getById($routeParams.id).then(function (response) {
	            $scope.node = response.data;
	            $scope.loaded = true;
	        });
	    }

	    $scope.publish = function (node) {
	        approvalResource.publish(node.Id).then(function (response) {
	            $scope.node = response.data;
	            $scope.contentForm.$dirty = false;
	            navigationService.syncTree({ tree: 'approvalTree', path: [-1, -1], forceReload: true });
	            notificationsService.success("Success", node.Name + " has been published");
	        });
	    };

	});

This Angular controller is called when the Approve It section is being used:

• If no node is selected (for instance, when we access this section for the first time) we do nothing;
• If a node is selected ($routeParams.id != -1) we request the node details through our approval.resource service facade
• Finally, the quick publish method is also implemented here. This methods calls the ApprovalResource service which then invokes the publish method of the ApprovalApiController.

<form name="contentForm"
      ng-controller="Approval.ApprovalEditController"
      ng-show="loaded"
      ng-submit="publish(node)"
      val-form-manager>
    <umb-panel>
        <umb-header>
            <div class="span7">
                <umb-content-name placeholder="@placeholders_entername"
                                  ng-model="node.Name" />
            </div>
            <div class="span5">
                <div class="btn-toolbar pull-right umb-btn-toolbar">
                    <umb-options-menu ng-show="currentNode"
                                      current-node="currentNode"
                                      current-section="{{currentSection}}">
                    </umb-options-menu>
                </div>
            </div>
        </umb-header>
        <div class="umb-panel-body umb-scrollable row-fluid">
            <div class="tab-content form-horizontal" style="padding-bottom: 90px">
                <div class="umb-pane">

                    <umb-control-group label="Name" description="Content's name">
                        <input type="text" class="umb-editor umb-textstring" ng-model="node.Name" required />
                    </umb-control-group>

                    <div class="umb-tab-buttons" detect-fold>
                        <div class="btn-group">
                            <a class="btn" ng-href="#/content/content/edit/{{node.Id}}">
                                Show
                            </a>
                        </div>
                        <div class="btn-group">
                            <button type="submit" data-hotkey="ctrl+s" class="btn btn-success">
                                Publish
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </umb-panel>
</form>

The node view presents the waiting approval page name and two buttons: one to quickly navigate to it’s details and another to publish it.

Finally, we need to update the ApprovalApiController.cs to include two new methods:

public IContent GetById(int id)
{
    IContent content = ApplicationContext.Services.ContentService.GetById(id);
    return content;
}

public IContent PostPublish(int id)
{
    IContent node = ApplicationContext.Services.ContentService.GetById(id);
    ApplicationContext.Services.ContentService.Publish(node);

    return node;
}

• GetById: returns the node details to the angular view
• PostPublish: publishes the node being viewed

By following these steps we are able to create a complete new Umbraco backoffice section that provides us with a way to manage every site content waiting approval for publishing:

If you want to see how this plugin as been evolving, you can check its source code in github: https://github.com/ViGiLnT/ApproveIt. You can also download the plugin ready to be installed at Umbraco’s extensions repository: https://our.umbraco.org/projects/backoffice-extensions/approve-it/. Other Umbraco 7 tutorials and information can be found here: http://umbraco.github.io/Belle.

The post Building an Umbraco 7 backoffice extension – Part III appeared first on Blog IT.

To begin with, we must reference a few more assemblies (also available at the Umbraco’s installation bin directory):

• umbraco.dll
• cms.dll
• Umbraco.Core.dll
• System.Web.Http
• System.Net.Http.Formatting

Then we can populate our section with a tree containing content awaiting approval. To accomplish this we must extend an Umbraco class named TreeController and decorate it with information about our Approve It plugin:

[Tree("approveIt", "approvalTree", "Content for Approval")]
[PluginController("ApproveIt")]
public class ApprovalTreeController : TreeController
{
   protected override TreeNodeCollection GetTreeNodes(string id, FormDataCollection queryStrings)
   {
       var ctrl = new ApprovalApiController();
       var nodes = new TreeNodeCollection();

       IUser user = UmbracoContext.Security.CurrentUser;

       //check if we're rendering the root node's children
       if (id == Constants.System.Root.ToInvariantString())
       {
           foreach (IContent content in ctrl.GetAll(user))
           {
                var node = CreateTreeNode(
                    content.Id.ToString(),
                    "-1",
                    queryStrings,
                    content.Name,
                    "icon-document",
                    false);

               nodes.Add(node);
            }
       }

        return nodes;
    }

    protected override MenuItemCollection GetMenuForNode(string id, FormDataCollection queryStrings)
    {
        var menu = new MenuItemCollection();

        if (id == Constants.System.Root.ToInvariantString())
        {
            // root actions
            menu.Items.Add<RefreshNode, ActionRefresh>(
                ApplicationContext.Services.TextService.Localize(ActionRefresh.Instance.Alias));
        }

        return menu;
    }
}

To create a tree we must implement two methods:

1. GetTreeNodes: in here we call the GetAll method of the ApprovalApiController that we’ll create in the following. This GetAll method returns a list of content waiting approval and we just iterate through it all and create tree nodes;
2. GetMenuForNode: presents a dropdown menu when we right click the root node to refresh the list.

Next we create our custom WebAPI and name it ApprovalApiController. For it to be available in our site, we need only extend the UmbracoAuthorizedJsonController.

[PluginController("ApproveIt")]
public class ApprovalApiController : UmbracoAuthorizedJsonController
{
    public IList<IContent> UnpublishedContent { get; set; }

    public IEnumerable<IContent> GetAll(IUser user)
    {
        UnpublishedContent = new List<IContent>();

        IList<IContent> root = ApplicationContext.Services.ContentService.GetRootContent().ToList();

        foreach (IContent content in root)
        {
            GetNode(content);
        }

        return UnpublishedContent;
    }

    private void GetNode(IContent node)
    {
        if (!node.Published)
        {
            UnpublishedContent.Add(node);
        }

        foreach (IContent child in ApplicationContext.Services.ContentService.GetChildren(node.Id))
        {
            GetNode(child);
        }
    }
}

The GetAll method, iterates through all the nodes in the content section and finds the ones that are not published, that is, that are waiting approval.

With these two classes we are able to populate our section with a tree containing the content nodes that are waiting approval:

The next post in the series will show how to create the Angular view and controller that will enable content managers to actually manage the content waiting approval.

The Approve It extension can be found here: https://our.umbraco.org/projects/backoffice-extensions/approve-it/. The complete source code can be found here: https://github.com/ViGiLnT/ApproveIt.

The post Building an Umbraco 7 backoffice extension – Part II appeared first on Blog IT.

The next series of posts will show how to build plugins that extend the default Umbraco backoffice capabilities.

How is it built?

The release of Umbraco’s version 7 presented a completely redesigned backoffice. It went from a  typical MVC website to a single page application built using AngularJS. Umbraco custom WebAPIs are used by Angular controllers in order to read information from the backoffice.

How can we change it?

A typical Umbraco 7 backoffice extension requires:

1. Creation of Angular controllers, views and probably models;
2. Umbraco WebAPI extensions in order to access Umbraco’s backoffice and for custom server side development;
3. Extension of some Umbraco classes to customize common backoffice functionalities.

What to do?

These series of posts will gradually present a way to build a new backoffice section, that will provide content managers with a centralized area where they can approve changes made to content. This backoffice extension was named Approve It. Natively, Umbraco sends an email to each content approver when changes are made to content nodes but, if an approver wants to see what nodes were updated just by visiting the backoffice, he must traverse every node to see which ones present a change waiting approval. This gets harder as the number of content nodes increase, and the changed nodes can be difficult to spot as we can see from the image below:

Preparing the development environment

1. Download the latest and greatest version of Umbraco 7 (currently at v7.3.1): https://our.umbraco.org/contribute/releases/731/ 
2. Download and setup WebMatrix: http://www.microsoft.com/web/webmatrix/
3. Create a new web site in WebMatrix selecting the folder which contains Umbraco’s downloaded .zip file contents and go through the Setup
   1. Select customize
   2. Use a SQL CE database
   3. Choose any starter kit (I chose Txt Starter Kit)
4. Create a new Empty ASP.NET project in Visual Studio (I’m using VS2015) and add folders and core references for MVC

Creating a new backoffice section

Creating a new section in Umbraco is easy:

1. Add references to the following three assemblies available in the bin Umbraco directory:
   • businesslogic.dll
   • interfaces.dll
   • System.Web.Mvc.dll (need to replace the one Visual Studio automatically referenced)
2. Create a new .cs file in the project with the following code:

[Application("approveIt", "ApproveIt", "icon-people", 15)]
public class Section : IApplication
{
}

Simply implementing the IApplication interface, creates a new Umbraco backoffice section with the properties defined above.

The next step is translating the section name. If we don’t translate it, it will show up as [approveIt]. So, we must edit the file \Umbraco\Config\Lang\en.xml (for the UK version), and append the “approveIt” line in the “sections” area:

<area alias="sections">
  <key alias="concierge">Concierge</key>
  <key alias="content">Content</key>
  <key alias="courier">Courier</key>
  <key alias="developer">Developer</key>
  <key alias="installer">Umbraco Configuration Wizard</key>
  <key alias="media">Media</key>
  <key alias="member">Members</key>
  <key alias="newsletters">Newsletters</key>
  <key alias="settings">Settings</key>
  <key alias="statistics">Statistics</key>
  <key alias="translation">Translation</key>
  <key alias="users">Users</key>
  <key alias="help" version="7.0">Help</key>
  <key alias="forms">Forms</key>
  <key alias="analytics">Analytics</key>
  <key alias="approveIt">Approve It</key>
</area>

Note: for the new section to appear you must add it to the available sections your user can see. Furthermore, because of caching, you probably need to restart the website and open a browser window in private mode in order to see the new section.

This is how it looks:

So, we have a new section, but there’s nothing we can do with it. The next post in the series will show how we can add some content to this newly created Umbraco backoffice area.

The Approve It extension can be found here: https://our.umbraco.org/projects/backoffice-extensions/approve-it/. The complete source code can be found here: https://github.com/ViGiLnT/ApproveIt.

The post Building an Umbraco 7 backoffice extension – Part I appeared first on Blog IT.

We ended up serving both the assets and content images through the same Microsoft Azure CDN. This post describes the way we implemented it.

First the easiest part. We have our site in a Azure Website, in order to serve the site’s assets through an Azure CDN we only needed to point the CDN to the website’s URL. So, if the website’s assets are located in something like http://sitedomain/assets/*, instead of referencing the assets through a relative url such as /assets/*, we just need to use the CDN url to serve them: http://cdnurl/assets/*. Through web.config transforms we are also able to use local assets during development and change to CDN only on the production environment.

Regarding the website image content, the solution has three phases.

1. The content is managed over SharePoint 2013, and the images are no exception. We created a feature receiver that uploads to Azure Blob Storage every time an image is uploaded, or modified,  on any Picture Library, and then save its known CDN URL in the library item.

string cdnUrl = Configuration.Settings.ImageUploader.CdnUrl;
string containerStr = Configuration.Settings.ImageUploader.Container;

// Retrieve storage account from connection string.
CloudStorageAccount storageAccount = CloudStorageAccount.Parse(
    CloudConfigurationManager.GetSetting(IMAGES_STORAGE_CONNECTION_STRING));

// Create the blob client.
CloudBlobClient blobClient = storageAccount.CreateCloudBlobClient();

// Retrieve reference to a container.
CloudBlobContainer container = blobClient.GetContainerReference(containerStr);

// Creates the container if it doesn't exist
container.CreateIfNotExists();

// Set the blobs access level to public
container.SetPermissions(new BlobContainerPermissions
{
    PublicAccess = BlobContainerPublicAccessType.Blob
});

string fileNameWithoutExtension = Path.GetFileNameWithoutExtension(file.Name);
string extension = Path.GetExtension(file.Name);

fileNameWithoutExtension += "-" + DateTime.Now.Ticks;

// Build file name to upload
string fileName = string.Format("{0}/{1}{2}", file.Item.ParentList.Title.ToLower(), fileNameWithoutExtension.Replace(" ", "-"), extension).ToLower();

// Retrieve reference to a blob named "file.name".
CloudBlockBlob blockBlob = container.GetBlockBlobReference(fileName);

// Create or overwrite the "file.name" blob with contents from a local file.
using (var fileStream = file.OpenBinaryStream())
{
    blockBlob.UploadFromStream(fileStream);

    // Update SP item CDN URL column
    string finalUrl = HttpUtility.UrlPathEncode(string.Format("{0}/{1}/{2}?{3}", cdnUrl, containerStr, fileName, IMAGE_RESIZER_FIRST_PARAMETER));

    properties.ListItem[Configuration.Settings.SP_COLUMN_CDN_URL] = finalUrl.ToLower();
    properties.ListItem.SystemUpdate(false);
}

2. Having the images in a Azure Blob Storage, we decided to use the Image Resizer ASP.NET Library and its AzureReader2 plugin to resize and serve images directly through our Azure Website. The implementation is as easy as installing a nuget package: Image Resizer. After configuring the Blob Storage endpoint, and setting the prefix (we use ~/azure), we are able to access the images through an URL such as: http://sitedomain/azure/image/path/in/blobstorage. With this working we can resize and modify the images in any way available to us with the Image Resizer library and described in detail here: http://imageresizing.net/docs/v4.

3. Since our CDN is pointing directly to our Azure Website, we can use the CDN URL instead of the azure website one. For instance, the fake image I talked about the previous bullet can be accessed with the following URL: http://cdnurl/azure/image/path/in/blobstorage. This way, the first time someone opens an image through the CDN URL it is handled by the Image Resizer library. The  second time, CDN has already cached it and distributed it around the world and it is served much faster!

The post Azure CDN, BlobStorage and ImageResizer appeared first on Blog IT.

We were using .NET 4.5 and MVC 5 and there was no out of the box solution for this problem. Throughout my search I came upon this paper and we took some ideas from it. This post describes the main changes to a normal website project we had to make in order to make this work.

First of all we had to create a Core MVC5 project that we set up to be used as a Class Library. We must also reference System.Runtime.Remoting. This Core project contains the shared functionality that is used on each site and as such is referenced by them. This project follows the usual MVC architecture where the only difference is that the views must have the build action set to embedded resource. It’s set to this build action so that the site projects can get them from the Core project assembly upon launch. This is accomplished through a custom view engine that is used on each site:

public class EmbeddedResourceViewEngine : RazorViewEngine
{
    public EmbeddedResourceViewEngine()
    {
        ViewLocationFormats = new[]
        {
            // Code below will search the client before core.
            "~/Views/{1}/{0}.aspx", "~/Views/{1}/{0}.ascx", "~/Views/Shared/{0}.aspx",
            "~/Views/Shared/{0}.ascx", "~/Views/{1}/{0}.cshtml",
            "~/Views/{1}/{0}.vbhtml", "~/Views/Shared/{0}.cshtml",
            "~/Views/Shared/{0}.vbhtml", "~/Views/Shared/Partials/{0}.cshtml",
            "~/Views/Shared/Partials/{0}.vbhtml", 

            // The embedded view will be copied to a tmp folder
            // using a similar structure to the View Folder
            "~/CoreViews/Views/{1}/{0}.cshtml",
            "~/CoreViews/Views/Shared/{0}.cshtml",
            "~/CoreViews/Views/{1}/{0}.vbhtml"
        };

        PartialViewLocationFormats = new[]
        {
            "~/Views/Shared/{0}.cshtml", // Client first
            "~/CoreViews/Views/Shared/{0}.cshtml",
            "~/Views/Shared/Partials/{0}.cshtml",
        };

        // Handle all areas generically
        AreaViewLocationFormats = new[]
            {
                "~/Areas/{2}/Views/{1}/{0}.cshtml", 

                // client Specific
                "~/CoreViews/Areas/{2}/Views/{1}/{0}.cshtml", 

                // Pick up core  if no client
            };

        AreaPartialViewLocationFormats = new[]
            {
                "~/Areas/{2}/Views/Shared/{0}.cshtml", 

                // Client Specific – not used in demo
                "~/CoreViews/Areas/{2}/Views/Shared/{0}.cshtml"

                // Pick up core  if no client
            };

        SaveAllViewsToTempLocation();
    }

    private static void SaveAllViewsToTempLocation()
    {
        IEnumerable<string> resources =
            typeof(EmbeddedResourceViewEngine).Assembly.GetManifestResourceNames()
                .Where(name => name.EndsWith(".cshtml"));
        foreach (string res in resources)
        {
            SaveViewToTempLocation(res);
        }
    }

    private static void SaveViewToTempLocation(string res)
    {
        // Get the file path to manipulate and the fileName for re-addition later.
        string[] resArray = res.Split('.');

        // rebuild split to get the paths.
        string filePath = string.Join("/", resArray, 0, resArray.Count() - 2) + "/";
        string fileName = string.Join(".", resArray, resArray.Count() - 2, 2);

        // replace name of project, with temp file to save to.
        string rootPath = filePath.Replace("ProjectName", "~/CoreViews");

        // Set in line with the server folder...
        rootPath = HttpContext.Current.Server.MapPath(rootPath);
        if (!Directory.Exists(rootPath))
        {
            Directory.CreateDirectory(rootPath);
        }

        // Save the file to the new location.
        string saveToLocation = rootPath + fileName;
        Stream resStream = typeof(EmbeddedResourceViewEngine).Assembly.GetManifestResourceStream(res);

        System.Runtime.Remoting.MetadataServices.MetaData.SaveStreamToFile(resStream, saveToLocation);
    }
}

With this Core project in place we can now have multiple website projects that use some common features defined in Controllers, Models, Views or any other custom code, such as custom attributes. We can also redefine Actions for a specific website, or use a different view for each website.

Views and PartialViews defined in the Core project must explicitly inherit from System.Web.Mvc.WebViewPage because they no longer know their base type from the Web.Config.

The project that motivated the use of this solution required the creation of 4 sites. One that contained all functionality (common), and 3 others that only contained an homepage similar to the common site (with one exception). For this reason we created 2 website projects:

• Common – Used to create the main site that contains all functionality
• Specific – Used to create 3 sites where only one contains a specific homepage

Instead of creating 3 specific website projects we decided to create only one because we can define what type of site it is by configuration when we publish it (using different publish profiles and web.config transforms).

With this setup, the Core project basically contains the Homepage Models,Views and Controller and some other core functionalities. The Common site project contains almost everything, except an homepage which it inherits from the Core project. The specific site project redefines the homepage for 1 of the 3 sites it represents and that also inherit from the Core project.

Without this setup we would have to replicate the homepage and other core functionalities across 4 website projects.

The post A Multi-Tenant Website in MVC appeared first on Blog IT.

I need this model to be filled before the action result, so that I can use those properties on the view.

In order to do this, I created a custom Action Filter Attribute that is used by every action:

    public class SetupMasterModelActionFilter : ActionFilterAttribute
    {
        public override void OnActionExecuted(ActionExecutedContext filterContext)
        {
            ViewResultBase result = filterContext.Result as ViewResultBase;
            if (result == null)
            {
                return;
            }

            MasterModel model = result.Model as MasterModel;
            if (model == null)
            {
                return;
            }

            SetupMasterModel(model);
            SetupViewBag(result, model);
        }

        private void SetupMasterModel(MasterModel model)
        {
            ...
        }

        private void SetupViewBag(ViewResultBase result, MasterModel model)
        {
            ...
        }
   }

In order to execute this filter before every action I had to register it in the GlobalFilters at the Global.asax.cs file:

        protected void Application_Start()
        {
            AreaRegistration.RegisterAllAreas();

            GlobalFilters.Filters.Add(new SetupMasterModelActionFilter());

            RouteConfig.RegisterRoutes(RouteTable.Routes);
        }

There are, however, some pages that don’t use this master model, so I need to exclude the use of this filter on certain actions. In order to do this, I created a new Filter Provider that looks for an exclude filter and filters out the one targeted:

    public class ExcludeFilterProvider : IFilterProvider
    {
        private FilterProviderCollection filterProviders;

        public ExcludeFilterProvider(IFilterProvider[] filters)
        {
            this.filterProviders = new FilterProviderCollection(filters);
        }

        public IEnumerable<Filter> GetFilters(ControllerContext controllerContext, ActionDescriptor actionDescriptor)
        {
            Filter[] filters = this.filterProviders.GetFilters(controllerContext, actionDescriptor).ToArray();

            IEnumerable<ExcludeFilterAttribute> excludeFilters = (from f in filters where f.Instance is ExcludeFilterAttribute select f.Instance as ExcludeFilterAttribute);

            List<Type> filterTypesToRemove = new List<Type>();
            foreach (ExcludeFilterAttribute excludeFilter in excludeFilters)
            {
                filterTypesToRemove.Add(excludeFilter.FilterType);
            }

            IEnumerable<Filter> res = (from filter in filters where !filterTypesToRemove.Contains(filter.Instance.GetType()) select filter);
            return res;
        }
    }

The exclude filter attribute that will decorate the excluded actions:

    public class ExcludeFilterAttribute : FilterAttribute
    {
        private Type filterType;

        public ExcludeFilterAttribute(Type filterType)
        {
            this.filterType = filterType;
        }

        public Type FilterType
        {
            get
            {
                return this.filterType;
            }
        }
    } 

And we add the new provider at the start of the application and remove the old ones:

        protected void Application_Start()
        {
            AreaRegistration.RegisterAllAreas();

            GlobalFilters.Filters.Add(new SetupMasterModelActionFilter());

            IFilterProvider[] providers = FilterProviders.Providers.ToArray();
            FilterProviders.Providers.Clear();
            FilterProviders.Providers.Add(new ExcludeFilterProvider(providers));

            RouteConfig.RegisterRoutes(RouteTable.Routes);
        }

With this, every action will setup the master model properties except the ones that implement the exclude filter:

    public class HomeController : Controller
    {
        [ExcludeFilter(typeof(SetupMasterModelActionFilter))]
        public ActionResult Index()
        {
            HomeModel model = new HomeModel();

            return View(model);
        }
    }

The post Pre-set common viewmodel properties before action result appeared first on Blog IT.