collapse - plynulé odkrývání

/*
+----------------------------------------------------------------+
|    WordPress Plugin: Collapsible Elements                                         |
|    http://deuced.net/wpress/collapsible-elements/                             |
|    File Information:                                                                                 |
|    - Collapsible Elements Javascript                                                       |
|    - wp-content/plugins/collapsible-elements/xcelements.js        |
| This code is based on Arvind Satyanarayan example which        |
| toggles the visibility of multiple  elements on a page         |
| http://blog.movalog.com/a/javascript-toggle-visibility/        |
+----------------------------------------------------------------+
*/

var currentccommid;
function xcollapse(id) 
{ 
  var ccommid = document.getElementById(id); 
  if(ccommid !== null)
  {
    if(ccommid.style.display == 'block')
    {
      ccommid.style.display = 'none';
    }
    else
    {
      if(currentccommid) currentccommid.style.display = 'none';
      ccommid.style.display = 'block';
      currentccommid = ccommid;
    }
  }
}

/**
 * @overview Interpolace, animace
 * @version 1.0
 * @author Zara
 */

/**
 * @class Periodicky interpolator
 * @group jak-utils
 */

  SZN.Interpolator = SZN.ClassMaker.makeClass({
    NAME:"Interpolator",
    VERSION:"1.0",
    CLASS:"class"
});

/** @constant */ SZN.Interpolator.LINEAR = 1;
/** @constant */ SZN.Interpolator.QUADRATIC = 2;
/** @constant */ SZN.Interpolator.SQRT = 3;
/** @constant */ SZN.Interpolator.SIN = 4;
/** @constant */ SZN.Interpolator.ASIN = 5;

/**
 * @param {float} startVal pocatecni hodnota
 * @param {float} endVal koncova hodnota
 * @param {int} interval doba trvani v msec
 * @param {function} callback periodicky callback
 * @param {object} [options] opsny
 * @param {int} [options.frequency=20]
 * @param {int} [options.interpolation=SZN.Interpolator.LINEAR]
 * @param {function} [options.endCallback]
 */
SZN.Interpolator.prototype.$constructor = function(startVal, endVal, interval, callback, options) {
    this.startVal = startVal;
    this.endVal = endVal;
    this.interval = interval;
    this.callback = callback;
    this.options = {
        interpolation:SZN.Interpolator.LINEAR,
        frequency:20,
        endCallback:false
    }
    this.running = false;
    this._tick = SZN.bind(this, this._tick);

    for (var p in options) { this.options[p] = options[p]; }
}


/**
 * zavola callback
 * @private
 * @param {float} frac cislo mezi nulou a jednickou
 */
SZN.Interpolator.prototype._call = function(frac) {
    var result = this._interpolate(frac);
    var delta = this.endVal - this.startVal;
    this.callback(this.startVal + delta*result);
}

/**
 * provede interpolaci na zaklade this.options.interpolation
 * @private
 * @param {float} val cislo mezi nulou a jednickou
 */
SZN.Interpolator.prototype._interpolate = function(val) {
    if (typeof(this.options.interpolation) == "function") {
        return this.options.interpolation(val);
    }
    switch (this.options.interpolation) {
        case SZN.Interpolator.QUADRATIC: return val*val;
        case SZN.Interpolator.SQRT: return Math.sqrt(val);
        case SZN.Interpolator.SIN: return (Math.sin(Math.PI * (val-0.5)) + 1) / 2;
        case SZN.Interpolator.ASIN: return (Math.asin(2 * (val-0.5)) + Math.PI/2) / Math.PI;
        default: return val; /* default, linear */
    }
}

/**
 * spusti animaci
 */
SZN.Interpolator.prototype.start = function() {
    if (this.running) { return; }
    this.running = true;
    this.startTime = (new Date()).getTime();
    this._call(0);
    this.handle = setInterval(this._tick, this.options.frequency);
}

/**
 * zastavi animaci
 */
SZN.Interpolator.prototype.stop = function() {
    if (!this.running) { return; }
    this.running = false;
    clearInterval(this.handle);
}

/**
 * krok interpolace
 * @private
 */
