Hosting Change

amplehostingI have been using Hetzner to host my blog and other sites, but this offer from Ample Hosting was just too good to turn down: (Hetzner’s stats in brackets)

  • 100 MB Disk Space (1gb)
  • 10 GB Bandwidth (20Gb)
  • 7 MailBoxes (100)
  • 7 MySql Databases (1)
  • 1 Website (1)
  • R22/month (R99)

So as you can see some of the figures are way less, but I really don’t need 100 mailboxes or large amounts of disk space (images should live on picaso or flickr anyway).

And best of all they handle the domain AND content transfer for free. Lets see if they get it right…

jQuery Infinite Loop

After looking around for a while I could not find something that would create a closed loop effect when scrolling through options in a carousel… so i had to build it. There are a lot of gallery type carousels that will left you click left and right to navigate through, but come to a dead end once you hit the first of last item. I wanted to be able to continue clicking to go round and round through the options.

infiniteloop

Check out the demo.

Kyoto Garden Sushi

kyoto1Last night Sam and I went off to Slipstream consulting‘s end of year dinner, which was held at Kyoto Garden Sushi, lower kloofnek road. Well done Dave for picking such a beaut of a restaurant. The owner himself showed us to our table which was in it’s own room, decorated minimalistic zen.

Now, I’ve been to some pretty good sushi establishments – but nothing has come even close to the dining adventure that we were exposed to. The courses came through one after another, each more delicious than the last. If memory serves, we started out with baby clams and jellyfish (!).kyoto2 The clams were superb, but I must say that the jellyfish was a little ‘gelatonous’ (thanks Mark). Next we had a couple more courses which included octopus, prawn, scallops, tasty sea weed (honestly), soup etc. Then the platters arrived with the most fantastic sushi I have ever had, prepared from wild Alaskan salmon, yellowtail, Norwegian salmon, tuna, prawn etc etc.
One of the most impressive things though was the wasabi – not your run of the mill horseradish and colouring wasabi, but the actual wasabi made fresh from wasabi root.

The new Jackson five.. um, three.

Jared, Toni and Dylan showing their moves at Toni’s Birthday party at Place of play.

Showing the loading icon when jQuery is waiting for a response

Here’s a very simple method of putting an overlay on the page when you are making an asynchronous call using $.ajax. As the page does not refresh, you need to alert your user that work is actually been done and that they cannot interact with the page until you have finished

The css:

