﻿        ﻿// accordeon.js
        // Javascript Behaviour for the accordeonBehaviour Control
        // Copyright (c) by Matthias Hertel, http://www.mathertel.de
        // This work is licensed under a BSD style license. See http://www.mathertel.de/License.aspx
        // ----- 
        // 13.05.2007 created by Matthias Hertel
        // 18.12.2007 Simplifications and documentation.
        // 12.01.2008 adding postback-support by saving the current open area.
        var AccordeonBehaviour = {
          /// <summary>Implementation of a JavaScript Behavior for a accordeon control.
          /// This control implements a space saving visual effect with multiple stacked
          /// areas of content. There is only one of the content areas visible.
          /// Any other area can be made visible by clicking into the associated title.</summary>

          _timer: null, /// <summary>reference to the timer used for the transitions</summary>
          _openarea: 0, /// <summary>number of the part that is visible.</summary>
          
          init: function () {
            /// <summary>Initialize the component and show the last open area.</summary>
            var area = -1;
            var clickedObj = "";
            var uniqueid;
          }, // init
          
          // --- events

          unique: function(id){
              uniqueid = id;
          },
        
          onclick: function (evt) {
            /// <summary>Handle click events for opening a new accordeon area.</summary>
            evt = evt || window.event;
            if (this._timer == null)
              clickedObj = evt.srcElement;
              this.SlideOpen(evt.srcElement);
          }, // onclick


          // --- public methods
          SlideOpen: function (obj) {
            /// <summary>Start opening a new content area.
            /// Setup the timer and start the size transitions.</summary>
            var h, c;
            var area = 0;
            // search the HEADER
            while ((obj != null) && (obj != this) && (obj.className != "cmsAcClose"))
              obj = obj.parentNode;
            if ((obj != null) && (obj != this) && (obj.className == "cmsAcClose"))
              if(obj.className != "cmsAcTot"){
                  obj.className = "cmsAcOpen";
                  obj.firstChild.firstChild.firstChild.firstChild.className = "cmsAcTitleBefore";
              }
            h = obj;
            
            // search the next CONTENT
            while ((obj != null) && (obj != this) && (obj.className != "cmsAcContent"))
              obj = obj.nextSibling;
              
            if ((obj != null) && (obj != this) && (obj.className == "cmsAcContent")) {
              c = obj;
              c.style.height = "0px";
              c.className = "cmsAcContentA";
              
              // adjustClassNames and calc the openPart number
              var allElements = this.getElementsByTagName("div");
              for (var n = 0; n < allElements.length; n++) {
                var obj = allElements[n];
                if ((obj.className == "cmsAcOpen") && (obj != h))
                    if(document.getElementById(uniqueid + 'Label1').title == "True"){
                        obj.className = "cmsAcClose";
                        obj.firstChild.firstChild.firstChild.firstChild.className = "cmsAcTitleBefore";
                    }
                if ((obj.className == "cmsAcContentA") && (obj != c))
                    if(document.getElementById(uniqueid + 'Label1').title == "True"){
                        obj.className = "cmsAcContent";
                    }
                if (obj.className == "cmsAcClose") area++;
                if (obj.className == "cmsAcOpen") this._openarea = area;

              } // for
              
              // save the new state of the accordeon to enable round-trips.
              c = this.firstChild;
              if (c.tagName == "INPUT")
                c.value = this._openarea;
              
              // start sliding...
              this._timer = window.setTimeout(this._resizeItem.bind(this), 5);
            } // if
               if (obj.className == "cmsAcTot"){
                if(clickedObj.className == "cmsAcOpen"){
                    clickedObj.className = "cmsAcClose";
                    //kijken firefox of internet explorer
                    if(clickedObj.nextSibling.className != "cmsAcContentA"){
                        //image veranderen
                        objTemp = clickedObj.nextSibling.nextSibling;
                        SlideBack();
                        clickedObj.nextSibling.nextSibling.className = "cmsAcContent";
                    }else{
                        objTemp = clickedObj.nextSibling;
                        SlideBack();
                        clickedObj.nextSibling.className = "cmsAcContent";
                    }        
                }else if(clickedObj.parentNode.parentNode.parentNode.parentNode.className == "cmsAcOpen"){
                    clickedObj = clickedObj.parentNode.parentNode.parentNode.parentNode;
                    clickedObj.className = "cmsAcClose";
                    if(clickedObj.nextSibling.className != "cmsAcContentA"){
                        objTemp = clickedObj.nextSibling.nextSibling;
                        SlideBack();
                        clickedObj.nextSibling.nextSibling.className = "cmsAcContent";
                    }else{
                        objTemp = clickedObj.nextSibling;
                        SlideBack();
                        clickedObj.nextSibling.className = "cmsAcContent";
                    }        
                }
           }
          }, // SlideOpen
          

          _resizeItem: function (obj) {
            /// <summary>Handle the internal timer event and
            /// resize the accordeon content regions by a view pixel.</summary>
            var allElements = this.getElementsByTagName("div");
            var isFinished = true;
            var delta;

            this._timer = null;

            for (var n = 0; n < allElements.length; n++) {
              var obj = allElements[n];
              if (obj.className == "cmsAcContentA") {
                // enlarge
                //obj.previousSibling.onclick = this.sluitNode(this);
                delta = obj.scrollHeight - obj.offsetHeight;
                if (delta <= 0) {
                  // nothing.
                } else if ((delta <= 2) && (delta > 0)) {
                  // snap exactly
                  obj.style.height = obj.offsetHeight + "px";
                } else {
                  obj.style.height = Math.round(obj.offsetHeight + Math.max(2, Math.min(12, delta/3))) + "px";
                  isFinished = false;
                } // if
                  
              } else if (obj.className == "cmsAcContent") {
                // shrink
                delta = obj.offsetHeight;
                if (delta <= 0) {
                  // nothing.
                } else if (delta <= 2) {
                  // snap exactly
                  obj.style.height = "0px";
                } else {
                  obj.style.height = Math.round(obj.offsetHeight - Math.max(2, Math.min(12, delta/3))) + "px";
                  isFinished = false;
                } // if
              }
            } // for
            if (! isFinished)
              this._timer = window.setTimeout(this._resizeItem.bind(this), document.getElementById(uniqueid + 'Label2').title/10);
          }// _resizeItem
        } // accordeonBehaviour
        // End
        
        function sluitNode(){
            this.c.className = 'cmsAcClose';
            this._resizeItem();
        }
                
        var objTemp = ""
        function SlideBack(){
            // shrink
            var obj = objTemp;
            var isFinished = true;
            var delta = obj.offsetHeight;
            if (delta <= 0) {
              // nothing.
            } else if (delta <= 2) {
              // snap exactly
              obj.style.height = "0px";
            } else {
              obj.style.height = Math.round(obj.offsetHeight - Math.max(2, Math.min(12, delta/3))) + "px";
              isFinished = false;
            } // if
            if (! isFinished){
                objTemp = obj;
                setTimeout("SlideBack();", document.getElementById(uniqueid + 'Label2').title/50);
            }
        }

