PeterKellner.net

I do not even want to admit how much time I spent today in a more complex application trying to get a button to respond to a tap event in SenchaTouch 2.0 Beta.  I did notice several people like me on the forums with similar issues, but I did not find one concrete example that made the simple “click a button application”.  Of course I’m building this in Microsoft Visual Studio 2010 and debugging with Chrome.  Let me start at the end.  When you are done, you will have a simple two button page that you can click on either button and have your MVC controller react to either button as well as trap the button hit inside the actual Panel.

And for those of you that have read enough, here is the source:  

The Nitty Gritty

Creating an SenchaTouch project with MVC is a little tricky to setup.  You need to get all the directories right.  My favorite way to do this is to use the Sencha Designer to create the project, then abandon it if I want to strike out on my own.  That is what I’ve done here.  I don’t even think you can tell.

Here is the file layout as seen from Visual Studio:

5 Files and 3 directories.

Let’s first take a look at the Panel that contains the buttons.  Here is the code:

Ext.define('MyApp.view.MyPanel', {
    extend: 'Ext.Panel',
    alias: 'widget.mypanel',
    config: {
        items: [
            {
                xtype: 'button',
                itemId: 'mybutton1',
                text: 'MyButton1',
                action: 'b1'
            },
            {
                xtype: 'button',
                itemId: 'mybutton2',
                text: 'MyButton2',
                action: 'b2'
            }
        ],

        listeners: [
            {
                fn: 'onMybutton1Tap',
                event: 'tap',
                delegate: '#mybutton1'
            }
        ]
    },
    onMybutton1Tap: function (button, e, options) {
        console.log('tap from mybutton1');
    }
});

Just a couple things to notice.  1) I’m defining an itemId which we will only be using in the local event (onMybutton1Tap).  If you notice the listener has a property delegate which looks for that.  I’m not sure if this is the best way to do this.  I’ve notice several forum people saying use the “on” syntax.  I did not find an example of that so this is what we have and it works.  Also notice the action property.  If you try and look that up on the SenchaTouch doc’s you will not find it.  I just made it up out of thin air (really!, well, I followed others examples).  I actually asked about this in the forums and I was told that is OK.  As a type safe language guy, it hurts, but I did it.

That’s it for the view.  Let’s move over to the controller.  Here is the source for that:

Ext.define('MyApp.controller.MyController', {
    extend: 'Ext.app.Controller',

    views: [
        'MyPanel'
    ],

    refs: [
        {
            ref: 'MyPanel',
            selector: 'mypanel'
        }],

    init: function () {

        this.control({
            'button[action=b1]': {
                tap: this.onButtonTap1
            },
            'button[action=b2]': {
                tap: this.onButtonTap2
            }
        });
    },

    onLaunch: function () {
        console.log('onLaunch');
    },

    onButtonTap1: function () {
        console.log('controller: onButtonTap1');
    },

    onButtonTap2: function () {
        console.log('controller: onButtonTap2');
    },

    config: {

    }
});

Basically, what this is doing is filtering all buttons, then looking at just the buttons that have an action of b1 or b2.  If this was a large application, we’d probably want to do some more fancy component querying, but for now, this is OK.  If you keep your controllers small, this should always work.

That’s it for now.  Download the source and run it.  I hope it saves you a ton of time. 

As always any experts want to comment and improve or correct what I’ve done, please feel free to comment. 

I’m always somewhat amazed when I read something from documentation that is not straight forward and it actually works.  So amazed and excited that I often feel the need to blog about it.

So, here is the problem.  I created a CodeFirst implementation of EntityFramework in Visual Studio and created a simple hierarchy in my data model.  That is, without showing all the code, here is what I have:

public class Person
{
    [Key]
    [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)]
    public int Id { get; set; }

    public virtual List<EmailAddressInfo> EmailAddressInfoList { get; set; }
    ..
}

public class EmailAddressInfo
{
    [Key]
    [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)]
    public int Id { get; set; }

    public string EmailAddress { get; set; }

}

public class EmailAccount
{
    [Key]
    [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)]
    public int Id { get; set; }
    ...
}

Now, if you execute a LINQ command like the following:

var recs = (from data in db.Persons
                            select data);
                foreach (var rec in recs)
                {
                    foreach (var email in rec.EmailAddressInfoList)
                    {
                        Console.WriteLine(email);
                    }
                }

You get the error:

Exception Details: System.InvalidOperationException: There is already an open DataReader associated with this Command which must be closed first.

