Falafel Blog Feed

Unveiling the Module Builder Importer / Exporter

George Saadeh — Wed, 01 Feb 2012 07:19:25 GMT

Whoever attended the latest Sitefinity Webinar regarding the Module Builder is already intimate with the list of enhancements that will come for the Module Builder with the new Sitefinity 5 release scheduled for end of February.

As a part of these enhancements, the new Module Builder will include a module Import and Export functionality to ease the process of sharing modules between developers and moving them between different environments.

While digging into the Module Builder's API, I was able to find traces of the Module Builder's Importer and Exporter. The reality is, they do exist today in Sitefinity 4.4. We would have played around with them had they not been set as "Internal".

I hope the team will change the scope of some classes in the next release so we could have access to the Module Builder's API and be able to create modules by code. That sounds pretty commoving to me.

Here are the traces that I found:

internal static class ModuleExporter

{

public static ZipFile ExportModule(DynamicModule dynamicModule, Stream outputStream)

{

if (dynamicModule == null)

{

throw new ArgumentNullException("Dynamic module argument is null!");

}

return Serializer.SerializeDynamicModule(dynamicModule, outputStream);

}

internal static class ModuleImporter

{

public static DynamicModule ImportModule(ZipFile dynamicModuleZip);

}

Expand All Members

Let's wait and see how the Module Builder develops in the next month.

Free Webinar: Windows Phone "Mango" Taste Test

Mike Dugan — Tue, 24 Jan 2012 18:25:47 GMT

The Windows Phone platform has been making headlines lately. A Customer Think survey recently revealed that among smartphone users, Windows Phone users experience the highest customer satisfaction. Nokia's new Lumia 900 Windows Phone debuted at the Consumer Electronics Show and took home CNET's best cell phone award. Market research firms iSuppli, Gartner and IDC all expect Windows Phone to claim the number two spot in smartphone market share by 2015.

So what's the big deal?

We are giving you a chance to see for yourself. On Feb 10th at 12PM EST, join us in our free Windows Phone webinar, "The Windows Phone 'Mango' Taste Test".

In this webinar, we will explore the Windows Phone 7.5 technologies that make "Mango" unique. We'll demonstrate how easy it is to get started building Metro apps featuring the Panorama control with its sliding foreground and distinctive "parallax" background. Learn how to push key information to the users Start page for immediate attention with Live Tiles and notifications. Watch over our shoulder while we demonstrate mapping, sensing device location, geocoding and more.

At Falafel Software, our Windows Phone trainers have participated in the design and development of real world Windows Phone applications and have shared their experience by authoring the “Windows Phone 7.5 ‘Mango’ Nut and Bolts” training guide. Just 75 minutes with these experts is an educational experience of a lifetime, so don’t miss this golden opportunity!

Sign up today!

Free Webinar: Testing Silverlight Applications

Mike Dugan — Wed, 18 Jan 2012 21:00:00 GMT

Falafel Software is at it again. Offering you a chance to join one of the industry’s most recognized testing experts in a free webinar. Join our CEO, Lino Tadros, as he teams up with SmartBear Software to bring you, “Tips and Tricks for Performance, Load & Functional Testing Silverlight Apps“ on January 31st, at 1 PM EST.

Silverlight applications present their own unique testing challenges, but in this webinar you will learn how to properly use an array of tools from SmartBear Software, including TestComplete, LoadComplete, and AQTime, to verify your Microsoft Silverlight application is rock solid and ready for prime time.

Have a particular Silverlight testing question? No problem. When you register, you can submit your own topics and questions to be addressed during the webinar.

So what are you waiting for? Register today!

Falafel Promotes Lance Bullock to V.P. of Mobile Solutions

Mike Dugan — Wed, 18 Jan 2012 17:28:40 GMT

Falafel Software is pleased to announce that renowned software architect and industry speaker Lance Bullock has been promoted to V.P. of Mobile Solutions at Falafel Software. Bullock has been essential to the growth of Falafel’s mobile business over the past two years, delivering mobile solutions to Falafel’s customers on time and on budget, drawing large crowds as a speaker at industry events such as Silicon Valley Code Camp and the Sprint Open Solutions Conference, and producing several mobile applications for iPhone and Android, including Falafel’s flagship mobile product, EventBoard.

“I am truly honored to have Lance Bullock lead our mobile vision into the future,” said Lino Tadros CEO of Falafel Software. “His technical abilities and leadership qualities were main factors in the success of Falafel’s Mobile endeavor”

Bullock’s unique skill set makes him the ideal candidate to take control of the entire mobile department at Falafel Software. In his new role, he will guide the Falafel mobile team in both principal and practice, manage all internal and external mobile projects, and deal directly with mobile customers. Employees and customers alike will be good hands with Mr. Bullock at the helm.

“I am honored and fortunate to have the support of a great team which has enabled Falafel Software to become a player in the mobile space”, said Bullock. “In today's environment, it is absolutely critical for a software development house to offer their enterprise customers a portfolio that includes mobile development. I look forward to my new role and continuing to bring cutting-edge mobile solutions to Falafel's clients while expanding our mobile product line.”

Silverlight Click to Edit TextBlock

Josh Eastburn — Thu, 05 Jan 2012 14:55:22 GMT

There are some powerful data editing controls in Silverlight such as the DataForm which let you define templates for ReadOnly and Edit modes, but sometimes you just need a simple way to view and update text. I came across a scenario in a custom application that required a simple way to view and edit text. The solution I came up with was a "Click to Edit" TextBlock. In the default state, the text is displayed as a read-only TextBlock, but you can simply click on the TextBlock for it to become an editable TextBox.

Here is a working example (Silverlight 5 plugin required):

To accomplish this, I built a UserControl that has both a TextBlock and a TextBox which are both bound to the same DependencyProperty for the Text value. Then I bind the visibility of each to an IsEditing DependencyProperty that gets toggled based on the focus state of the control.

<TextBlock Name="TextBlock" Width="150" HorizontalAlignment="Left" Text="{Binding Text, Mode=OneWay}" VerticalAlignment="Center" Visibility="{Binding IsEditing, Converter={StaticResource invisibilityConverter}}"/>

<TextBox Name="TextBox" Width="150" HorizontalAlignment="Left" Text="{Binding Text, Mode=TwoWay}" VerticalAlignment="Center" Visibility="{Binding IsEditing, Converter={StaticResource visibilityConverter}}" LostFocus="TextBox_LostFocus"/>

Once this control is in place, using it is quite simple and you can bind the Text property as needed.

<StackPanel>

<Controls:ClickToEditTextBlock Text="{Binding Text1, Mode=TwoWay}"/>

<Controls:ClickToEditTextBlock Text="{Binding Text2, Mode=TwoWay}"/>

<Controls:ClickToEditTextBlock Text="{Binding Text3, Mode=TwoWay}"/>

</StackPanel>

Download the Source Code

Extending Sitefinity Pager Control

George Saadeh — Thu, 05 Jan 2012 13:44:36 GMT

While working with all the content modules in Sitefinity, we have got several templates to choose from to display list items on our pages. When we have a long list to expose, the pager control that is shipped with Sitefinity allows us to specify how many items to display per page, which is great. However, we have all experienced the beauty and flexibility of the RadDataPager control and to this day I am still wondering why the Sitefinity team did not use this control instead of the custom pager that they built specifically for Sitefinity.

After I stumbled upon this post in the Sitefinity forum, I decided to do the attempt and extend the custom pager to make it look as close as possible to the RadDataPager control. In this post, I am going to show you how I managed to do just that. Before we start, let us preview the original and the outcome of our task:

Original pager:

The Extended pager control:

The first thing that we have to do is to create a class and inherit from the Pager control:

public class ExtendedPager : Pager

{

We then create the custom template for our ExtendedPager control:

<%@ Control Language="C#" %>

<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>

<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Web.UI" TagPrefix="sf" %>

<sf:ResourceLinks ID="resourcesLinks" runat="server">

<sf:ResourceFile AssemblyInfo="SitefinityWebApp.Widgets.AdvancedPager.ExtendedPager, SitefinityWebApp" Name="SitefinityWebApp.Widgets.AdvancedPager.Resources.Stylesheets.default.css" Static="true" IsFromTheme="False"/>

</sf:ResourceLinks>

<div class="sfpagerWrapper">

<sf:SitefinityHyperLink ID="cmdFirst" runat="server" Text="First" CssClass="sf_pagerFirst" />

<sf:SitefinityHyperLink ID="cmdPrev" runat="server" Text="Previous" CssClass="sf_pagerPrevious" />

<div runat="server" id="numeric" class="sf_pagerNumeric"></div>

<sf:SitefinityHyperLink ID="cmdNext" runat="server" Text="Next" CssClass="sf_pagerNext" />

<sf:SitefinityHyperLink ID="cmdLast" runat="server" Text="Last" CssClass="sf_pagerLast" />

<div id="gotopage">

<asp:Label ID="lblGoToPage" runat="server" Text="Go to Page: "></asp:Label>

<sf:RadComboBox runat="server" ID="ddlPage" AllowCustomText="false" EnableTextSelection="false" Width="50px"></sf:RadComboBox>

</div>

We configure the RadCombobox that will hold the list of pages:

private void ConfigurePageList()

{

if (PageCount <= 0) return;

PagesControl.AutoPostBack = true;

PagesControl.SelectedIndexChanged += PagesControl_SelectedIndexChanged;

PagesControl.Items.Clear();

var defaultItem = new RadComboBoxItem(string.Empty, "0") {Selected = true};

PagesControl.Items.Add(defaultItem);

PagesControl.Items.AddRange(Enumerable.Range(1, PageCount).Select(s => new RadComboBoxItem(s.ToString(), s.ToString())));

}

void PagesControl_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)

{

var pageIndex = int.Parse(e.Value);

if (pageIndex > 0)

{

var pageUrl = BuildNavigateUrl(pageIndex);

HttpContext.Current.Response.Redirect(pageUrl, false);

}

Then in the control's client component we handle the SelectedIndexChanged event:

_selectedPageChanged: function (sender, args) {

var selectedItem = args.get_item();

if (selectedItem != null) {

var pageIndex = selectedItem.get_value();

if (pageIndex > 0) {

Telerik.Sitefinity.Web.UI.NavigateToPage(this.get_id(), pageIndex);

}

Finally we replace the pager control in the templates with our custom pager:

<%@ Register TagPrefix="sf" Namespace="SitefinityWebApp.Widgets.AdvancedPager" Assembly="SitefinityWebApp" %>

<sf:ExtendedPager id="pager" runat="server"></sf:ExtendedPager>

Et Voila !

Note that:

The full source code is not included in this article but you can easily download it from the link below.
You have to have a Widgets folder in your SitefinityWebApp project and include the AdvancedPager control there.
You have to set the client component file as Embedded resource as well as the CSS file.
The CSS resource file has to be added to the assembly info.

Download the source code

Falafel Software Releases LoadComplete Courseware

Mike Dugan — Wed, 04 Jan 2012 20:12:07 GMT

Falafel Software's training classes and courseware have taught thousands of people how to use SmartBear's TestComplete and LoadComplete software. Today, Falafel expands these learning opportunities with the release of LoadComplete 2 Nuts and Bolts.

With this self paced training guide, you will learn to use LoadComplete to simulate hundreds of users entering unique data on your web site while you monitor key performance metrics in real time. This book builds from the ground up, starting with a tour of LoadComplete features, working through creating and customizing tests, understanding your test results and debugging problem tests.

The book topics include:

• Tour of LoadComplete: 1000 foot view, learning your way around the product, customizing the workspace to suit your working style.
• Project Management: Creating new projects, project structure, “Where are my files”.
• Recording Scenarios: Recording and reviewing HTTP scenarios, building reusable/composable scenarios, verifying that a scenario works.
• Defining Tests: Defining virtual users, establishing quality of service limits, load profiles, testing on multiple workstations.
• Customizing Tests: Customizing without script, test dynamically using parameters and variables, generating custom data, using external data.
• Analyzing Test Results: Making sense of load test results, reading the log, reporting and charting, fixing your top 10 performance issues.
• Debugging Tests: resolving warnings and errors, how to debug step-by-step, understanding response codes, authentication issues.

Purchase LoadComplete 2 Nuts and Bolts from Lulu.com and get started load testing today!

T-SQL Drop If Exists 2.0

Adam Anderson — Thu, 22 Dec 2011 22:32:36 GMT

After using the first iteration of my utility procedure drop_if_exists for a while, I noticed a few idiosyncrasies that I didn’t like about it, so I came up with a new version. This version removes the requirement of specifying the object’s type code, instead looking it up by the object’s 3-part identifier. It adds support for dropping objects in other databases than the current one as well. If no object is found, an informative message is output; if multiple objects are found, an error is output, requesting a more specific identifier. As stated in the first iteration, the purpose of this procedure is to reduce the amount of typing necessary to first check for an object’s existence and then drop it. Here is the new and improved code:

create procedure dbo.drop_if_exists
    @name nvarchar(257),
    @parent_name nvarchar(257) = null
as
set nocount on

if @name is null
begin
    raiserror('@name is required', 11, 1)
    return
end

declare
    @server sysname = parsename(@name, 4),
    @database sysname = parsename(@name, 3),
    @schema sysname = parsename(@name, 2),
    @object sysname = parsename(@name, 1)
    
if @server is not null
begin
    raiserror('Remote servers are not supported.', 11, 1)
    return
end

declare @type char(2)

declare @stmt nvarchar(max) = '
select @type = o.type
from ' + isnull(quotename(@database), '') + '.sys.objects o
join ' + isnull(quotename(@database), '') + '.sys.schemas s on s.schema_id = o.schema_id
where o.name = @object
and s.name = isnull(@schema, s.name)'

exec sp_executesql
    @stmt = @stmt,
    @params = N'
        @type char(2) out,
        @object sysname,
        @schema sysname',
    @type = @type out,
    @object = @object,
    @schema = @schema

declare @rowcount int = @@rowcount

if @rowcount = 0
begin
    raiserror('Info: ''%s'' does not exist', 1, 1, @name)
    return
end

if @rowcount > 1
begin
    raiserror('''%s'' does not uniquely identify an object. When there are multiple objects with the same name, you must also specify the schema', 11, 1, @name)
    return
end

declare @type_name varchar(10)

set @type_name = case
    when @type in ('c', 'd', 'f', 'pk', 'uq')
        then 'constraint'
    when @type in ('fn', 'if', 'tf')
        then 'function'
    else case @type
        when 'p'
            then 'procedure'
        when 'tr'
            then 'trigger'
        when 'u'
            then 'table'
        when 'v'
            then 'view'
        else null
    end
end

set @stmt = case
    when @type_name = 'constraint'
        then 'alter table ' + @parent_name + ' drop constraint ' + @name
    else 'drop ' + @type_name + ' ' + @name
end

if @stmt is null
begin
    raiserror('No statement to execute. If ''%s'' is a constraint, make sure to specify the parent''s name', 11, 1, @name)
    return
end
exec sp_executesql @stmt
GO

Example usage:

-- Up to 3-part identifiers are accepted
exec dbo.drop_if_exists 'object'
exec dbo.drop_if_exists 'schema.object'
exec dbo.drop_if_exists 'database.schema.object'

-- Quoted identifiers are supported
exec dbo.drop_if_exists '[quoted schema].[quoted object]'

-- Any valid object reference is supported
exec dbo.drop_if_exists 'database..object'
exec dbo.drop_if_exists '..object'
exec dbo.drop_if_exists '.object'

If you already have a script full of CREATE statements that don’t try to drop existing objects first, here is a find-replace regular expression you can use to upgrade your script:

Find what: <create>:b+:w:b+{.+}

Replace with: exec dbo.drop_if_exists '\1'\nGO\n\0

Example:

-- Example input
create table [database].[schema].[table]

-- Example result after find-replace
exec dbo.drop_if_exists '[database].[schema].[table]'
GO
create table [database].[schema].[table]

I hope you find this useful in your own T-SQL scripting.

Falafel and Iciniti Announce Sitefinity Training Partnership

Mike Dugan — Wed, 21 Dec 2011 20:03:48 GMT

Capitola, CA December 21th, 2011 - Falafel Software and Iciniti today announced a partnership that will bundle Sitefinity training from Falafel with every sale of Iciniti’s eCommSuite 5 package.

For over 13 years, Iciniti Store has allowed customers to create customized shopping carts that are fully integrated with Sage Accpac ERP. Now, with the introduction of eCommSuite 5, customers can use Telerik’s Sitefinity CMS to manage all of their web content, not just their shopping cart. To ensure that every eCommSuite customer is comfortable working in Sitefinity, Iciniti turned to Telerik’s long time training partner, Falafel Software.

“Iciniti has created an impressive mid-market ecommerce package, and we are honored they choose us to be part of It.” said Mike Dugan, Falafel’s Director of Marketing. “Sitefinity is one of our specialties, and we can’t wait to show Iciniti’s customers how easy it is to use. I think they are going to love what they see.”

”It was important to Iciniti that our customers get properly trained on not only the web store components of eCommSuite 5 but the CMS functionality as well” said Bill Parkinson, President of Iciniti Corporation. “Falafel was the logical partner to turn to. All of our staff’s training on Sitefinity has been delivered by Falafel. It just seemed to make sense to get the same level of expert training for our customers.”

About Falafel Software
Falafel Software offers world-class custom software development, training and testing services to companies around the globe. Customers learn to master the latest technologies in instructor-led online training classes, or utilize Falafel's team of Microsoft Certified Professionals to deliver a custom web, mobile or cloud solution. For Sitefinity, Falafel is the original training partner, a Platinum Solution Partner, and has created training videos, courseware, and a mobile application for the award winning CMS. To learn more, visit http://www.falafel.com.

About Iciniti
Founded in 1999, ICINITI Corporation is the leading supplier of integrated eCommerce Solutions for the Sage ERP Accpac (Sage 300) channel. For thirteen years ICINITI has focused exclusively on the provision of advanced e-Business solutions to mid-market corporations. Iciniti’s reputation is founded on an advanced understanding of what drives e-Business technologies and processes, in addition to the development of a wealth of innovative ideas. To learn more, visit http://www.iciniti.com.

EventBoard Gets Rave Review from Industry Blogger

Mike Dugan — Tue, 20 Dec 2011 19:22:56 GMT

Falafel's mobile conference application, EventBoard (http://www.eventboardmobile.com), just keeps knocking it out of the park. Most recently, a review at EventManagerBlog.com praises the application.

For those not in the event management industry, EventManagerBlog.com is one of the most well respected and well known event management blogs in the world. Author, Julius Solaris recently had an opportunity to experience EventBoard first hand, and has posted his review online. His take?.... “it’s a kick ass mobile conference programme maker.” Read the rest of the review here: http://www.eventmanagerblog.com/mobile/eventboard

Basic XNA Graphics for the WP7

Bary Nusz — Mon, 19 Dec 2011 16:45:56 GMT

With Christmas coming up soon, what better blog can a nerdy geek come up with than to explain how to draw a Santa hat on the WP7 using the XNA Graphics Framework.

I’ve been working with computer graphics on and off for most of my 20+ year career. For me, it all started with OpenGL in the early 90’s. Since then I’ve worked with DirectX and now XNA. It’s amazing how little things have changed over that time. All those frameworks are based on triangles and arrays of vertices and normals. When you learn one of those frameworks, you can quickly learn the others.

When I first started looking at graphics with the WP7, I started with the Mango Teacup example. In that example, the 3D teacup drawing was handled by a class called Teapot. This class handles the initialization and drawing of the triangles, vertices, normals, positioning, lighting, color, and effects that make up the teapot. Digging into the meat of that class, what made the teapot a teapot came down to just three lines of code.

// Teapot Data

float[] positions = new float[] { 0.6788729f, 0.330678f, blah, blah, blah

float[] normals = new float[] { -0.9457507f, -0.3222559f, blah, blah, blah

indices = new ushort[] { 0, 7, 8, blah, blah, blah

I added the “blah, blah, blah” because each of these arrays was a massive list of numbers that defined the shape of the teapot, which is not really something you can tweak to get some other shape easily. However, the class did make a good template to start with, and with just a few changes, I came up with a base class to handle most any graphics object.

public abstract class BaseXNAObject

 protected VertexBuffer vertexBuffer;

 protected IndexBuffer indexBuffer;

 protected int numVertices;

 protected int numElements;

 protected BasicEffect effect;

 private Vector4 eye = new Vector4(0f, 0f, 5, 1);

 private Vector4 light = new Vector4(10, 10, 10, 1);

 private Vector4 diffuse = new Vector4(1, 0, 0, 1);

 private Vector4 specular = new Vector4(1, 1, 1, 32);

 protected VertexPositionNormal[] vpn;

 protected struct VertexPositionNormal : IVertexType

 private Vector3 _vertexPosition;

 private Vector3 _vertexNormal;

 public Vector3 Position

            get { return _vertexPosition; }

            set { _vertexPosition = value; }

 public Vector3 Normal

            get { return _vertexNormal; }

            set { _vertexNormal = value; }

 public VertexPositionNormal(

 float positionX,

 float positionY,

 float positionZ,

 float normalX,

 float normalY,

 float normalZ)

            _vertexPosition = new Vector3(positionX, positionY, positionZ);

            _vertexNormal = new Vector3(normalX, normalY, normalZ);

 public static readonly VertexDeclaration VertexDeclaration =

 new VertexDeclaration(new VertexElement(

                0, VertexElementFormat.Vector3, VertexElementUsage.Position, 0),

 new VertexElement(

                12, VertexElementFormat.Vector3, VertexElementUsage.Normal, 0)

);

        VertexDeclaration IVertexType.VertexDeclaration

            get { return VertexDeclaration; }

 public Matrix World { get; set; }

 public Matrix View { get; set; }

 public Matrix Projection { get; set; }

 public float Shininess { get; set; }

 public int NumberOfVertices

get

 return numVertices;

 public BaseXNAObject(GraphicsDevice device, Color solidColor)

        List<float> points = new List<float>();

        List<float> normals = new List<float>();

        List<ushort> indices = new List<ushort>();

        BuildGraphics(device, points, normals, indices);

 float[] positions = points.ToArray();

 float[] normalsArray = normals.ToArray();

 ushort[] indicesArray = indices.ToArray();

        numVertices = positions.Length / 3;

 // Create Vertex Buffer

        vpn = new VertexPositionNormal[numVertices];

 for (int i = 0; i < NumberOfVertices; i++)

 int s = i * 3;

            vpn[i] = new VertexPositionNormal(

                positions[s + 0], positions[s + 1], positions[s + 2],

                normalsArray[s + 0], normalsArray[s + 1], normalsArray[s + 2]);

        vertexBuffer = new VertexBuffer(

            device, VertexPositionNormal.VertexDeclaration,

            numVertices, BufferUsage.None);

        vertexBuffer.SetData(0, vpn, 0, numVertices, 0);

 // Create Index Buffer

        indexBuffer = new IndexBuffer(device, IndexElementSize.SixteenBits,

            indicesArray.Length, BufferUsage.None);

        indexBuffer.SetData(0, indicesArray, 0, indicesArray.Length);

        numElements = indicesArray.Length / 3;

 // Setup Default Matices

 this.World = Matrix.Identity;

 this.View = Matrix.CreateLookAt(

 new Vector3(eye.X, eye.Y, eye.Z),

            Vector3.Zero, Vector3.Up);

 float aspectRatio = device.Viewport.AspectRatio;

 this.Projection = Matrix.CreatePerspectiveFieldOfView(

            MathHelper.PiOver4, aspectRatio, 1.0f, 50.0f);

 //Shininess

 this.Shininess = 64f;

 // BasicEffect

        effect = new BasicEffect(device);

        effect.EnableDefaultLighting();

        effect.DiffuseColor = solidColor.ToVector3();

        effect.PreferPerPixelLighting = true;

 public abstract void BuildGraphics(GraphicsDevice device,

        List<float> points, List<float> normals, List<ushort> indices);

 public void Draw(GraphicsDevice device)

        device.RasterizerState = RasterizerState.CullClockwise;

 // Set VertexBuffer and IndexBuffer

        device.SetVertexBuffer(vertexBuffer);

        device.Indices = indexBuffer;

        device.DepthStencilState = DepthStencilState.Default;

 // Set BasicEffect parameters

        effect.World = this.World;

        effect.View = this.View;

        effect.Projection = this.Projection;

        effect.SpecularPower = this.Shininess;

 // Finally Draw Indexed Primitives

 foreach (EffectPass p in effect.CurrentTechnique.Passes)

            p.Apply();

            device.DrawIndexedPrimitives(PrimitiveType.TriangleList,

                0, 0, numVertices, 0, numElements);

In place of those nasty arrays, I added the following lines:

List<float> points = new List<float>();

List<float> normals = new List<float>();

List<ushort> indices = new List<ushort>();

BuildGraphics(device, points, normals, indices);

BuildGraphics is an abstract method that will handle the actual building of the graphics in inherited classes.

public abstract void BuildGraphics(GraphicsDevice device,

    List<float> points, List<float> normals, List<ushort> indices);

As for the rest of this base class and how it fits into the parent project, I’ll cover that in another blog. This blog is going to deal with how to draw the parts for a Santa hat with the given base class.

To start off with, let’s see what it takes to draw the most basic graphic, a triangle. It has three vertices.

For each vertex, we need to define the normal vector. The normal vector is the vector that defines the normal of the surface at that point. If you’re interested in knowing more about normal vectors (we are using the right hand rule) and how to calculate them, look here. In this case, each of our vertices would have the same normal vector (0,0,1).

In our abstract BuildGraphics method, you can see parameters for an array of points, normals, and indices. For our triangle, we’ve gotten our points and normals defined. Now we just need to fill in the indices array, which is basically to define what vertices are drawn in which order by the index (zero indexed) of the vertices in the vertex array. In this case, it’s very simple, (0,1,2). The resulting class for the simple triangle is:

public class Triangle: BaseXNAObject

 public Triangle(GraphicsDevice device, Color solidColor)

        : base(device, solidColor)

{ }

 public override void BuildGraphics(

        GraphicsDevice device,

        List<float> points,

        List<float> normals,

        List<ushort> indices)

 #region Vertex 1

        points.Add(0f);

        points.Add(0f);

        points.Add(0f);

 #endregion

 #region Vertex 2

        points.Add(1f);

        points.Add(0f);

        points.Add(0f);

 #endregion

 #region Vertex 3

        points.Add(0f);

        points.Add(1f);

        points.Add(0f);

 #endregion

 #region Normal 1

        normals.Add(0f);

        normals.Add(0f);

        normals.Add(1f);

 #endregion

 #region Normal 2

        normals.Add(0f);

        normals.Add(0f);

        normals.Add(1f);

 #endregion

 #region Normal 3

        normals.Add(0f);

        normals.Add(0f);

        normals.Add(1f);

 #endregion

 #region Indices

        indices.Add(0);

        indices.Add(1);

        indices.Add(2);

 #endregion

The result of this code is:

As you can see, the points and normals array are both an array of floats. The vectors are actually made up by grouping the values into groups of three floats.

Adding another triangle to our simple triangle gives us a square. You can just continue to get a strip of triangles and thus a surface for your object.

To extend our triangle class into a square class, we just need to add Vertex 4 and its normal to define another triangle. However, we need to add three more indices. Just like the points and normal arrays are grouped in threes, the indices are grouped into threes for each triangle. The new overridden method now looks like this.

public override void BuildGraphics(

    GraphicsDevice device,

    List<float> points,

    List<float> normals,

    List<ushort> indices)

 #region Vertex 1

    points.Add(0f);

    points.Add(0f);

    points.Add(0f);

 #endregion

 #region Vertex 2

    points.Add(1f);

    points.Add(0f);

    points.Add(0f);

 #endregion

 #region Vertex 3

    points.Add(0f);

    points.Add(1f);

    points.Add(0f);

 #endregion

 #region Vertex 4

    points.Add(1f);

    points.Add(1f);

    points.Add(0f);

 #endregion

 #region Normal 1

    normals.Add(0f);

    normals.Add(0f);

    normals.Add(1f);

 #endregion

 #region Normal 2

    normals.Add(0f);

    normals.Add(0f);

    normals.Add(1f);

 #endregion

 #region Normal 3

    normals.Add(0f);

    normals.Add(0f);

    normals.Add(1f);

 #endregion

 #region Normal 4

    normals.Add(0f);

    normals.Add(0f);

    normals.Add(1f);

 #endregion

 #region Indices

    indices.Add(0);

    indices.Add(1);

    indices.Add(2);

    indices.Add(2);

    indices.Add(1);

    indices.Add(3);

 #endregion

Here you can see that the indices array is not so simple anymore. We are actually defining how our triangles are drawn, and the order in which you define the vertex indices is important. The first triangle is simple enough. It is defined by the first three vertices in order (0,1,2). Because we are using the right hand rule for our normals, to define the second triangle we need to start with the third vertex (index 2), then the second (index 1), and finally the fourth (index 3). The result on the phone is:

Armed with the ability to draw a triangle and square, you can now draw any shape you need. In my previous WP7 blogs (here, here, and here), you see that I’m drawing arrows. These arrows are symmetrical along a single axis. So I need to draw a strip of triangles in a circle to form a loop. To do this I added a new static function to my BaseXNAObject class.

public static void BuildStripLoop(int numberAround,

    List<float> points, List<float> normals, List<ushort> indices,

 float bottom, float top, float bottomScale, float topScale)

    Vector3 mypoint = Vector3.Right;

    Vector3 normal;

 ushort index;

    Vector3 one;

    Vector3 two;

 int current;

 float incAround = 360 / numberAround;

 int startCount = points.Count;

 for (int i = 0; i < numberAround; i++)

        Matrix rotation = Matrix.CreateFromYawPitchRoll(

            MathHelper.ToRadians(i * incAround), 0, 0);

        Vector4 point = Vector4.Transform(mypoint, rotation);

        points.Add(point.X * topScale);

        points.Add(top);

        points.Add(point.Z * topScale);

        points.Add(point.X * bottomScale);

        points.Add(bottom);

        points.Add(point.Z * bottomScale);

 if (points.Count >= (startCount + 12))

            current = points.Count - 1;

            one = new Vector3(points[current - 11],

                points[current - 10], points[current - 9]) -

 new Vector3(points[current - 8],

                    points[current - 7], points[current - 6]);

            two = new Vector3(points[current - 11],

                points[current - 10], points[current - 9]) -

 new Vector3(points[current - 5],

                    points[current - 4], points[current - 3]);

            normal = Vector3.Normalize(Vector3.Cross(two, one));

            normals.Add(normal.X);

            normals.Add(normal.Y);

            normals.Add(normal.Z);

            one = new Vector3(points[current - 5],

                points[current - 4], points[current - 3]) -

 new Vector3(points[current - 8],

                    points[current - 7], points[current - 6]);

            two = new Vector3(points[current - 5],

                points[current - 4], points[current - 3]) -

 new Vector3(points[current - 2],

                    points[current - 1], points[current]);

            normal = Vector3.Normalize(Vector3.Cross(two, one));

            normals.Add(normal.X);

            normals.Add(normal.Y);

            normals.Add(normal.Z);

            index = (ushort)((startCount / 3) + i * 2);

            indices.Add((ushort)(index - 2));

            indices.Add((ushort)(index - 1));

            indices.Add((ushort)index);

            indices.Add((ushort)(index));

            indices.Add((ushort)(index - 1));

            indices.Add((ushort)(index + 1));

    index = (ushort)((startCount / 3) + numberAround * 2);

    current = points.Count - 1;

    one = new Vector3(points[current - 5],

        points[current - 4], points[current - 3]) -

 new Vector3(points[current - 2],

            points[current - 1], points[current]);

    two = new Vector3(points[current - 5],

        points[current - 4], points[current - 3]) -

 new Vector3(points[startCount],

            points[startCount + 1], points[startCount + 2]);

    normal = Vector3.Normalize(Vector3.Cross(two, one));

    normals.Add(normal.X);

    normals.Add(normal.Y);

    normals.Add(normal.Z);

    one = new Vector3(points[startCount],

        points[startCount + 1], points[startCount + 2]) -

 new Vector3(points[current - 2],

            points[current - 1], points[current]);

    two = new Vector3(points[startCount],

        points[startCount + 1], points[startCount + 2]) -

 new Vector3(points[startCount + 3],

            points[startCount + 4], points[startCount + 5]);

    normal = Vector3.Normalize(Vector3.Cross(two, one));

    normals.Add(normal.X);

    normals.Add(normal.Y);

    normals.Add(normal.Z);

    indices.Add((ushort)(index - 2));

    indices.Add((ushort)(index - 1));

    indices.Add((ushort)(startCount / 3));

    indices.Add((ushort)((startCount / 3)));

    indices.Add((ushort)(index - 1));

    indices.Add((ushort)((startCount / 3) + 1));

Basically this function takes the points, normals, and indices arrays and loads them up with the triangles to get you a symmetrical triangle strip based upon the method we used to construct our triangle and square. The other parameters are used to size and position the triangle loop. The “numberAround” parameter is the number of squares in the strip around the loop. The “top” and “bottom” parameters define the vertical offset of the top and bottom of the strip and the topScale and bottomScale parameters define the radius of the top and bottom circles of the strip.

Now that we have this, we can start to build our Santa hat. The hat brim can be handled with this class:

public class HatBrimObject : BaseXNAObject

 public HatBrimObject(GraphicsDevice device, Color solidColor)

        : base(device, solidColor)

{ }

 public override void BuildGraphics(GraphicsDevice device,

        List<float> points, List<float> normals, List<ushort> indices)

        BuildStripLoop(72, points, normals, indices, -1.2f, -1.2f, 1f, 1.1f);

        BuildStripLoop(72, points, normals, indices, -1.2f, -0.8f, 1.1f, 1.1f);

        BuildStripLoop(72, points, normals, indices, -0.8f, -0.8f, 1.1f, 1f);

This builds three strips for us: the bottom, side, and top of the brim.

The red part of the hat is handled with this class.

public class HatObject : BaseXNAObject

 public HatObject(GraphicsDevice device, Color solidColor)

        : base(device, solidColor)

{ }

 public override void BuildGraphics(GraphicsDevice device,

        List<float> points, List<float> normals, List<ushort> indices)

        BuildStripLoop(72, points, normals, indices, -0.8f, 0.5f, 1f, 0.5f);

        BuildStripLoop(72, points, normals, indices, 0.5f, 1.5f, 0.5f, 0.01f);

This gives us the red parts with two strips.

The little ball on top takes a bit more math. We have to calculate how to construct a number of strips into a sphere. The class for this is here:

public class HatTopObject : BaseXNAObject

 public HatTopObject(GraphicsDevice device, Color solidColor)

        : base(device, solidColor)

{ }

 public override void BuildGraphics(GraphicsDevice device,

        List<float> points, List<float> normals, List<ushort> indices)

 double radius = 0.2;

 double verticalOffset = 1.5;

 int start, end;

 int verticalSteps = 72; //Needs to be < 90

        start = -verticalSteps / 2;

        end = -start;

 double verticalInc = 180.0 / verticalSteps;

 for (int i = start; i < end; i++)

 float angleD = i * (float)verticalInc;

 if (angleD == -90) angleD = -89;

 double angle = (double)MathHelper.ToRadians(angleD);

 double x1 = Math.Sin(angle) * radius + verticalOffset;

 double y1 = Math.Cos(angle) * radius;

            angleD = (i + 1) * (float)verticalInc;

 if (angleD == 90) angleD = 89;

            angle = (double)MathHelper.ToRadians(angleD);

 double x2 = Math.Sin(angle) * radius + verticalOffset;

 double y2 = Math.Cos(angle) * radius;

            BuildStripLoop(72, points, normals, indices,

                (float)x1, (float)x2, (float)y1, (float)y2);

Now we have the complete hat.

I glossed over much of the code for this, such as how to incorporate these classes into a WP7 project to actually draw it on the phone and the details of the static method BuildStripLoop. However, this blog is already far too long and all of that will have to be in another blog. If you can’t wait to get your own Santa Hat, then download the Mango Teacup example and replace the Teapot class with the object classes above.

Until then, Merry Christmas and Happy New Year.

Building a Mobile Web App using Sencha Touch 2 and MVC

Basem Emara — Thu, 15 Dec 2011 16:00:00 GMT

In my previous post, I showed how to build a mobile web app using jQuery Mobile. Its use of HTML5 data attributes and CSS classes made it pretty straightforward, especially if you are used to building regular websites. The architecture of your mobile website would have to be based on the server-side though, whether this be ASP.NET MVC, PHP, Ruby, etc. Then I came across Sencha Touch which changes this mentality to a more progressive approach… client-side applications!

First let me give you a bit of background about Sencha. These are the guys who made Ext JS, a Javascript framework that includes object-oriented programming, UI components, and an available MVC pattern (yes, this is all Javascript!). This very same framework is the core foundation for their mobile web framework called "Touch". I had to mention this because now you see how the architecture will be moved from server-side to client-side.

Setup the Project

Let us start a skeleton project so we can build our mobile web application. Normally I would tell you to fire up Visual Studio. Not this time. We need an IDE geared more towards Javascript and HTML5. I saved you the trouble and found that JetBrains WebStorm is the BEST Javascript IDE! I tried Komodo (lots of features), Coda, MacRabbit's Expresso (so pretty), Aptana (bloated hog), TextMate (too basic) and nothing beats WebStorm. It has more than what you would expect from an IDE plus Ext JS intellisense, cross platform compatibility (Windows, Mac, Linux), and TFS support. You should give it a shot.

Once you have created a fresh workspace, add an "index.html" file with the following code.

~/index.html:

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>Sencha Touch MVC App</title >

<link rel="stylesheet" href="lib/sencha/sencha-touch-2.0.0-pr3/resources/css/sencha-touch.css" type="text/css">

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

<script type="text/javascript" src="lib/sencha/sencha-touch-2.0.0-pr3/sencha-touch-all-debug-w-comments.js"></script>

<script type="text/javascript" src="app.js"></script>

<link rel="apple-touch-startup-image" media="screen and (resolution: 326dpi)" href="img/startup_640.png" />

<link rel="apple-touch-startup-image" media="screen and (resolution: 163dpi)" href="img/startup.png" />

<link rel="apple-touch-icon-precomposed" media="screen and (max-resolution: 325dpi)" href="img/icon_57.png" />

<link rel="apple-touch-icon-precomposed" media="screen and (min-resolution: 326dpi)" href="img/icon_114.png" />

</head>

<body>

</body>

</html>

Next add "app.js" to the root as well with the below code. This is the entry point for your Javascript application. If you set "autoCreateViewport" to true, your application will automatically look for "~/app/view/Viewport.js" as your first view. This will be the container used to serve your other views.

~/app.js:

//INITIALIZE ASYNCHRONOUS LOADER

Ext.Loader.setConfig({

enabled: true,

paths: {

' MyApp': 'app'

}

//, disableCaching: false //FOR DEBUGGING

});

Ext.application({

name: ' MyApp',

requires:[

' MyApp.model.User',

' MyApp.store.Users'

],

controllers: [

'User'

],

models: [

'User'

],

stores: [

'Users'

],

autoCreateViewport: true

});

~/app/view/Viewport.js:

Ext.define('MyApp.view.Viewport', {

extend: 'Ext.Panel',

config: {

fullscreen: true,

layout: 'card',

items: [

{

xtype: 'userlist'

},

{

xtype: 'userdetail'

}

]

},

initialize: function() {

this.setActiveItem(0);

}

});

For the rest of the application, create your structure like below. You can add your own flavor if you like. For example, I may merge the "css" and "img" folders into a "~/theme" folder in the future:

MVC

Notice the MVC structure and how this relates to the "app.js" file. You are registering your models, views, and controllers in there using dot notation to represent the file location. So "MyApp.controller.User" means "~/app/controller/User.js". Since you enabled the "Ext.Loader" in "app.js", it is asynchronously loading these files at runtime. Very cool indeed! Also worth mentioning is you can use the "requires" property in any Javascript class to initialize other classes. The same dot notation is used to locate these class files. For naming convention, folders will be lowercase and files will be uppercase (except for "index.html" and "app.js").

Models

As with any layered application, usually the best place to start is your models or entities. Think about what objects will be used for your application and create a model accordingly (yes, we are still talking about Javascript!). Check out the code below. You are inheriting from "Ext.data.Model" and defining the property names of the object.

~/app/model/User.js

Ext.define('MyApp.model.User', {

extend: 'Ext.data.Model',

fields: [

'ID',

'ModifiedOn',

'Bio',

'Company',

'FirstName',

'ImageURL',

'LastName',

'Title',

'Twitter',

'WebSite'

]

});

Stores

The store descends from the "Ext.data.Store" class and uses your models to populate your data. This data can come from local, session, memory, AJAX, JSONP, or Direct. What interests me most here is JSONP, which allows you to make REST calls to remote servers all from the client-side. This is what decouples your client-side application from the data storage. Now you can let the data storage be served from a remote cloud or a 3rd party service such as Twitter, Flickr, Amazon, or Sencha.io. The "store" is the closest thing to server-side you may have to touch, but hopefully you have a database admin or REST services for your storage already so you can focus on pure luscious code! Below is the "store" class used for mediating data between your models and storage.

~/app/store/Users.js

Ext.define('MyApp.store.Users', {

extend: 'Ext.data.Store',

model: 'MyApp.model.User',

autoLoad: true,

proxy: {

type: 'jsonp',

url: 'https://remotecloud.com/UserService/UserList',

extraParams: {

'Status': 'Active'

},

callbackKey: 'callback',

reader: {

type: 'json',

root: 'Users'

}

});

Views

You will be building the interface procedurally in this area. This means putting together available components like Lego blocks. You will be initializing the component properties within the "config" property and adding more components within the "items" property. Refer to the API documentation to see what components and properties are available for you to use. You can even create your own components which can be placed in the "~/app/ui" folder for reusability. By the way, set up an "alias" for your views using the special "widget." format so you can use it as an "xtype" in other views.

~/app/view/user/List.js

Ext.define('MyApp.view.user.List', {

extend: 'Ext.Panel',

alias: 'widget.userlist',

config: {

layout: 'fit',

items: [

{

xtype: 'toolbar',

docked: 'top',

title: 'My User App'

},

{

xtype: 'list',

itemId: 'lstUser',

allowDeselect: false,

store: 'Users',

itemTpl: [

'<div class="user-item">',

'<h2>{FirstName} {LastName}</h2>',

'<small>{Bio}</small>',

'</div>'

]

},

{

xtype: 'toolbar',

docked: 'bottom',

layout: {

pack: 'center'

},

items: [

{

text: 'Settings',

itemId: 'btnSettings'

}

]

}

]

}

});

Controllers

Notice that your views are just clean building blocks without any event handling. That is where your controllers come in. In the "init" event of your controller, you can subscribe to events of your view components. What is nice here is that you can reference components using CSS-selectors like jQuery using Sencha's "ComponentQuery". In the events, such as an item tap, you can pull the record clicked, process the data, and call a controller action to render a view. Sencha is working on more MVC features, so for now "rendering a view" means to activate a card in a "Panel" or pushing a view into a "NavigationView".

~/app/controller/User.js

Ext.define('MyApp.controller.User', {

extend: 'Ext.app.Controller',

//REGISTER CLASSES

requires:[

'MyApp.ui.LoginForm'

],

//REGISTER MVC

models: [

'User'

],

stores: [

'Users'

],

views: [

'user.List',

'user.Detail'

],

init: function() {

this.control({

//SUBSCRIBE TO EVENTS

'.userlist #lstUser': {

itemtap: this.onUserItemTap

},

'.userlist #btnSettings': {

tap: this.onSettingsTap

}

});

},

//ACTIONS

detail: function(options) {

//UPDATE STORE WITH USER INFO

var user = Ext.ComponentQuery.query('.userdetail #lstDetail')[0];

user.getStore().getProxy().extraParams.UserID = options.Id;

user.getStore().read();

//SELECT USER INFO VIEW

Ext.Viewport.getActiveItem().setActiveItem(1);

},

//EVENTS

onUserItemTap: function (dataView, index) {

var item = dataView.getStore().getAt(index);

this.detail(item.data);

},

onSettingsTap: function() {

var popup = Ext.create('MyApp.ui.LoginForm');

Ext.Viewport.add(popup);

}

});

Conclusion

We have only scratched the surface of what you can do with Sencha Touch. Hopefully this gives you an essential understanding of creating a base architecture for your MVC client-side application. This same concept can be used for regular websites using Ext JS, which is a subset of Sencha Touch. This means you can build client-side applications for desktop or mobile websites while sharing the same layers of code. Javascript is all grown up now!

References

HAPPY CODING!!

Customizing the “Email Campaigns” module in Sitefinity 4

Gary Campbell — Tue, 13 Dec 2011 08:36:00 GMT

The “Email Campaign” module of Sitefinity 4 is what you would use to create email campaigns, manage lists of subscribers, and test AB campaigns. If you haven’t used this module, you can get more information on the Sitefinity website by clicking this link:

http://www.sitefinity.com/40/help/developers-guide/sitefinity-essentials-modules-working-with-email-campaigns.html

While this is a very useful module in Sitefinity 4 out of the box, I’m going to show you how you could add some additional functionality to this module. For the purposes of this Blog, let’s assume you would like to be able to export your Mailing Lists to a csv file. The way we will do this is by creating a custom widget that we can put on the backend page that displays all the mailing lists.

The easiest way to create this widget is by Editing your website in Visual Studio. Once your website loaded into Visual Sutdio you just need to add a new “Web User Control”. Our control with have a Label, DropDownList and a Button.

Here is the .ascx file for my control:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ExportMailingList.ascx.cs" Inherits="SitefinityWebApp.CustomWidgets.ExportMailingList" %>

<br />

<asp:Label ID="Label1" runat="server" Text="Choose a mailing list to Export:" />

<asp:DropDownList ID="ddlMailingLists" runat="server" Height="19px"

 Width="171px">

</asp:DropDownList>

<asp:Button ID="btnExportSubscribers" runat="server" Text=" Export " OnClick="btnExportSubscribers_Click" />

In our code behind we will populate our DropDownList with the names of all the MailingLists in our website. If you clicked the link above to the “Working with mailing lists” section in the Sitefinity Documentation you probably reviewed some of the code examples contained there. Those examples will give you a good start creating the code to customize the “Email Campaign” module. Here is the code for populating our DropDownList:

   1:  if (!IsPostBack)

   2:  {

   3:   foreach (MailingList ml in NewslettersManager.GetManager().GetMailingLists())

   4:      {

   5:          ddlMailingLists.Items.Add(new ListItem(ml.Title, ml.Id.ToString()));

   6:      }

   7:  }

We will put this code in the Page_Load event handler for our control.

The next thing we need to do is plug in the code for our button’s click event handler. As you can see below this code will first check for a selection then using the Newslettermanager will call the GetMailingList method passing the selected ID to retrieve the mailinglist we are going to export. We are going to export the following properties: ID, Email, FirstName and LastName. Once we have built a string of all the subscriber records we are going to export, we call a custom method named StreamToBrowser to save the string to a csv file. Here is the code to export the Subscribers:

   1:  if (IsPostBack)

   2:  {

   3:   if (ddlMailingLists.SelectedIndex != -1)

   4:      {

   5:          var mailingList = NewslettersManager.GetManager().GetMailingList(new Guid(ddlMailingLists.SelectedValue));

   6:          var subscribers = mailingList.Subscribers;

   7:          var orderHeaders = new StringBuilder("Id,Email,FirstName,LastName\n");

8:

   9:   foreach (var item in subscribers)

  10:          {

  11:   // Collect data of order header

  12:              var headerValues = new List<string>();

  13:              headerValues.Add(item.Id.ToString());

  14:              headerValues.Add(item.Email.ToString());

  15:              headerValues.Add(item.FirstName.ToString());

  16:              headerValues.Add(item.LastName.ToString());

17:

  18:   // Write order header values to string

  19:              orderHeaders.AppendLine(WriteCsvRow(headerValues));

  20:          }

21:

  22:   // Output

  23:          StreamToBrowser(orderHeaders.ToString(), String.Format("{0}.csv", mailingList.Title), "text/csv");

  24:      }

  25:  }

The custom code for building each csv row and the StreamToBrowser method are here:

   1:  private static string WriteCsvRow(List<string> row)

   2:  {

   3:      var builder = new StringBuilder();

   4:   foreach (var item in row)

   5:      {

   6:   //VALIDATE FOR NULL

   7:   string value = item ?? String.Empty;

8:

   9:   // Add separator if this isn't the first value

  10:   if (builder.Length > 0)

  11:          {

  12:              builder.Append(',');

  13:          }

14:

  15:   if (value.IndexOfAny(new char[] { '"', ',' }) != -1)

  16:          {

  17:   // Special handling for values that contain comma or quote

  18:   // Enclose in quotes and double up any double quotes

  19:              builder.AppendFormat("\"{0}\"", value.Replace("\"", "\"\""));

  20:          }

  21:   else

  22:          {

  23:              builder.Append(value);

  24:          }

  25:      }

26:

  27:   return builder.ToString();

  28:  }

29:

  30:  private static void StreamToBrowser(string content, string downloadName,

  31:   string contentType)

  32:  {

  33:      var context = HttpContext.Current;

  34:   string attachment = String.Format("attachment; filename={0}", downloadName);

  35:      context.Response.AddHeader("Pragma", "public");

  36:      context.Response.AddHeader("content-disposition", attachment);

  37:      context.Response.ContentType = contentType;

  38:      context.Response.Write(content);

  39:      context.Response.End();

  40:  }

Now that we have completed our custom control we need to install the control in the Sitefinity Administrator’s list of available PageControl widgets. The first step this process is to open the Sitefinity 4 Administrator and choose “Administration” | “Settings”

Next we need to choose the “Advanced” link.

In the treeview on the left of this screen, scroll down to “Toolboxes” | “Toolboxes” | “PageControls” | “Sections” node, select it and press the “Create new” button.

This step is to create a new node in the PageControl widgets. It is a good practice to create your own node in this treeview to put your custom control rather than adding your control to one of the out-of-the-box nodes. I created a node called “CustomWidgets” as you can see from this screen shot. When you have provided a Name and Title press the “Save changes” button.

Once you have created a new node you need to select it and press the “Create new” button. On the property screen for adding the properties for your new widget you need to provide the path to the .ascx file of our custom control we created above in the “Control CLR Type or Virtual Path” setting. You also need to provide a “Name” and “Title” and press the “Save changes”.

Now your widget should be installed in the Sitefinity Administrator. Since we want to add it to one of the Backend Pages that is where we need to go next. Choose “Administration” | “Backend Pages”.

When you choose this option, you are asked to confirm your choice because as the warning says you can mess up your Sitefinity Administrator by changing the Backend pages. Assuming you want to continue, press the “OK, Continue” button. (I highly recommend doing this in a test site the first time you try it.)

In the treeview of the list of pages open the nodes until you get to the “Sitefinity” | “Email Campaigns” | “Subscribers and lists”, then click the “Mailing lists” page to edit that page.

On the right side of your screen you should see your new widget listed in the treeview with the Title you provided. In my case it is “Mailing List Export” under “CustomWidgets”.

Drag that widget to the bottom of the Mailing List page, then press the “Publish” button at the top.

You also need to make sure you have checked the “Enable View State” for this page. You get to that setting by clicking “Actions” link next to the “Mailing lists” page, then choose the “Title and Properties” link.

Click the “Enable View State’ option. We need to turn this setting on so our DropDownList will accurately contain our choice when it gets to our event handler for the button.

Finally to see this change you need to choose “Email Campaigns” | Mailing lists”

To confirm everything works, select one of your Mailing lists from the DropDownList and press the “Export’ button.

Here is a screen shot of my exported list in Excel.

Hopefully, that will simplify the process for adding new functionality to a module of the Sitefinity Administrator. Thanks for reading.

Learning iOS UINavigationItems: Back Bar Buttons

Rachel Hagerman — Mon, 12 Dec 2011 15:47:11 GMT

Here's a tip for the iOS beginners among us: Just because something is on the left doesn't mean it's called Left. LeftBarButtonItem, for example, might just take you down the wrong path if you’re not careful.

Let's say you are wanting to show customized text on the button that shows up on the left side of the navigation bar in an iOS app. In an unmodified Master-Details iPhone app, it is the button that returns you to the Master table view screen from within the Details view.

By default, that button displays the Title text from the previous ViewController. The key word there is 'previous'. Setting that text requires that you do so in the ViewController that executed the pushViewController call that got you to the next screen (Master, in this case).

So, there are two pieces to get correct here: you must make your modification in the right place (the previous ViewController), and you have to access the correct button. The correct button in this case is the navigationItem.backBarButtonItem. So the following will work if added in the MasterViewController. Remember, make the change in the view you want to return to using the 'My Custom Text' button.

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath

{

if (!self.detailViewController) {

self.detailViewController = [[[DetailViewControlleralloc] initWithNibName:@"DetailViewController" bundle:nil] autorelease];

}

self.navigationItem.backBarButtonItem = [[[UIBarButtonItemalloc] initWithTitle:@"My Custom Text"style:UIBarButtonItemStyleBordered target:nil action:nil] autorelease];

[self.navigationController pushViewController:self.detailViewController animated:YES];

}

Notice how this also gives you the nice arrow shape on the button, which has nothing to do with the style parameter, but is part of the backBarButtonItem itself.

If you had used leftBarButtonItem in the exact same place, however, you wouldn't see any effect at all on the Details screen. That's because leftBarButton shows on the current view, not the next one in the stack. So you would see a square button, not an arrow button…and it would be on the wrong screen! If you did want to see a button in that location that was NOT a back button, this would be useful - but probably not in the didSelectRowAtIndexPath method. Place there, the button doesn't show up until you leave the view and come back!

self.navigationItem.leftBarButtonItem = [[[UIBarButtonItemalloc] initWithTitle:@"My Custom Text"style: UIBarButtonItemStyleBorderedtarget:nil action:nil] autorelease];

So, given all this explanation, you might think that you can just use leftBarButtonItem from the Details ViewController. If you do so, you will lose both the arrow shape of the button and the 'Back' navigation from the button itself. So, only go that route if you want to replace the Back functionality altogether.

For example, we could do this:

self.detailViewController.navigationItem.leftBarButtonItem = [[[UIBarButtonItem alloc] initWithTitle:@"My Custom Text"style: UIBarButtonItemStyleBordered target:nil action:nil] autorelease];

To get a square button that replaces the Back button entirely.

Notice that we were able to do all of these manipulations without altering the Title property of either of our ViewControllers. While it is possible to change Back button text by using Title, I think you'll find that method pretty clumsy. In my tests, the Title text was quite visibly changing during the navigation animation - not a pretty result at all. To learn more about button manipulation inside NavigationItems, you can view the full documentation here.

Faster Silverlight XAP Downloads with Application Library Caching

J. Tower — Fri, 02 Dec 2011 16:50:07 GMT

If you’ve been programming in Silverlight for long, you may have noticed the project setting “Reduce XAP size by using application library caching” in you Silverlight project’s settings. You may have even checked it on to see what happens.

If you did try it, most likely nothing happened. This is because there are a few simple prerequisite steps you have to take in order to take advantage of application library caching.

In this blog post, I’ll step you through those set up steps. But first, why would you want to use application library caching?

Why Use Application Library Caching?

In short, there are two different reasons:

1) Caching shared references on the client for sharing between different Silverlight applications, or

2) Smaller application update downloads when some referenced libraries change, but not others.

As you probably already know, Silverlight applications are distributed in a XAP file , which is just a ZIP archive that also includes a manifest file in XML format. In fact, if you rename any .XAP file to end in .ZIP, you can open it and see its contents.

The contents of a XAP file include your application DLL plus a DLL for each of the referenced libraries in your application (that aren’t already part of the .NET Framework). Enabling application library caching splits each individual referenced library out into its own ZIP archive. These are then downloaded separately (but automatically) by the Silverlight applications that references them.

Practically speaking, enabling application library caching on a Silverlight application with two referenced libraries will change the contents of the ClientBin directory—the one that hosts the XAP file—from something like this:

Figure 1: Without application library caching

to something more like this:

Figure 2: With application library caching

Notice how much smaller the XAP file is in Figure 2. This is because the referenced libraries, each about 3.7 MB in size, have been removed and placed in their own separate ZIPs

Now for a little more detail on the different scenarios for using application library caching…

Scenario 1: Sharing References

Consider a scenario where you have multiple Silverlight applications hosted on the same domain which share some of the same referenced libraries. Every time a user accesses one of these applications for the first time, they have to download the entire XAP file, including all the referenced assemblies they may have already downloaded with another one of your applications.

Application library caching splits these references out so your user only has to download the ones they haven’t already downloaded.

Scenario 2: Smaller Application Updates

When you update your application, sometimes you make a small change to just one of the referenced libraries and now changes to anything else. In cases like this, it’s kind of ridiculous that all of your users have to re-download your entire application, including ALL of the unchanged referenced libraries, just to get the one changed file.

Application library caching avoids this problem by splitting all the references out into their own ZIP file downloads so that only the changed one needs to be downloaded again. Because the individual files are still zipped, the user still gets the download speed advantages of the file compression.

Setting Up Application Library Caching

Follow these steps to enable application library caching for you own Silverlight library assemblies:

1) Strong name your assembly

Each assembly must have a strong name key to be eligible for application library caching. Open the Visual Studio command project to your assembly’s root directory and type:

sn –k [YourAssemblyName].snk

Add the file to your class library project and open your library project’s settings to the Signing tab. Check “Sign the assembly” and select your SNK file from the drop down. Rebuild your project and leave the Visual Studio command prompt open for later use.

2) Create a [YourAssemblyName].extmap.xml file for your assembly

Add a new text file to the root of your class library project and rename it to [YourAssemblyName].extmap.xml. This file and its content are the key to making application library caching work. Open the file and paste in the following XML:

<?xml version="1.0"?>
<manifest xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                 xmlns:xsd="http://www.w3.org/2001/XMLSchema">
<assembly>
    <name>[YourAssemblyName]</name>
    <version>[YourAssemblyVersion, probably 1.0.0.0]</version>
    <publickeytoken>[YourAssemblyPublicKeyToken]</publickeytoken>
    <relpath>[YourAssemblyName].dll</relpath>
    <extension downloadUri="[YourAssemblyName].zip" />
</assembly>
</manifest>

Change [YourAssemblyName] to your assembly’s actual name and [YourAssemblyVersion] to the version set in you project’s AssemblyInfo.cs file—most likely 1.0.0.0 if you haven’t changed it already.

To retrieve your assembly’s public key token, return to the Visual Studio commend prompt, change to /Bin/Debug/ (or wherever you built the assembly to). Type the following:

sn –Tp [YourAssemblyName].dll

Copy the token that appears in the output after “Public key token is” and replace [YourAssemblyPublicKeyToken] in your .extmap.xml file with it.

Change the “Build Action” property of the .extmap.xml file to “Content” and the “Copy to output directory” setting to “Copy if newer”

3) Enable application library caching for your Silverlight application

Now you return to where we started by checking the “Reduce XAP size by using application library caching” check box in your Silverlight application project’s settings.

Rebuild your solution and look at the output directory (ClientBin) to see if it worked!

For reference, I created this sample project that is set up correctly to use application library caching.

Falafel Software announces sponsorship of FAST Gala

Mike Dugan — Fri, 02 Dec 2011 16:22:27 GMT

Falafel Software's donation helps the Foundation for Angelman Syndrome Therapeutics (FAST) host it's major annual fund raising event.

Capitola, CA December 2nd, 2011 - In support of finding a cure for Angelman Syndrome, Falafel Software has made a charitable contribution of $2,500 to the Foundation for Angelman Syndrome Therapeutics (FAST). This contribution will aid the organization in producing it's major annual fundraising event, the FAST Gala. This year's event will take place on December 3rd in Chicago.

Angelman Syndrome (AS) is a severe neurological disorder characterized by profound developmental delays, problems with motor coordination (ataxia) and balance, and epilepsy. The all volunteer staff at FAST dedicate their time and expertise towards finding a cure by funding aggressive research, education and advocacy. FAST funded research has indicated that a treatment for Angelman Syndrome is not only possible, but probable.

"Angelman Syndrome research appears to be on the verge of a breakthrough," said Mike Dugan, Falafel's Director of Marketing. "The disorder has been cured in the mouse model, but funding remains as the major hurdle to producing a cure for humans. This is why we are so eager to be a part of FAST's fund raising and awareness efforts. There is a real chance to cure Angelman Syndrome today."

About FAST
The Foundation for Angelman Syndrome Therapeutics (FAST) is an organization of families and professionals dedicated to finding a cure for Angelman Syndrome (AS) and related disorders through the funding of an aggressive research agenda, education, and advocacy. The Foundation is committed to assisting individuals living with Angelman Syndrome to realize their full potential and quality of life. We are confident that our goals are now within reach and together, with your help, we will change lives. You are our driving force so please donate generously and bring us one step closer to realizing our mission. To learn more, visit http://www.cureangelman.org.

About Falafel Software
Falafel Software provides world class custom software development, training and testing services to companies around the globe. Customers learn to master the latest technologies in the training department or utilize Falafel's team of Microsoft Certified Professionals to deliver a custom web, mobile or cloud solution. To learn more, visit http://www.falafel.com.

Troubleshooting Silverlight Out-of-Browser Problems

Josh Eastburn — Fri, 02 Dec 2011 15:26:31 GMT

It is quite easy to enable Out-of-Browser (OOB) mode when building a Silverlight application. Open up the project properties on the Silverlight project and check the box to "Enable running application out of the browser."

The more difficult task is troubleshooting problems when the application works in browser, but not out of browser. First, to debug OOB applications in Visual Studio, you need to open the Silverlight project properties and in the "Debug" tab, set the start action to "Out-of-browser application" and select the appropriate project from the dropdown list. Next, set your Silverlight project as the startup project. Now when you debug in Visual Studio, it will open the application in an OOB window instead of the default browser.

Even when you have debugging set up, some OOB problems are still difficult to track down. There are several things that will give you a blank screen in the OOB window even though no exceptions are displayed in Visual Studio. Here are some common problems to check:

HtmlPage References

You can reference the System.Windows.Browser.HtmlPage class when running the application within a browser, but in OOB mode, it will throw an exception. And even though you may have the debugger attached, this typically results in a blank screen depending on where the HtmlPage class is used. If you do need to use HtmlPage, wrap it in a check for OOB mode. Here is an example of code I typically have in App.xaml.cs to set focus on the Silverlight plugin within a browser window:

// Focus the Silverlight plugin, but only when running in-browser

if (!Application.Current.IsRunningOutOfBrowser)

{

HtmlPage.Plugin.Focus();

}

Without the IsRunningOutOfBrowser check, this would throw an exception in OOB mode.

InitializeRootVisual and WCF calls

If you are using WCF calls or WCF RIA Services, there is another elusive problem that can arise. While there is no problem when running in browser, OOB mode has a problem with making a WCF call before the RootVisual is set. So if you are calling a method like LoadUser(), be sure to call InitializeRootVisual() first:

private void Application_Startup(object sender, StartupEventArgs e)

{

// This will enable you to bind controls in XAML files to WebContext.Current properties

this.Resources.Add("WebContext", WebContext.Current);

// Initialize the RootVisual before LoadUser to prevent OOB problems

InitializeRootVisual();

// This will automatically authenticate a user when using windows authentication

// or when the user chose "Keep me signed in" on a previous login attempt

WebContext.Current.Authentication.LoadUser(Application_UserLoaded, null);

}

Are there any other tricks you've found to resolve Out of Browser problems?

Get Discounted Sitefinity Consulting from Falafel!

Mike Dugan — Tue, 29 Nov 2011 21:33:07 GMT

The end of the year is upon us. Time to assess the status of that Sitefinity project.

Did it ever get off the ground?
Were all of the requirements met?
Will it be delivered on time?

If you answered “no” to any of these questions, we have just the deal for you. Through the end of the year, Falafel Software will be offering Sitefinity Consulting hours to new clients at a discounted rate. You could save up to 33% by purchasing one of these packages! The purchased hours are good for 12 months and can be used for almost anything:

Planning to upgrade Sitefinity? - Leave that to us!
Want live support on standby? - Schedule web conferences with the experts!
Need a new module or widget? - Let us build it!
Need to integrate with another system? - We will make it happen!

Normally, live online support from a Sitefinity expert at Falafel Software could cost you up to $250/hour. Purchasing a consulting package before the end of the year does much more than that. You add a Sitefinity expert to your team at a huge discount:

Purchase 1 hour at $250/hour - Standard Rate
Purchase 20 hours at $195/hour - 22% Savings!
Purchase 40 hours at $165/hour - 33% Savings

Purchase your package from the Falafel Software store, or contact sales@falafel.com for your free project estimate.

Date Range Searches in Silverlight

Josh Eastburn — Mon, 28 Nov 2011 21:23:00 GMT

When building Line-of-Business applications, we typically provide a variety of ways to search for customer or transaction data. One of the common search types is a date range search. Telerik provides an excellent UI control to select dates, the RadDatePicker.

So now your application has a begin date and end date for your search and everything looks great until you realize that the end date is never included in the search results. This is because the DatePicker control defaults to midnight on the selected day (0 hours, 0 minutes, 0 seconds, 0 milliseconds) and if you use less-than criteria in your search, if the time is after midnight, it will not be included in the results.

There is a simple solution for this in Silverlight. While you could add logic on the back end that would accommodate this, an easy and reusable solution is to use a converter on the end date in the UI. Here is some sample code that will take the selected date, use only the date part of the DateTime object and add 1 day and subtract 1 millisecond. This will allow you to include the entire end date in your search.

public class EndDateConverter : IValueConverter

{

public object Convert(object value, Type targetType, object parameter,

System.Globalization.CultureInfo culture)

{

return value;

}

public object ConvertBack(object value, Type targetType, object parameter,

System.Globalization.CultureInfo culture)

{

if (targetType != typeof(DateTime) && targetType != typeof(DateTime?))

{

throw new ArgumentOutOfRangeException("targetType",

"EndDateConverter can only convert to DateTime");

}

if (value == null)

return value;

// When binding, we need to set the END of the selected date

// Get just the DATE part of the DateTime

var endDate = ((DateTime) value).Date;

// Add 1 day and subtract 1 millisecond, which will include

// ALL of the selected date

return endDate.AddDays(1).AddMilliseconds(-1);

}

And now you can simply use that converter anywhere you have a date range search, but only include it on the END date.

<telerik:RadDatePicker SelectedDate="{Binding EndDateSearch, Mode=TwoWay,

Converter={StaticResource EndDateConverter}}"/>

WP7 Attitude and Magnetometer UPDATE with HTC Titan

Bary Nusz — Mon, 21 Nov 2011 19:43:19 GMT

With the release of the HTC Titan, I needed to update a couple of my previous blogs.

In my blog Silverlight/XNA and Correcting WP7 Attitude Alignment, I talked about how to correct for any misalignment of the Attitude sensors with the phone body. With my Samsung Focus, I found that the Attitude alignment was off by about 3 degrees, which was noticeable in my compass application. The HTC Titan does not need any Attitude adjustment; its Attitude sensors are already inline with the phone body.

In my blog Showing the WP7 Magnetometer in 3D with XNA/Silverlight, I stated that the MagnetometerReading property in the Compass API returns a normalized vector instead of a reading in microteslas, thus only indicating a direction and not the field strength. However, I’ve recently discovered that not all WP7 phones are the same. I was very happy to find out that the MagnetometerReading property on the Titan does indeed return the field strength in microteslas. So I updated my Magnetometer application to indicate field strength.

WP7 Magnetometer with the HTC Titan

As you can see from the video, the magnet field shows a strength of around 40 uT. This matches up with what is expected at my location from the World Magnetic Model. When you put a strong magnet next to it, you can really see the field strength changing.

Now we have a real Magnetometer application! We may have to put this out on the Marketplace.

Falafel forums are here!

Mike Dugan — Thu, 17 Nov 2011 16:30:23 GMT

Have a question about a Falafel Software product or service? Now there is an easy way to ask. Introducing the Falafel forums. Visit http://www.falafel.com/forums.aspx to get in touch with the Falafel Software team and we will respond. It is as simple as that.

We want to help you and the community when you have a follow up question after a training class or when you need more information about a product or service. Most importantly, we want to hear about how we can better serve you.

To get the ball rolling, we are asking for your input regarding our Sitefinity and TestComplete training classes. Drop by the forums to let us know what topics you would most like to see covered in these courses, and we will be sure to include them in future trainings.

Falafel forums: http://www.falafel.com/forums.aspx

Windows Azure SDK 1.6 is here

John Waters — Thu, 17 Nov 2011 01:24:51 GMT

With some very nice new features!

Instead of deleting and reconfiguring a whole new instance when you upload a new version of your service, now it is upgraded in place!

Even better, the deployment ID of the app (which is used in the DNS entry) doesn’t change, so no more having to update our DNS records every time I deploy a new version.

And best of all, if you have more than 1 instance of a role running, it takes turn upgrading them so your service is never down!

There are some nice new additions to the Visual Studio deployment experience, less certificates to manage, and ways to save groups of settings for example for Production and Staging.

Get your copy here today!

Showing the WP7 Magnetometer in 3D with XNA/Silverlight

Bary Nusz — Wed, 16 Nov 2011 16:15:06 GMT

In my last post I came up with a simple compass application and how to correct for sensor misalignments. In that application I had a blue arrow that always points up and a yellow arrow that always points North. Now I wanted to add another arrow showing the raw magnetometer readings. For the simple compass application, we just needed to use the Motion Sensor API. To get access to the raw magnetometer readings, we need to use the Compass API to get to the MagnetometerReading property.

To set up the compass I used the Compass Sensor example as reference. In the documentation, it says that the MagnetometerReading property (which is a Vector3) returns the magnetometer reading in microteslas. However, I found that it actually returns a normalized vector, so we really only know the direction of the magnetic field and not the strength. It would be nice to know the strength, but for now we’ll just have to do with the direction. UPDATE: Please see this blog for an update.

The normalized magnetometer values are aligned with the phone with the X-axis pointing to the right, the Y-axis pointing out the top, and the Z-axis pointing out the face of the phone.

Building upon my simple compass application, I added a red arrow to show the direction of the magnetic field. In my application, by default, the arrows orient to the Y-axis. To get our new red arrow to line up with the magnetometer vector, we need to do some Matrix multiplication to get a rotational matrix.

In the following diagram, the dashed line is the magnetometer vector with the value x,y,z. Angle xrot is the angle of the vector off of the XY plane.

The first step is to rotate the arrow about the X-axis to get the correct pitch. This is easily done with the following code

var xrot = Math.Atan2(rawMagnetometerReading.Z, rawMagnetometerReading.Y);

Matrix redMatrix = Matrix.CreateRotationX((float)xrot);

We use the Atan2 function and pass in the values for the Z and Y to get the angle (xrot) of the vector relative to the Y-axis. Go here if you need a refresher on why we use the Atan2 function. We then create a rotational axis from that angle. Now we only need to make one more axis rotation to get the arrow to line up with the magnetometer vector.

This one requires a bit more math. In this diagram (looking down at the face of the phone with the top of the phone pointing to the right), the angle zrot is between the YZ plane and the magnetometer vector.

Because we’ve already rotated the arrow about the X-axis, we need to find the magnitude of the magnetometer vector in the YZ plane. We can then use that magnitude in combination with the x value of the magnetometer vector to calculate the value of the zrot angle. Now we can do our next rotation. The final code snippet is as follows.

var xrot = Math.Atan2(rawMagnetometerReading.Z, rawMagnetometerReading.Y);

var yzmag = Math.Sqrt(Math.Pow(rawMagnetometerReading.Y, 2) +

     Math.Pow(rawMagnetometerReading.Z, 2));

var zrot = Math.Atan2(rawMagnetometerReading.X, yzmag);

Matrix redMatrix = Matrix.CreateRotationX((float)xrot);

redMatrix = Matrix.CreateRotationZ((float)-zrot) * redMatrix;

redArrow.World = redMatrix;

We first calculate the rotation about the X-axis (xrot), then the magnitude of the magnetometer vector in the YZ plane (yzmag), and finally the angle between the YZ plane and the magnetometer vector (zrot). With the xrot and zrot angles we can now do our matrix rotations and apply the resulting rotational matrix to our red arrow.

The result is the following.

In this new application, the blue arrow always points up, the yellow arrow always points North, and the red arrow lines up with the earth’s magnetic field (assuming you’re not around any other strong magnetic fields). In the screen shot above I tried to get the yellow and red arrows lined up in the plane of the phone’s screen to show the magnetic inclination at my location. This value should be around 65 degrees down from the horizontal for the Texas panhandle, which looks to be spot on.

One other interesting thing to notice is that the yellow arrow, which indicates true north, is slightly off from the red arrow, which indicates the magnetic field. In this screen shot, which I took when the phone was flat and pointing north, you can see that the red arrow is pointing slightly to the right from the yellow arrow.

This offset is called the magnetic declination. This value should be around 6 degrees in the Texas panhandle, which again looks to be spot on.

What about making the same alignment correction as I did in my previous blog? It’s not really necessary in this case because the magnetometer sensor is a different sensor from the accelerometer used in the Motion API to determine what direction is up. Unless you have a highly specialized area where you absolutely know the strength and direction of the magnetic field, you can’t really make any magnetometer alignment corrections. In any case, with the errors we’re talking about, it’s not worth the effort.

The final product is very good at following the magnetic fields, as you can see in this video. In the last part of the video, you can see how the field changes drastically when rotating a magnet near the phone.

WP7 Magnetometer Application

EventBoard featured in Telerik case study

Mike Dugan — Tue, 15 Nov 2011 17:05:24 GMT

EventBoard is making waves again. Telerik just released a customer case study featuring our mobile conference companion: http://www.telerik.com/company/customers/case-studies/telerik-s-integrated-technologies-help-make-falafel-s-eventboard-solution-a-hit-with-audiences.aspx

When Telerik asked if we wanted to be part of a customer case study, the answer was an enthusiastic yes! At every turn, EventBoard utilizes a Telerik solution. The WP7 mobile application uses RadControls for Windows Phone, the administration application uses RadControls for Silverlight, and even the product webpage features blogs powered by Sitefinity.

Thanks to the Telerik controls, EventBoard for Windows Phone continues to shine as a model of style and usability. Expanding the use of Telerik’s Window’s Phone Controls in future releases will only strengthen that position. So look for even more Telerik controls in our next ‘Mango’ release!

Case Study:

http://www.telerik.com/company/customers/case-studies/telerik-s-integrated-technologies-help-make-falafel-s-eventboard-solution-a-hit-with-audiences.aspx

EventBoard product page:

http://www.eventboardmobile.com

Upload Documents Remotely to Sitefinity

Basem Emara — Tue, 15 Nov 2011 00:03:25 GMT

Uploading documents to the Sitefinity library is pretty simple using the API, but what if you wanted a remote process to upload documents to Sitefinity? The first thing I thought was to look into the documents library web services. The problem I found was there was no web service to pass my file streams or bytes.

So instead of extending the web services, I decided to keep things simple and leverage basic HTML concepts. How about allowing a remote POST of a file to Sitefinity using "<input type='file' />"?

We can achieve this by creating an HttpHandler within the Sitefinity project. This handler URL will listen for submitted forms and handle the uploaded files.

Check out the goods:

public class UploadFileHandler : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/plain";

        //VALIDATE FILES IN REQUEST
        if (context.Request.Files.Count > 0)
        {
            try
            {
                //HANDLE EACH FILE IN THE REQUEST
                foreach (string key in context.Request.Files)
                {
                    var item = context.Request.Files[key];
                    string result = ProcessFile(context, item);
                    context.Response.Write(result);
                }

            }
            catch (Exception ex)
            {
                //NO FILES IN REQUEST TO HANDLE
                context.Response.Write("Error: " + ex.Message);
            }
        }
        else
        {
            //NO FILES IN REQUEST TO HANDLE
            context.Response.Write("No file uploaded");
        }
    }

    public string ProcessFile(HttpContext context, HttpPostedFile file)
    {
        string fileName = Path.GetFileName(file.FileName);
        string libraryName = context.Request["library"];
        string storageProvider = context.Request["provider"];
        var credentials = new Credentials
        {
            UserName = context.Request["username"],
            Password = context.Request["password"]
        };

        //SEND FILE TO SITEFINITY LIBRARY
        var docId = SitefinityUtils.UploadDocument(file.InputStream, fileName, libraryName, storageProvider, credentials);

        //SEND RESULT
        return (docId != Guid.Empty ? "File uploaded" : "File failed upload!");
    }

    public bool IsReusable
    {
        get { return false; }
    }
}

Also, here is the code for uploading the posted file to the Sitefinity documents library. Notice that this is a general purpose method for uploading a file stream.

public class SitefinityUtils
{
    public const string URL_NAME_CHARS_TO_REPLACE = @"[^\w\-\!\$\'\(\)\=\@\d_]+";
    public const string URL_NAME_REPLACE_STRING = "-";

    public static Guid UploadDocument(Stream inputStream, string fileName, string libraryName, string blobStorageProvider, Credentials credentials)
    {
        //VALIDATE INPUT
        if (String.IsNullOrEmpty(fileName) || String.IsNullOrEmpty(libraryName))
            return Guid.Empty;

        //AUTHENTICATE
        var result = SecurityManager.AuthenticateUser(credentials);
        if (result == UserLoggingReason.Success)
        {
            var manager = LibrariesManager.GetManager();

            //CREATE LIBRARY IF APPLICABLE
            var library = manager.GetDocumentLibraries().Where(l => l.Title == libraryName).SingleOrDefault();
            if (library == null)
            {
                library = manager.CreateDocumentLibrary();
                library.Title = libraryName;
                library.UrlName = Regex.Replace(libraryName.ToLower(), URL_NAME_CHARS_TO_REPLACE, URL_NAME_REPLACE_STRING);
                if (!String.IsNullOrEmpty(blobStorageProvider))
                {
                    library.BlobStorageProvider = blobStorageProvider;
                }

                manager.RecompileItemUrls(library);
                manager.SaveChanges();
            }

            //CREATE DOCUMENT IN LIBRARY
            var document = manager.CreateDocument();
            string docName = Path.GetFileNameWithoutExtension(fileName);
            document.Parent = library;
            document.Title = docName;
            document.Description = docName;
            document.UrlName = docName;
            manager.Upload(document, inputStream, Path.GetExtension(fileName));
            manager.RecompileItemUrls(document);
            manager.Lifecycle.Publish(document);
            manager.SaveChanges();

            //LOGOUT
            SecurityManager.Logout();

            return document.Id;
        }

        return Guid.Empty;
    }
}

To activate the HttpHandler, remember to register it in the web.config:

<system.webServer>
...
<handlers>
...
<add name="UploadFileHandler" path="UploadFileHandler.ashx" verb="*" type="SitefinityWebApp.Custom.Files.UploadFileHandler, SitefinityWebApp"/>
</handlers>
</system.webServer>

Now we can set up plain HTML forms around the Internet and have it post files directly to the Sitefinity documents library:

<form action="http://somedomain.com/UploadFileHandler.ashx" method="post" enctype="multipart/form-data">
        Username: <input type="text" name="username" />
        <br />
        Password: <input type="password" name="password" />
        <br />
        Library: <input type="text" name="library" />
        <br />
        Provider: <input type="text" name="provider" />
        <br />
        <input type="file" name="file" />
        <br />
        <input type="submit" value="Upload to Sitefinity" />
    </form>

A picture is worth a thousand lines of code, so here are screenshots of the process:

All this without any server-side code or even Javascript on the remote client! Just a form you can paste onto any web page. Think of all the possibilities with integrations and affiliates :)

ENJOY!!