Nick Josevski

What?

This sample application is very contrived, and came out of a throw away twitter account creation joke.

Landing Page: usedguids.apphb.com

Usage Info: gist.github.com/3964492

Service Features

1. Submit a Guid, have it reserved
2. Will inform you if it’s taken, or ok.
3. Tweets

Tech Details / Steps

• File, New, Web Api Project
• ASP.NET 4.5 Web Api Controller
• PM> Install-Package TweetSharp (nuget link, github link)
• Git push to remote repo on BitBucket
• AppHarbor link to BitBucket account (this was great, very easy)
• Select an app name usedguids.apphb.com

Api Controller Logic

    public class UsedGuidController : ApiController
    {
        public HttpResponseMessage Post(UsedGuidInputModel ug)
        {
            //check for duplicates,
            //twitter authenticate, tweet
            //save guid
            //return new HttpResponseMessage(what_happened)
        }
    }

Conclusion

It’s up and running, we’ll see how stable it is. In this case the code is very sloppy, the focus was to get this concept up and running, so I decided to host it on BitBucket where I have private repositories on a free account.

The AppHarbor experience was great, no fuss to get it up and running, via the authorise AppHarbor app action when I was taken to BitBucket. Even setting up a back end store was very easy.

The hardest part was working out how to deal with the Twitter API, and that was only tricky because I was in a hurry to just get it working, without reading enough documentation.

It’s unlikely I’ll make time to tidy up that code so it can be of any reasonable use to anyone, there’s too many hack points to get it operational, in particular around twitter API keys, for the application that performs the posting, and the user linked to the account. Not to mention hard coded connection strings with passwords in them. Quite a long list of what-not-to-do.

I did like that the wizard does warn you of such bad behaviour. There’s some insight into the storage model on the back end

In my preivous post, I introduced “self submitting forms” with the help of some jQuery functions. I had 2 out-standing (todo) items from that post (and work). The first was to have some tracking around the input elements and when they’ve been re-modified before a delayed post has occurred.

Item 1 – Tracking Recently Modified

Problem Definition:
There are 2 input fields: “Deadline” and “Task Name”, the user modifies “Task Name” then “Deadline” then “Task Name” again. Under the previous approach, the first delayed processing of “Task Name” would end up sending 2 pieces of data in the form submit as separate actions. This is not optimal.

Solution Description:
Track when the input elements were modified, and if they’re modified in some “reasonable amount of time” again, then don’t send the previous value. This is for now is simply achieved by tracking the input element name with a “modified times” count value. Every time a change is made to an input element, we “push” the details onto a central collection, when it’s time to attempt to send the data we “pop” off that central collection.

Solution Steps:

1. Have somewhere to store the entries in a central collection, a simple dictionary style variable is fine for now.

var activeInputs;
//initialised later
activeInputs = {};

2. When an input element is modified, we simply store it’s ‘id’ and increment it’s modified counter in the ‘activeInputs’ dictionary:

var elemId = c.attr('id');
//c here is the input element that is associated with the handling event.

if(activeInputs[elemId] == null)
    activeInputs[elemId] = 1; //initialise
else
    activeInputs[elemId] = activeInputs[elemId] + 1; //increment

This method is the “push on to stack” approach, and does not need to supply feedback.

3. We next will need a method to decrement this, along with returning the modified count value:

var elemId = c.attr('id');
if(activeInputs[elemId] == null)
    return -1; //erorr state

if(activeInputs[elemId] > 1)
{
    countVal = activeInputs[elemId];
    activeInputs[elemId] = activeInputs[elemId] - 1;
}
else 
{
    countVal = activeInputs[elemId];
    activeInputs[elemId] = 0; //reset it
}

This method is the “pop from stack” approach; we need it to inform us if the input data was in fact ready to be “sent off”

So now if you recall the ‘startCountDownAndSendData’ function from the preivous post it had line to submit the form, this can now be wrapped by a check via the “pop” method to see if it should send. If there’s been a recent edit (i.e. the ‘activeInputs’ value is greater than 1), then it will not send.

I didn’t name the methods earlier, and only showed their internal workings, as naming these functions was tricky, but in the next code snippet, I give the pop method a name, to see them in action as a whole check it out on jsFiddle.

if(popProcessedControlFromStack(c) == 1)
{
    //if value "1" - active control then submit, otherwise it was editted recently                
    $('form#MyFormId').trigger('submit');
}

Item 2 – User Feedback on Progress

The second out-standing issue from the preivous post was the user feedback. For now I’m just going to borrow the one from WordPress when you save a post/draft.

Once you actually submit the data, you just need to handle the success response, this will either replace the above section or be a link. But for a bit of a wrap up on this post with the jQuery focus here’s a skeleton function to show some feedback.

function showSuccess(data) {
   $('#someDiv').html('<img id="checkmark" src="/Content/check.png" />');
}

The third (and coming soon) post, will cover the MVC side of this.

Following on from my previous post. I’m creating a PowerShell script that takes an input of a file location via a dialog. Extracts some files through a copy action, and compresses them into an archive. As I will show in the 3rd post, the purpose is to extract out 2 files to help with deploying a SketchFlow project. Such a complex script is overkill for 2 files, but is easily extensible to handle a larger set of files.

Step 1 – User input of folder:
Create a function to launch a folder select dialog, this is achieved through a com object call.

function Select-Folder($message='Select a folder', $path = 0)
{
    $object = New-Object -comObject Shell.Application
            
    $folder = $object.BrowseForFolder(0, $message, 0, $path)
    if ($folder -ne $null)
    {
        $folder.self.Path
    }
}

Note: Could call this twice to prompt user for output location also.
OR
To speed up script execution supply input parameter(s) to the script [input (and output) directory].

To achieve this simply use $args[0] (and $args[1]) instead of the Select-Folder cmdlet call.

The Select-Folder cmdlet launches:

Browse For Folder Dialog

Step 2 – Extract (via copy) the deployable files:
There are 3 tricks here; first extracting only files via not PSisContainer, grouping them via their extensions (in order to easily process them in a copy loop) and matching only a list of valid extensions (in this case xap and html).

$types = ".xap", ".html"

$files=  Get-ChildItem $folder | Where-Object {-not$_.PSisContainer} | Group-Object Extension 

$files = $files | Where-Object {$types-contains$_.Name}

New-Item -itemType Directory -path $deploymentFolder -ea SilentlyContinue

$files | ForEach-Object { $_.Group | Copy-Item -destination  $deploymentFolder }

Tip: use Some-Cmdlet | Format-Table or its variants to output details to screen to help with debugging.

Step 3 – Compress
This last step in the script is a compression action. I got the compression functions from David Aiken’s MSDN blog post. The Add-Zip function was unable to take a file path containing a directory-up (\..\), so the final script has Move-Item cmdlet line to compensate.

function Add-Zip
{
    param([string]$zipfilename)

    if(-not (test-path($zipfilename)))
    {
        set-content $zipfilename ("PK" + [char]5 + [char]6 + ("$([char]0)" * 18))
        (dir $zipfilename).IsReadOnly = $false    
    }
    
    $shellApplication = new-object -com shell.application
    $zipPackage = $shellApplication.NameSpace($zipfilename)
    
    foreach($file in $input) 
    { 
            $zipPackage.CopyHere($file.FullName)
            Start-sleep -milliseconds 500
    }
}

The complete script file can be found here on Gist.GitHub.

The next step in this script could be to email the newly created zip file, but that’s something for a future post.