﻿var pn1 = new PN1();
        
//HERE WE ADD THE NEXT REFERENCE ARROW. THE REASON WHY WE ADD IT IN JAVASCRIPT IS, THAT IF THE USER DO NOT HAVE JAVASCRIPT - THE ARROW IS USELESS - IT HAS NO EFFECT CLICKING IT.
pn1.addEventHandler(window,'load',function() {
  var referencesslider = document.getElementById('reference_elements');
  if (referencesslider != undefined) {
    var elements = pn1.getElementsByClassName(referencesslider,'element','div');
    var width = elements.length * 286;
    referencesslider.style.width = width + 'px';
    
    for (var i = 0; i < elements.length; i++) {
      var element = elements[i];
      var info = pn1.getElementsByClassName(element,'info','div')[0];
      
      var nextelement = document.createElement('img');
      nextelement.setAttribute('src','/Files/Billeder/TKNEW/sliderelements/references_slider_arrow.png');
      nextelement.setAttribute('alt','');
      nextelement.className = 'nextreference';
      nextelement.style.width = 'auto';
      
      pn1.addEventHandler(nextelement,'click',function() {
        var nelement = arguments[0];
        var index = arguments[1];
        var slider = arguments[2];
        var noofelements = arguments[3];
        
        if (index+1 == noofelements) {
          index = 0;
        } else {
          index++;
        }
        
        var pos = index * 286;
        
        $(slider).animate({marginLeft: '-' + pos + 'px'}, 500);
      }.bind(this,nextelement,i,referencesslider,elements.length));
      
      info.appendChild(nextelement);
    }
  }
}.bind(this));
