Steamed Design

I want to be less fat!, so I am going to complete the Zombies...

Wed, 21 Nov 2012 20:24:00 +1300

I want to be less fat!, so I am going to complete the Zombies Run 5k Training. This is not that first time I have wanted to be less fat in fact I have tried several things:

I tried C25K - and got bored
I tried to train for around the bays - and got scared and didn’t race
I tried Zombies Run! and actually did pretty well until I did too much too soon and hurt myself.
Also according to my wife “I ate all the hot chips”

So they say 5th time is the charm so It training starts today, again.

Look what ReSharper just taught me

Tue, 31 Jan 2012 14:56:23 +1300

You can rewrite:

var result =  object.Where(m => m.Id == id).FirstOrDefault()

var result = object.FirstOrDefault(m => m.Id == id);

Thank you ReSharper

Photo

Fri, 20 Jan 2012 20:20:49 +1300

if i ask a question, where does it go and how do i see the answer? is this powered by a magic 8 ball?

Mon, 16 Jan 2012 10:26:51 +1300

Reply hazy, try again

Why using test coverage as a metric is stupid

Tue, 20 Dec 2011 11:30:50 +1300

Adding a useless test to increase test coverage check.

[TestMethod]
[ExpectedException(typeof(NotImplementedException))]
public void AddUsersToRolesTest()
{
    Roles.AddUsersToRoles(new string[] { }, new string[] { });
}

Easter eggs jQuery plugin

Wed, 16 Nov 2011 18:36:05 +1300

I decided that a project I was working in needed more monsters so I created a quick jQuery plugin to add them, have fun.

//Change image
//<div data-swapcss-value='url("imageurl.png")'>

//Full options
//<div data-swapcss-property='background-color' data-swapcss-value='red'  data-swapcss-count="3">
var swapCssConfig = {}
var swapCssConfig.currentCount = 0;
(function ($) {
    $.fn.swapCSS = function (options) {

        var settings = jQuery.extend({
            clickCount: 6,
            property: 'background-image'
        }, options);

        var currentElement = this;

        currentElement.click(function () {
            warningClickCount++;
            if (swapCssConfig.currentCount > (settings.clickCount - 1)) {
                currentElement.css(settings.property, settings.value);
                currentElement.unbind('click');
            }
        });
    };

    $(document).ready(function () {
        $('[data-swapcss-value]').each(function (index) {
            var item = $(this);
            var options = { value: item.attr('data-swapcss-value') };

            if (item.attr('data-swapcss-count') !== undefined)
                options.clickCount = item.attr('data-swapcss-count');   

            if (item.attr('data-swapcss-property') !== undefined)
                options.property = item.attr('data-swapcss-property');

            item.swapCSS(options);
        });
    });

})(jQuery);

The perils of message placement

Tue, 01 Nov 2011 18:30:06 +1300

Today I entered a contest to win a windows phone I filled in the form and clicked send the form cleared and nothing happerned, or so I thought.

I scrolled down a little and there was a success message, It goes to show if you place a ajax message in the wrong place it can lead to confusion. If the message was above the submit button it would of been fine.

Shrinking Twitter Bootstrap

Mon, 17 Oct 2011 18:30:05 +1300

I really like the Twitter bootstrap but there is one small problem the css file has a bunch of styles that I never used and is slowing down the page load.

Luckly the the people at twitter use less so its pretty easy to customise the css to only include what you want.

For my new iPad Kids game site I wanted to use the reset and the layout and nothing else. To do this:

Download the source from github.
Open lib/bootstrap.less
Comment out the stuff you don’t want (see below)
Then Compress (I use less.app because I am lazy but the command line app works too).

Reset and Layout Only

// CSS Reset
@import "reset.less";

// Core variables and mixins
@import "variables.less"; // Modify this for custom     colors, font-sizes, etc
@import "mixins.less";

// Grid system and page structure
@import "scaffolding.less";

// Styled patterns and elements
//@import "type.less";
//@import "forms.less";
//@import "tables.less";
//@import "patterns.less";

My Typography Cheat Sheet

Fri, 14 Oct 2011 18:30:05 +1300

I know very little about web design and typography in fact most it is from one presentation, so here is my typography cheat sheet.

My Typography Cheat Sheet

Line height of 1.3-2.0 ems
Column width: 2 alphabets
Body text: 16px
2-3 typefaces, maximum
Sans-serif (ex. Helvetica) for titles
Serif (ex. Georgia) for body text

Some Links

It good when other people get bugs through to production too.

Tue, 11 Oct 2011 18:33:05 +1300

It good when other people get bugs through to production too.

Markdown and Javascript

Thu, 06 Oct 2011 18:32:05 +1300

