SubMain CodeIt.Right Giveaway

submain-logo-250x76 Well, its time for another great giveaway. This time SubMain has offered to giveaway 2 of their CodeIt.Right Enterprise Edition licenses that are valued at $600.00 each!

For those of you don’t know, CodeIt.Right is a Visual Studio plugin that assists in their development process. Here are some of the features that it offers…

  • Automatic Code Refactoring
  • Team Features
  • Code Metrics
  • Reporting
  • Microsoft Guidelines and Best Practices
  • Follow Your Own Standards
  • Automate Code Reviews
  • Continuous Integration
  • And Many More…

CodeIt.Right's biggest benefit is the automatic code refactoring
-- Scott Mitchell, MSDN Magazine Toobox

Giveaway Rules

CodeIt.Right-Logo_250x57The contest will start today, October 5th, 2009, and last 7 days concluding on October 11th, 2009 11:59PM CST. At that point I will pick the winner and announce the results on the following day.

In order to signup for the giveaway you need to do 3 things…

  1. Follow @elijahmanor on Twitter (if you haven’t already)
  2. Tweet the following…
  3. Add a comment to this blog including your Twitter username.

Note: To increase your chances of winning you can add one comment to this blog each day of the contest.

At the end of the contest I will pick a 2 random comments from this blog entry and then make sure the comment authors tweeted the above RT. At that point I will Direct Message the winners (which is why you need to follow @elijahmanor) with further instructions to receive the CodeIt.Right license.

More About the SubMain CodeIt.Right

Want to learn more about the awesome prize? I highly recommend you check out the following:

1. Visit CodeIt.Right product page to learn about the product you might win.

2. Download the full-featured trial and see how it can help you be a better developer, find some interesting, and real, code problems right away!

Winners Announced…

Congratulations to Sal DiStefano and Mark A. Wilson for winning the SubMain CodeIt.Right Giveaway. Someone from SubMain will be contacting you shortly with instructions.

Thanks to everyone for participating. It looks as if I will be getting some other prizes to giveaway in the near future. So stayed tuned ;)

Read More »

I’ve Been MVP’ed

MVP_08Banner_EN

As I woke up this morning I checked my Twitter feed on my iPhone and saw the following tweet…

RT @Zannabanana: Welcome back MVPs! @robzelt @plitwin @DanWahlin @anthony808 @chadcampbell & Welcome new MVPs @SaraJChipps and @elijahmanor

Wow, what a way to wake up in the morning! As you might imagine, I’ve been beaming inside ever since ;) What an honor to be accepted into the Microsoft Most Valuable Professional (MVP) Award!

Shortly later  that morning I received the official email welcoming me to the program…

Congratulations, you are one of only a few thousand people around the world who have been recognized with a Microsoft MVP Award.

I want to thank everyone who has supported & encouraged me… and of course all the tweet love you’ve shown :)

aspnetinsidersEarlier this year I was also accepted into the ASPInsiders program which has enabled me to converse with the developers of ASP.NET MVC, provide feedback, and play with the newest bits of software before they are released.

I look forward to growing more as a developer and will attempt to continue and provide helpful and timely resources, tips, and tricks for web developers (ASP.NET, ASP.NET MVC, jQuery, HTML, CSS, etc…)

twitter8 As I’m sure you know I am quite active on Twitter and provide daily tech tweets that are also posted on my blog in a daily tech tweet roundup and also archived to delicious.

Thanks for all the tweetulations today by the following band of twitter folk…

