var App = {
  viewType: 'nocontent',
  nervous: [],
  _loading: false,

  init: function () {
    var self = this;
    $(window).observable(this);
    this.resize();
    this.nervous.push(new Nervous(this.ob.cloud).start());
    this.nervous.push(new Nervous(this.ob.menu.contacts, {stopOnOver: true}).start());
    this.nervous.push(new Nervous(this.ob.menu.blog, {stopOnOver: true}).start());
    this.nervous.push(new Nervous(this.ob.menu.wecando, {stopOnOver: true}).start());
    this.nervous.push(new Nervous(this.ob.menu.portfolio, {stopOnOver: true}).start());
    this.nervous.push(new Nervous($('div', self.ob.arrows.contacts)).start());
    this.nervous.push(new Nervous($('div', self.ob.arrows.portfolio)).start());
    this.nervous.push(new Nervous($('div', self.ob.arrows.blog)).start());
    this.nervous.push(new Nervous($('div', self.ob.arrows.wecando)).start());

    var click = function (e) {
      e.preventDefault();
      if (self.viewType == 'content') {
        self.viewType = 'nocontent';
        for (var i = 0; i < self.nervous.length; i++) self.nervous[i].start();
        self.content.hide();
        self.resize();
      }
    }

    this.ob.cloudplace.click(click);
    this.ob.jumpkot.click(click);

    $(window).resize(this.resize);
  },

  onMenu: function (e) {
    e.preventDefault();
    var self = App;
    var name = $(this).attr('href').substr(3);
    self._loading = name;
    if (self.viewType == 'nocontent') {
      self.viewType = 'content';
      self.resize();
      self.content.show();
    } else {
      self.content.hide(function () {self.content.show()});
    }
    self.loadContent(name);
    $(this).blur();
    return false;
  },

  loadContent: function (name) {
    var self = App;
    $.get('content/' + name, function (data) {
      if (self._loading == name) {
        var pos = data.indexOf('\n');
        if (pos > -1) {
          self.content.title(data.substr(0, pos+1));
          data = data.substr(pos+1);
        } else self.content.title(name);
        self.content.body(data);      
      }
    });
  },

  content: {
    visible: false,
    left: 0,

    show: function (stop) {
      var self = App;
      var bW = $('body').realWidth();
      self.ob.content.stop().css({left: bW*1.5}).show();
      self.ob.title.stop().css({left: bW*3}).show();
      this.visible = true;
      this.resize(stop);
    },

    hide: function (stop) {
      var self = App;
      var bW = $('body').realWidth();
      self.ob.content.stop().animate({left: bW*1.5}, function () {self.ob.content.hide(); if (stop) stop();});
      self.ob.title.stop().animate({left: bW*3}, function () {self.ob.title.hide()});
      this.visible = false;
    },

    title: function (title) {
      var self = App;
      self.ob.title.html(title); this.resize();
    },

    body: function (body) {
      var self = App;
      self.ob.content.html(body); this.resize();
    },

    resize: function (stop) {
      var self = App;
      if (this.visible) {
        var
          bH = $('body').realHeight(),
          bW = $('body').realWidth() - this.left,
          cH = self.ob.content.height(),
          cW = self.ob.content.width(),
          tH = self.ob.title.realHeight();
        if (cW < 500) cW = 500;
        if (cH < 300) cH = 300;
        if (cW > bW) cW = bW;
        if (cH > (bH - tH)) cH = bH - tH;
        var
          l = (bW - cW) / 2 + this.left,
          t = (bH - cH) /2;
        self.ob.content.stop().animate({width: cW, height: cH, left: l, top: t});
        self.ob.title.stop().animate({left: l, top: t - tH});
      }
      return this;
    }
  },

  resize: function () {
    var self = App;
    if (self.viewType == 'nocontent') {
      self.ob.menuplace.removeClass('wcontent');
      for (var i = 0; i < self.nervous.length; i++) self.nervous[i].freeze();
      var
        bW = $('body').width(),
        bH = $('body').height();
      var
        tW = self.ob.jumpkot.realWidth(),
        tH = self.ob.jumpkot.realHeight();
      self.ob.jumpkot.css({position: 'absolute'}).animate({left: (bW-tW)/2, top: (bH - tH) / 2});
      var
        cW = self.ob.cloudplace.realWidth(),
        cH = self.ob.cloudplace.realHeight(),
        cL = (bW-cW)/2,
        cT = (bH-cH) / 2;
      self.ob.cloudplace.css({position: 'absolute'}).animate({left: cL, top: cT});
      var
        o = self.ob.menu.contacts.css({position: 'absolute'}),
        p = self.ob.menu.contacts.parent().css({position: 'absolute'});
      p.css({width: o.realWidth() + 10, height: o.realHeight() + 10});
        tW = p.realWidth();
        tH = p.realHeight();
      var
        pL = (cL - tW) / 2,
        pT = (cT - tH) /2;
      p.animate({left: pL, top: pT});
      var
        uL = pL +  tW,
        uW = cL - uL,
        uT = pT + tH,
        uH = cT - uT;
      self.ob.arrows.contacts.show().animate({width: uW, height: uH, left: uL, top: uT}); 

        o = self.ob.menu.blog.css({position: 'absolute'}),
        p = self.ob.menu.blog.parent().css({position: 'absolute'});
      p.css({width: o.realWidth() + 10, height: o.realHeight() + 10});
        tW = p.realWidth();
        tH = p.realHeight();
        pL = (cL - tW) / 2;
        pT = cT + cH + (bH - cT - cH - tH) /2;
      p.animate({left: pL, top: pT});

        uL = pL + tW;
        uW = cL - uL;
        uT = cT + cH;
        uH = pT - uT;
      self.ob.arrows.blog.show().animate({width: uW, height: uH, left: uL, top: uT}); 

        o = self.ob.menu.wecando.css({position: 'absolute'}),
        p = self.ob.menu.wecando.parent().css({position: 'absolute'});
      p.css({width: o.realWidth() + 10, height: o.realHeight() + 10});
        tW = p.realWidth();
        tH = p.realHeight();
        pL = cL + cW + (bW - cL - cW - tW) / 2;
        pT = (cT - tH) /2;
      p.animate({left: pL, top: pT});
        uL = cL + cW;
        uW = pL - uL;
        uT = pT + tH;
        uH = cT - uT;
      self.ob.arrows.wecando.show().animate({width: uW, height: uH, left: uL, top: uT}); 

        o = self.ob.menu.portfolio.css({position: 'absolute'}),
        p = self.ob.menu.portfolio.parent().css({position: 'absolute'});
      p.css({width: o.realWidth() + 10, height: o.realHeight() + 10});
        tW = p.realWidth();
        tH = p.realHeight();
        pL = cL + cW + (bW - cL - cW - tW) / 2;
        pT = cT + cH + (bH - cT - cH - tH) /2;
      p.animate({left: pL, top: pT});
        uL = cL + cW;
        uW = pL - uL;
        uT = cT + cH;
        uH = pT - uT;
      self.ob.arrows.portfolio.show().animate({width: uW, height: uH, left: uL, top: uT}); 
      for (var i = 0; i < self.nervous.length; i++) self.nervous[i].unfreeze();
    } else {
      self.ob.menuplace.addClass('wcontent');
      for (var i in self.ob.arrows) self.ob.arrows[i].hide().css({left:0,top:0,width:0,height:0});
      for (var i = 0; i < self.nervous.length; i++) self.nervous[i].unfreeze().stop(true).place().css({left: 0, top: 0});
      var
        bW = $('body').width(),
        bH = $('body').height();
      var
        cW = self.ob.cloudplace.realWidth(),
        cH = self.ob.cloudplace.realHeight(),
        cL = 0,
        cT = 0,
        tW = self.ob.cloud.realWidth(),
        tH = self.ob.cloud.realHeight();
      self.ob.cloudplace.css({position: 'absolute'}).animate({left: cL, top: cT});
      self.ob.cloud.css({position: 'absolute'}).animate({left: (cW - tW) / 2, top: (cH - tH) /2});
        tW = self.ob.jumpkot.realWidth();
        tH = self.ob.jumpkot.realHeight();
      self.ob.jumpkot.css({position: 'absolute'}).animate({left: (cW - tW) / 2 + cL, top: (cH - tH) / 2 + cT});
      tH = cH;
      for (var i in self.ob.menu) {
        var o = self.ob.menu[i];
        o.css({position: 'relative'});
        o.parent().animate({left: cL, top: tH});
        tH+= o.parent().realHeight();
      }
      self.content.left = cW + cL;
      self.content.resize();
    }
  }
}

