gryzzly

HTML & CSS:

• http://teamtreehouse.com/
• http://htmldog.com/
• https://developer.mozilla.org/en/CSS/Getting_Started
• PDF “HTML5 fundamentals”: http://public.dhe.ibm.com/software/dw/web/wa-html5fundamentals/wa-html5fundamentals-pdf.pdf
• http://www.abookapart.com/ – Notice HTML5 and CSS3 books there (although most of the books are well worth checking out)

JavaScript:

gryzzly

window.onload = function () {
  // create canvas DOM element / object
  var canvas = document.createElement("canvas");
  document.body.appendChild(canvas);
  
  // get context to draw on it
  canvas = canvas.getContext("2d");

  var drawSmiley = function (x, y) {
    // "http://lorempixel.com/400/200/animals/3/" tiger

gryzzly

// An example from http://matt.might.net/articles/implementation-of-recursive-fixed-point-y-combinator-in-javascript-for-memoization/
var Y = function (F) {
  return (function (x) {
	return F(function (y) { return (x(x))(y);});
  }(function (x) {
	return F(function (y) { return (x(x))(y);});
  }));
};

gryzzly

In the spirit of Railsgirls Berlin, we want to start a programming education group for JavaScript. We need your help to get all the coaching done.

If you are interested in coaching JavaScript, fork this gist and add yourself or leave your contact data in a comment:

• Jan Lehnardt [email protected] / @janl
• Misha Reyzlin / @gryzzly

gryzzly

var down = "touchup" in window ? "touchup" : "click";

var abstractView = Backbone.View.extend({
    // we don't want both click and touch handlers
    // delegated on touch-enabled devices
    events: function () {
        "click .toggler" : "foo", 
        "touchup .toggler" : "bar"
    },
    initialize: function () {

gryzzly

Combining handleEvent and Backbone

I'm sure for most of you it's the old news, but here's a short reminder anyway:

song = {
	handleEvent: function (event) {
    	switch (event.type) {
          case: "click":

console.log(this.name);

gryzzly

function () {}

gryzzly

// naïve bind implementation
Function.prototype.bind = function () {
    var obj = arguments[0], args = [].slice.call(arguments, 1);

    return function () {
        this.apply(
            obj,
            [].concat.call(args, [].slice.call(arguments))
        );
    }

gryzzly

// Helper function to correctly set up the prototype chain, for subclasses.
// Similar to `goog.inherits`, but uses a hash of prototype properties and
// class properties to be extended.
var inherits = function(parent, protoProps, staticProps) {
    var child;

    // The constructor function for the new subclass is either defined by you
    // (the "constructor" property in your `extend` definition), or defaulted
    // by us to simply call the parent's constructor.
    if (protoProps && protoProps.hasOwnProperty('constructor')) {

gryzzly

!function () {

  // helper to set prototype chain up
  var Constructor = function () {};
  Constructor.prototype = Array.prototype;
  
  var NotRealArray = function () {};
  // inherit from Array
  NotRealArray.prototype = new Constructor;