# Monthly Archives: July 2012

## Javascript Slides over Build Automation

JavaScript + Jenkins = Winning!

View more presentations from
Eric Wendelin

### Larry Battle

I love to program, and discover new tech. Check out my stackoverflow and github accounts.

## How to convert a repeating decimal to a fraction

Here are 4 simple steps to convert a repeating decimal to a fraction.

Step 1: Check to see if the number has a repeating decimal. Stop if it doesn’t and do normal conversion.

Step 2: Split the decimal into 3 parts; i, x, r. Such that the decimal equals `i.x(r)*`.

Step 3: Create a fraction in the form `a/b`.
a = ((ixr as int) – (ix as int))
b = ((10^x.length)*(10^r.length – 1))

Step 4: (optional) Reduce the fraction by dividing by the greatest common denominator.

Example:
4/3 = 1.333… which sets i = “1”, x = “”, r = “3”.
a = (13 – 1) = 12, b = ((10^0)*(10^1 – 1)) = 9
a/b = 12 / 9 = 4/3

Ratio.js does this for you when the `reduce` function is called.

Example using Ratio.js:

``` ```Ratio.parse( "1/3" ).reduce().toString() === "1/3"; Ratio.parse( 4/3 ).reduce().toString() === "4/3"; Ratio.parse( 0.123451234512345 ).reduce().toString() === "4115/33333"; Ratio.parse( 0.987987989798979897 ).reduce().toString() === "978108109901/990000000000";``` ```

## DEMO

### Larry Battle

I love to program, and discover new tech. Check out my stackoverflow and github accounts.

# doT.js Tutorial: Part 1 of 2

## What’s dot.js?

It’s one of the fastest and concise javascript template engine for nodejs and web browsers, created by Laura Doktorova, the President & Co-Founder of Bebedo Inc.
Check out dot.js on Github.com.
dot.js works on both the client and server side. But for this tutorial, we’re only going to be focusing on the client-side.

## Why use a template engine?

There are many reasons to use a template engine rather than printing your code in a given language. I think overall, the main reasons for this are code consistency and organization. If you have a good separation of your markup from your logic it becomes easier to debug your code, to share your code with collaborators, and allows for more rapid development by streamlining common methods for outputting your markup.

## How to import doT.js

Just include “doT.js” using the script tag. Once included, “doT” will be added to the global namespace.

``` `<script src="https://raw.github.com/olado/doT/master/doT.js"></script>` ```

## Steps for using doT.js

1. Create an object literal to store your data. A JSON format is preferred.
``` `var data = { name: "David" };` ```

2. Create a template that creates the overall structure and tells where your data will be placed.
``` `var template = "Hey <b>{{=it.name}}</b>, you own me money.";` ```

3. Generate a template function from the template using doT.template().
``` `var templateFunction = doT.template( template );` ```

4. Generate HTML by providing data to the template function.
``` `var html = templateFunction( data );` ```

Full source:

``` ```var data = { name: "David" }; // step 1 var template = "Hey <b>{{=it.name}}</b>, you own me money."; // step 2 var templateFunction = doT.template( template ); // step 3 var html = templateFunction( data ); // step 4   // result html == "Hey &lt;b>David&lt;/b>, you own me money.";``` ```

Let’s now examine the function doT.template().

``` `doT.template(template, settings, userDefinedDef);` ```

## Forming a template

The content of a template will remain the same, except for the sections that contain javascript encapulated sections (JES). JES look like this. `"{{ }}"`.
Note that the data passed to the template function can be reference by the template using the namespace ‘it’.

Example:

``` ```// input var data = { thatThingOverThere: "Bartman" }; var template = "Hey, look over there! It's {{=it.thatThingOverThere}}!"; var tempFunc = doT.template(template); var html = tempFunc(data);   // output html == "Hey, look over there! It's Bartman!";``` ```

To better understand what’s going on, let’s look at the generated source for the tempFunc.

``` ```// source for tempFunc function anonymous(it) { var out = 'Hey, look over there! It\'s '+(it.thatThingOverThere)+'!'; return out; }``` ```

## Type of JES

There two basic type of JES.
Type 1 requires a returned value.

``` `var template = "{{=it.value}}";` ```

Type 2 allows for javascript statements to be executed.

``` `var template = "{{ var global = {}; }}";` ```

Example:

``` ```var data = { team: "POWER RANGERS!"} var template = '{{ var chant = "Go go"; }}{{= chant + " " + it.team}}'; var tempFunc = doT.template( template ); var html = tempFunc( data );   // result html == "Go go POWER RANGERS!";   // source for tempFunc function anonymous(it) { var out=''; var chant = "Go go"; out+=( chant + " " + it.team); return out; }``` ```

End of part 1. Part 2 coming soon.

### Larry Battle

I love to program, and discover new tech. Check out my stackoverflow and github accounts.