/**
  * @constructor Animate
  * @param {HTMLElement} el the element we want to animate
  * @param {String} prop the CSS property we will be animating
  * @param {Object} opts a configuration object
  * object properties include
  * from {Int}
  * to {Int}
  * time {Int} time in milliseconds
  * callback {Function}
  */
function Animate(el, prop, opts) {
  this.el = el;
  this.prop = prop;
  this.from = opts.from;
  this.to = opts.to;
  this.time = opts.time;
  this.callback = opts.callback;
  this.animDiff = this.to - this.from;
}

/**
  * @private
  * @param {String} val the CSS value we will set on the property
  */
Animate.prototype._setStyle = function(val) {
  switch (this.prop) {
    case 'opacity':
      this.el.style[this.prop] = val;
      this.el.style.filter = 'alpha(opacity=' + val * 100 + '); progid:DXImageTransform.Microsoft.BasicImage(opacity='+val+')';
      break;

    default:
      this.el.style[this.prop] = val + 'px';
      break;
  };
};

/**
  * @private
  * this is the tweening function
  */
Animate.prototype._animate = function() {
  var that = this;
  this.now = new Date();
  this.diff = this.now - this.startTime;

  if (this.diff > this.time) {
    this._setStyle(this.to);

    if (this.callback) {
      this.callback.call(this);
    }
    clearInterval(this.timer);
    return;
  }

  this.percentage = (Math.floor((this.diff / this.time) * 100) / 100);
  this.val = (this.animDiff * this.percentage) + this.from;
  this._setStyle(this.val);
};

/**
  * @public
  * begins the animation
  */
Animate.prototype.start = function() {
  var that = this;
  this.startTime = new Date();

  this.timer = setInterval(function() {
    that._animate.call(that);
  }, 4);
};


/**
  * @static
  * @boolean
  * allows us to check if native CSS transitions are possible
  */
Animate.canTransition = function() {
  var el = document.createElement('twitter');
  el.style.cssText = '-webkit-transition: all .5s linear;';
  el.style.cssText = '-o-transition: all .5s linear;';
  el.style.cssText = '-moz-transition: all .5s linear;';
  return !!el.style.webkitTransitionProperty;
}();

/* Utils */


function getElementsByClass(searchClass,node,tag) {
    var classElements = new Array();
    if ( node == null )
        node = document;
    if ( tag == null )
        tag = '*';
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
    for (i = 0, j = 0; i < elsLen; i++) {
        if ( pattern.test(els[i].className) ) {
            classElements[j] = els[i];
            j++;
        }
    }
    return classElements;
}


function getChildElementsByTagName(node,tag) {
    var tagElements = new Array();
    if ( node == null )
        node = document;
    if ( tag == null )
        tag = '*';
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    for (i = 0, j = 0; i < elsLen; i++) {
            tagElements[j] = els[i];
            j++;
    }
    return tagElements;
}


    // event handler
    function addEvent(obj, evType, fn) {
        try {
            if (obj.addEventListener){							// W3C
            // if (window.addEventListener){					// W3C
                obj.addEventListener(evType, fn, false);
               return true;
            } else if (obj.attachEvent) {						// IE
            // } else if (window.attachEvent) {					// IE
                var r = obj.attachEvent("on"+evType, fn);
                return r;
            } else {
                return false;
            }
        } catch (e) {
            alert("addEvent Element\nObject:\n" + obj + "\nError:\n" + e);
        }
    }

    function ie8SafePreventEvent(e) {
        //e.stopPropagation();
        //e.preventDefault();

        if (e.preventDefault){
            e.preventDefault();
        } else {
            if (e.stop) { e.stop(); }
        }

        e.returnValue = false;
        if (e.stopPropagation){
            e.stopPropagation();
        }
    }

function seleccionar(categoria, checked){

    var main = document.getElementById("mosaico");
    if (main == null) {
        main = document.getElementById("todos");
    }

    // this category articles
    // var elems = document.getElementsByName(categoria);
    var elems = getElementsByClass(categoria,main,'li');

    // all articles
    var all_elems = getChildElementsByTagName(main,'li');
    if (checked == false) {
        for ( var x = 0 ; x < all_elems.length ; x++ ) {
            all_elems[x].style.display = 'none';
        }
    }


    for ( var x = 0 ; x < elems.length ; x++ ) {

        if (checked == true) {

            elems[x].style.display = 'block';

            if (Animate.canTransition) {
              elems[x].style.webkitTransition = 'opacity 0.5s ease-out';
              elems[x].style.opacity = 1;
              elems[x].style.filter = 'alpha(opacity=100); progid:DXImageTransform.Microsoft.BasicImage(opacity=1)';
            }

            new Animate(elems[x], 'opacity', {
              from: 0,
              to: 1,
              time: Math.floor(Math.random() * 1000), //500,
              callback: null
            }).start();

        } else {

            if (Animate.canTransition) {
              elems[x].style.webkitTransition = 'opacity 0.5s ease-out';
              elems[x].style.opacity = 0;
              elems[x].style.filter = 'alpha(opacity=0); progid:DXImageTransform.Microsoft.BasicImage(opacity=0)';
            }

            new Animate(elems[x], 'opacity', {
              from: 10,
              to: 0,
              time: Math.floor(Math.random() * 1000),
              callback: null
            }).start();
            elems[x].style.display = 'none';
        }

    }

    if (checked == false) {

        //var main = document.getElementById("mosaico");
        //var all_elems = getChildElementsByTagName(main,'li');

        for ( var x = 0 ; x < all_elems.length ; x++ ) {

            // uncheck categories must stay unchecked!!!!
            var thisClassname = all_elems[x].className;
            var classes = thisClassname.split(' ');
            if (document.getElementById(classes[0]).checked) {

                    all_elems[x].style.display = 'block';
                    if (Animate.canTransition) {
                      all_elems[x].style.webkitTransition = 'opacity 0.5s ease-out';
                      all_elems[x].style.opacity = 1;
                      all_elems[x].style.filter = 'alpha(opacity=100); progid:DXImageTransform.Microsoft.BasicImage(opacity=1)';
                    }

                    new Animate(all_elems[x], 'opacity', {
                      from: 0,
                      to: 1,
                      time: 100 + Math.floor(Math.random() * 500), //500,
                      callback: null
                    }).start();
            }
        }

        // hide current unchecked category
        var elems = document.getElementsByName(categoria);
        for ( var x = 0 ; x < elems.length ; x++ ) {
            elems[x].style.display = 'none';
        }
    }

}



function movemenu(Menu,MenuTopPos, MenuOldPos) {
    var ScrollPos = SAPO.Utility.Dimensions.scrollHeight();

    if (ScrollPos < MenuTopPos) {   // only when far to up than it might
        ScrollPos = MenuTopPos ;
    } else {
        ScrollPos += 10;            // from the really top (when not on top)
    }

    if (MenuTopPos != MenuOldPos) {
        Menu.style.top =ScrollPos + 'px';

    }

    MenuOldPos = ScrollPos;
    return setTimeout('movemenu(s$("switch_category"), '+MenuTopPos+', '+MenuOldPos+')',10);
}