/*
** Studeren in Leiden ~ sil.js
** Author:    Lodewijk Schutte ~ Low
** Purpose:   main JavaScript file, uses Mootools v1.11
** Last edit: 20080522
*/

// ----- ADD CSS FILE
document.write('<link rel="stylesheet" type="text/css" media="screen" href="http://www.studereninleiden.nl/styles/js.css" />');

// ----- Extend String with getHash()

String.extend({
 getHash : function() {
  var hash = this.split('#');
  return hash[1] || false;
 }
});

// ----- GLOBAL OBJECT

var SIL = new Hash;

// ----- CLICKABLE BLOCKS

SIL.set('Clickables', {
 selectors: $A(['li.clickable','#subnav .extra']),
 init: function() {
  $$(this.selectors.join(',')).each(function(el){ new Clickr(el); });
 }
});


// ----- DROP DOWN STUDY SELECTOR JUMPER

SIL.set('Selector', {
 form   : undefined,
 select : undefined,
 url    : undefined,
 select : undefined,
 categoryIndicator : 'categorie',

 jump : function() {
  // get select value, exit if empty
  var val = this.select.value;
  if (!val) return;
  // create url to jump to
  this.select.setProperty('disabled',true);
  // create url to jump to
  var url = this.url + this.select.name + '/' + val + '/';
  // Jump!
  window.location.href = url;
 },

 selectActive : function() {
  var ind = $('indicator');
  if (!ind) return;
  $A(this.select.options).each(function(el){
   if (el.value == ind.className) { el.selected = true; }
  });
 },

 init : function() {
  // get form, exit if not present
  this.form = $('studieselector');
  if (!this.form) return;
  // get select box, exit if not present
  this.select = this.form.getElement('select');
  if (!this.select) return;
  // get action from form
  this.url = this.form.getProperty('action');
  // prevent form from submitting, add jump to select onchange
  this.form.addEvent('submit',function(ev){ new Event(ev).stop(); });
  this.select.addEvent('change',this.jump.bind(this));
  // remove submit button
  try { this.form.getElement('button').remove(); } catch(x) {}
  // insert first empty option if it doesn't exist
  if (this.select.getElement('option').value != '') {
   new Element('option',{'value':'','selected':true}).appendText(this.form.getElement('label').getText()).injectTop(this.select);
  }
  this.selectActive();
 }
});


// ----- SHORTCUTS

SIL.set('Shortcuts', {
 element: undefined,
 wrapper: undefined,
 status: false,
 show: function(ev) {
  if (ev && $type(ev) == 'object') {
   ev = new Event(ev);
   if (!(ev.control && ev.shift)) return true;
   ev.stop();
  }
  if (this.wrapper.innerHTML == '') { this.get(); return; }
  
  var closeLink = new Element('a',{
   'id':'closeshortcuts',
   'href':'#nav',
   'events':{'click':this.close.bindAsEventListener(this)}
  }).appendText('Sluiten');
  closeLink.injectInside(this.wrapper);
  
  var coords = this.element.getCoordinates();
  this.wrapper.setStyles({
   'top' : coords.bottom+9,
   'left' : coords.left-10,
   'opacity' : .95
  });
  
  if (this.status) {
   this.close();
  } else {
   this.open();
  }
 },
 get: function() {
  new Ajax('/studies/azlist/',{method:'get',update:this.wrapper,onComplete:this.show.bind(this)}).request();
 },
 open: function(ev) {
  this.status = true;
  this.wrapper.setStyles({'display':'block','height':0});
  var height = 0;
  this.wrapper.getElements('div').each(function(el){
   var elHeight = el.getSize().size.y;
   if (elHeight > height) height = elHeight;
  });
  new Fx.Style(this.wrapper,'height',{duration:200}).start(0,height);
 },
 close: function(ev) {
  this.status = false;
  if (ev && $type(ev) == 'object') { new Event(ev).preventDefault(); }
  new Fx.Style(this.wrapper,'height',{duration:200,onComplete:(function(){this.wrapper.setStyle('display','none');}).bind(this)}).start(0);
 },
 init: function() {
  var nav = $('nav');
  if (!nav) return;
  var links = nav.getElements('a');
  if (!links) return;
  this.element = links[1]; // == studie link
  if (!this.element) return;
  
  this.wrapper = new Element('div',{'id':'shortcuts','styles':{'display':'none'}});
  this.wrapper.injectAfter(nav);
  
  this.element.addEvent('click',this.show.bindAsEventListener(this));
 }
});


