/*
  ReflectiSquare
  --------------
  This thing here takes boxes stacked on top of each other and
  labled with the ids blah_top and blah_bottom. They are then
  respectively moved up and down, away from a common 
  horizontal axis.

  One of these days I'll make a nice class out of this thing

  (cc) MMVI, Robert Otani.
  This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 2.5 License
  http://creativecommons.org/licenses/by-nc-sa/2.5/

*/

OST.Rfl = {
  config : {
    sqOrig:{},
    boxes: ['swt', 'prose', 'tbd'],
    boxtypes: ['_top', '_bottom']  
  },
  
  refreshOrigin : function() {
    for (var i=0; i < OST.Rfl.config.boxes.length; i++) {
      for (var j=0; j < OST.Rfl.config.boxtypes.length; j++) {
        var name = OST.Rfl.config.boxes[i] + OST.Rfl.config.boxtypes[j];
        OST.Rfl.config.sqOrig[name] = YD.getXY(name);
      }
    }
  },
  
  draw : function() {
    var m = YD.get('main');
    // get reflectisquares within main to calculate width
    var squares = YD.getElementsByClassName('reflsq', 'div');
    var width = 0;
    for (var i=0; i < squares.length; i++) {
      width += parseInt(YD.getStyle(squares[i], 'width'));
    };
    m.style.width = width + 6 + "px";
    YD.setStyle(squares, 'display', 'block');

    // Cache origins of each reflectisquare
    OST.Rfl.refreshOrigin();
  },
  
  floooat : function(e) {
    var moveBy = 30;
    var duration = 0.7;
    var origin = OST.Rfl.config.sqOrig[this.id];
    var ref = this.id.replace('top', 'bottom');
    var reflection = OST.Rfl.config.sqOrig[ref];
    var prpIcnAnim = {points: {to: origin, control:[origin[0], origin[1]-moveBy]}};
    var prpRefAnim = {points: {to: reflection, control:[reflection[0], reflection[1]+moveBy]}};
    var icnAnim = new YM(this.id, prpIcnAnim, duration);
    var refAnim = new YM(ref, prpRefAnim, duration);
    if(icnAnim.isAnimated()) {
      icnAnim.stop();
      refAnim.stop();
    } else {
      icnAnim.animate();
      refAnim.animate();
    }
  },
  
  linky : function(e) {
    var links = {
      swt_top: 'sw' + 't/',
      prose_top: 'jour' + 'nal/',
      tbd_top: 'http://www.pictorymag.com/showcases/san-francisco/#pictory-274'
    };
    window.location = links[this.id];
  },
  
  init : function() {
    OST.Rfl.draw();
    YE.addListener('wedding', 'click', OST.Rfl.linky);

    // This seems faster than getElementsByClassName
    for (var i=0; i < OST.Rfl.config.boxes.length; i++) {
      for (var j=0; j < OST.Rfl.config.boxtypes.length; j++) {
        var name = OST.Rfl.config.boxes[i] + OST.Rfl.config.boxtypes[j];
        if (0 == j) {
          YE.addListener(name, 'mouseover', OST.Rfl.floooat);  
          YE.addListener(name, 'click', OST.Rfl.linky);
        }
      }
    }
  }
  
};

YE.addListener(window, 'load', OST.Rfl.init);
YE.addListener(window, 'resize', OST.Rfl.refreshOrigin);