When I created my demo site I wanted to use markdown for all the text so that I can have the same text in github as when the site is displayed. After searching the internet io found showdown but there was a problem it is not very well maintained. There however is an offshoot that the guys at stackoverflow are using called pagedown.

Notice: There is a jQuery plugin I created the details on how to use it are further down this page.

To get pagedown working get the code from the pagedown repo (if you can’t be bothered with hg you can grab it here), then use the following code:

<html>
    <head>
      <title>Example</title>
    </head>
    <body>
        <button id="load">Load Markdown</button>
        <div id="content"></div>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script src="pathto/Markdown.Converter.js"></script>
        <script>
            $(document).ready(function () {
                $('#load').click(function(e) {
                    e.preventDefault();
                    //Get the markdown
                    $.ajax({
                        url: 'yourfile.md',
                        dataType: 'html',

                        success: function(data) {
                            //do the markdown replace
                            var converter = new Markdown.Converter();
                            var result = converter.makeHtml(data);

                            $('#content').replaceWith(result);
                        }
                    });
                });
            });
        </script>
    </body>
</html>

jQuery Plugin

I have also created a jquery plugin to simplify the process that I use for this site to get it working download the plugin then do the following:

<html>
    <head>
      <title>Example</title>
    </head>
    <body>
        <button id="load">Load Markdown</button>
        <div id="content"></div>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script src="pathto/Markdown.Converter.js"></script>
        <script src="pathto/jquery.markdown.js"></script>
        <script>
            $(document).ready(function () {
                $('#load').click(function(e) {
                    $('#content').loadMarkdown({
                         url: "yourfile.md",
                         replaceWith: true, //true use replaceWith ELSE appendTo when adding
                         preAdd: function(result) {
                            //Replace some of the generated text
                         },
                         postAdd: function() {
                             //Do anything you want to after the content is added
                         }
                    });
                });
            });
        </script>
    </body>
</html>

Tumblr Custom Domain DNS Redundancy

Mon, 19 Sep 2011 18:31:05 +1200

Recently Tumblr the DNS server used to host the tumblr custom domains went down and with it all custom tumblr blogs with custom domains, This blog be hosted as such went down with them I was annoyed.

I decided it was time to set up some redundancy I turned to Google and found these servers:

72.32.231.8
50.22.53.155
50.22.53.157
174.121.66.230
174.121.98.156

Just folow the Using a custom domain name instruction on the Tumblr wensite but add all the above IP address not just 72.32.231.8.

Turn off Server Shutdown message

Wed, 14 Sep 2011 18:31:00 +1200

One of the most annoying things about using Windows Server as a developement box is the fact that you always need select the shutdown reason when ever you want to reboot. I posted this some time ago on my old blog, but i have found myself using it twice this week so I thought it would be a good time to repost it.

Click Start, Run, and then enter gpedit.msc. Click OK.
The Group Policy Object Editor console opens.
In the left pane, expand Computer Configuration, and then Administrative Templates.
Click System
In the right pane, find and double-click the Display Shutdown Event Tracker.
When the Display Shutdown Event Tracker Properties dialog box opens, select one of the following options:
- Not Configured
- Enabled
- Disabled
If you select the Enabled option, you can choose between the following options to specify when the Shutdown Event Tracker should be displayed:
- Always: This option is self explanatory.
- Server Only: When selected, the Shutdown Event Tracker is displayed for only Windows Server 2003/2008 servers.
- Workstation Only: When selected, the Shutdown Event Tracker is displayed for only Windows XP Professional workstations. If you want to view help information on the Shutdown Event Tracker application, click the Explain tab.
Click OK, and then close the Group Policy Object Editor console.

Why pay for hosting?

Sat, 10 Sep 2011 18:34:00 +1200

Free Hosting

I don’t like to pay for stuff on the internet this also goes for hosting. Recently I wanted to put up some demo javascript so I figured it was time to find some free hosting.

I turned to google again to try and find an answer. There were a lot of of sites offering free hosting but most of them were crap, I did however find two options thar seemed pretty good, they were:

Google App Engine

What you get for free

With the new Google App Engine pricing you get:

1GB Disk space.
1GB Outgoing bandwidth daily.
1GB Incoming bandwidth daily.

How to set it up

I have created a github project with instructions and all you need.

Amazon S3 Static Hosting

What you get for free

With AWS Free Usage Tier you get (for one year only):

5 GB of Amazon S3 storage.
20,000 get requests monthly.
2,000 put requests monthly.
15GB of data transfer out each month for one year.

How to set it up

Go to amazon and sign up for a free account.
Open the management console.
Select “Amazon Simple Storage Service (S3)” from the dropdown at the top of the page.
Select the bucket(figure 1.1) and then click the properties button(figure 1.2).
Select the website tab(figure 1.3).
Click “Enable” and enter your Index Document this would normally be “index.html”.
Note down the Endpoint and click save.
Upload your site using the upload button.
Select all the files in your site right click and select “Make Public” (Figure 2.1).
Open the endpoint address for step 7 and enjoy your website.