// ----- ZEBRA TABLES

SIL.set('Zebra', {
 selectors: $A(['#primary table']),
 stripe: function(table) {
  var tbody = table.getElement('tbody') || table;
  var rows = tbody.getElements('tr');
  for (var i = 0, j = 1; i <= rows.length; i++,j++) {
   if (!rows[i]) continue;
   var className = (j % 2) ? 'odd' : 'even';
   rows[i].addClass(className);
  } 
 },
 init : function() {
  $$(this.selectors.join(',')).each(function(el) {
   this.stripe(el);
  },this);
 }
});

// ----- SEARCH FORM

SIL.set('SearchForm', {
 form: undefined,
 keywords: undefined,
 invalid: $A([';','(',')','?']),
 sanitize: function(e) {
  new Event(e).stop();
  if (!this.keywords.value.trim().length) return false;
  this.invalid.each(function(c){
   this.keywords.value = this.keywords.value.replace(c,'');
  },this);
  this.form.submit();
 },
 init: function() {
  this.form = $('searchform');
  this.keywords = $('keywords');
  if (!this.form || !this.keywords) return;
  this.form.addEvent('submit',this.sanitize.bindAsEventListener(this));
 }
});


// ----- MEMBER SEARCH SWITCH

SIL.set('MemberSwitch', {
 byName: undefined,
 byGroup: undefined,
 swap: function(e) {
  new Event(e).stop();
  var target = $(this.href.getHash());
  if (target) {
   target.removeClass('hidden');
   $(this).getParent().addClass('hidden');
  }
 },
 init: function() {
  this.byName  = $('by_member_name');
  this.byGroup = $('by_member_group');
  if (!this.byName || !this.byGroup) return;

  this.byName.getElement('a').addEvent('click',this.swap);
  this.byGroup.getElement('a').addEvent('click',this.swap);

 }
});


// ----- TOGGLE FORMS

SIL.set('ToggleForm', {
 form: undefined,
 box: undefined,
 boxes: undefined,
 toggle: function() {
  this.boxes.each(function(el){
   el.checked = this.box.checked;
  },this);
 },
 init: function() {
  this.form = $('toggleform');
  this.box  = $('togglebox');
  if (!this.form || !this.box) return;
  this.boxes = this.form.getElements('input[type=checkbox]');
  this.box.addEvent('click',this.toggle.bind(this));
 }
});

// ----- TOGGLE TABLES

SIL.set('ToggleTable', {
 elements: ['table.main td span','table.aside td span','table.full td span'],
 toggle: function(ev) {
  new Event(ev).stop();
  $(this).getParent().toggleClass('open');
 },
 init: function() {
  var els = $$(this.elements.join(','));
  if (!els) return;
  els.each(function(el){
   var td = el.getParent();
   var a = new Element('a',{'href':'#'}).injectAfter(el);
   el.injectInside(a);
   a.addEvent('click',this.toggle);
  },this);
 }
});

// ----- GRAPHS

SIL.set('Graphs', {
 elements: undefined,
 init: function() {
  this.elements = $$('.graphdata');
  this.elements.each(function(el) {
   el.addClass('hidden');
   var p = new Element('p',{'class':'more'}).injectAfter(el);
   var a = new Element('a',{
    'class':'graph',
    'id':el.id.replace('graph_','ex_'),
    'href':'#primary'
   }).appendText('Meer').injectInside(p);
  })
 }
});

// ----- EXTRAS

SIL.set('Extras', {
 elements: ['a.video','div.long','a.graph','a.slideshow'],
 overlay: undefined,
 target: undefined,
 fac: 'alg',
 isOpen: false,
 build: function() {
  // create new div
  this.overlay = new Element('div',{
   id: 'overlay',
   styles: {
    height: this.target.getSize().size.y
   }
  });
 },
 show: function() {
  if (this.isOpen) return;
  this.overlay.injectTop(this.target);
  this.isOpen = true;
 },
 hide: function() {
  if (!this.isOpen) return;
  this.overlay.remove();
  this.isOpen = false;
 },
 reset: function() {
  this.overlay.empty();
  this.overlay.setStyle('height',this.target.getSize().size.y);
 },
 add: function(el) {
  $(el).injectInside(this.overlay);
 },
 init: function() {
  var els = $$(this.elements.join(','));
  if (!els) return;
  
  var classes = document.body.className.split(' ');
  $A(classes).each(function(str){
   if (str.length == 3) this.fac = str;
  },this);
  
  this.target = $('primary');
  if (!this.target) return;
  
  this.build();
  els.each(function(el){ new Extra(el,this.fac); },this);
 }
});

