/***********************
* Adobe Edge Composition Actions
*
* Edit this file with caution, being careful to preserve 
* function signatures and comments starting with 'Edge' to maintain the 
* ability to interact with these actions from within Adobe Edge
*
***********************/
(function($, Edge, compId){
var Composition = Edge.Composition, Symbol = Edge.Symbol; // aliases for commonly used Edge classes

   //Edge symbol: 'stage'
   (function(symbolName) {
      
      
      Symbol.bindElementAction(compId, symbolName, "document", "compositionReady", function(sym, e) {
         //TOUCH / DRAG SLIDER
         	var rail = sym.$("slider");
         	var railWidth = rail.width();
         	var railX = rail.offset().left;
         	var railRightX = railX + railWidth;
         	var startX=0;
         	var moveIt=0
         	var startPos=railX;
         
         rail.bind("touchstart", touchStartX); //bind touch function to thumb
         rail.bind("touchmove", moveMe); //bind touch function to thumb
         rail.bind("mousedown", mouseMoveMe); //bind mouse function to thumb
         //strip details
         var stripShow = sym.getSymbol("slider").$("buttonstrip");
         var stripWidth = stripShow.width();
         var moveStrip = stripWidth-railWidth;
         function touchStartX(e){ //handle mousedown event
         	startX = e.touches[0].pageX;
         }	
         function moveMe(e) {
         		e.preventDefault(); //prevents it firing a click when touched
              var orig = e.originalEvent;
         		var pos = 0;
         		pos = orig.touches[0].pageX;
         		var moveDistance=startX-pos;
         		moveIt=startPos-moveDistance;   
         		if(pos>=railX&&pos<=railRightX){
         			if(moveIt<=0&&moveIt>=-moveStrip){
                  	stripShow.css({'left':moveIt});
                  	}
         	}
         };
         function mouseMoveMe(e){ //handle mousedown event
         	startX = e.pageX;
         sym.getComposition().getStage().getSymbolElement().mousemove(handleMouseMove); //bind mousemove functions to stage in case cursor goes oustide the thumb
         sym.getComposition().getStage().getSymbolElement().mouseup(handleMouseUp); //bind mouseup functions to stage 
         }	
         function handleMouseMove(jqEvent){
         		e.preventDefault(); //prevents it firing a mouse click when mousedown
         	var pos = 0;
         		pos = jqEvent.pageX;
         		var moveDistance=startX-pos;
         		moveIt=startPos-moveDistance;         	
         		if(pos>=railX&&pos<=railRightX){
         			if(moveIt<=0&&moveIt>=-moveStrip){
                  	stripShow.css({'left':moveIt});
                  	}
         	}
         }
         function handleMouseUp(jqEvent){ // handle mouseup event
         sym.getComposition().getStage().getSymbolElement().unbind("mousemove");
         sym.getComposition().getStage().getSymbolElement().unbind("mouseup");
         startPos=moveIt;
         }
         function handleTouchUp(jqEvent){ // handle touchup event
         sym.getComposition().getStage().getSymbolElement().unbind("touchmove");
         sym.getComposition().getStage().getSymbolElement().unbind("touchend");
         }
         
         //Text & other variables
         sym.$("captionTxt").css('line-height', '120%');
         var headline;
         var headlinetxt = sym.$("headlineTxt");
         var order;
         var caption;
         var pictures;
         var mainPic = sym.$("main_pic");
         
         //AJAX retrieves data from xml source specified in url, maps xml variable to DOM object variable
         function resetCaps(){
         $.ajax({	
         	type: "GET",
         	url: "GN30459.xml",
         	dataType: "xml",
         	success: function(xml) {
         
         		headline = $(xml).find('headline').text();
         		sym.$("headlineTxt").html(headline);
         
         		order = $(xml).find('order0').text();
         		sym.$("orderTxt").html(order);
         
         		caption = $(xml).find('caption0').text();
         		sym.$("captionTxt").html(caption);
         
         		drag = $(xml).find('drag').text();
         		sym.$("dragTxt").html(drag);
         
         		pictures = $(xml).find('pictures').text();
         		sym.$("picturesTxt").html(pictures);
         
         		}
         	});
         }
         resetCaps();
         
         
         //CHANGE THE FOLLOWING	
         var thumbWidth=20; //distance between origin of thumbnail images
         var n=10; //number of images
         var thumbs = 8; //number of thumbnails per screen
         var space = 0; //pixels offset at beginning of buttonstrip
         var ttime= 500; //transition time in milliseconds
         var stripw=1440; //width of button strip symbol
         var RTL="false"; //change true/false to change direction
         var igmeasure=600; //width of whole graphic
         //For RTL, the order of the images must also be reversed and the button strip moved so that it starts on the RH side of the graphic
         //END CHANGES
         
         var rtloff=igmeasure-stripw;//width of iGraphic - needed for RTL conversion
         var fwd;
         var back;
         fwd=(RTL=="true")?0:1; 
         back=(RTL=="true")?1:0;
         
         //set variables for image gallery
         sym.setVariable("number", 0);
         sym.setVariable("strip", 0);
         
         //CREATE MAIN FORWARD-BACK BUTTONS
         var mainbtnArray = ["mainBtn0","mainBtn1"]; // back and forward buttons
         		for (var m=0; m<mainbtnArray.length; m++){
         		sym.$("mainBtn"+m).bind('click', mainbtnClick);
         		//sym.$("mainBtn"+i).bind('mouseover', btnShow);
         		//sym.$("mainBtn"+i).bind('mouseout', btnHide);
         		}
         function mainbtnClick() {
         			var selected_id = $(this).attr("id");
         			$.ajax({    
             		type: "GET",
             		url: "GN30459.xml",
             		dataType: "xml",
             		success: function(xml) { 
          			var id = sym.getVariable("number");
         			var next;
         			if(selected_id == "Stage_mainBtn"+back){
         				next = id-1;
          				if(next==0){
         				sym.$("logo").show();
         				sym.$("captionTxt").css({'top':188});
         				}
         				if(next<1){
         				sym.$("mainBtn"+back).hide();
         				sym.$("stripBtn"+back).hide();
         				}
         				if(next<n-thumbs){
         				sym.$("stripBtn"+fwd).show();
         				}
         				if(next>n-thumbs){
         				sym.$("stripBtn"+fwd).hide();
         				}
         				if(next<n-1){
         				sym.$("mainBtn"+fwd).show();
         				}
         				if (id>n-thumbs){
         					if (RTL=="true"){
         							//sym.getSymbol("slider").$("buttonstrip").animate ({left: rtloff+((n-thumbs)*(thumbWidth))-space}, 0);
         							ttime=0;
         							moveIt=rtloff+((n-thumbs)*(thumbWidth))-space;
         					}else{
         							//sym.getSymbol("slider").$("buttonstrip").animate ({left: ((n-thumbs)*-(thumbWidth))+space}, 0);
         							ttime=0;
         							moveIt=((n-thumbs)*-(thumbWidth))+space;
         					}
         
         				}else{
         					if (RTL=="true"){
         							moveIt=rtloff+(next*(thumbWidth))-space;
         					}else{
         							moveIt=(next*-(thumbWidth))+space;
         					}
         				}
         			}else{  
         			//forward button
         			next = id+1;
         				if(next>0){
         				sym.$("logo").hide();
         				sym.$("captionTxt").css({'top':39});
         				sym.$("mainBtn"+back).show();
         				sym.$("stripBtn"+fwd).show();
         				}
         				if(next<n-thumbs-1){
         				sym.$("stripBtn"+back).show();
         				}
         				if(next>n-thumbs-1){
         				sym.$("stripBtn"+fwd).hide();
         				}
         				if(next>n-2){
         				sym.$("mainBtn"+fwd).hide();
         				}
         				if (id<n-thumbs){
         					if (RTL=="true"){
         							moveIt=rtloff+(next*(thumbWidth))-space;
         					}else{
         							moveIt=(next*-(thumbWidth))+space;
         					}
         				}
         			}
         			   sym.getSymbol("slider").$("buttonstrip").animate ({left: moveIt}, ttime);
         			 	startPos=moveIt;
         				pictures = $(xml).find('picture'+next).text();
                 		sym.$("pictureTxt").html(pictures);
                 		caption = $(xml).find('caption'+next).text();
                 		sym.$("captionTxt").html(caption);
                 		order = $(xml).find('order'+next).text();
                 		sym.$("orderTxt").html(order);
         
         			for (var i=0; i<n; i++){
         				if (i==next){
         				mainPic.attr("src","images/pic_"+next+".jpg");
           				sym.getSymbol("slider").getSymbol("buttonstrip").$("btn"+i).css({"background-color":"rgba(255,0,0,1.0)"});
         				}else{
           				sym.getSymbol("slider").getSymbol("buttonstrip").$("btn"+i).css({"background-color":"rgba(252,175,23,1.0)"});
         				}
         			}
         				sym.setVariable("number", next);
         				//sym.getSymbol("slider").$("buttonstrip").animate ({left: (thumbs*s*-(thumbWidth))+space}, ttime);		
                        }
             		});
         			e.preventDefault()
         }
         
         
         
         //CREATE BACK AND FORWARD BUTTONS on BUTTONSTRIP
         var btnArray = ["stripBtn0","stripBtn1"]; // back and forward buttons
         		for (var b=0; b<btnArray.length; b++){
         		sym.$("stripBtn"+b).bind('click', stripbtnClick);
         		}
         
         
         
         function stripbtnClick() {
         			var selected_id = $(this).attr("id");
         			var s = sym.getVariable("strip");
         		if(selected_id == "Stage_stripBtn"+back){ //back button
         			if (s>0){ 
         				if (s<=i){ 
         					sym.$("stripBtn"+back).hide(); 
         				}else{
         					sym.$("stripBtn"+back).show(); 
         					} 
         				s=s-1;
         			}else{
         				 s=0; 	
         				 sym.$("stripBtn"+back).hide(); 
         				 }
         					if(RTL=="true"){
         					moveIt=rtloff+(thumbs*s*(thumbWidth))-space;
         					}else{
         					moveIt=(thumbs*s*-(thumbWidth))+space;
         					}
         			sym.$("stripBtn"+fwd).show(); 
         		}else{  //forward button
         			if (s>(n/thumbs)-2){ s= Math.floor(n/thumbs);
         					if(RTL=="true"){
         					moveIt= rtloff+((n-thumbs)*(thumbWidth))-space;
         					}else{
         					moveIt=((n-thumbs)*-(thumbWidth))+space;					
         					}
         				sym.$("stripBtn"+fwd).hide();
         			}else{ 
         				s=s+1;
         					if(RTL=="true"){
         					moveIt= rtloff+(thumbs*s*(thumbWidth))-space;
         					}else{
         					moveIt=(thumbs*s*-(thumbWidth))+space;					
         					}
         				sym.$("stripBtn"+fwd).show();
         			}
         			sym.$("stripBtn"+back).show(); 
         
         		}
         		sym.getSymbol("slider").$("buttonstrip").animate ({left: moveIt}, ttime);					
         		startPos=moveIt;
         		sym.setVariable("strip", s);
         		e.preventDefault()
         	}
         
         
         //CREATE THUMBNAIL IMAGE BUTTONS
         for (var j=0; j<n; j++){
         		sym.getSymbol("slider").getSymbol("buttonstrip").$("btn"+j).bind('click', thClick);
           		sym.getSymbol("slider").getSymbol("buttonstrip").$("btn"+j).css({"background-color":"rgba(252,175,23,1.0)", "cursor":"pointer"});
         		}
         
         function thClick() {
         			var selected_id = $(this).attr("id");
         			$.ajax({    
             				type: "GET",
             				url: "GN30459.xml",
             				dataType: "xml",
             				success: function(xml) {
         					for (var i=0; i<n; i++){
         						if(selected_id == "Stage_slider_buttonstrip_btn" + i){
         						pictures = $(xml).find('picture' + i).text();
                 				sym.$("pictureTxt").html(pictures);    
                 				caption = $(xml).find('caption' + i).text();
                 				sym.$("captionTxt").html(caption);
                 				order = $(xml).find('order' + i).text();
                 				sym.$("orderTxt").html(order);
           						sym.getSymbol("slider").getSymbol("buttonstrip").$("btn"+i).css({"background-color":"rgba(255,0,0,1.0)"});
         						mainPic.attr("src","images/pic_"+i+".jpg");
         							if(i>0){ sym.$("mainBtn"+back).show(); sym.$("stripBtn"+back).show(); }//show back button once selected image is past the first
         							if(i<1){ sym.$("mainBtn"+back).hide(); sym.$("stripBtn0"+back).hide(); }//hide back button if first image is selected
         							if(i<n-thumbs-1){ sym.$("stripBtn"+fwd).show(); }	//hide forward button if last image is selected
         							if(i>n-thumbs-1){ sym.$("stripBtn"+fwd).hide(); }	//hide forward button if last image is selected	
         							if(i>n-2){ sym.$("mainBtn"+fwd).hide(); }	//hide forward button if last image is selected	
         							if(i<n-1){ sym.$("mainBtn"+fwd).show(); }	//show forward button if selected image is before the last
         							//move strip horizontally
         
         							if (i<n-thumbs+1){
         								if(RTL=="true"){
         								moveIt=rtloff+(i*(thumbWidth))-space; 
         								}else{
         								moveIt=(i*-(thumbWidth))+space; 
         								}
         							}else{ 
         								if(RTL=="true"){
         								moveIt=rtloff+((n-thumbs)*(thumbWidth))-space;
         								}else{
         								moveIt=((n-thumbs)*-(thumbWidth))+space;
         								}
         							}
         						sym.getSymbol("slider").$("buttonstrip").animate ({left: moveIt}, ttime);
         						startPos=moveIt;					
         						sym.setVariable("strip", Math.floor(i/thumbs));
         						sym.setVariable("number", i);
         						}else{				
           		            sym.getSymbol("slider").getSymbol("buttonstrip").$("btn"+i).css({"background-color":"rgba(252,175,23,1.0)"});
         					}
         			}
                         }
             			});
         		e.preventDefault()
         		}
         
         sym.$("mainBtn"+back).hide();
         sym.$("stripBtn"+back).hide();
         
         
         

      });
      //Edge binding end

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

      

   })("stage");
   //Edge symbol end:'stage'

//=========================================================

//Edge symbol: 'backBtn'
(function(symbolName) {

















})("back_butt");
   //Edge symbol end:'back_butt'

//=========================================================

//Edge symbol: 'forwardBtn'
(function(symbolName) {

















})("forward_butt");
   //Edge symbol end:'forward_butt'

   //=========================================================
   
   //Edge symbol: 'button_strip'
   (function(symbolName) {   
   
      

   })("button_strip");
   //Edge symbol end:'button_strip'

   //=========================================================
   
   //Edge symbol: 'strip'
   (function(symbolName) {   
   
   })("strip");
   //Edge symbol end:'strip'

})(jQuery, AdobeEdge, "GraphicNews30386");