Install Latest Version of Rails

1

sudo gem install rails

Install Specific Version of Rails

1

sudo gem install rails --version 3.0

Update Rails

1

sudo gem update rails

Rolling Back to Previous Version of Rails

1

sudo gem uninstall rails

You’ll then see something like this:

1
2
3
4
5
6
7

Select gem to uninstall:
 1. rails-3.0.0
 2. rails-3.0.5
 3. rails-3.0.11
 4. rails-3.1.1
 5. rails-3.2.1
 6. All versions

Type the number of the version you’d like to uninstall and hit enter, and away it goes.

RVM

If you need specific ruby/rails environments for various projects, then you should be using RVM and named gem sets.

1. January brought a new driveway for our house, which meant our longtime construction project was soon coming to a close.

2. We were also able to retrieve and scan all my wife’s medical files from Ohio for her original brain injury 13 years ago. This proved very helpful as the records showed the doctors then found the same brain abnormality our current doctors just found. Proof surgery was the right track.

3. February Laura and I started following the Paleo diet in hopes to clean our her system from all the ineffective anti-seizure drugs she’s been taking for the past few years. Surprisingly, this also decreased her seizures by 75%! Normally she would have a cluster of seizures every month, without fail. On the diet, clusters came every 2 to 4 months.

4. March launched ChefDave.org’s site membership using the Membrr / OpenGateway and Solspace’s User plugins. This is also the time when my love of ExpressionEngine started falling apart due to various issues.

5. Also in March I bought a road bike after I sheared off my pedal arm on my Raleigh hybrid. Though time in 2011 been scarce, I hope to get back into cycling soon.

6. April saw the final piece of COJ.net go live. This wrapped up a year-long conversion and redesign project of the 30,000 page site.

7. In May we finally finished the outside construction on our house, completing the addition of my wife’s workshop and my (albeit unplanned) office. This major project included demolishing the existing one car garage and replacing it with a 30x30 garage with AC, 220v and 3 phase power. It’s the dream workshop of almost any woodworker. Now we start the inside of the house and shop.

8. In June my garden was in full swing. The bell peppers and cucumbers were great producers, and my watermelon plants were full of blooms. I planted 11 watermelon plants total which meant about 66 square-feet of vines—but no watermelons actually came to fruition. I will try again, though, with only one or two plants this time.

9. June was also the last month my wife had any seizures. From July to November was the longest stretch of no meds and no seizures. All from dieting alone. This was great, but also added additional stress without knowing when a cluster of seizures could strike.

10. I converted rwbaker.com to WordPress using the Briefed WooTheme.

11. At the end of August Jacksonville Mayor’s new blog went live. It was a very rushed and fast-paced project and I even learned a few things.

12. September I rewrote the API for ChefDave.org, making it more flexible and removing a big bottleneck when requesting a lot of data. This also lays the groundwork for larger system-wide changes down the road.

13. In October my mother-in-law finished her battle with breast cancer.

14. November Laura had a right temporal lobectomy to hopefully put an end to her partial complex seizures. Every seizure wipes Laura’s long and short term memory—she doesn’t know who I am, doesn’t recognize our house, etc. Surgery took exactly 3 hours, and they were even able to reuse the incision from her first craniotomy. She was awake within one hour, and walking around in five. Two months post-op and no seizures so far.

15. I converted rwbaker.com to Octopress/Jekyll after my WordPress install was hacked and made a mess of my server. I love the static platform though, and it’s a great way to get started in Ruby and SASS.

16. For December, Christmas was in Ohio this year, which gave us a great opportunity to take up the truck and fill it full of lumber for Laura’s new shop. The holidays, quality family time, and October fresh in our minds gave us time to reflect on the year and where we are in life.

17. December marks 6 months my wife has continuously known me, the longest stretch in our 10 years together.

Hopefully 2012 will bring a lot of changes for Laura and I. Some big, some fun, and perhaps even a scary one or two. On the personal side of things, I want to branch out more with Node.js, Ruby on Rails and iOS development, and maybe even start a new side project.

GoDaddy sells domains for cheap, and in return, I look past their horrible control panel, cheap advertising campaigns, and ridiculous animal abuse. No more; I’ve finally moved my 16 domains to Namecheap. I suggest you do the same and move your domains a responsible company like Namecheap or Dreamhost (both affiliate links).

