/*
* ###################################################
* #                                                 #
* #    author: marko maksym                         #
* m    website: http://blognauki.in.ua/my-works/    m
* #    project name: mx-slider                      #  
* #    e-mail: markomaksym@gmail.com                #
* x    date of creation: 04.10.2016                 x
* #    last modified:                               #
* #                                                 #
* ###################################################
*/

;( function( $ ){

	$.defaultconfig = {
		nav: true, // create forward and backward buttons. if set to "false", the navigation will not be
		dots: false, // buttons to navigate
		timeslide: 1000, // the length of time 
		autoplay: false, // autoplay
		autoplayspeed: 5000 // autoplay speed
	};

	$.fn.mxslider = function( params ){
		var settings = $.extend( {}, $.defaultconfig, params );
		sliderperform( this, settings );
	};

	function sliderperform( root, settings ){

		/* ---------------------------------------------
		*                create slider
		----------------------------------------------*/
		var
		countslide,
		heightslide,
		createslider = {

			createclass: function(){
				root.addclass( 'mx-slider_wrap' );
			},

			createwrap: function(){
				root.wrap( '<div class="mxslider"></div>' );
			},

			createnavigation: function(){
				if( settings.nav == true ){
					$( '<div class="mx-navigation"><div class="mx-prev">предыдущий</div><div class="mx-next">следующий</div></div>' ).appendto( '.mxslider' );
				}				
			},

			createitemslider: function(){
				root.children().addclass( 'mx-slide' );
			},

			getheightitem: function(){
				heightslide = root.children().eq(0).height() - 4;
				settimeout( function(){ root.css( 'height', heightslide + 'px' ); }, 500 );
			},

			getcountslide: function(){
				countslide = root.children( '.mx-slide' ).length;			
			},

			setzindex: function(){
				var i = countslide;
				$( '.mx-slide' ).each( function(){
					$(this).css( 'z-index', i-- );
				} );				
			},

			createdonsnavigation: function(){
				if( settings.dots == true ){
					$( '<div class="mx-nav_dots"></div>' ).appendto( '.mxslider' );
					var d = 1;
					$( '.mx-slide' ).each( function(){
						$( '<span>' + d + '</span>' ).appendto( '.mx-nav_dots' );
						d++;
					} );
					$( '.mx-nav_dots span' ).eq( 0 ).addclass( 'dotactive' );
					
				}
			},

			// init function
			init: function(){
				// add class
				this.createclass();
				// create wrapper
				this.createwrap();
				// add class children item
				this.createitemslider();
				// get count slides
				this.getcountslide();
				// set z-index for slide
				this.setzindex();
				// get height
				this.getheightitem();
				// create navigation
				this.createnavigation();
				// create dots-navigation
				this.createdonsnavigation();
			}
		};

		/* initialise */ 
		createslider.init();

		/* -------------------------------------------------
		*                functions slider
		--------------------------------------------------*/

		// func play next
		function playnext(){
			if( keymotion == true ){
				keymotion = false;

				$( '.mx-slide' ).each( function(){
					if( $( this ).css( 'z-index' ) == countslide ){
						$( this ).animate( { 'left': '-100%' }, settings.timeslide );
					}
				});

				settimeout( function(){

					$( '.mx-slide' ).each( function(){
						getzi = $( this ).css( 'z-index' );
						$( this ).css( 'z-index', parseint( getzi ) + 1 );
					} );

					$( '.mx-slide' ).each( function(){
						if( $( this ).css( 'z-index' ) == countslide + 1 ){
							$( this ).css( 'z-index', '1' );
							$( this ).css( 'left', '0%' );
						}								
					} );

					// dots active
					if( settings.dots == true ){

						$( '.mx-slide' ).each( function(){
							zinex = $( this ).css( 'z-index' );
							if( zinex == countslide ){
								nthchild = $( this ).index();
								if( nthchild == countslide ){
									nthchild = 0;
								}
								$( '.mx-nav_dots span' ).removeclass( 'dotactive' );
								$( '.mx-nav_dots span' ).eq( nthchild ).addclass( 'dotactive' );						
							}					
						} );

					}
					keymotion = true;
				}, settings.timeslide + 100 );

			}	
		}

		// func play back
		function playback(){
			if( keymotion == true ){
				keymotion = false;

				$( '.mx-slide' ).each( function(){
					if( $( this ).css( 'z-index' ) == 1 ){
						$( this ).css( 'left', '-100%' );
					}
				});

				settimeout( function(){

					$( '.mx-slide' ).each( function(){
						getzi = $( this ).css( 'z-index' );
						$( this ).css( 'z-index', parseint( getzi ) - 1 );
					} );

					$( '.mx-slide' ).each( function(){
						if( $( this ).css( 'z-index' ) == 0 ){
							$( this ).css( 'z-index', countslide );
							$( this ).animate(  { 'left': '0%' }, settings.timeslide  );
						}
					} );

				},100 );

				settimeout( function(){
					// dots active
					if( settings.dots == true ){

						$( '.mx-slide' ).each( function(){
							zinex = $( this ).css( 'z-index' );
							if( zinex == countslide ){
								var nthchild = $( this ).index();
								$( '.mx-nav_dots span' ).removeclass( 'dotactive' );
								$( '.mx-nav_dots span' ).eq( nthchild ).addclass( 'dotactive' );						
							}					
						} );

					}
					keymotion = true;
				}, settings.timeslide + 200 );	

			}
		}

		// func autoplay
		function autoplay(){
			if( settings.autoplay == true ){				
				autoplayinit = setinterval( function(){
					playnext();
				},settings.autoplayspeed );
			}
		}

		// func autoplay amend
		function autoplayamend(){
			clearinterval( autoplayinit );
			autoplay();
		}

		/*-------------------------------------------------
		*               functional init
		--------------------------------------------------*/

		var
		keymotion = true,
		autoplayinit = null,
		motionslide = {

			nextslide: function(){
				$( '.mx-next' ).on( 'click', function(){
					playnext();
					autoplayamend();
				} );
			},

			prevslide: function(){
				$( '.mx-prev' ).on( 'click', function(){
					playback();
					autoplayamend();
				});
			},

			autoplayint: function(){
				autoplay();
			},

			dotsmotion: function(){
				$( '.mx-nav_dots span' ).on( 'click', function(){
					autoplayamend();
					var thisdonnum = $( this ).text(),
						thissildernth;

					$( '.mx-slide' ).each( function(){
						thissilderzi = parseint( $( this ).css( 'z-index' ) );
						if( thissilderzi == countslide ){
							thissildernth = $( this ).index() + 1;								
						}
					} );
					
					if( thissildernth < thisdonnum && keymotion == true ){
						var dotintervalnext = setinterval( function(){
								keymotion = false;
								if( thissildernth != thisdonnum ){

										$( '.mx-slide' ).each( function(){
											if( $( this ).css( 'z-index' ) == countslide ){
												$( this ).animate( { 'left': '-100%' }, 200 );
											}
										});

										settimeout( function(){

											$( '.mx-slide' ).each( function(){
												getzi = $( this ).css( 'z-index' );
												$( this ).css( 'z-index', parseint( getzi ) + 1 );
											} );

											$( '.mx-slide' ).each( function(){
												if( $( this ).css( 'z-index' ) == countslide + 1 ){
													$( this ).css( 'z-index', '1' );
													$( this ).css( 'left', '0%' );
												}								
											} );

											// dots active
											if( settings.dots == true ){

												$( '.mx-slide' ).each( function(){
													zinex = $( this ).css( 'z-index' );
													if( zinex == countslide ){
														nthchild = $( this ).index();														
														$( '.mx-nav_dots span' ).removeclass( 'dotactive' );
														$( '.mx-nav_dots span' ).eq( nthchild ).addclass( 'dotactive' );						
													}					
												} );

											}	

										}, 300 );

								} else{
									clearinterval( dotintervalnext );
									keymotion = true;
								}								
								thissildernth++;
						},400 );

					} else if( thissildernth > thisdonnum && keymotion == true ){

						var
						dotintervalprev = setinterval( function(){
							keymotion = false;
							if( thissildernth != thisdonnum ){

								$( '.mx-slide' ).each( function(){
									if( $( this ).css( 'z-index' ) == 1 ){
										$( this ).css( 'left', '-100%' );
									}
								});

								settimeout( function(){

									$( '.mx-slide' ).each( function(){
										getzi = $( this ).css( 'z-index' );
										$( this ).css( 'z-index', parseint( getzi ) - 1 );
									} );

									$( '.mx-slide' ).each( function(){
										if( $( this ).css( 'z-index' ) == 0 ){
											$( this ).css( 'z-index', countslide );
											$( this ).animate(  { 'left': '0%' }, 200  );
										}
									} );

									// dots active
									if( settings.dots == true ){

										$( '.mx-slide' ).each( function(){
											zinex = $( this ).css( 'z-index' );
											if( zinex == countslide ){
												nthchild = $( this ).index();												
												$( '.mx-nav_dots span' ).removeclass( 'dotactive' );
												$( '.mx-nav_dots span' ).eq( nthchild ).addclass( 'dotactive' );						
											}					
										} );

									}	

								},100 );

							} else{
								clearinterval( dotintervalprev );
								keymotion = true;
							}							
							thissildernth--;
						},400 );					

					}
				} );
			},

			// motion function
			contrmotion: function(){
				// next slider
				this.nextslide();
				// prev slider
				this.prevslide();
				// autoplay
				this.autoplayint();
				// dots
				this.dotsmotion();
			}
			
		};

		/* controller */
		motionslide.contrmotion();

		// responsive
		var resize;
		$( window ).resize( function(){
			cleartimeout( resize );
			resize = settimeout( function(){
				heightslide = root.children().eq(0).height() - 4;
				root.css( 'height', heightslide + 'px' );
			},600 );
		} );
		
	}

} )( jquery );