var Blog = {
  articles: new Array(),
  createArticle: function( article ) {
    this.articles.push( new BlogArticle( article ) );
  },
  collapseAllExcept: function( articleId ) {
    for( var i=0; i<this.articles.length; i++ )
      if ( this.articles[ i ].article_id != articleId && !this.articles[ i ].collapsed ) {
        this.articles[ i ].collapse();
        this.articles[ i ].toggleState();
      }
  },
  retrieveData: function( articleId, dataType, callback ) {
    var phpScript = ( 'full' == dataType )
      ? 'xml/expandArticle/' : 'xml/collapseArticle/';
    var cn = new Remote();
  	cn.uri = BASE_URL + phpScript + articleId;
  	cn.registerListener( 'onLoad', { handleEvent: function( eventType, eventSource, xmlResponse ) {
  	  callback.call( this, xmlResponse );
  	} } );
  	cn.send( 'post' );
  }
}

function BlogArticle( htmlElement ) {
  this.domNode = htmlElement;
  this.article_id = htmlElement.id.substr( 8 ); //  l'id commence tjs par `article_`
  this.collapsed = ( htmlElement.className.indexOf( 'collapsed' ) != -1 );

  var paragraphs = htmlElement.getElementsByTagName( 'p' );
  var tmp = null;
  for( var i=0; i<paragraphs.length; i++ )
    if ( paragraphs[ i ].className == 'button' ) {
      tmp = paragraphs[ i ];
      break;
    }
  if ( !isNull( tmp ) ) {
    this.toggle_trigger = tmp.childNodes[ 0 ];
    addListener( this.toggle_trigger, 'click', Delegate.create( this, 'onTriggerClick' ) );

    //  On va garder en mémoire de manière à ne pas faire plusieurs fois la mm requête XML
    this.teaser_nodes = new Array();
    this.full_nodes = new Array();
    if ( this.collapsed ) {
      for( var i=0; i<htmlElement.childNodes.length; i++ )
        if ( htmlElement.childNodes[ i ] != this.toggle_trigger.parentNode )
          this.teaser_nodes.push( htmlElement.childNodes[ i ] );
    } else {
      for( var i=0; i<htmlElement.childNodes.length; i++ )
        if ( htmlElement.childNodes[ i ] != this.toggle_trigger.parentNode )
          this.full_nodes.push( htmlElement.childNodes[ i ] );
    }
  }

  this.toString = function() {
    return '[BlogArticle] ' + this.article_id;
  }

  this.removeContent = function() {
    while( this.domNode.childNodes.length > 0 && this.domNode.firstChild != this.toggle_trigger.parentNode )
      this.domNode.removeChild( this.domNode.firstChild );
  }

  this.setContent = function( nodes ) {
    this.removeContent();
    for( var i=0; i<nodes.length; i++ )
      this.domNode.insertBefore( nodes[ i ], this.toggle_trigger.parentNode );
  }

  //  Affiche un message d'attente
  this.wait = function() {
    this.removeContent();

    var wait = document.createElement( 'div' );
    wait.className = 'waitPanel';
    var img = document.createElement( 'img' );
    img.setAttribute( 'src', '/pix/wait.gif' );
    wait.appendChild( img );
    wait.appendChild( document.createTextNode( 'Chargement...' ) );

    this.domNode.insertBefore( wait, this.toggle_trigger.parentNode );
  }
  //  Affiche un message d'erreur
  this.raiseError = function( errTxt ) {
    this.removeContent();

    var err = document.createElement( 'div' );
    err.className = 'errorPanel';
    var img = document.createElement( 'img' );
    img.setAttribute( 'src', '/pix/error.gif' );
    err.appendChild( img );
    err.appendChild( document.createTextNode( errTxt ) );

    this.domNode.insertBefore( err, this.toggle_trigger.parentNode );
  }

  //  Intervertit l'état de l'article et l'apparence du déclencheur
  this.toggleState = function() {
    var anchor_text = anchor_classname = null;
    if ( this.collapsed ) {
      anchor_text = 'Lire la suite';
      anchor_classname = 'expand';
    } else {
      anchor_text = 'Réduire';
      anchor_classname = 'collapse';
    }
    this.toggle_trigger.className = anchor_classname;
    this.toggle_trigger.replaceChild( document.createTextNode( anchor_text ), this.toggle_trigger.firstChild );
  }

  //  Contracte l'article en affichant le teaser
  this.collapse = function() {
    if ( 0 == this.teaser_nodes.length ) {
    	this.wait();
      Blog.retrieveData( this.article_id, 'teaser', Delegate.create( this, 'onTeaserData' ) );
    } else {
      this.setContent( this.teaser_nodes );
    }
    this.collapsed = true;
  }

  //  Étend l'article en affichant le contenu complet
  this.expand = function() {
    if ( 0 == this.full_nodes.length ) {
    	this.wait();
      Blog.retrieveData( this.article_id, 'full', Delegate.create( this, 'onFullData' ) );
    } else {
      this.setContent( this.full_nodes );
    }
    this.collapsed = false;
  }

  //  Callback pour le click sur le déclencheur en fin d'article
  this.onTriggerClick = function( e ) {
    DOMEvent.preventDefault( e );

    this.toggle_trigger.blur();

    if ( this.collapsed )
      this.expand();
    else
      this.collapse();

    this.toggleState();
  }

  //  Callback appelée à la fin du chargement des données XML du teaser
  this.onTeaserData = function( response ) {
    var root = response.xml.getElementsByTagName( 'article' )[ 0 ];
    if ( !isNull( root ) ) {
      var articleDate = getXmlText( root.getElementsByTagName( 'date' )[ 0 ] );
      var articleTitle = getXmlText( root.getElementsByTagName( 'title' )[ 0 ] );
      var articleCategory = getXmlText( root.getElementsByTagName( 'category' )[ 0 ] );
      var articleText = getXmlText( root.getElementsByTagName( 'text' )[ 0 ] );

      this.teaser_nodes = new Array();
      if ( !isNull( articleCategory ) ) {
        var titleNode = document.createElement( 'div' );
        titleNode.className = 'titre';

        if ( !isNull( articleDate ) ) {
          var dateNode = document.createElement( 'span' );
          dateNode.className = 'date';
          dateNode.innerHTML = articleDate;
          titleNode.appendChild( dateNode );
        }

        var categoryNode = document.createElement( 'h1' );
        categoryNode.innerHTML = articleCategory;
        titleNode.appendChild( categoryNode );

        this.teaser_nodes.push( titleNode );
      }
      if ( !isNull( articleTitle ) ) {
        var titleNode = document.createElement( 'h2' );
        titleNode.innerHTML = articleTitle;
        this.teaser_nodes.push( titleNode );
      }
      if ( !isNull( articleText ) ) {
        var textNode = document.createElement( 'p' );
        textNode.innerHTML = articleText;
        this.teaser_nodes.push( textNode );
      }

      this.setContent( this.teaser_nodes );
    } else {
      this.raiseError( 'Impossible de récupérer les données XML' );
    }
  }

  //  Callback appelée à la fin du chargement des données XML de l'article
  this.onFullData = function( response ) {
    var root = response.xml.getElementsByTagName( 'article' )[ 0 ];
    if ( !isNull( root ) ) {
      var articleDate = getXmlText( root.getElementsByTagName( 'date' )[ 0 ] );
      var articleTitle = getXmlText( root.getElementsByTagName( 'title' )[ 0 ] );
      var articleSubTitle = getXmlText( root.getElementsByTagName( 'subtitle' )[ 0 ] );
      var articleCategory = getXmlText( root.getElementsByTagName( 'category' )[ 0 ] );
      var articleText = getXmlText( root.getElementsByTagName( 'text' )[ 0 ] );
      var articlePicture = root.getElementsByTagName( 'picture' )[ 0 ];
      var articlePictureLegend = articlePictureAlign = articlePictureWidth = articlePictureHeight = null;
      if ( !isNull( articlePicture ) ) {
        articlePictureLegend = articlePicture.getAttribute( 'legend' );
        articlePictureAlign = articlePicture.getAttribute( 'align' );
        articlePictureWidth = articlePicture.getAttribute( 'width' );
        articlePictureHeight = articlePicture.getAttribute( 'height' );
        articlePicture = articlePicture.getAttribute( 'src' );
      }

      var articleInsetTitle = getXmlText( root.getElementsByTagName( 'inset_title' )[ 0 ] );
      var articleInsetText = getXmlText( root.getElementsByTagName( 'inset_text' )[ 0 ] );

      this.full_nodes = new Array();
      if ( !isNull( articleCategory ) ) {
        var titleNode = document.createElement( 'div' );
        titleNode.className = 'titre';

        if ( !isNull( articleDate ) ) {
          var dateNode = document.createElement( 'span' );
          dateNode.className = 'date';
          dateNode.innerHTML = articleDate;
          titleNode.appendChild( dateNode );
        }

        var categoryNode = document.createElement( 'h1' );
        categoryNode.innerHTML = articleCategory;
        titleNode.appendChild( categoryNode );
        this.full_nodes.push( titleNode );
      }
      if ( !isNull( articleTitle ) ) {
        var titleNode = document.createElement( 'h2' );
        titleNode.innerHTML = articleTitle;
        this.full_nodes.push( titleNode );
      }
      if ( !isNull( articlePicture ) ) {
        var divImage = document.createElement( 'div' );
        divImage.className = 'blog_picture';
        if ( 0 != articlePictureAlign )
          divImage.className += ( 1 == articlePictureAlign )
            ? ' left_align' : ' right_align';
        var imgNode = document.createElement( 'img' );
        imgNode.setAttribute( 'src', articlePicture );
        imgNode.setAttribute( 'alt', '' );
        if ( articlePictureWidth != null )
          imgNode.setAttribute( 'width', articlePictureWidth );
        if ( articlePictureHeight != null )
          imgNode.setAttribute( 'height', articlePictureHeight );
        divImage.appendChild( imgNode );
        if ( '' != articlePictureLegend ) {
          var pNode = document.createElement( 'p' );
          pNode.className = 'legend';
          pNode.appendChild( document.createTextNode( articlePictureLegend ) );
          divImage.appendChild( pNode );
        }
        this.full_nodes.push( divImage );
      }
      if ( !isNull( articleSubTitle ) ) {
        var titleNode = document.createElement( 'h3' );
        titleNode.innerHTML = '<span>' + articleSubTitle + '</span>';
        this.full_nodes.push( titleNode );
      }
      if ( !isNull( articleText ) ) {
        var textNode = document.createElement( 'p' );
        textNode.innerHTML = articleText;
        this.full_nodes.push( textNode );
      }
      if ( !isNull( articleInsetTitle ) || !isNull( articleInsetText ) ) {
        var encartNode = document.createElement( 'div' );
        encartNode.className = 'encard';
        var contentNode = document.createElement( 'div' );
        contentNode.className = 'encard_content';

        if ( !isNull( articleInsetTitle ) ) {
          var titleNode = document.createElement( 'h3' );
          titleNode.innerHTML = articleInsetTitle;
          contentNode.appendChild( titleNode );
        }
        if ( !isNull( articleInsetText ) ) {
          var textNode = document.createElement( 'p' );
          textNode.innerHTML = articleInsetText;
          contentNode.appendChild( textNode );
        }
        encartNode.appendChild( contentNode );
        this.full_nodes.push( encartNode );
      }

      this.setContent( this.full_nodes );
    	Blog.collapseAllExcept( this.article_id );
    } else {
      this.raiseError( 'Impossible de récupérer les données XML' );
    }
  }
}

addListener( window, 'load', function() {
  var divs = document.getElementsByTagName( 'div' );
  for( var i=0; i<divs.length; i++ )
    if ( divs[ i ].className.indexOf( 'article' ) != -1 )
      Blog.createArticle( divs[ i ] );
} );