A Got Ya

There seems to be an issue with the bucket names where you cannot create a website unless your bucket name is all lowercase. I found that if you stick to lowercase and only dashes you will be fine.

Figure 1

Figure 2

Working with the Twitter Bootstrap modal

Thu, 08 Sep 2011 21:53:00 +1200

Twitter Bootstrap Modal

I have been playing with the Twitter Bootstrap but one thing seemed to be missing, there is no javascript libraries to do the fancy stuff like modals and drop downs. After a little looking around I found the people who made the twitter bootstrap are actually creating a bunch of javascript to do all the fancy stuff.

But there are two problems:

To use the JS you need to use the work in progress build of the CSS,
There is no way to make the popup a proper modal that you cannot close without selecting something.

So I figured that it was time to hack together a solution, heres what I managed.

To get the twitter modal work for you, download and include my hacked modal JS. Then do the following:

<html>
<head>
  <title>Example</title>
  <link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-1.2.0.min.css">
  <style>
  /*Fixes the positioning of the modal*/
 .modal {
    top: 0px;
    margin-top: 60px;
    z-index: 10002; /*Make the modal display over the toolbar*/
 }
  /*From the 1.3 work in progress build*/
 .modal-backdrop {
  background-color: #000;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10001; /*Make the modal display over the toolbar*/
 }
 .modal-backdrop.fade {
    opacity: 0;
 }
 .modal-backdrop, .modal-backdrop.fade.in {
    filter: alpha(opacity=50);
    -khtml-opacity: 0.5;
    -moz-opacity: 0.5;
    opacity: 0.5;
 }
 .hide {
    display: none;
 }
 .fade {
    -webkit-transition: opacity 0.15s linear;
    -moz-transition: opacity 0.15s linear;
    -ms-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
    opacity: 0;
 }
 .fade.in {
    opacity: 1;
 }
 </style>
</head>
<body>
  <!-- The Modal Dialog  -->
  <div id="modal-from-dom" class="modal hide fade">
    <div class="modal-header">
      <h3>Modal Heading</h3>
     <a href="#" class="close">&times;</a>
    </div>
    <div class="modal-body">
      <p>One fine body…</p>
    </div>
    <div class="modal-footer">
     <a id="btnPrimary" href="#" class="btn primary">Primary</a>
     <a id="btnSecondary" href="#" class="btn secondary">Secondary</a>
    </div>
  </div>
  <div class="container">
    <div class="row">
      <div class="span16 columns">
        <div class="span4 columns">
      </div>
    </div>
  </div>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  <script src="[pathto]/mc-bootstrap-modal.js"></script>
  <script>
    $(function () {
      //Sets up the modal
      var domModal = $("#modal-from-dom").modal({
        backdrop: true, //Show a grey back drop
        //closeOnEscape: true, //Can close on escape
        modal: true //display it as a modal
      });

      $('#modal-from-element').click(function () {
        domModal.toggle(); //Show the modal
      });

      $('#btnPrimary').live('click', function(){
        alert('btnPrimary clicked!');
        domModal.close(); //Close the modal
      });

      $('#btnSecondary').live('click', function(){
        alert('btnSecondary clicked!');
        domModal.close(); //Close the modal
      });
  })
  </script>
</body>

iSurvey has got some good clients. This is from the new site...

Tue, 30 Aug 2011 18:31:00 +1200

iSurvey has got some good clients. This is from the new site design that will go up next week.

Some times Ants are cool!

Tue, 09 Aug 2011 09:46:00 +1200

Some times Ants are cool!:

Another book for my reading list.

Mon, 08 Aug 2011 18:30:00 +1200

Another book for my reading list.:

Ok my game is using Cocos 2D to build my game and now there is a book sweet. I will be buying this very soon.

No sound on avi for PS3 = Solved (using a mac)

Sun, 17 Jul 2011 09:39:48 +1200

Every so often you go to watch a movie on your PS3 and there is no sound this has been an annoyance for some time for me. The way to fix it is to convert the movie to another sound format that the PS3 can play. As I have a mac it is a pain to convert it but thanks to gizmodo I now have a simple way.

Download and Install Media Converter it’s free.
Open Media Converter and select “iPod/iPhone (H.264)”
Drag your movie on to the media converter and wait.
Watch Your newly converted movie.

While doing chapter 4 of the book I ran into a road block the...

Tue, 05 Jul 2011 19:48:00 +1200

While doing chapter 4 of the book I ran into a road block the book was written for Xcode 3 and I was using Xcode4 when it told me to add a framework there was no menu called project, so I couldn’t add the framework.

But with a little digging i managed to find it.