Where can I find Upshot.js examples and documentation?

Question

Steve Sanderson gave a very interesting presentations at Techdays 2012 in the Netherlands. In one of them he presented a library that he used for client-server communication in MVC application: Upshot.

I was really amazed how easy it was to use it, so I wanted to download and test it. I found the download link here through NuGet, but I cannot find any documentation. Does anyone have something that works? I would also appreciate the sample code that Steve showed as during presentation.

EDIT:

I found the online presentation I attended at Techdays. It's soooo much worth seeing. You will get a glance of what upshot is capable of and also get an idea how to start with it. Good luck and have fun.

The link: http://channel9.msdn.com/Events/TechDays/Techdays-2012-the-Netherlands/2159

Answer 1

I found one which is one of the MS samples for SPAs (which might be the only one for now):

ASP.NET Single Page Application (SPA) BigShelf

The complete tutorial on this project can be found here: BigShelf

Edit:

See this tweet from Steve Sanderson: https://twitter.com/#!/stevensanderson/status/171561402597773312

We're setting up a website for Upshot/SPA right now. Hopefully will go live this week! Sorry for delay.

Answer 2

Edit: see blog post of Steven over here with sample download code: http://blog.stevensanderson.com/2012/03/06/single-page-application-packages-and-samples/

Don't know either how to access the helper, would love to know so I can play with it :-)

This seems to do the trick for now:

<script src="../../Scripts/knockout-2.0.0.js" type="text/javascript"></script>
<script src="../../Scripts/upshot.js" type="text/javascript"></script>
<script src="../../Scripts/upshot.compat.knockout.js" type="text/javascript"></script>

<script type="text/javascript">

    upshot.metadata({ "CLASSNAME:#NAMESPACE":{ "key": ["aId"],
        "fields": {
            "aId": { "type": "Int32:#System" }, 
            "Title": { "type": "String:#System" },
            "Description": { "type": "String:#System" },
            "Effort": { "type": "Double:#System" }
            }
        }
    });

    var myDataSource = new upshot.RemoteDataSource({
        providerParameters: {
            url: "http://localhost:7018/api/CONTROLLERNAME",
            operationName: "",
            operationParameters: {}
        },
        entityType: "CLASSNAME:#NAMESPACE"
    });
            myDataSource.refresh(function (results) {
                alert(results[0].Title());
            });

</script>

You need to replace CLASSNAME:#NAMESPACE with your classname and namespace, so for example: "WorkItem:#MySystem.Models".

And replace the CONTROLLERNAME with the actual name of the controller, in the case of this

public class MyTasksController : ApiController 

you will need to replace CONTROLLERNAME with MyTasks

And fill the stuff inside the metadata according to your model objects. I hope the code samples come online soon, because this is a lot of work :-(

Answer 3

Looking at the BigShelf example, their are a few extra available packages you can use.

I haven't tried them myself yet, but take a look at:

http://nuget.org/packages/Upshot

http://nuget.org/packages/SinglePageApplication

I think the SPA package contains the Upshot and Metadata html helper extension methods

Answer 4

Here is the Delivery Tracker sample from the presentation