Bohdan Zhuravel

It’s two months since I don’t eat cows. I like cows. They’re big and smart, like...

Thu, 31 May 2012 22:16:29 +0300

It’s two months since I don’t eat cows. I like cows. They’re big and smart, like deers and moose. I eat in McDonald’s like once a week, and now I only eat chicken burgers. They taste bad, but it’s nice to think that maybe one less cow will be murdered just because it tastes good.

Benchmarking and testing your PHP script with microtime

Sun, 13 May 2012 23:57:00 +0300

$timer = new Timer;
$timer->start();
// some code...
$timer->stop();
// some more code...
$timer->stop(true);

/**
 * PHP script execution timer
 * @author Bohdan Zhuravel
 * @version .1
 */
class Timer {

  private $time;

  const format = 
          "<strong>Execution Time</strong>: %s seconds<br />";

  public function start() {
    $this->_set();
  }

  public function stop($die = false) {
    $this->_get() or $this->_set();
    $s = round($this->_time() - $this->_get(), 4);
    $this->_set();
    printf(self::format, $s);
    $die and die;
  }

  private function _get() {
    return $this->time;
  }

  private function _set() {
    $this->time = $this->_time();
  }

  private function _time() {
    $time = explode(' ', microtime());
    $time = $time[1] + $time[0];
    return $time;
  }

}

Sorry I haven’t posted lately. I fear I’ve run out...

Wed, 02 May 2012 00:14:00 +0300

Sorry I haven’t posted lately. I fear I’ve run out of things to say.
Like we’re on an awkward 4th date, staring at each other in silence.
Here are some photos of me chillaxing though.

@ work (Taken with instagram)

Wed, 04 Apr 2012 08:50:38 +0300

@ work (Taken with instagram)

Things that keep me awake at night #3

Wed, 29 Feb 2012 20:47:49 +0200

There’s a place in your life where you put away your dreams, because stability is more important than blah blah blah. So if you don’t at least take a genuine swing at being who you want to be now, when you don’t have a family yet, chances are high you’ll end up being a lousy model to your children.

This picture above describes how I felt for the past two weeks.I had really bad teeth, I mean...

Sat, 28 Jan 2012 23:45:46 +0200

This picture above describes how I felt for the past two weeks.
I had really bad teeth, I mean really bad. I think it had gotten so fragile and sensitive because of the years of drinking coffee and brushing once a day. Every now and then I felt pain but I didn’t do anything with it because the pain was bearable and very quick. But then two weeks ago I felt excruciating toothache and went to my first dentist appointment since… it’s been so long I can’t even remember when, and my reluctance to visit the dentist cost me, in total, around 1200 dollars. Not to mention that I couldn’t eat (and speak) normally because I could barely open my mouth and chewing was extremely painful. But now I’m writing this while eating Greek salad and it feels like the happiest day of my life.

CSS Cross-Country solutions

Sat, 28 Jan 2012 22:30:57 +0200

http://www.codeschool.com/courses/css-cross-country

Level 1

Challenge 1/6 : External Stylesheets

index.html:

<!doctype html>
<html lang="en">
  <head>
    <title>Sven's Snowshoe Emporium</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <section class="content">
      <header>
        <h1>Sven's Snowshoe Emporium</h1>
      </header>
    </section>
  </body>
</html>

style.css:

body {
  color: #4b4648;
  font-family: tahoma, arial, sans-serif;
  font-size: 14px;
}
.content {
  border: 1px solid #cac3c6;
  margin: 0 auto;
  padding: 20px;
  width: 260px;
}
h1 {
  color: #6d9fac;
  font-size: 22px;
  text-align: center;
}

Challenge 2/6 : ID Selector

#slogan {
  text-align: center;
  font-style: italic;
}

Challenge 3/6 : Compound Selector