$(function () {App.init()});

var Nervous = function (place, opts) {
  var self = this;
  opts = opts || {}
  this._ = {
    place: place.css({position: 'absolute'}),
    offset: opts.offset || 10,
    stopOnOver: opts.stopOnOver || false,
    working: false,
    freeze: false,
    duration: opts.duration || 'slow',
    shift: opts.shift || 5
  }

  this.place = function () {return this._.place}

  this.freeze = function () {
    if (!this._.freeze) {
      this._.freeze = true;
      this._.workingState = this._.working;
      this.stop();
    }
    return this;
  }

  this.unfreeze = function () {
    if (this._.freeze) {
      if (this._.workingState) this.start();
      this._.freeze = false;
    }
    return this;
  }

  this.start = function () {
    if (!this._.working) {
      this._.working = true;
      this.animate();
    }
    return this;
  }

  this.stop = function (total) {
    if (this._.working) {
      this._.place.stop();
      if (total) {
        this._.freeze = false;
        this._.workingState = false;
      }
      this._.working = false;
    }
    return this;
  }

  this.animate = function () {
    if (self._.working) {
    var
      pWidth = self._.place.parent().realWidth(),
      pHeight = self._.place.parent().realHeight(),
      cTop = self._.place.position().top,
      cLeft = self._.place.position().left,
      cWidth = self._.place.realWidth(),
      cHeight = self._.place.realHeight();
    var
      cx = cLeft > (pWidth - cWidth - cLeft)?-cLeft:(pWidth - cWidth - cLeft),
      cy = cTop > (pHeight - cHeight - cTop)?-cTop:(pHeight - cHeight - cTop);
    var
      dx = Math.random() * cx,
      dy = Math.random() * cy;
    self._.place.animate({left: cLeft + dx, top: cTop + cy}, self._.duration, self.animate);
    }
  }

  this._.place
    .mouseover(function () {if (self._.stopOnOver) self.freeze()})
    .mouseout(function () {if (self._.stopOnOver) self.unfreeze()})

  return this;
}