var articles;

function openBody() {
  $('body').style.display = 'block';
  $('show_article').style.display = 'none';
  $('articles_headline').show();
  $('articles_list').show();
}
function closeBody() {
  $('body').style.display = 'none';
  $('show_article').style.display = 'block';
  $('articles_headline').hide();
  $('articles_list').hide();
}

function openSubcategory(id) {
  $('subcategory_' + id).style.display = 'block';
  $('open_subcategory_' + id).style.display = 'none';
  $('close_subcategory_' + id).style.display = 'block';    
}
function closeSubcategory(id) {
  $('subcategory_' + id).style.display = 'none';
  $('open_subcategory_' + id).style.display = 'block';
  $('close_subcategory_' + id).style.display = 'none';    
}
function openSteps(id) {
  $('steps_' + id).style.display = 'block';
  $('open_steps_' + id).style.display = 'none';
  $('close_steps_' + id).style.display = 'block';
}
function closeSteps(id) {
  $('steps_' + id).style.display = 'none';
  $('open_steps_' + id).style.display = 'block';
  $('close_steps_' + id).style.display = 'none';
}

function populateListArticle(a) {
  var anchor = new Element('a', {'href': 'javascript:loadArticle(' + a.id +');markListArticle(' + a.id + ');'}).update(a.title);
  var li = new Element('li', {'id': ('item_' + a.id)}).update(anchor);
  $('articles_list').insert({'bottom':li});
}

function markListArticle(id) {
  $('articles_list').childElements().each(function(li) {
    if(li.identify() == ('item_' + id)) {
      li.addClassName('current');
      
    }
    else {
      li.removeClassName('current'); 
    }
  });
}

function populateListArticles() {
  articles.each(function(a){
    populateListArticle(a);
  });
}

function loadArticle(id) {
  var url = '/steps/article/' + id;
  new Ajax.Request( url, {
    method: 'get',
    asynchronous: true,
    evalScripts:true,
    onLoading: function(transport) {

    },
    onLoaded: function(transport) {
    },
    onInteractive: function(transport) {
    },
    onSuccess: function(transport) {
    },
    onComplete: function(transport) {    
      var article = transport.responseText.evalJSON(true);
      $('title').update(article.title);
      $('abstract').update(article.abstract);
      $('article_body').update(article.body);
    },
    onFailure: function(transport) {
      alert('Artikelliste konnten nicht geladen werden!');
    }
  });  
}

function loadArticles() {
  var url = '/steps/articles';
  new Ajax.Request( url, {
    method: 'get',
    asynchronous: true,
    evalScripts:true,
    onLoading: function(transport) {

    },
    onLoaded: function(transport) {
    },
    onInteractive: function(transport) {
    },
    onSuccess: function(transport) {
    },
    onComplete: function(transport) {    
      articles = transport.responseText.evalJSON(true);
      populateListArticles();
      markListArticle(articles[0].id);
    },
    onFailure: function(transport) {
      alert('Artikelliste konnten nicht geladen werden!');
    }
  });    
}



function initTagesgeldItemsEvents() {
  $$('.tagesgeldItem').each(function(element) {
    element.observe('click', function(){
      var imageUrl = 'http://tabellen.fmh.de/images/' + element.id + '.jpg';
      window.open(imageUrl, "blank", "toolbar=no, width=760, height=570");
    });
  });
}

Event.observe(window, 'load', function() { 
  $('articles_headline').hide();
  $('articles_list').hide();
  loadArticles();
  initTagesgeldItemsEvents();
});