@Zannabanana @AndyLeonard @johnnystock @lazycoder @mjlefevre @SaraJChipps @johnnystock @rob_james @D_Guidi @mstum @TheCodeJunkie @Frozzare @unclebiguns @DeveloperInfra @SteveAndrews @foreachdev @ChrisLove @arcanecode @AlanBarber @wendy_dance @DavidGiard @wbm @julielermanvt @alvinashcraft @RachelAppel @ddurose @sergeb @jgaylord @kyleNash @SuprotimAgarwal @wpstudios @JeremySkinner @JMBucknall @EduBergantini @GavinOsborn @maartenballiauw @MrTyzik @PrintsCharming @JRGarcia @Raycast @omarq @omarq @ronnycarreras @jglozano @christianaspnet @KathleenOrland @sergeb @donniefitz2 @tommynorman @geekedout @thegeekyouneed @tasid @shuraCL @karlprosser @davepurdon @taurafigueiredo @DouglasAguiar @novogeek @vimpyboy @dmohl @A_Robson @jcoehoorn @ifandelse @schmehi @vitaminjeff @jthomp @ehexter @snahider @ssathya @DeanWeber @navin_l @tobint @rrubin @toncijukic @darthobiwan @_Neville @Raycast @stimms @funcakes @neilcamm @D_Guidi @ivaylovasilev @eddiespooner @jbasilio @tekchic @stevenabanks @JavaScript1x @CoderDennis @kirstinj

Read More »

Increase Your Website Performance by Hosting jQuery with a CDN

In the following screencast I will demonstrate how to speed up your website by using a Content Delivery Network (CDN). Specifically, I will be swamping out a local copy of jQuery with one hosted by Google. You can host a variety of files (example: jQuery, jQuery UI, Prototype, script.aculo.us, MooTools, Dojo, SWFObject, YUI, etc...) with a CDN as well, but the following screencast only shows jQuery being hosted.

First of all, you might be wondering "What is a CDN and why do I need to use one?". If so, you are in luck because Encosia wrote a great blog post concerning this question and here is what he came up with. A CDN provides...

  1. Decreased Latency
  2. Increased Parallelism
  3. Better Caching

For a detailed explanation of the above 3 concept please read his detailed blog post. Now without further ado, here is the screencast.

In the above screencast, I showed how you can replace your local reference of jQuery (see line 4 below) with a version of jQuery that is hosted on a CDN (such as line 5 from Google or line 6 from Microsoft).


Test Page





It is worth to not that even after updating your update to use Google or Microsoft as your CDN, YSlow will still not recognize those files as being hosted on a CDN. YSlow only recognizes itself, Yahoo, as a known CDN. The good news is that you can register other CDNs (such as Google &| Microsoft) deep inside of Firefox's configuration. In order to update this setting you can follow these instructions…

  1. Type in 'about:config' into the Firefox's navigation TextBox
  2. Filter for the 'extensions.yslow.cdnHostnames' Preference Name
  3. Double-Click & enter 'ajax.googleapis.com,ajax.microsoft.com' into the dialog box
  4. Restart Firefox and re-run YSlow
    As I mentioned above, there are many files on CDNs that are available for you to reference in your project. The two CDNs that I highlighted in the above screencast are…
Read More »

Quickly Testing Various jQuery UI Themes on Your Website

The following short screencast shows how you can use the jQuery UI ThemeRoller Firefox Bookmarklet to quickly switch the theme on your webpage in order to compare and tweak out the colors that is just right for your website.

 

Not only do the jQuery UI Plugins support the jQuery UI Themes, but there are several other jQuery Plugins that also utilize the themes as well such as

    If I am missing some others, please leave a comment and I will add it to the above list.
Read More »

Jumpstarting Your Next jQuery Plugin with an Online Tool

The following screencast focuses on how to quickly make a jQuery plugin. The intent is not to dig deep into the ins and outs of a jQuery Plugin’s wiring. If that is what you are looking for there are many other good tutorials out there for that such as…

This screencast’s focus is to build off of your current knowledge of how to build a jQuery Plugin (although it doesn’t have to be too deep), and allow you to quickly focus on the building your plugin, rather than worrying about how all the little pieces are wired together.