.lightbox_bg {
        background:#ffffff none repeat scroll 0 0;
        display:none;
        height:800px;
        left:0;
        filter:alpha(opacity=50);
        opacity: 0.5;
        top:0;
        width:100%;
        z-index:1110;
        display:none;
        position:fixed;
    }
    .modal{
        position:absolute;
        left:45%;
        top:45%;
        z-index:1111;
        width:32px;
        height:32px;
        background:url(/image/of/your/choice.gif) #fff 50% 50% no-repeat;}

The javascript:

$(‘body’).ajaxStart(function() {
        $(‘<div />’).addClass(‘lightbox_bg’).appendTo(‘body’).show();
        $(‘<div />’).addClass(‘modal’).appendTo(‘body’);
    });
    $(‘body’).ajaxStop(function() {
        $(‘.lightbox_bg’).remove();
        $(‘.modal’).remove();
    });

Thats it, now everytime you do your ajax magic the ajaxstart method will kick in and do its bit – then when its finished the ajaxstop method will remove the overlay.

Ajax using .Net and jQuery – Revised and improved with help from Json

I previously wrote a post outlining a simpler method of making asynchronous calls with jQuery. It turns out that in practice that method was exactly that – too simple. It works fine when you only need one value back, but if you need to work with something a little more complex then try out my new method that uses a JSON object. So the basic overview is as follows:

  1. create an object server-side on page load and add it to the DOM
  2. populate the object using javascript
  3. pass it back to a webservice using jquery’s ajax method and json
  4. use the new object serverside and pass it back

Ok, so lets get started by creating the object in your webservice:

public class Person
    {
        public string Name { get; set; }
        public string ContactNumber { get; set; }
        public string Description { get; set; }
    }

Then in your page load you can inject this object into the DOM:

var objPerson = new Webservice.Person();
var js = new JavaScriptSerializer();
Page.ClientScript.RegisterArrayDeclaration("_person", js.Serialize(objPerson));

Now you can use this object with javascript:

function AjaxMethodJSON(serviceFn, paramArray, successFn, errorFn) {
    $.ajax({
        type: "POST",
        url: serviceFn,
        contentType: "application/json; charset=utf-8",
        data: "{‘clientobject’:" + JSON.stringify(paramArray) + "}",
        dataType: "json",
        success: successFn,
        error: errorFn
    })
;


$("#btnSubmit").click(function() {
        objPerson.Name = $(‘#txtName’).val();
        objPerson.ContactNumber = $(‘#txtContactNumber’).val();
        objPerson.Description = $(‘#txtDescription’).val();
        AjaxMethodJSON("/webservices/Webservice.asmx/UpdatePerson", objPerson, AjaxSuccessStep, AjaxFailed);
    });

If you have been paying attention you may be thinking – stringify? The official explanation from json.org: If the stringify method sees an object that contains a toJSON method, it calls that method, and stringifies the value returned. This allows an object to determine its own JSON representation. So remember to add a reference to json2.js upstream from this code.

function AjaxSuccessStep(result) {
        if (result != null) {
            var obj = result.d;
            objPerson = JSON.parse(obj);
//got the updated object back, now you can            
//do some more stuff with it
        }
    }

There you go. This works very well when you are stepping through a wizard and updating a few fields with each step.

An undocumented selector for jQuery – Contains Word

Here’s a useful and as yet undocumented feature of jQuery’s attribute selector, the contains word feature – here’s how it works:

suppose you want to select a series of elements based on a class or rel or whatever. In this case I want to select all the links with the class .mylinks – but only those with the rel containing ‘something’:

<a rel="something else" href="#">this is a link</a>
<a rel="thething other" href="#">this is a link</a>
<a rel="something more" href="#">this is a link</a>
<a rel="something up" href="#">this is a link</a>
<a rel="nothing down" href="#">this is a link</a>
<script type="text/javascript" charset="utf-8">
$(function() {
//contains word
$(‘.mylinks[rel~=something]‘).addClass(‘foundyou’); //note the important selector: ~=
});
</script>

Using jQuery to check if all radio buttons have been checked

If you find yourself needing to check if all radio button groups have been checked try this dead simple solution made possible by jQuery:

$(document).ready(function() {
if ($(‘:checked’).length != 5) { alert(‘Please answer all the questions..’); return false; }
});

Tech-Ed Day 2

What a full day – to be honest its all a blur. But fear not I tweeted up a storm and will revisit this post and update once the dust has settled. Suffice to say there were some awesome talks (and some not so awesome ;) ).

I seized a gap in lectures in the afternoon and took my sedatory body for a run along the beachfront and a dip in the ocean. What a pleasure to just go for a swim and not fear loosing extraneous body bits to frostbite – and this is in the middle of ‘winter’. Turns out I needed the mental refresh as I headed back to attend a session by Gail Shaw on Query hints – I know nothing about sql in comparison to her. mercy.

I got taken out for dinner by the gang at IS Partners to a great little italian place on Florida Road, which seems to be Durban’s version of Kloof street. Shot guys, I had a really good evening – if Cape Town ever ends up under water due to global warming – I will come and see if I can be of any value.

Tech-Ed 2009

Mad Street NamesSo here I am, Durban by the sea, for the 09 instalment of Microsoft’s Tech-Ed. I have not been in Durbs for many years, but there’s something about the place that agrees with me, stepping of the plane you are welcomed by a thick blanket of humidy – and it’s the middle of winter. I bought a great book to keep me company on the long flight (which included a stop in the friendly city), its inspirational to read stories where people have taken hold of dreams and not let situations deter then from success.

I met Ugene from lightstone (?) on the flight who was also on the way to the event. He was a dead give away – after taking an hour to totally absorb every word he computer mag the whipped out his laptop and plugged himself into a movie. I introduced myself and guessed his reason for traveling to Durban and was right. Turns out that he has been to the last seven tech-eds. Grief, he deserves an award of some sort – matching microsoft mousepads or something. He was totally amped and said the parties are not to be missed.. I smiled and nodded, but remained a little sceptical.

The opening keynote had all the expected elements: big audio visuals, microsoft evangelism, a couple google bashing jokes and demos that mostly worked. There were some very cool things, the ones that come to mind are:
Visual Studio 2010
Control click to auto generate new methods and properties
Windows 7
making use of gestures
Project Gemini (Donald Farmer)
100 million rows in excel, sorted and filtered instantaniously.
Expression Blend Sketching storyboards

I had dinner with my brother, Gavin, and was introduced to Gail Shaw – one of two Microsoft sql mvp’s in the country. It is so amusing to see uber geeks getting there annual chance to be rock stars amongst the few people that actually get what they do. After spending some time with the guys from IS partners, I called it a night made my way back to the city lodge in the warm drizzle.

Tomorrow it begins in ernest with sessions every hour from eight till five. Hoping to get a gap to go for a dip in the warm ocean…