chris barr

Photo/Dev/Design

Console2 Integration With Visual Studio 2012

Do you need any kind of command line access for your Visual Studio projects? If so, that built in CMD in Windows works… but it could be a lot better.  In comes Console2 – all hail the power!  Go ahead and download it on SourceForge, although it hasn’t been updated since 2010.  If you’re new to Console2, I highly recommend first using Scott Hanselman’s recommended default setup for it. It looks much better and makes more sense after you do this.

Setting Up Console2

image001At work, we have several command line utilities that we need to run occasionally. Sometimes it’s a cleanup script, sometimes it starts a listening service for other projects we need to run.  After a while it got to be a real pain to always have to manually type in the commands and memorize the long file paths.  We soon found out that Console2 has support for custom tabs!

Here’s a screenshot of how this can look in the end.

 

image002To add these custom tabs, open the Console2 settings, and go to “Tabs”.  Add a new tab for each .bat script you want to run. Now, you just have to fill in two fields minimum like this:

Shell: %comspec% /k C:\path\to\your\folder\FILE.bat
Startup dir: C:\path\to\your\folder\

You can also do some other cool stuff like color code the backgound of each custom tab! That’s it, Console2 now has some helpful customized tabs.

Setting Up Visual Studio

image003Now in Visual Studio, you can add a button to launch Console2 to the current solution directory, sounds good right?

Go to the Tools > External Tools menu and add an entry for Console2. Point the Command to the executable for Console2, and make sure that Initial Directory is set to $(SolutionDir).. to ensure that Visual Studio passes the argument to Console2 for it to initially start in the current solution directory.

Remember the order in which this entry appears! We will need to use this number later. In this case, let’s save it as the first tool, so it’s #1 in the list.

 

image004Now the tool exists, we just have to add a button for it.  Find a toolbar you want to add the button to, click the flyout menu and and select customize…

 

image005In the next window, press Add Command and then select the Tools category.  Depending on the order of the external tool we made earlier, select that external tool.  In this case it was the first item in the external tools list, so I will select the first external command.

 

image006Now it will appear in your toolbar as “External Tool 1” which you will probably want to rename to something that makes more sense.

Now when you click your newly added button, Console2 will be launched and it will automatically start at your current solution directory! Pretty handy.

Mix ’09 Session Videos

I just got back from the Mix ’09 conference in Las Vegas, and it was so much better than I expected! For being a Microsoft sponsored conference mostly focusing on .NET and other MS technologies, there was about 50% Mac users there and most of these people were designers. It was a really nice mix (haha?) of designers and developers. I’ve got some photos from my trip up here on Flickr.

I think one of the best things they do is put up ALL the session videos online for free! There’s some really valuable information in these!
http://videos.visitmix.com/MIX09 (also you can view past years MIX sessions at http://videos.visitmix.com )

Here’s some highlights I’m going to recommend:

  • Web Form Design – absolutely one of the best sessions I attended. Watch this video! He talks about why forms suck and what we as designers can do to help the process along. Very very well done and extremely informative. As soon as this session was over I went and bought the speakers book.
  • The Way of the Whiteboard: Persuading with Pictures – Anotehr great session, but not necessarily directly related to web design. It’s on how to get ideas out of your head and communicate them properly to people via a whiteboard of napkin.
  • Measuring Social Media Marketing – If you or your company does any kind of social media marketing, this is a great one.

The following sessions I did not attend, but they seem great:

And finally, for any other ASP.NET or Visual Studio users, These are somre great previews of what’s coming soon!

Finding Unused CSS Rules

The other day I ran across a very useful article about the $$ selector in Firebug for Javascript and how to use it to loop through your stylesheets to find unused CSS styles. Very cool. The original code snippet would output everything to the firebug console, which I found to be useless on larger sites because I would hit Firebug’s limit too often.

I modified it a bit to output the CSS to the actual site instead inside a styled element. So to use this on your own site, just copy and paste the code below into Firebug’s console and hit run.

//Create a styled place to output styles to
var output = document.createElement('pre');
output.setAttribute("id","unusedCSSstyles");
output.setAttribute("style","height:95%; overflow:auto; text-align:left; background:#000000; border:2px outset #00CC33; color:#00CC33; opacity:0.9; padding:3px; position:fixed !important; left:5px; top:20px; width:95%; z-index:9998; font-size:12px;");

//create a styled close button
var closeBtn = document.createElement('a');
closeBtn.setAttribute("id","cssCloseBtn");
closeBtn.setAttribute("href","#");
closeBtn.setAttribute("onclick","document.body.removeChild(document.getElementById('unusedCSSstyles')); document.body.removeChild(document.getElementById('cssCloseBtn')); return false;");
closeBtn.setAttribute("style","position:fixed !important; left:2; top:0; z-index:9999; color:red; font-size:16px; padding:3px 20px; background-color:#000000; border:1px solid #FFF;");
closeBtn.innerHTML="close";

//add button and output element to body
document.body.appendChild(closeBtn);
document.body.appendChild(output);

//Find each stylesheet
for(var i = 0; i < document.styleSheets.length; i++) {
//write the filename to output element
output.innerHTML+="<br /><h3>"+document.styleSheets[i].href+"</h3>";
//find CSS rules
  for (var j = 0; j < document.styleSheets[i].cssRules.length; j++) {
    s = document.styleSheets[i].cssRules[j].selectorText;
    //write unused CSS rules to output element
    if ($$(s).length === 0) output.innerHTML+="<strong>["+j+"]</strong> "+s+"<br />";
  }
}

Do note that this has a few limitations:

  • It cannot find stylesheets from another domain or subdomains
  • It cannot find inline styles or the <style> tags anywhere
  • It will not work on sites that use Mootools since it also uses the $$ selector. (this site does, so don’t try it here!)