// ----- IE6 FIXES
if (window.ie6) {
 SIL.set('IE6', {
  init: function() {
   var frame, title;
   if (frame = $('frame'))
    frame.setStyle('background-image','url(/images/photo_bottom.png)');
   if (title = $$('#header .title')[0])
    title.setStyle('background-image','url(/images/header_mask_ie6.png)');
  }
 });
}


// ----- INITIATE HASH 

SIL.each(function(obj,key){
 window.addEvent('domready',obj.init.bind(obj));
});



// ----- CLASSES --------------------------------------------------------------

var Clickr = new Class({
 initialize : function(el) {
  this.element = $(el);
  if (!this.element) return false;

  this.anchor = this.element.getElement('a');
  if (!this.anchor) return false;

  this.element.addClass('json');
  this.element.addEvent('click',this.go.bind(this));
  this.element.addEvent('mouseenter',this.over.bind(this));
  this.element.addEvent('mouseleave',this.out.bind(this));
 },
 go   : function() { window.location.href = this.anchor.href; },
 over : function() { this.element.addClass('hover'); },
 out  : function() { this.element.removeClass('hover'); }
});


var Extra = new Class({
 initialize: function(el,fac) {
  this.element = $(el);
  if (!this.element) return false;

  this.fac    = fac;
  this.id     = this.element.id ? this.element.id.replace('ex_','') : false;
  this.isOpen = false;
  
  this.target = SIL.get('Extras');
  if (this.element.getTag() == 'a') {
   this.xhr = new Ajax('/xml/extras/'+this.id+'/',{method:'get',onComplete:this.show.bind(this)});
   this.element.addEvent('click',this.get.bindAsEventListener(this));
  } else {
   this.content = this.element;
   var p = new Element('p',{'class':'more'});
   var openLink = new Element('a',{
    'href': '#',
    'class': 'open',
    'events': { 'click':this.get.bindAsEventListener(this) }
   }).appendText('Meer');
   this.element.replaceWith(p);
   openLink.injectInside(p);
  }
 },
 get: function(ev) {
  new Event(ev).stop();
  //if (this.isOpen) return;
  this.isOpen = true;  

  this.closeLink = new Element('a',{
   'href': '#',
   'class': 'close',
   'events': { 'click': this.close.bindAsEventListener(this) }
  }).appendText('sluiten');

  this.target.isOpen ? this.target.reset() : this.target.show();
  
  if (this.xhr) {
   this.content = new Element('div').appendText('Loading...');
   this.xhr.request();
  }
  
  this.target.add(this.content)  
  this.target.add(this.closeLink);
 },
 show: function() {
  var xml = this.xhr.response.xml;
  var extra = xml.getElementsByTagName('item')[0];
  
  var title = extra.getElementsByTagName('title')[0].firstChild.nodeValue;
  var type  = extra.getAttribute('type').toLowerCase().replace(' ','');
  var swf   = extra.getElementsByTagName('swf')[0];
  var url   = '/xml/'+type+'/'+this.id+'/'+this.fac;

  /*var src   = extra.getElementsByTagName('url')[0];
  if (src && src.firstChild.nodeValue) {
   url = src.firstChild.nodeValue;
  }*/

  if (swf) {
   // flash attrs
   var attributes = {
    data: swf.firstChild.nodeValue,
    width: swf.getAttribute('width'),
    height: swf.getAttribute('height'),
    version: swf.getAttribute('version')
   }
   // flash pars
   var parameters = {
    flashvars: swf.getAttribute('vars').replace('{ex_url}',url),
    allowfullscreen: 'true',
    wmode: 'opaque'
   }
   // create flash object
   swfobject.createSWF(attributes, parameters, this.content);
  } else {
   // fetch snippet and update content
   new Ajax(url,{method:'get',update:this.content}).request();
  }

 },
 close: function(ev) {
  new Event(ev).stop();
  this.isOpen = false;
  this.target.reset();
  this.target.hide();
 }
});