And to read more about SOPA, Jeffery Zeldman has written a great piece on SOPA and what it could mean for our industry.

can you figure out whether you’re working with an array or arguments list without the use of 3rd party code?

I was intrigued, because I didn’t know the answer.

Two ways (of many, I’m sure) to determine the type of JavaScript Object you’re working with is by using instaceof or Object.prototype.toString

instaceof

Instaceof will give you a boolean response. It’s useful to determine if you’re working with a specific kind of object.

1
2
3
4
5
6
7

function bob(one, two, three) {
  var x = arguments;
  var y = [];
  
  console.log ( x instanceof Array ); //false
  console.log ( y instanceof Array ); //true
};

Instanceof evaluates to true if the object inherits from the class’s prototype:

1
2

var p = new Person("Richard");
p instanceof Person //true

This evaluates to true since p inherits from Person.prototype. It’s worth noting that using the new keyword is imperative.

Arguments is not a valid instanceof object, so we can only use this to tell if we’re dealing with an Array or something else.

Object.prototype.toString

Calling this returns the type of object

1
2
3
4
5
6
7

function bob(one, two, three) {
  var x = arguments;
  var y = [];
  
  console.log( Object.prototype.toString.call( x ) ); //[object Arguments]
  console.log( Object.prototype.toString.call( y ) ); //[object Array]
};

You could then use indexOf or search to check for ‘Arguments’ or ‘Array’.

Without a doubt, there are other ways to do this in JavaScript. That’s what makes it fun—you’re never done learning.

History

This site has gone through a number of changes. Static files > Dreamweaver templates > Textpattern > Static > ExpressionEngine > Static > WordPress. In all that time, I never found a publishing system I cared for. Then, I found Jekyll.

Jekyll is a rails application that allows you to maintain your site in individual HTML or Markdown files and generates a static site. Mix that with Octopress and you have a find publishing system. One that fits quite well for me.

Changes

Soon I’ll be moving all my links over to Pinboard. They were once on Delicious, then Yahoo! goofed things up, so I tried posting links to this site. Though, it just didn’t fit. I’m not sure if I’ll move the Delicious links over, or just start fresh. Perhaps I’ll move just a few…

This site will now be mostly long-format posts and code snippets. Hopefully I keep that going.

The Standard Form Submit

Here is the basic form we’re working with:

1
2
3
4
5
6
7
8
9
10
11

<html><body>
<form name="submit_with_button" action="success.html">
  <fieldset>
      <legend>Submit form with button</legend>
      <label for="email">Email Address</label>
      <input type="text" id="email" name="email" />
      <input type="submit" value="Submit" />
      <p>Standard method with a submit button</p>
  </fieldset>
</form>
</body></html>

Submit with a JavaScript Function

In this example we call a JavaScript function from the link, and that function submits the form. This method is fine, but it’s generally bad form to put JavaScript functions in a link’s href.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<html><body>
<form name="submit_with_js" action="success.html">
  <fieldset>
      <legend>Submit form with JavaScript</legend>
      <label for="email">Email Address</label>
      <input type="text" id="email" name="email_js" />
      <a id="submit_js" href="javascript: submitform()">Submit</a>
  </fieldset>
  <script>
      function submitform() {
          document.submit_with_js.submit();
      };
  </script>
</form>
</body></html>

Submit with jQuery

This method still depends on the action tag, but just triggers the submit() function. Use return false to stop the link being executed.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<html><body>
<form name="submit_with_jquery" action="success.html">
  <fieldset>
      <legend>Submit form with jQuery</legend>
      <label for="email">Email Address</label>
      <input type="text" id="email" name="email_jquery" />
      <a id="submit_jquery" href="#">Submit</a>
  </fieldset>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
      $('#submit_jquery').click(function(){
          $('form[name="submit_with_jquery"]').submit();
          return false;
      });
  </script>
</form>
</body></html>

Submit with jQuery AJAX

Using the jQuery post function here (a subset of $.ajax()), we submit the form asynchronously and return back any resulting data. In this example I’m returning back the success message in an alert. I’m also using javascript:void(0) in the submit link href rather than a #. This way, even if the link is executed, the URL isn’t modified and the page doesn’t jump.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

