Sébastien's Coding Journey

Change is in the air

Sébastien Ayotte — Tue, 16 Aug 2011 02:32:38 +0000

Here’s a quick post to let you know that I moved my blog. So it will be my last post on this blog. I want to experiment with AdSense. I wanted to keep things simple so I started a new one on Blogger where AdSense is easy to activate.

Cheers :)

Scriptaculous Sortable List Example

Sébastien Ayotte — Tue, 28 Dec 2010 20:24:07 +0000

In my previous article I built a list where a user is able to move a table row up or down by clicking on a up icon and a down icon associated to the row. The thing is that I want the user to be able to sort a priority list by moving the items in the list. It’s working quite well but I don’t like the fact that the mouse’s cursor don’t follow the row when the up or down icon is clicked. I find it quite disturbing for the user. So I decided to take an other approach.

What are we doing

In this article I will use Scriptaculous to make the items of a list draggable.

The list

I will make the following list draggable.


	List item 1
	List item 2
	List item 3
	List item 4

The librairies

To make the items in the list draggable I also need Prototype.

Applying the effect

The last thing we need is to create a sortable list with Scriptaculous.

Event.observe(window, 'load', function() {
	Sortable.create("list");
});

The complete example



    
        
		
		
		
		
	
	
		
			List item 1
			List item 2
			List item 3
			List item 4

It’s pretty straightforward to make a list draggable with Scriptaculous. Now the users can drag and drop the items in the list to sort them the way they want.

Cheers :-)

How to move table row up or down with Prototype

Sébastien Ayotte — Thu, 23 Dec 2010 15:37:38 +0000

What are we doing

I need to build a list where a user should be able to sort the elements by moving up or down an element. To do so I want to present the elements in a table similar to this:


	
		
			1 up down
		
		
			2 up down
		
		
			3 up down
		
		
			4 up down

To keep things simple I want the user to click on td.up to move the row up or on td.down to move the row down.

Moving the rows

To help me do that I use the Prototype JavaScript library.

So when the page load I attach a function to the click event of each td.up and each td.down.

Event.observe(window, "load", function() {
	$$("td.up").each(function(element) {
		element.observe("click", up)
	});

	$$("td.down").each(function(element) {
		element.observe("click", down)
	});
});

Move up

To move an element up in the table I remove the row before the row the user clicked on and I insert it after the row the user clicked on.

function up(event) {
	var element = event.element().ancestors()[0];
	var previous = element.previous();
	if (previous) {
		previous.remove();
		element.insert({after:previous});
	}
}

Move down

To move an element up in the table I remove the row after the row the user clicked on and I insert it before the row the user clicked on.

function down(event) {
	var element = event.element().ancestors()[0];
	var next = element.next();
	if (next) {
		next.remove();
		element.insert({before:next});
	}
}

The complete example

Cheers :-)

Taking out the trash

Sébastien Ayotte — Fri, 10 Sep 2010 13:10:23 +0000

I always wanted to be my own boss. So I refined my skills by buying books on programming. I also added a lot of blogs about programming to my Google Reader. My day job is about programming. With all that I became a pretty descent programmer.

I realized that I was not quite on the right path. Don’t get me wrong. I love to program and it is useful to invest in yourself. But you have to invest in something that will help you achieve your goals.

But what are my goals?

The idea is that I want to build my own business. I need to focus on that. I need to stick around people that can help me. A thing I learned about programming is to fix a problem adequately you need to identify the root cause of the problem.

Why do I wanted to build my own business?

The thing is I want to make more money. I want freedom. I want to be able to live my own lifestyle.

Refocusing

What I needed to do is to take action. I read Getting Thinks Done. I learned to focus on the next action.

I read I Will Teach You To Be Rich. I learned a simple and solid system to handle my money. I discovered the blog of Ramit who inspired me to make some money on the side.

I deleted some programming blog and I added some personal finance blogs and some lifestyle blogs to my Google Reader.

I discovered the blog of Tim Ferriss and I bought his book.

I’m relieved. I got so much energy from those guys. I needed this mental shift.

Now what?

I want to learned how to get into my clients head. I want to help them to get a window on the web. I want to build a business to get a side income. I want to join the earn1k program.

I’m thrilled cause I’m not alone in this. My wife and I are chasing the same dream. I’m very grateful that we can start this together. It will be quite a journey.

Minding My Own Business

Sébastien Ayotte — Wed, 26 May 2010 11:55:28 +0000

It’s been a while since I post something in the mood category.
I have been limiting myself to write little posts on how to do this in JavaScript or how to do that in VBScript.
These kinds of posts are quick reminder for me. Hopefully, they’re useful to someone else.

Lately, I had been quite busy.
My wife and I are in the process of building our own company.

After a little bit of drama about her working life, we realized that we should be focusing on something of our own.
We decided to create an Internet company that will provide an affordable website development service.

I will try to write some of my insights about this process.

Stay tuned!

VBScript’s default keyword

Sébastien Ayotte — Wed, 31 Mar 2010 11:50:45 +0000

While I’m digging more and more into VBScript, I learned that you can use the default keyword to mark a default method in a class.

First, we define a class MyClass where is default sub is myDefaultSub.

public class MyClass

  public default sub myDefaultSub(p_value)
    response.write p_value
  end sub

  public sub notADefaultSub(p_value)
    response.write p_value
  end sub

end class

Second, we instantiate MyClass and we use it.

dim objMyClass : set objMyClass = new MyClass

objMyClass("This is calling the default sub.")

objMyClass.notADefaultSub("This is not the default sub.")

Cheers :-)

JavaScript isNumeric function

Sébastien Ayotte — Fri, 08 Jan 2010 15:20:08 +0000

Here is a JavaScript function that defined if a value is numeric or not.

function isNumeric(value) {
    return value == parseFloat(value);
}

Cheers :-)

JavaScript String.startsWith and String.endsWith implementation

Sébastien Ayotte — Thu, 07 Jan 2010 13:58:36 +0000

While I was reading Ricky Rosario’s blog I took note of an interesting way to implement the startsWith and the endsWith methods for Strings. It may be useful.

String.prototype.startsWith = function(prefix) {
    return this.indexOf(prefix) === 0;
}

String.prototype.endsWith = function(suffix) {
    return this.match(suffix + "$") == suffix;
}

Cheers :-)

Looping in a form’s elements in JavaScript

Sébastien Ayotte — Thu, 05 Nov 2009 16:33:57 +0000

Sometime you need to prevalidate some inputs in a form. You could do this by looping in all the elements of the form. Here is a quick example of doing just that.


    
        An example.

What happen here is when I submit the form, the loopInFormElements method get called. This function loop in all the form’s elements and show the name and the value of the inputs.

I thought it could be handy.

Cheers :-)

A note about standards

Sébastien Ayotte — Wed, 04 Nov 2009 19:46:22 +0000

Just a quick thought about standards. You should try to keep them simples.

And please, don’t push to hard on best practices. The’re not silver-bullets.

Enough evangelizing for today :-P.

Cheers :-)