Dreamer. I Love to Build Cool Stuff | Microsoft MVP | Innovator, Architect, Speaker, Blogger | Experience in Microsoft Platforms, .NET, Mobile, Web Apps, Azure, Enterprise Integration, AI | Hacker, Husband, Son, Father
I just collated some of my posts on C#, and published an Ebook – Revisiting C#. Have a look at the same here.
This book is intended to be a value adding reading material for beginner to intermediate C# programmers. It may also be used for accelerating the learning about new and upcoming features in C#, and also to get an introduction about new libraries in .NET. You may find random articles and alternate perspectives related to various aspects of C# - ranging from delegates, lambdas, fluent interfaces, dynamic features etc. with practical examples.
Who won’t love adventurous, out of the box hacks and prototypes? The joy of being a developer is to experiment with hot new ideas, and to do things others haven't done yet. For a developer, a hack is a source of joy - just as a poet who finds his real joy in unleashing his creativity, than in selling the same to others.
In modern computing terminology, a "hack" is a solution to a problem, doing a task, or fixing a system (whether hardware or software) that is inefficient, inelegant, or even unfathomable, but which nevertheless (more or less) works.
Here are few super cool hacks I explored and found in the last couple of weeks.
Node.Js Running on top of Azure
Paul has experimented with Node.Js and Azure, and wrote a couple of posts on running Node.Js on Windows Azure. And I got interested because Node.js is among the new cool kids in the town, and looks pretty interesting .
Using Kinect to control Windows 7 Apps And More Kinect hacks
Evoluce has released a video that shows leveraging Kinect for controlling the Windows 7 UI using Kinect. The hack is pretty awesome, it simulates almost all mouse movements, and to some extent, multi touch and features like that.
Sounds interesting? You may also checkout http://kinecthacks.net/tools-and-resources/ to see a great list of tools and resources to start doing your own Kinect hacks. They’ve a cool list of various Kinect hacks. Also, recently there are few more interesting Kinect hacks in response to Gmail Motion Prank .
Accessing WPF windows over a Web browser using Websockets and Canvas
Let me shamelessly plugin this hack here. Over the weekend, I just put together a hack for pumping WPF windows over Websockets and rendering it using HTML5 canvas – also with basic mouse input support. For each user connecting to the server, a new window instance is created, and screen will be pumped over web sockets to the browser as base64 encoded images. These images are painted on an HTML5 canvas. Have a look at the same here
You may see that the mouse input on top of the canvas is pumped back to the server, to simulate mouse events, and the results are refreshed in the browser. Have a look at the post and source code here.
Html5 Prototypes from Microsoft Web Labs And WCF Websockets
Microsoft Html5 Web Labs has a couple of interesting prototypes around HTML5 Draft Specifications.
IndexedDB
IndexedDB is a draft Web specification for the storage of large amounts of structured data in the browser. View details.
The IndexedDB API is currently being standardized by the W3C Web Applications Working Group. IndexedDB can be used for browser implemented functions like bookmarks, and as a client-side cache for web applications such as email.
WebSockets
WebSockets simplifies bi-directional, full-duplex communications channels, over a single TCP socket. View details.
This is a very interesting project using .NET Micro Framework and Netdunio to control water heater temperature based on weekly usage patterns. The article is there at Coding4Fun blog
The application is built on the open source 'netduino.helpers' library which provides a set of hardware drivers written in C# targeting the netduino family of .Net Micro Framework micro-controllers.
NetDunio is an open source electric platform using Microsoft .NET Micro Framework, and if you want to hack on that, go get the resources and tools here. http://www.netduino.com/downloads/ resources.
Over the weekend, I just put together a hack for pumping WPF windows over Websockets and rendering it using HTML5 canvas – also with basic mouse input support. For each user connecting to the server, a new window instance is created, and screen will be pumped over web sockets to the browser as base64 encoded images. These images are painted on an HTML5 canvas. The entire source code is here at codeplex – http://wow.codeplex.com
What does this mean?
Once HTML5 specification is final - it is almost certain that it’ll be the most widely adopted platform for delivering applications to end users. With Websockets in HTML5, we are going beyond the unidirectional, stateless http to a full duplex, high speed connection infrastructure between the server and the client. This will definitely bring up lot of interesting possibilities, including exciting and feature rich user experiences. WPF is already a widely adopted, feature rich desktop application development platform, and this hack is a quick POC to bring the WPF experience over the web to the end user using HTML5 web sockets and canvas.
You can see that I’m accessing my WPF application over multiple browsers in the below video. Just to clarify, it is rendered in the browser purely using HTML5 canvas – No Silverlight or Flash
WebSocket is a technology providing for bi-directional, full-duplex communications channels, over a single Transmission Control Protocol (TCP) socket. It is designed to be implemented in web browsers and web servers but it can be used by any client or server application. The WebSocket API is being standardized by the W3C and the WebSocket protocol is being standardized by the IETF.
Here is a pretty minimized implementation of the page that opens a web socket, retrieve the image data, and draws the same on a canvas
var socket = new WebSocket("ws://localhost:8181/main");
socket.onopen = function () {
}
socket.onmessage = function (msg) {
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var img = new Image;
img.onload = function () {
ctx.clearRect(0, 0, canvas.width, canvas.height)
ctx.drawImage(img, 0, 0); // Or at whatever offset you like
};
img.src = "data:image/gif;base64," + msg.data; ;
}
The server
I was planning to implement a quick socket server based on draft specifications – but I found that there are already a couple of .NET based implementations out there. One among them is Nugget - http://nugget.codeplex.com/ – I’m having a thin layer on top of Nugget for creating a window instance when ever a client socket connects to the server.
var srv = new WebSocketServer(port, origin, "ws://" + server + ":" + port);
srv.RegisterHandler<ElementSocket<T>>("/" + name);
srv.Start();
return srv;
Most of the logic required for creating window instances, and pumping them back to the connected client socket goes in my ElementSocket implementation.
Capturing User Inputs
Presently, the support for input devices (mouse, keyboard) etc is minimal. Only Mousebutton down and Mouse button up events are supported. To do this, we are capturing the mouse inputs using JQuery, and then pumping it back to the server.
$("#canvas").mousedown(function (e) {
var point = getXY(e);
socket.send("mousedown;" + point.X + ";" + point.Y);
});
$("#canvas").mouseup(function (e) {
var point = getXY(e);
socket.send("mouseup;" + point.X + ";" + point.Y);
});
On the server side, the incoming messages are used to simulate the events on the WPF window instance that corresponds to the socket, like
var pnt=this.TranslatePoint(new Point(x, y), this);
var res=VisualTreeHelper.HitTest(this, pnt);
if (res != null && res.VisualHit != null && res.VisualHit is UIElement)
{
SimulateEvent(res, action);
}
Challenges
There are a number of challenges – Ideally we should push only the region copies once it is modified. As of now, I’m pushing the entire screen image (bad) as that’s pretty easy (This is a weekend hack, remember). Now, another challenge is proper user input simulation on the instance windows – I still need to find a good way to trigger user inputs to the specific windows, with out affecting the actual input devices. For example, when one user moves the mouse, the move message should be triggered to the corresponding server side window instance, with out affecting the actual mouse cursor. May need to have a look at the WM_ messages, not sure to what extend it can be applied on WPF top level windows.
You can simulate Websockets using the Flash proxy, if your browser won’t support websockets - https://github.com/gimite/web-socket-js – Most browsers do support Canvas though.
As I mentioned, the entire source code of this hack is there at http://wow.codeplex.com – Enjoy.
Posts
.
). Now, another challenge is proper user input simulation on the instance windows – I still need to find a good way to trigger user inputs to the specific windows, with out affecting the actual input devices. For example, when one user moves the mouse, the move message should be triggered to the corresponding server side window instance, with out affecting the actual mouse cursor. May need to have a look at the WM_ messages, not sure to what extend it can be applied on WPF top level windows.