To solve this, you need to tell EntityFramework/CodeFirst to include the EmailAddressInfoList in the query.  All you need to do is change the db.Persons to db.Persons.Include("EmailAddressInfoList") as follows:

var recs = (from data in db.Persons.Include("EmailAddressInfoList")
            select data);

Then, it all works!

Hope this helps.

Let’s say I’ve created two Visual Studio Projects with the same name “WebApp” but reside in different directories as shown below (c:\temp\Proj1 and c:\temp\Proj2).  I often call the project WebApp, however I want to keep the projects totally separate.  Below are the File/New Project dialog examples.

Now, when I click start (this is with the vs2011 preview I’m demonstrating), I see the following:

I actually have to hover over each “WebApp.sln” to tell which project is which.  I think that information should be in the pinned app itself, not require a hover over to tell which project it is.

Agree?  Add your comment below and go to the following link to vote up my connect suggestion.

https://connect.microsoft.com/VisualStudio/feedback/details/679081/should-have-vs-launch-shortcuts-inside-vs-recent-projects-because-run-as-admin

From the comments, Microsoft said they would consider it for the next release, but it looks like it has not made it.  Let’s try and change that!

SV Code Camp is happening next weekend with well over 200 sessions.  The conference is really technology agnostic and try hard to keep it that way, but I am an ASP.NET guy these days so I think it reasonable I take my Code Camp Coordinator hat off for the moment and put on my ASP.NET hat.  As an ASP.NET Microsoft MVP, I feel I’m in a good position to give a tour of some sessions in ASP.NET and throw in my own 2 cents.  Below are a list of these sessions in no particular order.

Demystifying ASP.NET MVC, $(Lino).MVC{getknowledge()}

Sunday, October 9th 9:45AM

MVC (Model View Controller) is one of the hottest patterns around building web sites these days no matter what the technology. When Microsoft first introduced Web programming to Visual Studio, they did it such that almost anyone who had done windows programming (VB or other) could quickly come up to speed and build a web site. Personally, this what sucked me into web programming. Drag a button, drag a textbox, double click on the button and add some code to set the text box and WHAM, you have a web site. Unfortunately, as things get more complicated, this model does not scale so well. ASP.NET’s MVC implementation does scale, it takes a little bit of flipping your mind around if you are Web Forms programmer, but definitely worth learning about and seeing if it’s right for you.

Lino Tadros is one of my favorite presenters and I’m sure will give you a much better understanding of MVC and how it fits into the ASP.NET programming model. I strongly recommend this one. Lino is the CEO for one of the top Application development and training companies in the world that partners with Microsoft, Falafel Software. In other words, GO TO THIS SESSION!

Pragmatic JavaScript, jQuery & Ajax with ASP.NET

Saturday, October 9th 1:45PM

Damian Edwards is a Program Manager on the Microsoft ASP.NET team.  That’s right, he is flying here from Redmond just to present to us.  He’s also an awesome presenter and we are extremely lucky to have him at Code Camp!   Damien will tak about using JQuery while building sites with the Microsoft ASP.NET framework.  Something Damien knows very very well.  For those who don’t know, Damien is also leading the next generation efforts around ASP.NET WebForms which is the technology 90% of who use ASP.NET use (it’s what the silicon valley code camp web site is built with).

DON’T MISS THIS PRESENTATION!

WebMatrix In Depth

Saturday, October 9th  5:00PM

John Sheehan, one of the best guys I know at explaining complex things is presenting this session on WebMatrix.  I’m not sure everyone would agree with me, but for those people that really don’t like the heavy weight feeling of building web applications with Visual Studio, WebMatrix will make you feel right at home. It’s much lighter weight and also gives tons of punch.  Come see John and ask him a million questions!  He loves that.

All the sessions Tagged ASP.NET can be found here:  http://www.siliconvalley-codecamp.com/Sessions.aspx?sortby=title&by=category&tag=3

OK, I think this is the longest post title I’ve ever made, but if you understand it, you’ll know why it needs to be so long.  I discovered this totally by accident.  I would never ever have pressed F11 (step into) from a client side proxy and expect to get into anything but a bunch of ugly machine generated proxy code (especially with Azure).  To my total surprise, I landed right inside my WCF service as if I had started the Windows Azure Developer fabric in debug mode and set a break point.

So, I’ll step through the process an show screen shots on the outside chance I was dreaming and can’t reproduce it. If I can, now I will have proof so I can do it again.  Sorry for the work in progress code you will see.  The point here is really the debugger and not the code I’m showing so try and ignore that.