If you’re really serious about finding what CSS styles you haven’t used on your site, you might want to check out a Firefox plugin called Dust Me Selectors

Restoring from a Time Machine Backup

laptop-osx-disc
It’s usually a good idea to wipe off your hard drive and start fresh once every year or so, regardless of what OS you run. In the past it’s been a thing I’ve dreaded mostly due to the huge time commitment involved. My process before was to:

  1. Make sure all important files were backed up (1 hour minimum)
  2. Wipe the hard drive and re-install OS X (1-2 hours)
  3. Reboot and install OS updates (~30 minutes)
  4. Copy all the backed up file back onto the machine (~1 hour)
  5. Install all software needed from installation disks and the web (3-4 hours No thanks to Creative Suite…)

Needless to say, that’s pretty much an all day event. It involved so many steps that were spaced out just enough so that you couldn’t really leave and get anything done. It can also cause a lot of mental stress because you’re always worried with “Did I remember to back up my _____???” In the end, it was worth it though, I got rid of all kinds of junk that had built up and I ended up with a faster machine that’s no longer bogged down.

Enter Time Machine. I began to use this last year and haven’t looked back yet. For those that don’t yet know, Time Machine is Apple’s brilliant and easy backup solutions. You just designate another hard drive for backups, and once an hour it makes a copy of all the files that have changed. Because of this I have pretty much everything I’ve worked on since the beginning of 2008 – and multiples copies of it.

For those curious, I choose to trust my data with a Drobo, which is like RAID for dummies. I’ve got two redundant 1 Terabyte drives – I feel my data is safe.

One of the best new features in OS X was the ability to use that Time Machine backup as a way to restore your computer to a previous state. This is perfect for you if your hard drive crashes, or even if you’re having problems. My initial thought was that if I was having problems, wouldn’t restoring from Time Machine just restore the problems as well? In short, no. Time Machine only backs up your user data, no system files are backed up and noting that can be re-generated will be backed up (things like caches and your spotlight index).

Recently my Macbook Pro was feeling pretty sluggish. Videos didn’t play smoothly, applications took forever to load, and importing and browsing through my photos in iPhoto was painfully slow. It was time for a clean start. Lucky for me, Time Machine removes the majority of the steps I listed above. Basically all that needs to be done now is:

  1. Wipe the drive, install OS X
  2. Restore from Time Machine
  3. Install OS updates

Now this isn’t a quick process, but it’s no longer a thought intensive, worrisome, all day process. So if you’re in a similar situation to mine and you’re already using Time Machine, lets get started! Follow the jump to read more.

time-machine-1 First, you obviously need to make sure you’re using Time Machine. I’ll assume you know how to do this already, but go ahead and make one last backup just to be sure you have the most recent version of all your files. Next, insert your OSX install disk, open the installer, type in your password and your computer should restart and boot from the CD. Go ahead and unplug your Time Machine drive for now, just to be safe.

time-machine-2

Select your language, and then before continuing, go up to the Utilities menu and select Disk Utility. In the Disk Utility, select your hard disk on the left (not the hard drive, the actual disk). On the right, click the Erase tab. You could just click the Erase button right here, but when I erase a hard drive I want to be sure I’m actually erasing the data and not just the index. Your choice, but I’d recommend this next step for thoroughness.

time-machine-3Click the Security Options… button, and a pane will slide down with some secure erase options. Select Zero Out Data. If you’re really paranoid, or work for the DOD, select one of the other options. Hit OK, and now ask yourself if you have really got everything you need off the hard drive, there’s no going back after this. Take a deep breath and press Erase.

This part may take a while since it literally goes over your entire hard drive and writes Zeros on every sector. I’ve got a 160GB drive in my Macbook Pro and it took about an hour or two.

time-machine-4Now is a good time to go run some errands, get some lunch, or do the laundry. Once this is done, close out the Disk Utility and continue with the standard OS X installation. I highly recommend a custom installation, be sure to not install languages you don’t speak, and printer drivers for printers you don’t own and will never own. Now is a great time to get to that ironing you’ve been meaning to do.

time-machine-5
After OS X finishes installing you will be presented with the migration assistant. Plug in your Time Machine drive, and select to transfer your data from the Time Machine drive. Select which drive to transfer from, and then select what dat you want transferred. Usually you’d want to restore all your data, so I’d say just go with that. This part may take a while to calculate how much will be restored, so just wait a few minutes and then continue when it lets you.

time-machine-6If you haven’t caught on on LOST, now is a great time. I had about a years worth of backups, and it took around 2 hours to restore completely, just enough time to re-watch that season 5 premiere! Once that finishes, just enter in your information and that should do it. You now have a fresh install of OS X, but will all your data just as before!

First things first though, head up to the apple menu and select Software Update to make sure you’ve got all the latest updates. Install them, restart, and check again. Some updates require others first, so you may get a new set of things to update after the first round of updates. That’s it, you’re done!

time-machine-7
Something to keep in mind though is that Time Machine does not back up anything that your Mac can re-build itself. This includes things like your Spotlight index, caches, and your Mail index. The first time you open Mail, you will probably see something like the image below. No big deal, but it’s just something to be aware of. The same thing goes for opening programs for the first time, it’s going to ask you if you’re sure you want to do that since it’s the “first” time it’s been opened on this fresh system.

Hope that was helpful to someone. I tried this process without knowing for sure how it would work, and it turned out to be exactly how I imagined it would be – easy.

(EDIT 1/31/09) – After doing this restore and using my computer for a few days I noticed that Time Machine was no longer doing regular backups! Turns out that for some reason Time Machine is set to Off be default after an install of OS X. Be sure to go into the preferences and turn this back on to continue backing up your data!