Modernizr.addTest('touchevents', function() {
  var div = new Element('div');
  div.writeAttribute('ontouchstart', 'return;');
  return (typeof div.ontouchstart === 'function');
});

var jgwhite = {};

jgwhite.Object = Class.create({
  
  initialize: function() {
    for (var method in this.constructor.prototype)
      if (method.startsWith('_') && typeof(this[method]) === 'function')
        this[method] = this[method].bind(this);
    
    (this.constructor.__instances = this.constructor.__instances || []).push(this);
  }
  
});

jgwhite.Controller = Class.create(jgwhite.Object, {
  
  initialize: function($super) {
    $super();
    
    if (document.loaded) this._on_load();
    else document.observe('dom:loaded', this._on_load);
  },
  
  _on_load: function(event) {
    $$('#work a').each(function(a) { new jgwhite.Button(a) });
    
    if (Modernizr.touchevents) {
      $(document.body).observe('touchstart', this._on_touchstart);
      $(document.body).observe('touchmove', this._on_touchmove);
      $(document.body).observe('touchend', this._on_touchend);
    }
  },
  
  _on_touchstart: function(event) {
    this._wasTap = true;
  },
  _on_touchmove: function(event) {
    this._wasTap = false;
  },
  _on_touchend: function(event) {
    if (!this._wasTap) return;
    if (!event.memo || jgwhite.Button.focused !== event.memo.button) {
      jgwhite.Button.focused.deactivate();
      delete jgwhite.Button.focused;
    }
  }
  
});

jgwhite.Button = Class.create(jgwhite.Object, {
  
  initialize: function($super, element) {
    $super();
    
    this._element = $(element);
    
    if (Modernizr.touchevents && this.info()) {
      this.element().observe('touchstart', this._on_touchstart);
      this.element().observe('touchmove', this._on_touchmove);
      this.element().observe('touchend', this._on_touchend);
      this.element().observe('mouseup', this._on_click);
      this.element().observe('click', this._on_click);
    }
    
    if (this.img().complete) this._on_img_did_load();
    else this.img().observe('load', this._on_img_did_load);
  },
  
  element: function() {
    return this._element;
  },
  
  img: function() {
    return this._img = this._img || this.element().down('img');
  },
  
  info: function() {
    return this._info = this._info || this.element().down('.info');
  },
  
  deactivate: function() {
    this.element().removeClassName('focused');
  },
  
  _on_img_did_load: function(event) {
    this.img().addClassName('visible');
  },
  
  _on_touchstart: function(event) {
    this._wasTapped = true;
  },
  _on_touchmove: function(event) {
    this._wasTapped = false;
  },
  _on_touchend: function(event) {
    if (!this._wasTapped) return;
    
    event.memo = { button: this };
    
    if (jgwhite.Button.focused !== this) {
      event.stop();
      jgwhite.Button.focused && jgwhite.Button.focused.deactivate();
      jgwhite.Button.focused = this;
      this.element().addClassName('focused');
      this._clickThrough = false;
      return false;
    } else {
      this._clickThrough = true;
    }
  },
  _on_click: function(event) {
    if (!this._clickThrough) {
      event.stop();
      return false;
    }
  }
  
});
jgwhite.Button.all = function() {
  return jgwhite.Button.__instances;
}

jgwhite.run = function() {
  jgwhite.__controller = new jgwhite.Controller();
}

jgwhite.run();