WFH Brian brianpetro

## rails-4-new-options
Because I couldn't find these with a quick Google search on 28 April 2015:

Usage:
  rails new APP_PATH [options]

Options:
  -r, [--ruby=PATH]                                      # Path to the Ruby binary of your choice
                                                         # Default: /home/brian/.rvm/rubies/ruby-2.2.0/bin/ruby
  -m, [--template=TEMPLATE]                              # Path to some application template (can be a filesystem path or URL)
      [--skip-gemfile], [--no-skip-gemfile]              # Don't create a Gemfile

## jquery-to-angularjs-1.js
// this one
$('.navi li:first-child').css('background-color', 'yellow');

// Also this one
$('.navi li').on('click', function(e){
  // what does ‘this’ refer to?
  $(this).css('background-color', 'green');
});

## jquery-to-angularjs-2.html
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>
  <div ng-app="myApp">
    <div ng-controller="ctrl1">
      <p>Input something in the input box:</p>
      <p>Name :
        <input type="text" ng-model="name" placeholder="Enter name here">
      </p>
      <h1>Hello {{name}}</h1>

## jquery-to-angularjs-3.html
<!-- correct way to bind event in jquery  -->
<ul class="menu-list">
  <li class="menu-item">menu 1</li>
  <li class="menu-item">menu 2</li>
  <li class="menu-item">menu 3</li>
</ul>

<script>
  $('.menu-item').on('click', function () {
    var menuText = $(this).text();

## jquery-to-angularjs-4.html
<body>
  <div ng-app="myApp">
    <div ng-controller="ctrl1">
      <button ng-click="showAlert($event)">Show Alert</button>
    </div>
  </div>

  <script>
    angular.module('myApp', [])
      .controller('ctrl1', function ($scope) {

## jquery-to-angularjs-5.html
<body>
  <div ng-app="myApp">
    <div ng-controller="ctrl1">
      <div style="background-color: green; width: 100px"
      ng-if="switch1">light 1</div>
    </div>
  </div>

  <script>
    angular.module('myApp', [])

## jquery-to-angularjs-6.html
<div style="background-color: green; width: 100px"
id="switch1">light 1</div>

<script>
  var $light = $('#switch1');
  setInterval(function () {
    $light.toggle();
  }, 1000);
</script>

## jquery-to-angularjs-7.html
<script type="text/template" id="account-template">
  <div class="account-area">
    <div class="main-account-area">
      <span class="toggle-handler">^></span>
      <span class="main-account-name">Assets</span>
    </div>
    <div class="sub_accounts-area">
      sub accounts...
    </div>
  </div>

## jquery-to-angularjs-8.js
var app = angular.module('myApp', []);
app.directive('account', function () {
  return {
    restrict: 'E',
    template: $('#account-template')
      .html(),
    controller: function ($scope,
      $element, $attrs) {
      $scope.subAccountsOpen =
        false;

## jquery-to-angularjs-9.html
<script type="text/template" id="account-template">
  <div class="account-area">
    <div class="main-account-area">
      <span class="toggle-handler" ng-click="toggleSubAccounts()">^></span>
      <span class="main-account-name">Assets</span>
    </div>
    <div class="sub_accounts-area" ng-if="subAccountsOpen">
      sub accounts...
    </div>
  </div>
	Because I couldn't find these with a quick Google search on 28 April 2015:

	Usage:
	rails new APP_PATH [options]

	Options:
	-r, [--ruby=PATH] # Path to the Ruby binary of your choice
	# Default: /home/brian/.rvm/rubies/ruby-2.2.0/bin/ruby
	-m, [--template=TEMPLATE] # Path to some application template (can be a filesystem path or URL)
	[--skip-gemfile], [--no-skip-gemfile] # Don't create a Gemfile
	// this one
	$('.navi li:first-child').css('background-color', 'yellow');

	// Also this one
	$('.navi li').on('click', function(e){
	// what does ‘this’ refer to?
	$(this).css('background-color', 'green');
	});
	<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

	<body>
	<div ng-app="myApp">
	<div ng-controller="ctrl1">
	<p>Input something in the input box:</p>
	<p>Name :
	<input type="text" ng-model="name" placeholder="Enter name here">
	</p>
	<h1>Hello {{name}}</h1>
	<!-- correct way to bind event in jquery -->
	<ul class="menu-list">
	<li class="menu-item">menu 1</li>
	<li class="menu-item">menu 2</li>
	<li class="menu-item">menu 3</li>
	</ul>

	<script>
	$('.menu-item').on('click', function () {
	var menuText = $(this).text();
	<div style="background-color: green; width: 100px"
	id="switch1">light 1</div>

	<script>
	var $light = $('#switch1');
	setInterval(function () {
	$light.toggle();
	}, 1000);
	</script>
	<script type="text/template" id="account-template">
	<div class="account-area">
	<div class="main-account-area">
	<span class="toggle-handler">^></span>
	<span class="main-account-name">Assets</span>
	</div>
	<div class="sub_accounts-area">
	sub accounts...
	</div>
	</div>
	var app = angular.module('myApp', []);
	app.directive('account', function () {
	return {
	restrict: 'E',
	template: $('#account-template')
	.html(),
	controller: function ($scope,
	$element, $attrs) {
	$scope.subAccountsOpen =
	false;