White Board

console output


var foo = "Hello";
(function() {
    var bar = " World";
    console.log(foo + bar);
})();
console.log(foo + bar);
						

console output


var x = 5;

(function () {
    var x;
    console.log(x);
    x = 10;
    console.log(x); 
})();
						

console output


function consoleFunction(ele){
    var text = 'Successful ' + ele;
    var useThis = function(){console.log(text);}
    return useThis;
}

var testThis = consoleFunction('Test');
testThis();
						

True/False?


new String("abc") = "abc"

new String("abc") == "abc"

new String("abc") === "abc"

new String("abc") ==== "abc"
						

Chaining


$( "button#play-movie" ).on( "click", playMovie );
$( "button#play-movie" ).css( "background-color", "orange" );
$( "button#play-movie" ).show();
						

Reverse Name

Write a statement that takes your name and returns it backwards. Example:


"Brody Carlson"

console result: "noslraC ydorB"

						

Return List

Return array as an unordered html list in alphabetical order.


var friends = ["Mike", "Stacy", "Andy", "Rick"];
						

Implement Array.prototype.map

Question:

Write a method that performs a function on each element in an array, and returns a new, processed array (double each number in array).


var numbers = [1, 4, 9];
var doubles = ???;

// doubles will be [2, 8, 18]. numbers is still [1, 4, 9]

URL Parsing

Accept the following URL

http://www.overstock.com/#blue-shoes,/k,/results.html?index=61&sort=Relevance&count=60&landingPage=false&CID=8675309

 

Then return an object that looks like this:


{
	index: 61,
	sort: 'Relevance',
	count: 60,
	landingPage: false,
	CID: 8675309
}

Rows

row 1
row 2
row 3

Columns

column 1
column 2
column 3

Responsive

3 rows under 1000px.

row 1
row 2
row 3

3 columns above 1000px.

column 1
column 2
column 3

One More Row/Column

Add a button that will create a new (yellow) row/column

row 1
row 2
row 3
row 4

 

column 1
column 2
column 3
column 4

Our Site

Click the logo and change the shipping banner to red. Click should not refresh the page.

  • Logo class: new-logo
  • Banner class: hd-shippingbanner

2nd Logo Click

Updates the Shipping Banner to say:

"Shipping is FREE for everyone!!!"

3rd Logo Click

Goes to cart (www.overstock.com/cart)

Angular

What's wrong?


angular.module('ui.filters', []);
angular.module('ui.directives', []);
angular.module('ui', [
  'ui.filters', 
  'ui.directives'
]).value('ui.config', {});

angular.module('ui.directives', []).directive('uiFoo', 
    function() {
      return {
        restrict: 'EAC',
        require: '?ngModel',
        link: function($scope, element, attrs, controller) {
          var controllerOptions, options;
          element.text('iamfoo');
        }
      };
    }
  );
angular.module('ui.directives', []).directive('uiBar',
    function() {
      return {
        restrict: 'EAC',
        require: '?ngModel',
        link: function($scope, element, attrs, controller) {
          var controllerOptions, options;
          element.text('iambar');
        }
      };
    }
  );
angular.module('myApp', ['ui.directives']);
						
						

http://jsfiddle.net/A8Vgk/7/

deck

By Michael Elliott