// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults

actsAsAspect(Ajax.InPlaceEditor.prototype);
Ajax.InPlaceEditor.prototype.after('enterEditMode', MN.Note.resizeTextArea);

Effect.ScrollToXY = Class.create();
Object.extend(Object.extend(Effect.ScrollToXY.prototype, Effect.Base.prototype), {
  initialize: function(element) {
    this.element = $(element);
    this.start(arguments[1] || {});
  },
  setup: function() {
    Position.prepare();
    var offsets = Position.cumulativeOffset(this.element);
    if(this.options.offsetY) offsets[1] += this.options.offsetY;
    if(this.options.offsetX) offsets[0] += this.options.offsetX;
    var maxY = window.innerHeight ? 
      window.height - window.innerHeight :
      document.body.scrollHeight - 
        (document.documentElement.clientHeight ? 
          document.documentElement.clientHeight : document.body.clientHeight);
    var maxX = window.innerWidth ?
      window.width - window.innerWidth :
      document.body.scrollWidth -
        (document.documentElement.clientWidth ?
          document.documentElement.clientWidth : document.body.clientWidth)
    this.scrollStartY = Position.deltaY;
    this.scrollStartX = Position.deltaX;
    this.deltaY = (offsets[1] > maxY ? maxY : offsets[1]) - this.scrollStartY;
    this.deltaX = (offsets[1] > maxX ? maxX : offsets[0]) - this.scrollStartX;
  },
  update: function(position) {
    Position.prepare();
    window.scrollTo(
      this.scrollStartX + (position*this.deltaX),
      this.scrollStartY + (position*this.deltaY));
  }
});

// My Behaviour
MN.rules = {

  // Underneath everything is a very big div which I call the "workspace".
  // The div is a Droppable that accepts drop events from Notes.
  '.workspace': function(el) {
    MN.workspace = new MN.Workspace(el);
  },

  // A Note can be dragged and dropped;
  // it can be edited;
  // it can be resized;
  // it can be restyled;
  // and it can be linked to other Notes via Relations.
  'div.note': function(el) {
    new MN.Note(el);
  },

  'div.note a': function(el) {
    el.onclick = function(ev) {
      Event.stop(ev);
      window.location = this.href;
    }
  },

  '#menu-toggler': function(el) {
    Element.setStyle(el, { cursor: 'w-resize' });
    var ul = $$('#menu ul')[0];
    el.onclick = function(ev) {
      ul.toggle();
      if (ul.getStyle('display') == 'none') {
        el.setStyle({ cursor: 'e-resize' });
        el.src = '/images/arrow-right.gif';
      } else {
        el.setStyle({ cursor: 'w-resize' });
        el.src = '/images/arrow-left.gif';
      }
    }
  },

  '#note.create': function(el) {
    el.onclick = function(ev) {
      var xo    = parseInt(self.innerWidth  / 2 - (320 / 2));
      var yo    = parseInt(self.innerHeight / 2 - (240 / 2));
      var point = MN.getScrollingOffsets(xo, yo);
      new Ajax.Request(
        '/note/create',
        {
          method    : 'post',
          postBody  : 'x=' + point.x + '&y=' + point.y + '&page_id=' + MN.Workspace.current.pageId,
          onSuccess : MN.Note.create
          // TODO - handle 404 and other errors
        }
      );
    }
  },

  '#page.create': function(el) {
    el.onclick = function(ev) {
      $('page-creator').toggle();
    }
  },

  '#page.find': function(el) {
    el.onclick = function(ev) {
      $('page-finder').toggle();
    }
  },

  '#user.register': function(el) {
    el.onclick = function(ev) {
      $('user-registration').toggle();
    }
  },

  '#user.login': function(el) {
    el.onclick = function(ev) {
      $('user-login').toggle();
    }
  }

};

Behaviour.register(MN.rules);
// Event.addBehavior(MN.rules);

Event.observe(window, 'load', MN.Note.drawAllRelations, false);
// Event.onReady(function() {
//   // I'd prefer to cut behaviour out of the picture, but this will do for now.
//   Behaviour.register(MN.rules);
//   Behaviour.apply();
//   MN.Note.drawAllRelations();
// });