Microsoft technologist's view on nodejs

Most of my enterprise experience is bound to the Microsoft stack (.Net, SharePoint 2007 & 2010, SQL Server, IIS, Windows 2003, 2008, 2008 R2, the list goes on and on)

Pretty much of this change ever since i took my part time degree and i was brought back to hardcore software development, design and documentation. C++, C, php, rdms, 3NF, data structures & abstraction, algorithms, big O notation, etc.

I sat down and gave it a thought, the very existence of IT in most businesses are mostly for complimenting a business. We can leave Facebook, twitter, google and yahoo out of the picture, as they had caught on a market niche while their respective industry are in their infancy.

In the last project that i was involved in, i've opened up my mindset, i told myself, not to listen to microsoft all the time. I said no to ajaxcontrol toolkit, i said no to grid view binding to datasets. This time i wan to go hardcore and be able to know exactly what i am doing and how is it being done.

Enter: jQuery. There is no need for me to introduce this excellent javascript framework, but what it did for me was more than being a javascript framework. It allow me to be exposed to the open source communities on IRC, mailing lists and several forums. Underscore.js, less.js and Zurb foundation soon found their way into my IDE.

Soon enough, i've heard and tried a few node.js one page applications. The concept was clear and easy. The one language that most, if not all web developers are familiar with: Javascript. Using it for your user interface, server application and even database, one language to rule them all.

Author Ryan Dahl initially insisted that node be a 1 process thingy, lately, i believed due to many feedback and Joyent's direction, now they provide process forking.

My main roadblock for implementation in production is the stability, better debugging capabilities & easier fail-over. There are ways to implement fail over, but due to the fact that it is still under very rapid development, breaking API changes & deprecation caused a few sample apps that i created having problems.

I will look forward to v1.0 and implement it on our production servers.

IE7 & IE8 calibri font blurry Sharepoint jQuery

Using jQuery in Sharepoint became a second nature to me. I was using a div with fadeIn(), nothing special and everything went well on our development environment and integration environment. Until we went to UAT and received lots of complains from users saying that the fonts look pixelated and blurry. I went down on site and saw that the fonts was indeed very blurry (especially true on their screens).

Bad news for me as I had a 7 level depth of div and span tags, not to mentioned it was in a webpart and Sharepoint corev4.css had this div.ms-WPBody that likes to screw my styles up.

After deep investigation, since safari, chrome and IE9 didn't had any blurry fonts, I downgraded my IE9 to IE8 and managed to replicate the issue. Hours past and I did a side-by-side comparison between chrome and IE8. Then I saw something within the top level div which I used the fadeIn() effect. div id="divContainer" style="filter: alpha bla bla bla,....."

It caught my attention and I used IE developer tools and went straight to the CSS tab and looked for the "filter". I turned it off by clicking on the checkbox. The fonts immediately sharpened. Hmm, http://blogs.msdn.com/b/e7/archive/2009/06/23/engineering-changes-to-cleartype-in-windows-7.aspx


So I've read up a lot and found out that jQuery might actually add in the filter somehow. I managed to solve it by putting:

document.getElementById('divContiner').style.removeAttribute('filter');

But I later found out that it only work for IE8. After some more frustrating hours, I discarded the fadeIn() effect and the fonts were sharp and crisp :)

Facebook detect movement before loading new feeds

If you are eagle-eyed enough, you would have noticed that facebook actually doesn't poll unnecessarily from the server. Somehow it knows that you are away for sometime and when you are active and start to move your mouse, newer feeds starts loading.


<script type="text/javascript">
  document.onmousemove = (function() {
    var onmousestop = function() {
      $('h1').css("color", "white");
    }, thread;
    return function() {
      $('h1').css("color", "red") clearTimeout(thread);
      thread = setTimeout(onmousestop, 200);
    };
  })();


Read more on this: Closures
I've embedded this scrip into the blog -> Blue H1, so don't panic if you see the h1 starts turning blue :)

Mimic wikipedia for SharePoint 2010 search

Recently, there was a user requirement for customizing SharePoint 2010 Enterprise wiki search control. 

Objective: Mimicking Wikipedia search box functionality, whereby when a user enters a wiki page title, if there is an exact hit, we should redirect the user to the page, instead of displaying SharePoint's default result page. (Less the autocomplete)

Using jQuery & a bit of digging into SP.js, i found that internally, SharePoint actually uses a javascript function called "SubmitSearchRedirect", which actually redirects the user to "/_layouts/searchresults.aspx" and appending the search keyword as the querystring. 

So a seemingly difficult request was actually completed in less than 10 mins.

function applyCustomSearch() {

            $("#onetIDGoSearch").attr("onclick", ""); //user click on search img
            $("#idSearchString").attr("onkeydown", ""); //user keystroke

            $("#onetIDGoSearch").click(function() {
                <Your AJAX function to check if the page exists>($("#idSearchString").val(), function(exactHit){
                    if(exactHit== true) { //simulate got exact hit
                        window.location = "http://"+ document.domain +"/<Your Enterprise Wiki Homepage>/" + $("#idSearchString").val() + ".aspx?ContextId=" + $.queryString("ContextId");
                    } else { 
                        SubmitSearchRedirect("http://"+ document.domain +"/_layouts/searchresults.aspx");
                    }           
                });
            });

            $("#idSearchString").keydown(function (event) {                
                if (event.keyCode == '13') {
                    event.preventDefault();
                    <Your AJAX function to check if the page exists>($("#idSearchString").val(), function(exactHit){
                    if(exactHit== true) { //simulate got exact hit
                        window.location = "http://"+ document.domain +"/<Your Enterprise Wiki Homepage>/" + $("#idSearchString").val() + ".aspx?ContextId=" + $.queryString("ContextId");
                    } else { 
                        SubmitSearchRedirect("http://"+ document.domain +"/_layouts/searchresults.aspx");
                    }           
                });
            });
        }

The logic is dead simple. 

For my project, i used an event receiver to track all the articles by saving them into a database and creating a tag cloud. So i had the benefit of knowing exactly how many article pages and how they are being named. So all i did was a simple $.getJSON() to my custom RESTful WCF service, which returns a boolean, and the rest is straightforward.

For simpler projects, you can either use http://spservices.codeplex.com/ to query the wiki pages library for the article existence.

I shall do a blogpost on how to embed jQuery library into SharePoint 2010 in the subsequent posts.

GSPMigrator source code release

After leaving the source codes for this tool, i've decided to put it on CodePlex with the GNU v2 licence, hoping that it will support and help any one that needs to migrate files into SharePoint 2007 (and in the future 2010).

GSPMigrator is basically a migration tool that allows anyone within the network to connect to a network drive and view it with a tree view.

There are several problems (although there are still some minor ones) that i went through before coming out with this version:

• Lazy-loading vs eager-loading on generating tree views

Lazy-loading will give better user experience.