Toranj Custom js / Masterslider fraction

gistfile1.txt

var msSlider={

		//This is the function that controlls all masterslider instances or atleast it tries to do!
		init:function($target){
			var self=this;

			//Select the target which can be passed to the function or auto selected from DOM
			var $elem=$target || $('.tj-ms-slider');

	
			//Call the main function that apply master slider on selected elements
			$elem.each(function(){

				var $this=$(this);

				//Some basic settings
				var msOptions={
					ewidth:$this.attr('data-width')|| $this.width(),
					eheight:$this.attr('data-height') || $this.height(),
					layout:$this.attr('data-layout') || 'boxed',
					view:$this.attr('data-view') || 'basic',
					dir:$this.attr('data-dir')||'h',
					showCounter:$this.attr('data-counter') || false,
					isGallery:$this.attr('data-gallery') || false,
					autoHeight:$this.attr('data-autoheight') || false,
					hasPlay:$this.attr('data-playbtn') || false,
					galleryWrapper:$this.parents('.tj-ms-gallery'),
					mouse:($this.attr('data-mouse')||true)==true,
					fillMode:$this.attr('data-fillmode')||'fill',
					initialPlay:false,
					overPause:$this.attr('data-overPause') || false,
				}

				self.runSlider($this,msOptions);
			});
		},
		runSlider:function($elem,options){

			var self=this;

			var slider = new MasterSlider(),
				elemID=$elem.attr('id')||'';


		    slider.setup(elemID , {
		        width:options.ewidth,
		        height:options.eheight,
		        layout:options.layout,
		        view:options.view,
		        dir:options.dir,
		        autoHeight:options.autoHeight,
		        space:0,
		        preload:1,
		        centerControls:false,
		        mouse:options.mouse,
		        fillMode:options.fillMode,
		        overPause:options.overPause
	   		 });

		    slider.control('arrows',{autohide:false}); 
		    if (options.hasPlay){
		    	slider.control('timebar'  , {autohide:false,color:"#dc971f"});
		    }

		     if (options.isGallery){
		    	self.makeGallery($elem,slider);	
		     }


		    slider.api.addEventListener(MSSliderEvent.INIT , function(){
		    	var $controlsWrapper=$elem.find('.ms-container'),
		    		$controlUI=$('<div class="tj-controlls tj-controlls-'+options.dir+'mode"></div>').appendTo($controlsWrapper);

		    	//Play pause button
		    	 if (options.hasPlay){
			    	var playBtn=$('<div></div>').addClass('tj-playbtn').appendTo($controlUI);
			    	self.addPlay(slider,playBtn,options);
			    	
			    }

		    	//Next & Prev buttons
		    	$controlUI.append($controlsWrapper.find('.ms-nav-prev'));
		    	//First one is prev and last next add anything in betwen(eg.counter)

			    if (options.showCounter){
	    			var counterMarkup='<div class="tj-ms-counter">'+
		    						'<span class="counter-current">'+(slider.api.index()+1)+'</span>'+
		    						'<span class="counter-divider">/</span>'+
		    						'<span class="counter-total">'+slider.api.count()+'</span>'+
	    						  '</div>';
	    			var $counterMarkup=$(counterMarkup).appendTo($controlUI),
	    				$current=$counterMarkup.find('.counter-current'); 
			    	self.sliderCounter($elem,slider,$current);


			    }

			    slider.api.resume();

		    	$controlUI.append($controlsWrapper.find('.ms-nav-next'));

		    	$(window).trigger('resize');
		    });


		},sliderCounter:function($elem,slider,$current){
		    var self=this;

			slider.api.addEventListener(MSSliderEvent.CHANGE_START , function(){
	    		//slider slide change listener
	    		$current.html(''+(slider.api.index()+1)+'');
			});

		},makeGallery:function($elem,slider){
			//Do the gallery things here... 
			var direction=($elem.hasClass('tj-vertical-gallery'))?'v':'h';

			slider.control('thumblist' , {autohide:false  , dir:direction});


		},addPlay:function(slider,playbtn,options){
			if(options.initialPlay){
				slider.api.resume();
				playbtn.addClass('btn-pause');
			}
		    playbtn.click(function(){
				if(slider.api.paused){
					 slider.api.resume();
					 playbtn.addClass('btn-pause');
				}else{
					 slider.api.pause();
					 playbtn.removeClass('btn-pause');
				}
			});
		}
	}