OK, here we go.

Let’s assume you have a completely configured azure web role that is hosting a simple WCF service.  When you start that web role and point at the service, you’ll get something like this: (just a note that I started the app fabric by deploying directly from Microsoft Visual Studio 2010 with the start/run.  I am using a debug profile but am NOT running in debug mode.  If I do run the app fabric in debug mode, this does not work.

There are lots of articles on the internet if you search for WCF Fiddler however it’s not clear what the simplest path to follow is. For me, it turns out that just sprinkling a couple lines of code at the bottom of my windows forms app’s app.config file is all it took.  I got the tip from this post:  http://www.fiddler2.com/fiddler/help/hookup.asp

The magic lines are as follows:

<system.net>
    <defaultProxy>
      <proxy bypassonlocal="false" usesystemdefault="true" />
    </defaultProxy>
  </system.net>
</configuration>

That’s it!  Now, Fiddler just sees the traffic.  I’m a happy camper.

I’m trying to download a base64 encoded image that is about 4 Megabytes embedded inside a JSON object.  When I first tried this from my MVC3 Web application, I got the error:

Error during serialization or deserialization using the JSON JavaScriptSerializer. The length of the string exceeds the value set on the maxJsonLength property.

The way I do Windows Azure development is that I have OneClick Deployment setup on my Azure host.  This means I can simply and quickly update what I have on my Azure WebRole and test it without going through the 10 to 20 minute deployment process.  Sometimes, when I’m tired, I accidentally press the “Debug” or “Run” button on my Visual Studio 2010 cloud project.  This launches a 2 or 3 minute process that I have trouble killing.

Today, I accidentally figured out a way to stop it.  Simply go to the web project and right mouse button on your project and say “Publish”. You will be immediately presented with an option to stop the deployment!

That’s it.  Simple, but pretty undiscoverable IMHO.

I just have to blog about what a helpful feature this is that the VS team added in VS2010.  That is, as you are debugging, you can set a watch variable and pin it to your source code.  In previous versions, you needed to basically go through the hassle of setting conditional break points to do simple debugging or be prepared to do lots of mouse clicking.  In the latest version, all you have to do is click the little thumb tack icon and drag the variable to where you want to see it. Here is what your screen looks like.

Background

This post shows a very simple technique for processing a gzip compression on a background thread using c# with Visual Studio 2010.  What is unique here is we are using no statics to do it.  I’m not totally against using statics, but in general, it is best to avoid them.  I’ve heard the notorious Ward Bell say statics are evil and have had many cases where they have bitten me.  Since I heard Ward say this, I’ve been trying to avoid them where I can.

The Simple Problem

The problem is to simply compress a file to bytes and return to us the compressed, uncompressed and byte array of the result.  We can pass parameters into a thread, however we can not return them (when I say thread, I mean the anonymous method that processes our data).

Background And Conclusion

In my very last post I talked about how using SHA256 seemed to not be affected by whether you use Buffered or Not Buffered streams.  An astute reader (Samuel Jack) referenced an article by one of my favorite ex MIcrosoft employees (Brad Abrams) saying that almost all the .Net streams have buffering built in.

Well, I think SHA256Managed does not.  One of the challenges I’ve been facing lately with my current project is to provide feedback while doing all kinds of byte piping (stream stuff).  While figuring out how to do this, I inadvertently figured out that buffering makes a huge difference.  Briefly, let me show my results first, then talk about the code that went into it.

Notice that when I use a 64MB Buffer, the memory used for the process is 77MB and when I use an 8MB buffer, the memory used is 17MB.  Clearly the buffer allocated matters.  Just for information, I’ve also included the code that does not break the SHA256 hash into blocks, and it has the same results based on the size of the Memory Buffer declared.  That is, small buffer, small use, big buffer, big use.

The End Result

Motivation

As you can imagine, The Silicon Valley Code Camp web site has lots of “back end” functions that need to be done. That is, things like doing mailings, assigning roles to users, making schedules, allocating rooms and times and literally  hundreds of other tasks like that.  Over the 5 years of code camp, I’ve always built simple protected asp.net web pages to do this.  I’ve always used the simplest asp.net control I could find, such as GridView, DetailsView, DropDownList, and SqlDataSource.  The interfaces usually basically work but are very clumsy and lacking in both functionality and aesthetics.

Why Now

I’ve seen lots of short demos on LightSwitch for Visual Studio and recently read on someone else’s blog that they are now building all their simple applications using LIghtSwitch.  Also, my friend Beth Massi has been running around the world espousing the greatness of this product and I knew if I ran into any dumb issues that she’d bail me out (I’m the king of running into dumb issues.  I’ve found that given two choices that seem right, I always pick the wrong one which is what actually happened here along the way, and Beth did bail me out).

I’m just starting to use Windows Azure for a project and plan on using the Azure Blob Storage part.  I won’t go into the details here, but let’s say I figured it out far enough so that I have pushed some piles of data into the blog storage.   Now, I want to see them.  I assumed that from the Azure portal, there would be some interface where I could see what I actual did and am being billed from.  I posted to the forums and basically was told that’s not really the case.  Here is the post with the answer saying you need some other software to do it (details below).

My friend RobinDotNet suggested I look at his article about how to use Visual Studio 2010 to view the blob storage.  Sure enough, in VS, I can set my account and key in server explorer and see the blob storage!  Thanks Robin.

So, you want to add a couple extra parameters to an existing method in Visual Studio, while not having to change all your existing code to call the new method signature?  It’s easy with CodeRush from Devexpress.  In this post, I’ll start with a simple method and add some parameters to it, then do the magic refactor.

Here is the starting code.

public static int SynchronizeScopesAsyncStart(
  int dbSyncPairId, string schemaName, 
  string connectionStringLeft,
  string scopeLeft, string connectionStringRight, 
  string scopeRight, bool skipDbLogging)
    {...

For the last few days, I’ve been using DevExpress CodeRush and am finding some very useful refactorings.  Many I’m not blogging about, but there are a few that I really like.  In this post, I’m going to show just two of those refactorings that have been making my code much nicer and easier to write.  One is the “Introduce Using” refactoring, and the other is “Convert to Lambda Expression”.

Before I go into the details, I’d just like to disclose that when I was first writing the Silicon Valley Code Camp web site, I was an asp.net and c# newby.  I’m not claiming wizard status now, but I have to admit that when I go back and look at some of the code I wrote back then (including what I’m showing below before the refactoring), it’s a little embarrassing.  Silicon Valley Code Camp for me as “when I’m not doing real work” web site so I don’t really have the time to go back and clean things up.  Now, with CodeRush, it’s easy to clean things up when I see them with very little effort.

I’ve recently started using CodeRush with Visual Studio 2010 and am so far very impressed with the convenience it adds to coding.  One thing that is very clear is that the creators of CodeRush are real programmers and look very hard for patterns that us developers are constantly doing.  As I run into these things that get my attention, I plan on blogging them.  Some are just earth shattering, and others, just nice to have.  This particular one is a nice to have.

So, say you have code like this:

var sessionAttendeeOds = 
  new SessionAttendeeODS();
listSessionAttendees = 
  sessionAttendeeOds.GetByUsername(Context.User.Identity.Name);

MSDN has a very nice article on how to create a windows service that hosts a Windows Communication Foundation (WCF) service.  It explains all the details of doing this in a step by step fashion.  One thing that I often find missing from these articles is the actual Visual Studio project that I can download and play with.  What I usually do is put that together myself (which I’m sure is the author’s intent).

To save anyone some time who wants to do the same thing, I’ve created a VS2010 project from the example, added a very simple Windows C# console application that consumes the service, as well as made some small changes in a very nice Windows Presentation Foundation (WPF) calculator project so that the calculator does it operations inside the windows service rather than in the calculator itself.

In this article, I’ve attached the source code (with my small changes and additions) for you to work with and change as you like.

One of the very cool new features in Visual Studio 2010 is the ability to “Pin” a variable you are watching, right in the place you want to see it.  It’s always been a hassle to have to add a “Watch” and keep track of it among all your other watch variables.  I guess I shouldn’t really complain because I’ve always really like the debug capabilities in Visual Studio, but I have to say, this new “Pin” is really nice.

This article is very short.  In the actual presentation, there was not much time to talk about this so a brief overview was done.  Basically, it’s all standard WCF stuff.  The idea is that the Silverlight Business Template adds logging in and supports Authentication just like an asp.net application does.  It uses the DomainDataSource to do the bridging between the silverlight clientside app, and the web application.  Authorization is built into the login module also so that you can assign attributes to your domainservice classes to restrict access.

In this section, we will talk about what happens when the users presses the “Sessions” hyperlink from the speakers page.  If you remember from the last article, we used a special converter on the Speakers.xaml page and bound that to the hyperlink titled sessions as shown below.