Framerizr.MVC

What is it?

Framerizr.MVC lets you easily embed your ASP.NET Razor Views inside iframes hosted in external webs with kick-ass auto-height behavior Ajax Requests resistant. Meaning you can iframe your own ASP.NET MVC Web Application inside another web and browse your own without worrying about if the size of embedded html content will fit the iframe in case of DOM modification by Ajax Requests or simply link navigation.

How it works?

It works by installing an additional controller FramerizrController in your ASP.NET MVC Web Application which serves any requested URI of your own application inside a 100% dimension wide iframe (you'll see why in a minute). In the external web, Framerizr uses easyXDM to create an iframe and visualize the content of your ASP.NET MVC Web Application served through FramerizrController. Meaning this, that content is enclosed by 2 iframes: the one in the external web and the transitional one generated by FramerizrController.

This happens because Framerizr monitors the size of the enclosed html content using DOM Mutation Observers for detecting height changes in the html body and easyXDM Sockets, which allow X Domain Javascript calls, for pushing this info to the iframe in the external web. The transitional iframe used to serve the html content is required in order to keep open the easyXDM socket, otherwise once you browse away the connection will be closed and height monitoring stops working. One extra advantage of using a transitional iframe is it allows you to serve any html content of your ASP.NET MVC Web Application without having to add any extra script reference in any of your views.

Installation

Use the Package Manager Console for installing full Framerizr.MVC package:

	PM> Install-Package Framerizr.MVC

Or alternatively installing the client and server packages as it suits:

	PM> Install-Package Framerizr.Client

	PM> Install-Package Framerizr.MVC.Server

Note

You may also install this packages by right-clicking the project in Visual Studio and selecting the option Manage Nuget Packages..

Getting Started

Using Framerizr.MVC is easy once installed. You just have to reference easyXDM and jQuery in the external web

	<script src="http://example.domain.com/Scripts/easyXDM.min.js">  </script> 
    <script src="http://example.domain.com/Scripts/jquery-1.6.2.js">  </script>

And specify the container where you want to iframe an ASP.NET MVC Web Application empowered with Framerizr, e.g.:

	<div data-iframe-src="http://example.domain.com/" ></div>

Or alternatively you may specified a custom Framerizr URI, e.g.:

	<div data-iframe-src="http://example.domain.com/" data-framerizr-uri="http://other.route.com/OtherApp/Framerizr"></div>

Note:

It's strongly recomended to check the jQuery reference in Views/Framerizr/Index.cshtml. It's default set to jQuery v1.6.2 but surely you'll have another one installed, it's just Murphy's Law.

	<script src="@Url.Content("~/Scripts/jquery-1.6.2.min.js")"></script>

nebtrx / framerizr