<html><body>
<form name="submit_with_jquery_ajax" action="success.html">
  <fieldset>
      <legend>Submit form with jQuery AJAX</legend>
      <label for="email">Email Address</label>
      <input type="text" id="email" name="email_ajax" />
      <a id="submit_ajax" href="javascript:void(0)">Submit</a>
  </fieldset>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
      $('#submit_ajax').click(function(){
          //Grab action from the form if it's there
          if ( $('form[name="submit_with_jquery_ajax"]').attr('action') ) {
              myAction = $('form[name="submit_with_jquery_ajax"]').attr('action');
          } else {
              myAction = 'success.html';
          };
          $.post(myAction, function(data) {
              alert(data);
          });
          return false;
      });
  </script>
</form>
</body></html>

You can download all these examples from Github

This calendar theme is an imageless version of the jQuery UI Redmond calendar and uses the basic CSS documentation from the toolkit documentation.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93

/* Ajax Control Toolkit Calendar */

/*    The outer rectangular container that supplies the border around the calendar element. 
  Child Css classes: .ajax__calendar_header,.ajax__calendar_body,.ajax__calendar_footer. */
.ajax__calendar_container     {background-color:#fff; border:solid 1px #a6c9e2 !important;}

  /*  A container element that holds the next and previous arrows and the title of the current view. 
      Child Css classes: .ajax__calendar_prev, .ajax__calendar_title, .ajax__calendar_next. */
  .ajax__calendar_header      {background-color:#87b6d9; margin-bottom:5px;}

      /*  An element that displays the arrow to view the previous set of data in the view(previous month/year/decade).
          Child Css classes: none. */
      .ajax__calendar_prev    {}

      /*  An element that displays the title of the current view (month name, year, decade). 
          Child Css classes: none. */
      .ajax__calendar_title   {height:20px; color:#fff; line-height:1.7em;}
      .ajax__calendar_hover .ajax__calendar_title {color:#eee !important;}

      /*  An element that displays the arrow to view the previous set of data in the view (previous month/year/decade). 
          Child Css classes: none. */
      .ajax__calendar_next    {}
      
      .ajax__calendar_prev,.ajax__calendar_next
                              {background-color:#dce6f4; height:20px !important; color:#fff !important;}

  /*  A container element that holds the days, months, and years panes. Also provides a fixed rectangle with hidden overflow that is used for transitioning between views (next/previous month, or days/months/years).
      Child Css class: .ajax__calendar_days, .ajax__calendar_months, .ajax__calendar_years. */
  .ajax__calendar_body        {}

      /*  A container element that holds the layout for the days in a month. 
          Child Css classes: .ajax__calendar_dayname, .ajax__calendar_day */
      .ajax__calendar_days    {}
      .ajax__calendar_days table thead tr td
                              {background-color:#fff; color:#000; font-weight:bold;}
      

          /*  An element that displays the short name of the day of the week. 
              Child Css classes: none. */
          .ajax__calendar_dayname
                              {border:0 !important;}

          /*  An element that displays the day of the month. 
              Child Css classes: none */
          .ajax__calendar_day {border:1px solid #c5dbec !important; background:#eaf4fd; margin:1px !important; height:15px !important; width:16px !important;}

      /*  A container element that holds the layout for the months in a year. 
          Child Css classes: .ajax__calendar_month. */
      .ajax__calendar_months  {}

          /*  An element that displays the month of the year. 
              Child Css classes: none */
          .ajax__calendar_month
                              {}
                              
          .ajax__calendar_month, .ajax__calendar_day {color:#2e6e9e; font-weight:bold; }

      /*  A container element that holds the layout for the years in a decade. 
          Child Css classes: .ajax__calendar_year. */
      .ajax__calendar_years   {}

          /*  An element that displays the year in a decade. 
              Child Css classes: none */
          .ajax__calendar_year{}

/*  A container element that holds the current date. 
  Child Css classes: .ajax__calendar_today. */
.ajax__calendar_footer            {border-top:1px solid #c5dbec !important; line-height:1.2em;}

  /*  An element that displays the current date. 
      Child Css classes: none. */
  .ajax__calendar_today       {border:1px solid #c5dbec; background-color:#e1effb;}

/*    This is applied to an element in the DOM above a day, month or year and is used to apply CSS attributes that show a hover state. 
  Child Css classes: .ajax__calendar_day, .ajax__calendar_month, .ajax__calendar_year */
.ajax__calendar_hover         {}
td.ajax__calendar_hover div       {background:#d2e6f5 !important; border:1px solid #79b7e7 !important;}

/*    This is applied to an element in the DOM above a day, month or year and is used to apply CSS attributes that show the currently selected value. 
  Child Css classes: .ajax__calendar_day, .ajax__calendar_month, .ajax__calendar_year. */
.ajax__calendar_active            {}
td.ajax__calendar_active div  {background:#fbec88 !important; border:1px solid #fad42e !important;}


/*    This is applied to an element in the DOM above a day or year that is outside of the current view (day not in the visible month, year not in the visible decade). 
  Child Css classes: .ajax__calendar_day, .ajax__calendar_year. */
.ajax__calendar_other         {}

.ajax__calendar_other .ajax__calendar_day
                              {font-weight:normal !important; color:#bbb !important; border:1px solid #eee !important;}

.ajax__calendar_hover.ajax__calendar_other .ajax__calendar_day
                              {background:#efefef !important; color:#aaa !important; border:1px solid #ddd !important;}

In the existing website, users can upload images of any-size and aspect-ratio, and then we resize the image in the Transformation. Our pager thumbnails need to be square; a string of mixed-size images doesn’t look quite right. But unfortunately Kentico doesn’t provide a way to crop images on the fly. Luckily, CSS can help.

Carousel HTML Wrapper

Here is the basic carousel wrapper with a blank UL pager to get things started:

1
2
3
4
5
6
7

<div class="grid_content featured carousel-wrapper">
     <div class="carousel">
          <!-- content repeater generating our slides. Uses the transformation below -->
     </div>
     <ul id="pager" class="plain"></ul>
     <div class="clear"></div>
</div>

CSS

Our pager is an unordered list with a link and a span. The link has the pagination action attached so it. The span has a fixed size of 50x50—this is desired size of our thumbnails. The thumbnail image is set as the background of the span, centered, then the span will crop off the rest of the image. We now have square thumbnails.

1
2
3
4
5
6

.carousel~#pager li                 {float:left !important; margin:0 20px 0 0; overflow:hidden; }
.carousel~#pager a                  {padding:3px; border:1px solid #ccc;}
.carousel~#pager a .thumbnail       {background-position:50% 50%; background-repeat:no-repeat;}
.carousel~#pager a,
.carousel~#pager a .thumbnail       {width:50px; height:50px; display:block;}
.carousel~#pager li.activeSlide a  {background:#fff;}

Kentico Transformations

The thumbnail() function is responsible for creating our ‘cropped’ thumbnail for the carousel pager. This is actually really simple—just grab the image use a maxSideSide of 50. The CSS above takes care of the ‘cropping’.

We’re using the BlogPostTeaser image object for testing, even though we only need the image URL. It turns out Kentico’s IfEmpty() function isn’t all that reliable, and often <%# IfEmpty ("BlogPostTeaser", "", GetFileURL("BlogPostTeaser")) %> will result in /getattachment/00000000-0000-0000-0000-000000000000/Post-Title.aspx (the URL of a non-existent image).

Kentico’s CMSAbstractTransformation.Eval() function returns an object, while CMSAbstractTransformation.GetFileURL() returns a string. Our function parameters must be declared accordingly and converted for comparison.

The carousel JavaScript generates the pagination HTML, so we’re just storing the thumbnail path in the summary so our JavaScript and pick it up when needed.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

<script runat="server">
    public static string videoTest(object BlogPostTeaser, string BlogPostTeaserURL, object BlogPostTeaserAltText, object BlogPostVideo)
    {
      ...
    }

    public static string thumbnail(object BlogPostTeaser, string BlogPostTeaserURL)
    {
        //Check the image object to see if it's an actual image or not. 
        //If no image, default to the 'standard' thumb.
        string teaser = Convert.ToString(BlogPostTeaser);
        if (teaser != "")
        {
            return BlogPostTeaserURL + "?height=50";

        }
        else
        {
            return "/App_Themes/coj/images/coj-thumb.png";
        }
    }
</script>

<div class="carouselTransformation">
    <%# videoTest(Eval("BlogPostTeaser"), GetFileUrl("BlogPostTeaser"), Eval("BlogPostVideo"), Eval("BlogPostVideo"))%>
    <div class="title">
        <a href="<%# GetDocumentUrl() %>">
            <%#Eval("BlogPostTitle")%>
        </a>
    </div>
    <div class="date">
        <%#GetDateTime("BlogPostDate", "MMMM dd, yyyy")%>
    </div>
    <div class="summary" thumbnail="<%# thumbnail(Eval("BlogPostTeaser"), GetFileUrl("BlogPostTeaser")) %>">
        <%# LimitLength(Eval("BlogPostSummary"),350,"...") %>
    </div>
</div>

Javascript

The carousel is built on the Cycle jQuery plugin. The pagination is generated by a callback function in the carousel function. In this function we grab the thumbnail URL and generate the pager LI and set the thumbnail as the background of the span. Our CSS above takes care of the rest.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

$(document).ready(function() {

    jQuery.dom = jQuery(document);

    var $carousel = jQuery.dom.find('.carousel');
    if ($carousel.length) {

          $carousel.cycle({
            fx: 'fade',
            speed: 300,
            timeout: 10000,
            pager: '#pager',
            pause: 1,
            cleartypeNoBg: true,

            // A callback function that creates a thumbnail to use as pager anchor
            pagerAnchorBuilder: function(idx, slide) {

              /*     Find your image inside the individual slide.
                 In this case, I generate a scaled image on the server and store the path in an attribute */
              var slideImg = jQuery(slide).children(".summary").attr('thumbnail');
      
              /*  If there is no image associated with the story, use a standard thumbnail
                 This is also handled in our Kentico Transformation, so this is only a backup */
              if (slideImg == undefined) {
                  slideImg = "/App_Themes/site/images/thumb.png";
              };

                /*   Our thumbnails are 50x50, but our image might not be square.
                 Setting the image as the background lets the element crop the image */
                return '<li><a href="#"><span class="thumbnail" style="background-image:url('+ slideImg +');"></span></a></li>';
            }
        });
     });
});

UPDATE The project is now live, so you can take a look at the thumbnails in action: Jacksonville’s Mayor’s new blog

Table taken from Douglas Crockford’s JavaScript: The Good Parts

Undefined

Undefined is the absence of a value, not an empty value.

JavaScript has two sets of equality operators: === and !==, and their evil twins == and !=. The good ones work the way you would expect. If the two operands are of the same type and have the same value, then === produces true and !== produces false. The evil twins do the right thing when the operands are of the same type, but if they are of different types, they attempt to coerce the values. The rules by which they do that are complicated and unmemorable.

Double Equals (==)

Double equals (==) will try to convert the 2nd half to the same type as the first half of the expression.

string == number will result in a comparison to string == string after the conversion.

Triple Equals (===)

Triple equals === is just a straight comparison, regardless of type.

Using === is not any quicker if the types are the same. If types are not the same, === will be quicker because it won’t try to do the conversion.

Jekyll (Github) is a Ruby project for generating and maintaining a static site or blog.

Octopress gives you templates and some fancy plugins that make the engine quite a bit more friendlier.  Now all of a sudden, a static blog is looking very doable.

1
2
3
4

#nav li a
{background:url(images/nav-sub-div.png) 0 0 repeat-x;}
#nav li:first-child a
{background-image:transparent;}

However, using the Adjacent Siblings Selector, you can streamline it:

1
2

#nav li + li a
{background:url(images/nav-sub-div.png) 0 0 repeat-x;}

The + selector applies the style to any LI that immediately follows an LI, which obviously rules out the first item. A simple solution, often overlooked.

Compatibility

What follows is a list of all the articles within the web standards curriculum, which will give you an essential grounding in HTML5, CSS, JavaScript, accessibility, and the other topics you need to be a modern web developer/designer. Reading them in order makes the most sense, but they are written to work individually, so you can dip in and out as it suits you, if you need to hone individual skills. Web Standards Curriculum

I’ve used sprites for a while now, though generally, they’re a pain to setup — especially the CSS positioning. Finally I wised up and figured out a perfect way to align the icons to easily reuse the same CSS positioning on all projects.

In Photoshop, create a new document with the dimentions of 16x2050. This is my standard sprite image size, though often it gets cropped when I’m finished.

The maximum size for decoded GIF, PNG, and TIFF images is 3 megapixels for devices with less than 256 MB RAM and 5 megapixels for devices with greater or equal than 256 MB RAM.

That is, ensure that width * height ≤ 3 * 1024 * 1024 for devices with less than 256 MB RAM. Note that the decoded size is far larger than the encoded size of an image.

iOS Developer Documentation

Adjust your document’s grid in Edit > Preferences > Guides, Grid & Slices. Set your Gridline to 50 pixels with 1 subdivision. This setup makes it easy to space our images in 50px increments, making our CSS much easier.

Pull all your icons in the document and align them by snapping the top of each icon to each grid line. Be sure to leave the top grid block blank — this is in case the background isn’t properly positioned for some reason, you won’t have a screen full of links with the same exact icon.

Your images might need to drop down a pixel or two for perfect alignment.  For me, I set the first icon at 52px. Now look how easy our CSS is to write:

1
2
3
4
5
6
7
8
9
10
11
12
13

.icon                  {background:url(images/icons.png) 0 0 no-repeat; padding-left:20px;}
a.icon                 {font-size:14px; line-height:16px;}
.icon.errorx           {background-position:0px -50px;}
.icon.alert            {background-position:0px -100px;}
.icon.delete           {background-position:0px -150px;}
.icon.info             {background-position:0px -200px;}
.icon.help             {background-position:0px -250px;}
...
.icon.customer         {background-position:0px -1850px;}
.icon.sort-active      {background-position:0px -1900px;}
.icon.sort             {background-position:0px -1950px;}
.icon.sort-up          {background-position:0px -2000px;}
.icon.sort-down        {background-position:0px -2050px;}

This setup also gives you some wiggle room about each icon, so in many cases you can forgo the 16x16 span and just use the sprite as a background of the actual element.

I built the template so the customer only needed to give me two pieces of information: Video URL (not embed code) and Video Start Time (in seconds, if not 0:00).

The link URL and the Embed URL aren’t quite the same, but they’re pretty close. Look at the difference:

Link URL: http://www.youtube.com/watch?v=HaQvBbzslJE Embed URL: http://www.youtube.com/v/HaQvBbzslJE&hl=en_US&fs=1&

Using the plugin Low Replace, we can parse through the Link URL to change watch?v= to v/. If there is a start time, then you can append it on the URL with start=####. Remember, the start time must be in seconds when embedding a video.

Below is the ExpressionEngine template code:

1
2
3

{if blog_video}
<object width="630" height="379" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="{exp:low_replace find=" /><param name="v" value="" /><param name="blog_video" value="" /><param name="exp:low_replace" value="" /><param name="038" value="" /><param name="hl" value="en_US&amp;fs=1&amp;{if" /><param name="blog_video_starttime" value="" /><param name="start" value="{blog_video_starttime}{/if}&quot;" /><param name="allowfullscreen" value="true" /><embed width="630" height="379" type="application/x-shockwave-flash" src="{exp:low_replace find=" allowFullScreen="true" allowscriptaccess="always" v="" blog_video="" exp:low_replace="" 038="" hl="en_US&amp;fs=1&amp;{if" blog_video_starttime="" start="{blog_video_starttime}{/if}&quot;" allowfullscreen="true" /></object>
{/if}

Yay for happy customers.

I just ran across a few posts on JavaScript interview questions; these are a good reminder of key parts of JS to pay attention to:

• Nathan Smith - JavaScript Interview Questions
• James Padolsey - JavaScript Interview Questions
• Stack Overflow - Advanced JavaScript Interview Questions
• Vikas’ Commonly Asked JavaScript Interview Questions

Stoyan’s work-in-progress book is available to read at Book of Speed. If you have anything to add or even edits, you can fork the project on Github and submit a pull request with your changes.

Note: Take a look at the Github project just to see how it’s structured. Chapter text is in the /src folder with a build script to generate the TOC. This could be made into a very nice book starter project for anyone.

They’ve published 35 email templates open-sourced on Github

Be sure to check out their entire resources section. Great stuff in there.

Below is a quick fix to stop that pesky box from coming up. Just set this as your user stylesheet in your favorite browser.

1
2

#fancybox-tmp, #fancybox-loading, #fancybox-overlay, #fancybox-wrap
{display:none !important;}