SZN.Interpolator.prototype._tick = function() {
    var now = (new Date()).getTime();
    var elapsed = now - this.startTime;
    if (elapsed >= this.interval) {
        this.stop();
        this._call(1);
        if (this.options.endCallback) { this.options.endCallback(); }
    } else {
        this._call(elapsed / this.interval);
    }
}

/**
 * @class Interpolator CSS vlastnosti
 * @group jak-utils
 */
SZN.CSSInterpolator = SZN.ClassMaker.makeClass({
    NAME:"CSSInterpolator",
    VERSION:"1.0",
    CLASS:"class"
});

/**
 * @param {element} elm HTML prvek
 * @param {int} interval doba animace v msec
 * @param {object} [options] opsny pro interpolator
 * @see SZN.Interpolator
 */
SZN.CSSInterpolator.prototype.$constructor = function(elm, interval, options) {
    this.elm = elm;
    this.properties = [];
    this.colors = [];

    this._tick = SZN.bind(this, this._tick);
    this.interpolator = new SZN.Interpolator(0, 1, interval, this._tick, options);
}

/**
 * prida novou vlastnost k animovani
 * @param {string} property CSS vlastnost
 * @param {float} startVal pocatecni hodnota
 * @param {float} endVal koncova hodnota
 * @param {string} [suffix=""] volitelna pripona pro CSS hodnotu (typicky 'px')
 */
SZN.CSSInterpolator.prototype.addProperty = function(property, startVal, endVal, suffix) {
    var o = {
        property:property,
        startVal:startVal,
        endVal:endVal,
        suffix:suffix || ""
    }
    this.properties.push(o);
}

/**
 * prida novou barevnou vlastnost k animovani
 * @param {string} property CSS vlastnost
 * @param {string} startVal pocatecni hodnota
 * @param {string} endVal koncova hodnota
 */
SZN.CSSInterpolator.prototype.addColorProperty = function(property, startVal, endVal) {
    var o = {
        startVal:SZN.Parser.color(startVal),
        endVal:SZN.Parser.color(endVal),
        property:property
    };
    this.colors.push(o);
}

/**
 * spusti animaci
 */
SZN.CSSInterpolator.prototype.start = function() {
    this.interpolator.start();
}

/**
 * zastavi animaci
 */
SZN.CSSInterpolator.prototype.stop = function() {
    this.interpolator.stop();
}

/**
 * nastavi spravne hodnoty pro opacity v zavislosti na prohlizeci
 * @private
 */
SZN.CSSInterpolator.prototype._setOpacity = function(prop, frac){
    var propNew = {};

    // tady spocitej hodnotu pro ruzne klienty a prirad ji do cssPropValue;
    if (SZN.Browser.client == "ie" && SZN.Browser.version < 8) {
        propNew.property = 'filter';
        var val = Math.round(prop.startVal*100 + frac * (prop.endVal*100 - prop.startVal*100));
        propNew.val = 'progid:DXImageTransform.Microsoft.Alpha(opacity=' + val + ');';
    } else {
        propNew.property = 'opacity';
        var val = prop.startVal + frac * (prop.endVal - prop.startVal);
        propNew.val = val;
    }
    return propNew;
}

/**
 * krok animace
 * @private
 */
SZN.CSSInterpolator.prototype._tick = function(frac) {
    for (var i=0;i<this.properties.length;i++) {
        var prop = this.properties[i];

        switch (prop.property) {
            case "opacity" :
                var propNew = this._setOpacity(prop, frac);
                this.elm.style[propNew.property] = propNew.val;
                continue;
            break;

            default:
                var val = prop.startVal + frac * (prop.endVal - prop.startVal);
                val += prop.suffix;
                this.elm.style[prop.property] = val;
        }
    }

    var names = ["r", "g", "b"];
    for (var i=0;i<this.colors.length;i++) {
        var c = this.colors[i];
        var out = [0,0,0];
        for (var j=0;j<names.length;j++) {
            var name = names[j];
            out[j] = c.startVal[name] + Math.round(frac*(c.endVal[name]-c.startVal[name]));
        }
        var result = "rgb(" + out.join(",") + ")";
        this.elm.style[c.property] = result;
    }
}