.content { border: 2px solid #ccc; }
.content.home { border: 0; }

Challenge 4/6 : Style Specificity

index.html:

<!doctype html>
<html lang="en">
  <head>
    <title>Sven's Snowshoe Emporium</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <section class="content home">
      <header>
        <h1>Sven's Snowshoe Emporium</h1>
        <h2>"For the Snow-Savvy Shoe-Shopper"</h2>
      </header>
    </section>
  </body>
</html>

style.css:

header { background: #e0e2e6; }

Challenge 5/6 : Floats

aside {
  width: 120px;
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
}

Challenge 6/6 : Columns

aside { float: right; width: 120px; }
article { float: left; width: 120px; }

Level 2

Challenge 1/5 : Clearfix

index.html:

<!doctype html>
<html lang="en">
  <head>
    <title>Sven's Snowshoe Emporium</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <nav>
      <ul class="group">
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact</a></li>
      </ul>
    </nav>
    <section class="content home group">
      <aside>
        <p>Did you know that Sven's Snowshoe Emporium produces the highest quality snowshoes in North America? <a href="#">Find out more</a>.</p>
      </aside>
      <article>
        <h3>New Fall Styles</h3>
        <p>Be the first at your resort to sport the hot new tennis-themed snow kicks, now available in the <a href="#">store</a>.</p>
      </article>
    </section>
  </body>
</html>

Challenge 2/5 : Nested Selectors

p { font-style: normal; }
aside p { font-style: italic; }

Challenge 3/5 : Inherited Styles

p { font-style: normal; }
aside p { font-style: italic; }
aside p a { font-style: normal; }

Challenge 4/5 : Specificity

.main li a { color: #7ab2c1; }
.main .active a { color: #826c55; }
.primary p { font-size: 12px; }
.primary .copyright { font-size: 10px; }

Challenge 5/5 : Removing ID Selectors

.home a { color: #c09e79; }
article .button { color: #fff; }

Level 3

Challenge 1/5 : Box Model

footer figure {
  background: #e0e2e6;
  border: 1px solid #c5c9cf;
  padding: 15px;
  width: 88px;
}

Challenge 2/5 : Box Model Overflow

footer figure {
  background: #e0e2e6;
  border: 1px solid #c5c9cf;
  padding: 15px;
  width: 88px;
  height: 88px;
  overflow-x: hidden;
}

Challenge 3/5 : Relative Positioning

.button {
  float: right;
  position: relative;
  top: 3px;
}

Challenge 4/5 : Scoping Position

.newsletter {
  position: absolute;
  bottom: 0;
  width: 100%;
}
footer { position: relative; }

Challenge 5/5 : Absolute Positioning

footer { position: relative; }
.copyright { width: 120px; }
.newsletter {
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 1;
}
footer figure {
  position: absolute;
  right: 0;
  top: 0;
}

Level 4

Challenge 1/6 : DRY

article { color: #444; }

Challenge 2/6 : Selector Combination

header, article { margin: 0 0 20px 0; }

Challenge 3/6 : Selector Combination II

header, article { padding: 20px; }
header { background: #ccc; font-size: 16px; }
article { font-size: 14px; margin-bottom: 20px; }

Challenge 4/6 : Shorthand

p {
  margin: 0 0 10px 0;
  font: 14px/16px tahoma, arial, sans-serif;
}

Challenge 5/6 : Inline

nav li { display: inline; margin: 0 5px; }

Challenge 6/6 : Horizontal Centering

nav li { display: inline; margin: 0 5px; }
nav ul { width: 250px; margin: 0 auto; }

Level 5

Challenge 1/4 : Collapsing Margins

header, article, aside { margin: 20px 0; }

Challenge 2/4 : Non-Collapsing

header, article, aside {
  padding: 10px;
  margin: 0 0 20px;
}

Challenge 3/4 : Despecify

p {
  background: #e0e2e6;
  font-size: 15px;
  line-height: 20px;
  margin-bottom: 20px;
  min-height: 140px;
  width: 260px;
  padding: 10px;
}
h1 {
  font-size: 20px;
  font-family: tahoma, arial, sans-serif;
  margin: 0 0 20px 0;
}

Challenge 4/4 : Reasonable Defaults

p {
  font-size: 15px;
  line-height: 20px;
  margin-bottom: 20px;
}
p.history {
  background: #e0e2e6;
  min-height: 140px;
  width: 260px;
  padding: 10px;
}
h1 {
  font-size: 20px;
  font-family: tahoma, arial, sans-serif;
  margin: 0 0 20px 0;
}

Level 6

Challenge 1/5 : Content Images

index.html:

<!doctype html>
<html lang="en">
  <head>
    <title>Sven's Snowshoe Emporium</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <article>
      <h1>The Woven Wonder</h1>
      <figure>
        <img src="wovenwonder.jpg" alt="The Woven Wonder" />
      </figure>
      <p>The last snowshoe you'll ever own. Sporting quad-band tuning technology, The Woven Wonder® lives up to its name. And then some. Really.</p>
    </article>
  </body>
</html>

style.css:

figure { border: 2px solid #c5c9cf; }

Challenge 2/5 : Background Images

index.html:

<!doctype html>
<html lang="en">
  <head>
    <title>Sven's Snowshoe Emporium</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <article>
      <h1>The Woven Wonder</h1>
      <figure>
        <img src="wovenwonder.jpg" alt="The Woven Wonder" />
      </figure>
      <p>
        The last snowshoe you'll ever own. Sporting quad-band tuning technology, The Woven Wonder® lives up to its name. And then some. Really.
        <a class="more" href="#">More Information</a>
      </p>
    </article>
  </body>
</html>

style.css:

.more {
  background: #c09d78 url(arrow.png) right no-repeat;
  display: block;
  position: relative;
  padding: 0 50px;
}

Challenge 3/5 : Image Crop

.store li {
  height: 150px;
  width: 150px;
  overflow: hidden;
}

Challenge 4/5 : Proportional Image Crop

.store li {
  height: 150px;
  width: 150px;
  overflow: hidden;
}
.store li img { height: 150px; }

Challenge 5/5 : Portait Image Crop

.store li {
  height: 150px;
  width: 150px;
  overflow: hidden;
}
.store li img {
  height: auto;
  width: 150px;
}

Level 7

Challenge 1/5 : Image Replacement

index.html:

<!doctype html>
<html lang="en">
  <head>
    <title>Sven's Snowshoe Emporium</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <section class="content home">
      <header>
        <h1><a class="logo" href="#">Sven's Snowshoe Emporium</a></h1>
        <h2>"For the Snow-Savvy Shoe-Shopper"</h2>
      </header>
    </section>
  </body>
</html>

style.css:

.logo {
  background: url(logo.png);
  display: block;
  height: 75px;
  width: 250px;
  text-indent: -9999px;
}

Challenge 2/5 : Hover Sprite

.logo {
  background: url(logo2.png);
  display: block;
  height: 75px;
  text-indent: -9999px;
  width: 250px;
}
.logo:hover, .logo:focus {
  background-position: 0 -75px;
}

Challenge 3/5 : Active Sprite

.logo {
  background: url(logo3.png);
  display: block;
  height: 75px;
  text-indent: -9999px;
  width: 250px;
}
.logo:hover, .logo:focus {
  background-position: 0 -75px;
}
.logo:active { background-position: 0 -150px; }

Challenge 4/5 : Icon Sprite

.sidebar a {
  display: block;
  line-height: 40px;
}
.sidebar .featured, .sidebar .sales {
  background: url(sidebar.png) no-repeat;
  padding-left: 50px;
}
.sidebar .sales { background-position: 0 -80px; }

Challenge 5/5 : Icon Sprite Hover

.sidebar a {
  display: block;
  line-height: 40px;
}
.sidebar .featured,
.sidebar .sales {
  background: url(sidebar.png) no-repeat;
  padding-left: 50px;
}
.sidebar .sales {
  background-position: 0 -80px;
}
.sidebar .featured:hover,
.sidebar .featured:focus {
  background-position: 0 -40px;
}
.sidebar .sales:hover,
.sidebar .sales:focus {
  background-position: 0 -120px;
}

Level 8

Challenge 1/7 : Pseudo Classes

p:first-child {
  color: #999;
  font-style: italic;
}

Challenge 2/7 : Pseudo Classes II

.hours li:nth-child(odd) {
  background: #c5c9cf;
}

Challenge 3/7 : Pseudo Classes III

.hours li:nth-child(4n+1) {
  background: #c5c9cf;
}

Challenge 4/7 : Pseudo Elements

p:first-child:first-line {
  font-weight: bold;
}

Challenge 5/7 : Pseudo Elements II

p:before {
  content: '->';
  margin-right: 5px;
}

Challenge 6/7 : Positioned Elements II

.store {
  display: block;
  position: relative;
}
.store:before, .store:after {
  display: block;
  position: absolute;
  content: '';
}
.store:before {
  background: url(store-before.png);
  height: 23px;
  width: 54px;
  top: -3px;
  left: -3px;
}
.store:after {
  background: url(store-after.png);
  height: 20px;
  width: 41px;
  bottom: -3px;
  right: -3px;
}

Challenge 7/7 : Positioned Elements

.store {
  display: block;
  position: relative;
}
.store:before, .store:after {
  display: block;
  position: absolute;
  content: '';
}
.store:before {
  background: url(store-before.png);
  height: 23px;
  width: 54px;
  top: -3px;
  left: -3px;
}
.store:after {
  background: url(store-after.png);
  height: 20px;
  width: 41px;
  bottom: -3px;
  right: -3px;
}
.store:hover:before, .store:focus:before {
  top: -5px;
  left: -5px;
}
.store:hover:after, .store:focus:after {
  bottom: -5px;
  right: -5px;
}

I Heart Chaos: Fun with math: Dividing one by 998001 yields a surprising result

Thu, 26 Jan 2012 19:45:16 +0200

I Heart Chaos: Fun with math: Dividing one by 998001 yields a surprising result:

iheartchaos:

There’s all sorts of magic to be had with numbers, and many mathematicians have made entire careers in finding these little tricks that are mostly useless, but fun anyway. Unfortunately, a lot of calculators are going to truncate the results of this trick, but if you manage to get a hold of…

parislemon: This is actually the craziest chart about Apple...

Wed, 25 Jan 2012 10:26:39 +0200

parislemon:

This is actually the craziest chart about Apple following their insane earnings today.

There is exactly one company on that entire list that is not an oil and gas company. And they’re not that far from the top.

CoffeeScript solutions

Sun, 22 Jan 2012 21:52:08 +0200

http://www.codeschool.com/courses/coffeescript

Level 1

Challenge 1/7 : Variable Assignment

person = "Bohdan"

Challenge 2/7 : Functions

greet = -> alert "Hello CoffeeScript"

Challenge 3/7 : Functions II

greet = (argument) ->
  alert argument

Challenge 4/7 : Functions III

greet = (argument1, argument2) ->
  alert argument1 + " " + argument2

Challenge 5/7 : Functions IV

greet = (name='Stranger') ->
  alert name

Challenge 6/7 : Functions V

greet = (name='Stranger') ->
  "Hello, #{name}"

Challenge 7/7 : Sum Function

sum = (argument1, argument2) ->
  return argument1 + argument2

Level 2

Challenge 1/6 : JS to Coffee I

$ ->
  $('#newCoffee a').click alert "New coffee added"

Challenge 2/6 : JS to CS - Part II

$('#newCoffee a').click ->
  name = prompt "Name of coffee:"
  alert "New coffee added: #{name}"

Challenge 3/6 : JS to CS - Part III

$('#newCoffee a').click ->
  name = prompt "Name of coffee:"
  coffee = $("<li>#{name}</li>")
  $('ul.drink').append(coffee)

Challenge 4/6 : JS to CS - Part IV

$('.drink li a').click (e) ->
  e.preventDefault()
  alert($(@).text())

Challenge 5/6 : JS to CS - Part V

$('.drink li').mouseenter ->
  $(@).find('span').show()
$('.drink li').mouseleave ->
  $(@).find('span').hide()

Challenge 6/6 : JS to CS - Part VI

$('.drink li').hover(
  -> $(@).find('span').show()
  -> $(@).find('span').hide()
)

Level 3

Challenge 1/7 : Conditionals

if caffeineLevel > 5 then alert "High Caffeine Level"

Challenge 2/7 : Conditionals - Part II

if caffeineLevel > 5 then alert "Too High" else alert "OK"

Challenge 3/7 : Conditionals - Part III

alert "Please wait 5 more minutes." unless coffeeReady

Challenge 4/7 : Chained Comparisons

if lowLevel < newLevel < highLevel
  alert 'ok'
else
  alert 'abnormal caffeine level'

Challenge 5/7 : Switch/Case

message = switch newLevel
  when 1 then 'Out of bed yet?'
  when 2 then 'Good morning!'
  else 'You should stop while you can'

Challenge 6/7 : Existential Operator

if newLevel?
  checkLevel(newLevel)
else
  resetLevel()

Challenge 7/7 : Existential Operator - Part II

if level?
  checkLevel(level) unless checkLevel?
else
  resetLevel() unless resetLevel?

Level 4

Challenge 1/7 : Coffee on the Range

range = [1..10]

Challenge 2/7 : Coffee on the Range II

range = [1...11]

Challenge 3/7 : Object Literals

coffee = name: "Russian", level: 2, isRussian: -> return true

Challenge 4/7 : For In Loop

for person in people
  console.log(person.name) if person.age > 18

Challenge 5/7 : List Comprehension

console.log(person.name) for person in people when person.age > 18

Challenge 6/7 : List Comprehension II

addCoffee(coffee) for coffee in coffeeList when not coffee.isRussian?()

Challenge 7/7 : Splat Arguments

displayTopPicks = (bestCoffee, suggested...) ->
  alert('Top #1 ' + bestCoffee)
  alert('Suggested: ' + suggested.join(","))

Level 5

Challenge 1/3 : jQuery & Object Notation

$ ->
  $('.drink a').click ->
    newStyle = 'color': '#F00', 'font-weight': 'bold'
    $(@).css(newStyle)

Challenge 2/3 : jQuery & Object Notation - Part II

coffeeList =
  init: ->
    $('.drink a').click (e) ->
      e.preventDefault()
      alert $(@).text()

coffeeList.init()

Challenge 3/3 : jQuery & Object Notation - Part III

$.ajax
  url: '/coffeeList'
  method: 'GET',
  success: (results) ->
    $('ul.drink').append("<li>#{coffee.name}</li>") for coffee in results when coffee.level > 3
  error: (results) ->
    alert "failure #{results}"

Level 6

Challenge 1/6 : Classes - Part I

class Coffee
  constructor: (name, level) ->
    @name = name
    @level = level

  isRussian: -> @name is 'Russian'

Challenge 2/6 : Classes - Part II

coffee = new Coffee("Bohdan", 19)

Challenge 3/6 : Property Arguments

class Coffee
  constructor: (@name, @level=0) ->
  isRussian: -> @name is 'Russian'

Challenge 4/6 : Class Inheritance

class Coffee extends Drink
  constructor: (@name, @level=0) ->
  serve: ->
    return false if @sleeve is not on
    super()

Challenge 5/6 : Classes with jQuery

class DrinkLink
  watchClick: ->
    $('a').click -> $(@).css('color', '#F00')

Challenge 6/6 : Watch those @’s

class DrinkLink
  constructor: (@linkClicked=false) ->
  watchClick: ->
    $('.drink a').click (event) =>
      $(event.target).css('color', '#F00')
      @linkClicked = true

Tom Hanks does the 'Big' rap. Again.

Sat, 21 Jan 2012 01:29:00 +0200

1988:

2009:

The spades go, Down! Down! Baby! Down! Down the roller coaster! Sweet, sweet baby! Sweet, sweet delectable! Shimmy, shimmy cocoa pop! Shimmy, shimmy rock! Shimmy, shimmy cocoa pop! Shimmy, shimmy rock! I met a girlfriend a triscuit! She said a triscuit a biscuit! Ice cream, soda pop, vanilla on the top! Ooh Shelly, walking down the street, ten times a week! I met it! I said it! I stole my mother’s credit! I’m cool! I’m hot! Sock me in the stomach three more times!

Photo

Wed, 18 Jan 2012 12:24:27 +0200

jQuery Air: Captain's Log solutions

Thu, 12 Jan 2012 12:38:49 +0200

http://www.codeschool.com/courses/jquery-air-captains-log

Level 1

Challenge 1/12 : HTML Value

$('ol.economy-class li.row:first li:first').html();

Challenge 2/12 : Text Value

$('ol.economy-class li.row:first li:first a').text();

Challenge 3/12 : Text Value II

$('ol.economy-class li.row:eq(1) li:eq(3)').html();

Challenge 4/12 : Attributes

$('ol.economy-class li.row:eq(1) li:eq(3) a').attr('href');

Challenge 5/12 : Data Attributes

$('ol.economy-class li.row:eq(1) li:eq(3) a').data('seat');

Challenge 6/12 : Click Event

$('div.seating-chart a.available').click(selectSeat);
function selectSeat(event) {
  event.preventDefault();
  $('.selected').removeClass('selected');
  $(this).addClass('selected');
}

Challenge 7/12 : Bind Click Event

$('div.seating-chart a.available').bind({
  click: selectSeat
});

Challenge 8/12 : Using Data Attributes

function selectSeat(e) {
  e.preventDefault();
  $('.selected').removeClass('selected');
  $(this).addClass('selected');
  $('#seatSelected').text($(this).data('seat'));
  $('div#confirm-seat').show();
}

$('div.seating-chart li a.available').click(selectSeat);

Challenge 9/12 : Unbind Event

function selectSeat(e) {
  e.preventDefault();
  $('.selected').removeClass('selected').bind('click', selectSeat);
  $(this).addClass('selected').unbind('click', selectSeat);
  $('#seatSelected').text($(this).data('seat'));
  $('#confirm-seat').show();
}

$('div.seating-chart li a.available').click(selectSeat);

Challenge 10/12 : Multiple Click Handlers

$('div.seating-chart ol.first-class li a.available').click(selectFirstClass);
$('div.seating-chart ol.economy-class li a.available').click(selectSeat);

Challenge 11/12 : Live

$('#confirm-first-class a.confirm-upgrade').live('click', confirmUpgrade);

Challenge 12/12 : Delegate

$("#confirm-first-class").delegate("a.confirm-upgrade", "click", confirmUpgrade);

Level 2

Challenge 1/9 : $.ajax

function fetchFirstClassConfirm() {
  var flight_id = 815;
  
  $.ajax('/flights/' + flight_id, {
    success: function(result) {
      $("#confirm-first-class").html(result).show();
    }
  });
}

Challenge 2/9 : Error Callback

function fetchFirstClassConfirm() {
  var flight_id = 815;

  $.ajax('/flights/' + flight_id, {
    type: 'GET',
    cache: false,
    timeout: 7000,
    success: function(result) {
      $('#confirm-first-class').html(result).show();
    },
    error: function() {
      $('#confirm-first-class').html('Unable to pull seat price, please select another seat').show();
      
    }
  });
}

Challenge 3/9 : $.ajax II

function viewAlternateFlight() {
  var flight_id = 815;

  var rel = $(this).attr('rel');

  $.ajax('/flights/' + flight_id, {
    type: "GET",
    data: { direction: rel },
    success: function(result) {
      $('.seating-chart').html(result);
    }
  });
}

$('#flight-navigation a').click(viewAlternateFlight)

Challenge 4/9 : Refactor $.ajax II

function viewAlternateFlight() {      
  var url = $(this).attr('href');

  $.ajax(url, {
    type: 'GET',
    success: function(result) {
      $('.seating-chart').html(result);
    }
  });
}

$('#flight-navigation a').click(viewAlternateFlight)

Challenge 5/9 : Delegate

$("#flight-navigation").delegate("a", "click", viewAlternateFlight);

Challenge 6/9 : Abort

var fetchingFlight = null;

function viewAlternateFlight() {
  if (fetchingFlight) {
    fetchingFlight.abort();
  }

  var url = $(this).attr('href');

  fetchingFlight = $.ajax(url, {
    type: 'GET',
    success: function(result){
      $('.seating-chart').html(result);
      fetchingFlight = null;
    }
  });
}

$('#flight-navigation').delegate('a', 'click', viewAlternateFlight);

Challenge 7/9 : $.ajax JSON

function selectSeat(event) {
  event.preventDefault();

  var flight_id = 815;
  var seat = $(this).data('seat');

  $.ajax('/flights/' + flight_id + '/reserve', {
    type: 'POST',
    data: { seat: seat },
    datatype: 'json',
    success: function(result) {
      $('#confirmation-number').text(result.confirmation);
      $('#reservations').show();
    }
  });
}

Challenge 8/9 : $.ajax JSON II

function fetchFlightStatistics() {
  var flight_id = 815;

  $.ajax('flights/' + flight_id + '/stats', {
    type: 'GET',
    dataType: 'json',
    success: function(result) {
      $('#flight-stats .meal').text(result.meal);
      $('#flight-stats .model').text(result.model);
      $('#flight-stats .on-time').text(result.percentage_on_time);
      $('#flight-stats').show();
    }
  });
}

$(document).ready(fetchFlightStatistics);

Challenge 9/9 : Serialized Form

function notifyMe(event) {
  event.preventDefault();

  var form = $(this).serialize();

  $.ajax('/notify_me', {
    type: 'POST',
    data: form,
    dataType: 'script'
  });
}

$('#notify-me form').submit(notifyMe);

Level 3

Challenge 1/8 : Simple Effects

function showSeat(seat) {
  seat.fadeOut().addClass('selected').fadeIn();
}

Challenge 2/8 : Effect Speed

function showSeat(seat) {
  seat.fadeOut('fast').addClass('selected').fadeIn('fast');
}

Challenge 3/8 : Slide Down

function showConfirm(result) {
  $('#confirm-first-class').html(result).slideDown();
}

Challenge 4/8 : Show Callback

function showConfirm(result) {
  $('#confirm-first-class').html(result).slideDown(function() {
    $('#notify-me').fadeIn()
  });
}

Challenge 5/8 : Effect Delay

function showConfirm(result) {
  $('#confirm-first-class').html(result).slideDown(function(){
    $('#notify-me').delay(1000).fadeIn();
  })
}

Challenge 6/8 : Effect Queue

function viewAlternateFlight() {
  var href = $(this).attr('href');

  $('.seating-chart').fadeOut();

  $.ajax(href, {
    type: 'GET',
    success: function(result) {
      $('.seating-chart').queue(function(next) {
        $(this).html(result).fadeIn();
        next();
      });
    }
  });
}

$('#flight-navigation a').click(viewAlternateFlight)

Challenge 7/8 : All Together Now

function showSeatInformation(e){
  var seat = $(this).data('seat');
  $(this).append("<span class='tooltip'>seat " + seat + "</span>");
  $('.seating-chart .tooltip').delay(200).fadeIn();
}

function hideSeatInformation(e){
  $('.seating-chart .tooltip').fadeOut(function(){
    $(this).remove();
  });
}

$('.seating-chart li.row li a').hover(showSeatInformation, hideSeatInformation)

Challenge 8/8 : Effect Stopping

function showSeatInformation(e) {
  var seat = $(this).data('seat');
  $(this).append("<span class='tooltip'>seat " + seat + "</span>");
  $('.seating-chart .tooltip').delay(200).fadeIn();
}

function hideSeatInformation(e) {
  $('.seating-chart .tooltip').stop().fadeOut(function() {
    $(this).remove();
  });
}

$('.seating-chart li.row li a').hover(showSeatInformation, hideSeatInformation)

Level 4

Challenge 1/8 : jQuery.each

function buildSeats(row_number, seats) {
  var seat_html = "";

  $.each(seats, function(index, seat) {
    seat_html += "<li>" +
                 "<a class='" + (seat.available ? 'available' : '') + "' " +
                  "data-features='" + seat.features + "' " +
                  "data-seat='" + row_number + seat.seat + "' href='#'>" + seat.seat + "</a>" +
                 "</li>";
  });

  return seat_html;
}

Challenge 2/8 : jQuery.map

function buildSeats(row_number, seats) {
  return $.map(seats, function(seat) {
    return "<li>" +
             "<a class='" + (seat.available ? 'available' : '') + "' " +
               "data-features='" + seat.features + "' " +
               "data-seat='" + row_number + seat.seat + "' href='#'>" + seat.seat + "</a>" +
           "</li>";
  }).join('');
}

Challenge 3/8 : Utility Function

$.highlightSeats = function(seat_selector, checkboxes) {
  $.each(checkboxes, function(index, checkbox) {
    checkbox = $(checkbox);

    if (checkbox.is(":checked")) {
      $('.seating-chart a.available').each(function(index, seat) {
        var features = $(seat).data('features');
        if (features && features.indexOf(checkbox.attr('name')) != -1) {
          $(seat).addClass(checkbox.val());
        }
      });
    } else {
      $('.seating-chart a').removeClass(checkbox.val());
    }
  });
}

$('#highlights input').change(function() {
  var checkbox = $(this);
  $.highlightSeats('.seating-chart a.available', $(this));
});

Challenge 4/8 : Create a plugin

$.fn.highlightSeats = function(seat_selector) {
  this.each(function(index, checkbox) {
    checkbox = $(checkbox);

    if (checkbox.is(':checked')) {
      $(seat_selector).each(function(index, seat) {
        seat = $(seat);
        var features = seat.data('features');
        if (features && features.indexOf(checkbox.attr('name')) !== -1) {
          seat.addClass(checkbox.val());
        }
      });
    } else {
      $('.seating-chart a').removeClass(checkbox.val());
    }
  });
};

$('#highlights input').change(function() {
  $(this).highlightSeats('.seating-chart a.available');
});

Challenge 5/8 : Default Options

$.fn.highlightSeats = function(seat_selector, options) {
  var defaults = {
    initialOpacity: 0.5,
    targetOpacity: 1.0
  };
  
  var options = $.extend(defaults, options);

  $.each(this, function(index, highlight){
    highlight = $(highlight);
  
    if (highlight.is(":checked")) {
      $(seat_selector).each(function(index, seat){
        var features = $(seat).data('features');
        if (features && features.indexOf(highlight.attr('name')) != -1){
          $(seat).addClass(highlight.val());
          $(seat).css({opacity: options.initialOpacity}).animate({opacity: options.targetOpacity});
        }
      });
    } else {
        $(seat_selector).removeClass(highlight.val());
    }
  });
}

Challenge 6/8 : Encapsulation

var seatSelector = {
  viewAlternateFlight: function() { /* ... */ },
  buildCabin: function() { /* ... */ },
  buildSeats: function() { /* ... */ },
  init: function() {
    $('#flight-navigation a').click(this.viewAlternateFlight);
  }
};

seatSelector.init();

Challenge 7/8 : Custom Events

$('#flight-navigation a').click(function(event) {
  event.preventDefault();
  $(this).trigger('flightChanged');
});

$(document).keydown(function(event) {
  if (event.keyCode === 37) { // left arrow
    $('#flight-navigation a[rel="prev"]').trigger('flightChanged');
  } else if (event.keyCode === 39) { // right arrow
    $('#flight-navigation a[rel="next"]').trigger('flightChanged');
  }
});

$('#flight-navigation a').bind('flightChanged', function() {
  $(this).toggleClass('on');
});

Challenge 8/8 : Template

Javascript

function buildSeats(seats) {
  var result = $('<ol></ol>');
  $('#seatTemplate').tmpl(seats).appendTo(result);
  return result.html();
}

Template.Html

<script id="seatTemplate" type="x-jquery-tmpl">
  <li>
    <a class="{{if available}} available {{/if}}" data-features="${features}" data-seat="${seat}">${seat}</a>
  </li>
</script>

Better than the original, sounds like it was written for her.And...

Mon, 09 Jan 2012 13:25:51 +0200

Better than the original, sounds like it was written for her.
And no, Drake’s version is not the original. Original is by Gil Scott-Heron and Jamie xx.

Things I learned in 2011

Mon, 02 Jan 2012 23:11:00 +0200

I had something my children won’t have — analog childhood (rotary phones, cassettes albums, VCRs with tracking problems, 8-bit games consoles and all). It was beautiful. In it’s own ugly way.
I am taking a hiatus from this “always available anytime” culture. I remember when you had to be home to answer the phone if you wanted to talk.
Still, we are living in the most interesting time in human history. Everything is amazing right now and nobody is happy.
English is the language of the world. The language of the Web and wider communication. The language of science, literature and art. The language that unlocks opportunities. It is time to stop calling it foreign language or second language.
Watching my friends write in English makes me want new friends.
The London rioters were protesting violence with more violence, and that was the most stupid thing I ever heard.
Every time Facebook or Twitter releases the new design everyone curses the hell out of it, then they get comfortable with it, and then Facebook or Twitter releases the new design.
My Android phone takes longer to reboot than my laptop do and the battery lives two days. Instead of fixing that they are increasing number of cores. Who needs multi-core phone? Are you sending humans into space or what?
Reading C system headers is difficult, but educational. Reading C++ system headers is torture.
If it is possible to be in love with a book, then I’m in love with this one. Matt Doyle has written the book that is probably the single best book for the person who’s just getting started with PHP, and programming as a whole.
Web programming is the science of coming up with increasingly complicated ways of concatenating strings.
The American consumer is somebody who bought something — they’re not sure why — but it was five dollars off, so they bought it.
Don’t make the mistake of thinking that something or someone will always be around. Never chase love, affection, or attention. If it isn’t given freely by another person, it isn’t worth having. It’s funny how quickly someone can go from being the center of your life to someone you don’t even want to know about anymore. So long, fairwell, auf wiedersehen, adieu to yieu.
You can’t force yourself to treat well someone who put you through shit. I believe it was Charles Bukowski who said “the way to end a poem like this is to become suddenly quiet.” No matter what he meant by it.
When I hear a song that fits my current life situation, I listen to it 24/7.
There’s no such thing as a hopeless situation, just hopeless people in situations. Two things in life are infinite: the universe and options.
The only person you need to compare yourself to is who you have been. And the only person you need to be better than is who you are now.
If you’re the smartest person in the room, you’re in the wrong room.
You’re gonna get judged with whatever you do, so keep doing what you’re doing.
Life is about proving your parents wrong by making them proud.
Every moment counts. Excellent people know that time is highly valuable. There’s this quote by Donald Trump which I read in one of his books, and I absolutely love it. He said that time is more precious than money, because you can earn back money, but you can’t get back time. That is absolutely true.

I hope you all had a safe and fun New Year. Even those who TL;DR’d.
My New Year’s resolution is the same as last year’s — 1366×768.

You should all watch this video, cause after I saw it, I was so...

Sun, 01 Jan 2012 19:19:00 +0200

You should all watch this video, cause after I saw it, I was so inspired
I wasted half an hour converting and cropping it just to show it to you.

Download printable or generate your own.

Sat, 31 Dec 2011 00:43:00 +0200

Download printable or generate your own.

Photo

Fri, 30 Dec 2011 12:56:23 +0200

<?php $today = date( "Y-m-d" ); $christmas = date( "Y-m-d", strtotime( "december 25" ) ); echo (...

Sun, 25 Dec 2011 22:30:00 +0200

<?php
$today = date( "Y-m-d" );
$christmas = date( "Y-m-d", strtotime( "december 25" ) );
echo ( $today == $christmas ) ? "Merry Christmas!" : "";
?>

I have been posting (I’m talking about meaningful posts, not about all these pictures and...

Sun, 25 Dec 2011 00:51:00 +0200

I have been posting (I’m talking about meaningful posts, not about all these pictures and quotes and stuff that I wanted to share with someone but haven’t anyone to share with) infrequently at best lately. Everything in my life has been moving in slow motion. I have spent the last couple of weeks rethinking everything in my life, from my family, to my job, to my education, to how to realign my priorities, to what really matters to me. And I think I’ve come out on the other side with a really different perspective on how I want to divide my time and energies.

If I was faced with a crisis that might limit my time, how would I rethink my life? Or would I? Am I truly taking advantage of every minute? Am I spending every minute doing what really makes me happy? Am I doing what I believe in, or am I settling for what I am doing? Which is worse, failing or never trying? What things have I not done that I really want to do, and what is holding me back? Do I feel everyday like I have lived this day a hundred times before? What would I do differently if I knew nobody would judge me? These are the questions I’ve contemplated the last couple of weeks.

Life is too short to not do what you love. Life is too short to not do what you love. Life is too short to not do what you love. This line kept repeating in my head like a mantra. And then at some point I finally felt I could not take it anymore. What I am doing with my life is just not right. And it is time to stop calculating risk and rewards, and just go ahead and do what I know is right. It is time to move forward. And the best way for me to move forward, is to dive back into the things that excite me. I want to be an engineer. Work with great minds. Solve complex technical problems. Create business value. Add revenue. Reduce costs.

In September I go to National Aviation University to study system programming and operating systems (this is by far the hardest direction I could think of). Needless to say, not the least role in this played Linus Torvalds’ book “Just for Fun.” One might say, education is overrated, but I believe that you can’t educate yourself system programming simply by reading the web and some book, no matter how good it is written (one really good job interview I happened to have and fuck up proved this to me). So, I’ve called them and they said they can accept me and my education will take two years (because I already have some background, I’m on my fourth year in college studying Accounting). And if all goes well I will graduate from two universities by the time I’m 22. This is my first move to fulfill my dreams.