The tool we will be using is called Starter: jumptstart Your jQuery Plugins and you just provide the new jQuery Plugin name, optional namespace, parameters, options, etc… and then you are on your way focusing on the guts of your Plugin.

 

Update: This screencast has been posted on Nettuts+ for voting. If you like it, then please consider voting for the 3rd entry on the Nettuts+ blog post…

The plugin that we will be creating is an ImageTextOverlay that will allow you to provide a list of message and overlay them over a message. The message will fade in and out in succession and you will be able to change the properties of each message (such as it’s location, size, color, etc…). I was inspired to write this small plugin after hearing someone on Twitter wanting something similar to this.

Sometimes it is easiest if we look at how we want to use our Plugin before actually creating it. So, here is a simple page that is selecting an image and calling our imageTextOverlay plugin. You can see how there is a default top & left positions provided and then a list of messages. Each message only needs to have a text property provided, but you can also provide many other properties to override the default values.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">










The next step is to starting entering our plugin Class Name and Default Options into the Starter: jumptstart Your jQuery Plugins online tool. Then we just click the Create button to prototype out our plugin! We can either copy/paste the results into our own file or there is even a Download button so you don’t have to copy/paste :)

StarterInput

Now we can focus on writing the core logic of our jQuery plugin and not have to worry about all the nuts and bolts of how a plugin should be structured. So, here is what I put together for the ImageTextOverlay plugin. I will highlight only the lines of code that I actually wrote… everything else was generated by the online tool!

(function($){

$.ImageTextOverlay = function(el, options){
// To avoid scope issues, use 'base' instead of 'this'
// to reference this class from internal events and functions.
var base = this;

// Access to jQuery and DOM versions of element
base.$el = $(el);
base.el = el;

// Add a reverse reference to the DOM object
base.$el.data("ImageTextOverlay", base);

base.init = function(){

base.options = $.extend({},$.ImageTextOverlay.defaultOptions, options);

// Put your initialization code here
base.createAndUpdateImageText(base.$el, base.options);
}

// Sample Function, Uncomment to use
// base.functionName = function(paramaters){
//
// }

base.createAndUpdateImageText = function($ctlImage, options) {
var $ctlText = base.createImageText();
base.updateImageText($ctlImage, $ctlText, options, function() {
base.createAndUpdateImageText($ctlImage, options);
});
}

base.createImageText = function() {
var $imageText = $('#ctlImageText');

if ($imageText.length == 0) {
$('
')
.css({
position: "absolute"
})
.appendTo('body')
.hide();
$imageText = $('#ctlImageText');
}

return $imageText;
}

base.messageIndex = 0;
base.updateImageText = function($ctlImage, $ctlText, options, onComplete) {
var message = options.messages[base.messageIndex++ % options.messages.length];
var messageOptions = $.extend({}, options, message);
$ctlText.html(message.text).css({
fontSize: messageOptions.fontSize
});

$ctlText.css({
top: messageOptions.top,
left: messageOptions.left,
color: messageOptions.color,
letterSpacing: messageOptions.letterSpacing,
backgroundColor: messageOptions.backgroundColor,
}).fadeIn('slow').animate({ opacity: 1.0 }, 3000).fadeOut('slow', function() {
onComplete();
});
}

base.init();
}

$.ImageTextOverlay.defaultOptions = {
fontSize: "24px",
letterSpacing: "normal",
color: "white",
backgroundColor: "transparent"
}

$.fn.imageTextOverlay = function(options){
return this.each(function(){
(new $.ImageTextOverlay(this, options));
});
}

// This function breaks the chain, but returns
// the ImageTextOverlay if it has been attached to the object.
$.fn.getImageTextOverlay = function(){
return this.data("ImageTextOverlay");
}

})(jQuery);

As I mentioned above, I only wrote the lines that are highlighted. The rest of the plugin was written by the Starter: jumptstart Your jQuery Plugins online tool!

If you are interested in other screencasts, I have made several others that you may be interested in as well…

Read More »