jssor.slider.js

js 4malayalees.com collected 2026-10-02 18:21:01 UTC 165,847 bytes, 4,088 lines download raw bytes

1ï»¿/// <reference path="Jssor.js" />
2
3/*
4* Jssor.Slider 18.0
5* http://www.jssor.com/
6*
7* Licensed under the MIT license:
8* http://www.opensource.org/licenses/MIT
9* 
10* TERMS OF USE - Jssor.Slider
11* 
12* Copyright 2014 Jssor
13*
14* Permission is hereby granted, free of charge, to any person obtaining
15* a copy of this software and associated documentation files (the
16* "Software"), to deal in the Software without restriction, including
17* without limitation the rights to use, copy, modify, merge, publish,
18* distribute, sublicense, and/or sell copies of the Software, and to
19* permit persons to whom the Software is furnished to do so, subject to
20* the following conditions:
21* 
22* The above copyright notice and this permission notice shall be
23* included in all copies or substantial portions of the Software.
24* 
25* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
26* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
27* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
28* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
29* LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
30* OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
31* WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
32*/
33
34var $JssorSlider$;
35var $JssorSlideshowFormations$ = window.$JssorSlideshowFormations$ = {};
36var $JssorSlideshowRunner$;
37
38new function () {
39    //Constants +++++++
40
41    var COLUMN_INCREASE = 0;
42    var COLUMN_DECREASE = 1;
43    var ROW_INCREASE = 2;
44    var ROW_DECREASE = 3;
45
46    var DIRECTION_HORIZONTAL = 0x0003;
47    var DIRECTION_VERTICAL = 0x000C;
48
49    var TO_LEFT = 0x0001;
50    var TO_RIGHT = 0x0002;
51    var TO_TOP = 0x0004;
52    var TO_BOTTOM = 0x0008;
53
54    var FROM_LEFT = 0x0100;
55    var FROM_TOP = 0x0200;
56    var FROM_RIGHT = 0x0400;
57    var FROM_BOTTOM = 0x0800;
58
59    var ASSEMBLY_BOTTOM_LEFT = FROM_BOTTOM + TO_LEFT;
60    var ASSEMBLY_BOTTOM_RIGHT = FROM_BOTTOM + TO_RIGHT;
61    var ASSEMBLY_TOP_LEFT = FROM_TOP + TO_LEFT;
62    var ASSEMBLY_TOP_RIGHT = FROM_TOP + TO_RIGHT;
63    var ASSEMBLY_LEFT_TOP = FROM_LEFT + TO_TOP;
64    var ASSEMBLY_LEFT_BOTTOM = FROM_LEFT + TO_BOTTOM;
65    var ASSEMBLY_RIGHT_TOP = FROM_RIGHT + TO_TOP;
66    var ASSEMBLY_RIGHT_BOTTOM = FROM_RIGHT + TO_BOTTOM;
67
68    //Constants -------
69
70    //Formation Definition +++++++
71    function isToLeft(roadValue) {
72        return (roadValue & TO_LEFT) == TO_LEFT;
73    }
74
75    function isToRight(roadValue) {
76        return (roadValue & TO_RIGHT) == TO_RIGHT;
77    }
78
79    function isToTop(roadValue) {
80        return (roadValue & TO_TOP) == TO_TOP;
81    }
82
83    function isToBottom(roadValue) {
84        return (roadValue & TO_BOTTOM) == TO_BOTTOM;
85    }
86
87    function PushFormationOrder(arr, order, formationItem) {
88        formationItem.push(order);
89        arr[order] = arr[order] || [];
90        arr[order].push(formationItem);
91    }
92
93    $JssorSlideshowFormations$.$FormationStraight = function (transition) {
94        var cols = transition.$Cols;
95        var rows = transition.$Rows;
96        var formationDirection = transition.$Assembly;
97        var count = transition.$Count;
98        var a = [];
99        var i = 0;
100        var col = 0;
101        var r = 0;
102        var cl = cols - 1;
103        var rl = rows - 1;
104        var il = count - 1;
105        var cr;
106        var order;
107        for (r = 0; r < rows; r++) {
108            for (col = 0; col < cols; col++) {
109                cr = r + ',' + col;
110                switch (formationDirection) {
111                    case ASSEMBLY_BOTTOM_LEFT:
112                        order = il - (col * rows + (rl - r));
113                        break;
114                    case ASSEMBLY_RIGHT_TOP:
115                        order = il - (r * cols + (cl - col));
116                        break;
117                    case ASSEMBLY_TOP_LEFT:
118                        order = il - (col * rows + r);
119                    case ASSEMBLY_LEFT_TOP:
120                        order = il - (r * cols + col);
121                        break;
122                    case ASSEMBLY_BOTTOM_RIGHT:
123                        order = col * rows + r;
124                        break;
125                    case ASSEMBLY_LEFT_BOTTOM:
126                        order = r * cols + (cl - col);
127                        break;
128                    case ASSEMBLY_TOP_RIGHT:
129                        order = col * rows + (rl - r);
130                        break;
131                    default:
132                        order = r * cols + col;
133                        break; //ASSEMBLY_RIGHT_BOTTOM
134                }
135                PushFormationOrder(a, order, [r, col]);
136            }
137        }
138
139        return a;
140    };
141
142    $JssorSlideshowFormations$.$FormationSwirl = function (transition) {
143        var cols = transition.$Cols;
144        var rows = transition.$Rows;
145        var formationDirection = transition.$Assembly;
146        var count = transition.$Count;
147        var a = [];
148        var hit = [];
149        var i = 0;
150        var col = 0;
151        var r = 0;
152        var cl = cols - 1;
153        var rl = rows - 1;
154        var il = count - 1;
155        var cr;
156        var courses;
157        var course = 0;
158        switch (formationDirection) {
159            case ASSEMBLY_BOTTOM_LEFT:
160                col = cl;
161                r = 0;

162                courses = [ROW_INCREASE, COLUMN_DECREASE, ROW_DECREASE, COLUMN_INCREASE];
163                break;
164            case ASSEMBLY_RIGHT_TOP:
165                col = 0;
166                r = rl;
167                courses = [COLUMN_INCREASE, ROW_DECREASE, COLUMN_DECREASE, ROW_INCREASE];
168                break;
169            case ASSEMBLY_TOP_LEFT:
170                col = cl;
171                r = rl;
172                courses = [ROW_DECREASE, COLUMN_DECREASE, ROW_INCREASE, COLUMN_INCREASE];
173                break;
174            case ASSEMBLY_LEFT_TOP:
175                col = cl;
176                r = rl;
177                courses = [COLUMN_DECREASE, ROW_DECREASE, COLUMN_INCREASE, ROW_INCREASE];
178                break;
179            case ASSEMBLY_BOTTOM_RIGHT:
180                col = 0;
181                r = 0;
182                courses = [ROW_INCREASE, COLUMN_INCREASE, ROW_DECREASE, COLUMN_DECREASE];
183                break;
184            case ASSEMBLY_LEFT_BOTTOM:
185                col = cl;
186                r = 0;
187                courses = [COLUMN_DECREASE, ROW_INCREASE, COLUMN_INCREASE, ROW_DECREASE];
188                break;
189            case ASSEMBLY_TOP_RIGHT:
190                col = 0;
191                r = rl;
192                courses = [ROW_DECREASE, COLUMN_INCREASE, ROW_INCREASE, COLUMN_DECREASE];
193                break;
194            default:
195                col = 0;
196                r = 0;
197                courses = [COLUMN_INCREASE, ROW_INCREASE, COLUMN_DECREASE, ROW_DECREASE];
198                break; //ASSEMBLY_RIGHT_BOTTOM
199        }
200        i = 0;
201        while (i < count) {
202            cr = r + ',' + col;
203            if (col >= 0 && col < cols && r >= 0 && r < rows && !hit[cr]) {
204                //a[cr] = i++;
205                hit[cr] = true;
206                PushFormationOrder(a, i++, [r, col]);
207            }
208            else {
209                switch (courses[course++ % courses.length]) {
210                    case COLUMN_INCREASE:
211                        col--;
212                        break;
213                    case ROW_INCREASE:
214                        r--;
215                        break;
216                    case COLUMN_DECREASE:
217                        col++;
218                        break;
219                    case ROW_DECREASE:
220                        r++;
221                        break;
222                }
223            }
224
225            switch (courses[course % courses.length]) {
226                case COLUMN_INCREASE:
227                    col++;
228                    break;
229                case ROW_INCREASE:
230                    r++;
231                    break;
232                case COLUMN_DECREASE:
233                    col--;
234                    break;
235                case ROW_DECREASE:
236                    r--;
237                    break;
238            }
239        }
240        return a;
241    };
242
243    $JssorSlideshowFormations$.$FormationZigZag = function (transition) {
244        var cols = transition.$Cols;
245        var rows = transition.$Rows;
246        var formationDirection = transition.$Assembly;
247        var count = transition.$Count;
248        var a = [];
249        var i = 0;
250        var col = 0;
251        var r = 0;
252        var cl = cols - 1;
253        var rl = rows - 1;
254        var il = count - 1;
255        var cr;
256        var courses;
257        var course = 0;
258        switch (formationDirection) {
259            case ASSEMBLY_BOTTOM_LEFT:
260                col = cl;
261                r = 0;
262                courses = [ROW_INCREASE, COLUMN_DECREASE, ROW_DECREASE, COLUMN_DECREASE];
263                break;
264            case ASSEMBLY_RIGHT_TOP:
265                col = 0;
266                r = rl;
267                courses = [COLUMN_INCREASE, ROW_DECREASE, COLUMN_DECREASE, ROW_DECREASE];
268                break;
269            case ASSEMBLY_TOP_LEFT:
270                col = cl;
271                r = rl;
272                courses = [ROW_DECREASE, COLUMN_DECREASE, ROW_INCREASE, COLUMN_DECREASE];
273                break;
274            case ASSEMBLY_LEFT_TOP:
275                col = cl;
276                r = rl;
277                courses = [COLUMN_DECREASE, ROW_DECREASE, COLUMN_INCREASE, ROW_DECREASE];
278                break;
279            case ASSEMBLY_BOTTOM_RIGHT:
280                col = 0;
281                r = 0;

282                courses = [ROW_INCREASE, COLUMN_INCREASE, ROW_DECREASE, COLUMN_INCREASE];
283                break;
284            case ASSEMBLY_LEFT_BOTTOM:
285                col = cl;
286                r = 0;
287                courses = [COLUMN_DECREASE, ROW_INCREASE, COLUMN_INCREASE, ROW_INCREASE];
288                break;
289            case ASSEMBLY_TOP_RIGHT:
290                col = 0;
291                r = rl;
292                courses = [ROW_DECREASE, COLUMN_INCREASE, ROW_INCREASE, COLUMN_INCREASE];
293                break;
294            default:
295                col = 0;
296                r = 0;
297                courses = [COLUMN_INCREASE, ROW_INCREASE, COLUMN_DECREASE, ROW_INCREASE];
298                break; //ASSEMBLY_RIGHT_BOTTOM
299        }
300        i = 0;
301        while (i < count) {
302            cr = r + ',' + col;
303            if (col >= 0 && col < cols && r >= 0 && r < rows && typeof (a[cr]) == 'undefined') {
304                PushFormationOrder(a, i++, [r, col]);
305                //a[cr] = i++;
306                switch (courses[course % courses.length]) {
307                    case COLUMN_INCREASE:
308                        col++;
309                        break;
310                    case ROW_INCREASE:
311                        r++;
312                        break;
313                    case COLUMN_DECREASE:
314                        col--;
315                        break;
316                    case ROW_DECREASE:
317                        r--;
318                        break;
319                }
320            }
321            else {
322                switch (courses[course++ % courses.length]) {
323                    case COLUMN_INCREASE:
324                        col--;
325                        break;
326                    case ROW_INCREASE:
327                        r--;
328                        break;
329                    case COLUMN_DECREASE:
330                        col++;
331                        break;
332                    case ROW_DECREASE:
333                        r++;
334                        break;
335                }
336                switch (courses[course++ % courses.length]) {
337                    case COLUMN_INCREASE:
338                        col++;
339                        break;
340                    case ROW_INCREASE:
341                        r++;
342                        break;
343                    case COLUMN_DECREASE:
344                        col--;
345                        break;
346                    case ROW_DECREASE:
347                        r--;
348                        break;
349                }
350            }
351        }
352        return a;
353    };
354
355    $JssorSlideshowFormations$.$FormationStraightStairs = function (transition) {
356        var cols = transition.$Cols;
357        var rows = transition.$Rows;
358        var formationDirection = transition.$Assembly;
359        var count = transition.$Count;
360        var a = [];
361        var i = 0;
362        var col = 0;
363        var r = 0;
364        var cl = cols - 1;
365        var rl = rows - 1;
366        var il = count - 1;
367        var cr;
368        switch (formationDirection) {
369            case ASSEMBLY_BOTTOM_LEFT:
370            case ASSEMBLY_TOP_RIGHT:
371            case ASSEMBLY_TOP_LEFT:
372            case ASSEMBLY_BOTTOM_RIGHT:
373                var C = 0;
374                var R = 0;
375                break;
376            case ASSEMBLY_LEFT_BOTTOM:
377            case ASSEMBLY_RIGHT_TOP:
378            case ASSEMBLY_LEFT_TOP:
379            case ASSEMBLY_RIGHT_BOTTOM:
380                var C = cl;
381                var R = 0;
382                break;
383            default:
384                formationDirection = ASSEMBLY_RIGHT_BOTTOM;
385                var C = cl;
386                var R = 0;
387                break;
388        }
389        col = C;
390        r = R;
391        while (i < count) {
392            cr = r + ',' + col;
393            if (isToTop(formationDirection) || isToRight(formationDirection)) {
394                PushFormationOrder(a, il - i++, [r, col]);
395                //a[cr] = il - i++;
396            }
397            else {
398                PushFormationOrder(a, i++, [r, col]);
399                //a[cr] = i++;
400            }
401            switch (formationDirection) {
402                case ASSEMBLY_BOTTOM_LEFT:
403                case ASSEMBLY_TOP_RIGHT:
404                    col--;
405                    r++;
406                    break;
407                case ASSEMBLY_TOP_LEFT:
408                case ASSEMBLY_BOTTOM_RIGHT:
409                    col++;
410                    r--;
411                    break;
412                case ASSEMBLY_LEFT_BOTTOM:
413                case ASSEMBLY_RIGHT_TOP:
414                    col--;
415                    r--;
416                    break;
417                case ASSEMBLY_RIGHT_BOTTOM:
418                case ASSEMBLY_LEFT_TOP:
419                default:
420                    col++;
421                    r++;
422                    break;
423            }
424            if (col < 0 || r < 0 || col > cl || r > rl) {
425                switch (formationDirection) {
426                    case ASSEMBLY_BOTTOM_LEFT:
427                    case ASSEMBLY_TOP_RIGHT:
428                        C++;
429                        break;
430                    case ASSEMBLY_LEFT_BOTTOM:
431                    case ASSEMBLY_RIGHT_TOP:
432                    case ASSEMBLY_TOP_LEFT:
433                    case ASSEMBLY_BOTTOM_RIGHT:
434                        R++;
435                        break;
436                    case ASSEMBLY_RIGHT_BOTTOM:
437                    case ASSEMBLY_LEFT_TOP:
438                    default:
439                        C--;
440                        break;
441                }
442                if (C < 0 || R < 0 || C > cl || R > rl) {
443                    switch (formationDirection) {
444                        case ASSEMBLY_BOTTOM_LEFT:
445                        case ASSEMBLY_TOP_RIGHT:
446                            C = cl;
447                            R++;
448                            break;
449                        case ASSEMBLY_TOP_LEFT:
450                        case ASSEMBLY_BOTTOM_RIGHT:
451                            R = rl;
452                            C++;
453                            break;
454                        case ASSEMBLY_LEFT_BOTTOM:
455                        case ASSEMBLY_RIGHT_TOP: R = rl; C--;
456                            break;
457                        case ASSEMBLY_RIGHT_BOTTOM:
458                        case ASSEMBLY_LEFT_TOP:
459                        default:
460                            C = 0;
461                            R++;
462                            break;
463                    }
464                    if (R > rl)
465                        R = rl;
466                    else if (R < 0)
467                        R = 0;
468                    else if (C > cl)
469                        C = cl;
470                    else if (C < 0)
471                        C = 0;
472                }
473                r = R;
474                col = C;
475            }
476        }
477        return a;
478    };
479
480    $JssorSlideshowFormations$.$FormationSquare = function (transition) {
481        var cols = transition.$Cols || 1;
482        var rows = transition.$Rows || 1;
483        var arr = [];
484        var i = 0;
485        var col;
486        var r;
487        var dc;
488        var dr;
489        var cr;
490        dc = cols < rows ? (rows - cols) / 2 : 0;
491        dr = cols > rows ? (cols - rows) / 2 : 0;
492        cr = Math.round(Math.max(cols / 2, rows / 2)) + 1;
493        for (col = 0; col < cols; col++) {
494            for (r = 0; r < rows; r++)
495                PushFormationOrder(arr, cr - Math.min(col + 1 + dc, r + 1 + dr, cols - col + dc, rows - r + dr), [r, col]);
496        }
497        return arr;
498    };
499
500    $JssorSlideshowFormations$.$FormationRectangle = function (transition) {
501        var cols = transition.$Cols || 1;
502        var rows = transition.$Rows || 1;
503        var arr = [];
504        var i = 0;
505        var col;
506        var r;
507        var cr;
508        cr = Math.round(Math.min(cols / 2, rows / 2)) + 1;
509        for (col = 0; col < cols; col++) {
510            for (r = 0; r < rows; r++)
511                PushFormationOrder(arr, cr - Math.min(col + 1, r + 1, cols - col, rows - r), [r, col]);
512        }
513        return arr;
514    };
515
516    $JssorSlideshowFormations$.$FormationRandom = function (transition) {
517        var a = [];
518        var r, col, i;
519        for (r = 0; r < transition.$Rows; r++) {
520            for (col = 0; col < transition.$Cols; col++)
521                PushFormationOrder(a, Math.ceil(100000 * Math.random()) % 13, [r, col]);
522        }
523
524        return a;
525    };
526
527    $JssorSlideshowFormations$.$FormationCircle = function (transition) {
528        var cols = transition.$Cols || 1;
529        var rows = transition.$Rows || 1;
530        var arr = [];
531        var i = 0;
532        var col;
533        var r;
534        var hc = cols / 2 - 0.5;
535        var hr = rows / 2 - 0.5;
536        for (col = 0; col < cols; col++) {
537            for (r = 0; r < rows; r++)
538                PushFormationOrder(arr, Math.round(Math.sqrt(Math.pow(col - hc, 2) + Math.pow(r - hr, 2))), [r, col]);
539        }
540        return arr;
541    };
542
543    $JssorSlideshowFormations$.$FormationCross = function (transition) {
544        var cols = transition.$Cols || 1;
545        var rows = transition.$Rows || 1;
546        var arr = [];
547        var i = 0;
548        var col;
549        var r;
550        var hc = cols / 2 - 0.5;
551        var hr = rows / 2 - 0.5;
552        for (col = 0; col < cols; col++) {
553            for (r = 0; r < rows; r++)
554                PushFormationOrder(arr, Math.round(Math.min(Math.abs(col - hc), Math.abs(r - hr))), [r, col]);
555        }
556        return arr;
557    };
558
559    $JssorSlideshowFormations$.$FormationRectangleCross = function (transition) {
560        var cols = transition.$Cols || 1;
561        var rows = transition.$Rows || 1;
562        var arr = [];
563        var i = 0;
564        var col;
565        var r;
566        var hc = cols / 2 - 0.5;
567        var hr = rows / 2 - 0.5;
568        var cr = Math.max(hc, hr) + 1;
569        for (col = 0; col < cols; col++) {
570            for (r = 0; r < rows; r++)
571                PushFormationOrder(arr, Math.round(cr - Math.max(hc - Math.abs(col - hc), hr - Math.abs(r - hr))) - 1, [r, col]);
572        }
573        return arr;
574    };
575
576    function GetFormation(transition) {
577
578        var formationInstance = transition.$Formation(transition);
579
580        return transition.$Reverse ? formationInstance.reverse() : formationInstance;
581
582    } //GetFormation
583
584    //var _PrototypeTransitions = [];
585    function EnsureTransitionInstance(options, slideshowInterval) {
586
587        var _SlideshowTransition = {
588            $Interval: slideshowInterval,  //Delay to play next frame
589            $Duration: 1, //Duration to finish the entire transition
590            $Delay: 0,  //Delay to assembly blocks
591            $Cols: 1,   //Number of columns
592            $Rows: 1,   //Number of rows
593            $Opacity: 0,   //Fade block or not
594            $Zoom: 0,   //Zoom block or not
595            $Clip: 0,   //Clip block or not
596            $Move: false,   //Move block or not
597            $SlideOut: false,   //Slide the previous slide out to display next slide instead
598            //$FlyDirection: 0,   //Specify fly transform with direction
599            $Reverse: false,    //Reverse the assembly or not
600            $Formation: $JssorSlideshowFormations$.$FormationRandom,    //Shape that assembly blocks as
601            $Assembly: ASSEMBLY_RIGHT_BOTTOM,   //The way to assembly blocks
602            $ChessMode: { $Column: 0, $Row: 0 },    //Chess move or fly direction
603            $Easing: $JssorEasing$.$EaseSwing,  //Specify variation of speed during transition
604            $Round: {},
605            $Blocks: [],
606            $During: {}
607        };
608
609        $Jssor$.$Extend(_SlideshowTransition, options);
610
611        _SlideshowTransition.$Count = _SlideshowTransition.$Cols * _SlideshowTransition.$Rows;
612        if ($Jssor$.$IsFunction(_SlideshowTransition.$Easing))
613            _SlideshowTransition.$Easing = { $Default: _SlideshowTransition.$Easing };
614

615        _SlideshowTransition.$FramesCount = Math.ceil(_SlideshowTransition.$Duration / _SlideshowTransition.$Interval);
616        _SlideshowTransition.$EasingInstance = GetEasing(_SlideshowTransition);
617
618        _SlideshowTransition.$GetBlocks = function (width, height) {
619            width /= _SlideshowTransition.$Cols;
620            height /= _SlideshowTransition.$Rows;
621            var wh = width + 'x' + height;
622            if (!_SlideshowTransition.$Blocks[wh]) {
623                _SlideshowTransition.$Blocks[wh] = { $Width: width, $Height: height };
624                for (var col = 0; col < _SlideshowTransition.$Cols; col++) {
625                    for (var r = 0; r < _SlideshowTransition.$Rows; r++)
626                        _SlideshowTransition.$Blocks[wh][r + ',' + col] = { $Top: r * height, $Right: col * width + width, $Bottom: r * height + height, $Left: col * width };
627                }
628            }
629
630            return _SlideshowTransition.$Blocks[wh];
631        };
632
633        if (_SlideshowTransition.$Brother) {
634            _SlideshowTransition.$Brother = EnsureTransitionInstance(_SlideshowTransition.$Brother, slideshowInterval);
635            _SlideshowTransition.$SlideOut = true;
636        }
637
638        return _SlideshowTransition;
639    }
640
641    function GetEasing(transition) {
642        var easing = transition.$Easing;
643        if (!easing.$Default)
644            easing.$Default = $JssorEasing$.$EaseSwing;
645
646        var duration = transition.$FramesCount;
647
648        var cache = easing.$Cache;
649        if (!cache) {
650            var enumerator = $Jssor$.$Extend({}, transition.$Easing, transition.$Round);
651            cache = easing.$Cache = {};
652
653            $Jssor$.$Each(enumerator, function (v, easingName) {
654                var easingFunction = easing[easingName] || easing.$Default;
655                var round = transition.$Round[easingName] || 1;
656
657                if (!$Jssor$.$IsArray(easingFunction.$Cache))
658                    easingFunction.$Cache = [];
659
660                var easingFunctionCache = easingFunction.$Cache[duration] = easingFunction.$Cache[duration] || [];
661
662                if (!easingFunctionCache[round]) {
663                    easingFunctionCache[round] = [0];
664                    for (var t = 1; t <= duration; t++) {
665                        var tRound = t / duration * round;
666                        var tRoundFloor = Math.floor(tRound);
667                        if (tRound != tRoundFloor)
668                            tRound -= tRoundFloor;
669                        easingFunctionCache[round][t] = easingFunction(tRound);
670                    }
671                }
672
673                cache[easingName] = easingFunctionCache;
674
675            });
676        }
677
678        return cache;
679    } //GetEasing
680
681    //Formation Definition -------
682
683    function JssorSlideshowPlayer(slideContainer, slideElement, slideTransition, beginTime, slideContainerWidth, slideContainerHeight) {
684        var _Self = this;
685
686        var _Block;
687        var _StartStylesArr = {};
688        var _AnimationStylesArrs = {};
689        var _AnimationBlockItems = [];
690        var _StyleStart;
691        var _StyleEnd;
692        var _StyleDif;
693        var _ChessModeColumn = slideTransition.$ChessMode.$Column || 0;
694        var _ChessModeRow = slideTransition.$ChessMode.$Row || 0;
695
696        var _Blocks = slideTransition.$GetBlocks(slideContainerWidth, slideContainerHeight);
697        var _FormationInstance = GetFormation(slideTransition);
698        var _MaxOrder = _FormationInstance.length - 1;
699        var _Period = slideTransition.$Duration + slideTransition.$Delay * _MaxOrder;
700        var _EndTime = beginTime + _Period;
701
702        var _SlideOut = slideTransition.$SlideOut;
703        var _IsIn;
704
705        _EndTime += $Jssor$.$IsBrowserChrome() ? 260 : 50;
706
707        _Self.$EndTime = _EndTime;
708
709        _Self.$ShowFrame = function (time) {
710            time -= beginTime;
711
712            var isIn = time < _Period;
713
714            if (isIn || _IsIn) {
715                _IsIn = isIn;
716
717                if (!_SlideOut)
718                    time = _Period - time;
719
720                var frameIndex = Math.ceil(time / slideTransition.$Interval);
721
722                $Jssor$.$Each(_AnimationStylesArrs, function (value, index) {
723
724                    var itemFrameIndex = Math.max(frameIndex, value.$Min);
725                    itemFrameIndex = Math.min(itemFrameIndex, value.length - 1);
726
727                    if (value.$LastFrameIndex != itemFrameIndex) {
728                        if (!value.$LastFrameIndex && !_SlideOut) {
729                            $Jssor$.$ShowElement(_AnimationBlockItems[index]);
730                        }
731                        else if (itemFrameIndex == value.$Max && _SlideOut) {
732                            $Jssor$.$HideElement(_AnimationBlockItems[index]);
733                        }
734                        value.$LastFrameIndex = itemFrameIndex;
735                        $Jssor$.$SetStylesEx(_AnimationBlockItems[index], value[itemFrameIndex]);
736                    }
737                });
738            }
739        };
740
741        function DisableHWA(elmt) {
742            $Jssor$.$DisableHWA(elmt);
743
744            var children = $Jssor$.$Children(elmt);
745
746            $Jssor$.$Each(children, function (child) {
747                DisableHWA(child);
748            });
749        }
750
751        //constructor
752        {
753            slideElement = $Jssor$.$CloneNode(slideElement);
754            DisableHWA(slideElement);
755            if ($Jssor$.$IsBrowserIe9Earlier()) {
756                var hasImage = !slideElement["no-image"];
757                var slideChildElements = $Jssor$.$FindChildrenByTag(slideElement);

758                $Jssor$.$Each(slideChildElements, function (slideChildElement) {
759                    if (hasImage || slideChildElement["jssor-slider"])
760                        $Jssor$.$CssOpacity(slideChildElement, $Jssor$.$CssOpacity(slideChildElement), true);
761                });
762            }
763
764            $Jssor$.$Each(_FormationInstance, function (formationItems, order) {
765                $Jssor$.$Each(formationItems, function (formationItem) {
766                    var row = formationItem[0];
767                    var col = formationItem[1];
768                    {
769                        var columnRow = row + ',' + col;
770
771                        var chessHorizontal = false;
772                        var chessVertical = false;
773                        var chessRotate = false;
774
775                        if (_ChessModeColumn && col % 2) {
776                            if ($JssorDirection$.$IsHorizontal(_ChessModeColumn)) {
777                                chessHorizontal = !chessHorizontal;
778                            }
779                            if ($JssorDirection$.$IsVertical(_ChessModeColumn)) {
780                                chessVertical = !chessVertical;
781                            }
782
783                            if (_ChessModeColumn & 16)
784                                chessRotate = !chessRotate;
785                        }
786
787                        if (_ChessModeRow && row % 2) {
788                            if ($JssorDirection$.$IsHorizontal(_ChessModeRow)) {
789                                chessHorizontal = !chessHorizontal;
790                            }
791                            if ($JssorDirection$.$IsVertical(_ChessModeRow)) {
792                                chessVertical = !chessVertical;
793                            }
794                            if (_ChessModeRow & 16)
795                                chessRotate = !chessRotate;
796                        }
797
798                        slideTransition.$Top = slideTransition.$Top || (slideTransition.$Clip & 4);
799                        slideTransition.$Bottom = slideTransition.$Bottom || (slideTransition.$Clip & 8);
800                        slideTransition.$Left = slideTransition.$Left || (slideTransition.$Clip & 1);
801                        slideTransition.$Right = slideTransition.$Right || (slideTransition.$Clip & 2);
802
803                        var topBenchmark = chessVertical ? slideTransition.$Bottom : slideTransition.$Top;
804                        var bottomBenchmark = chessVertical ? slideTransition.$Top : slideTransition.$Bottom;
805                        var leftBenchmark = chessHorizontal ? slideTransition.$Right : slideTransition.$Left;
806                        var rightBenchmark = chessHorizontal ? slideTransition.$Left : slideTransition.$Right;
807
808                        //$JssorDebug$.$Execute(function () {
809                        //    topBenchmark = bottomBenchmark = leftBenchmark = rightBenchmark = false;
810                        //});
811
812                        slideTransition.$Clip = topBenchmark || bottomBenchmark || leftBenchmark || rightBenchmark;
813
814                        _StyleDif = {};
815                        _StyleEnd = { $Top: 0, $Left: 0, $Opacity: 1, $Width: slideContainerWidth, $Height: slideContainerHeight };
816                        _StyleStart = $Jssor$.$Extend({}, _StyleEnd);
817                        _Block = $Jssor$.$Extend({}, _Blocks[columnRow]);
818
819                        if (slideTransition.$Opacity) {
820                            _StyleEnd.$Opacity = 2 - slideTransition.$Opacity;
821                        }
822
823                        if (slideTransition.$ZIndex) {
824                            _StyleEnd.$ZIndex = slideTransition.$ZIndex;
825                            _StyleStart.$ZIndex = 0;
826                        }
827
828                        var allowClip = slideTransition.$Cols * slideTransition.$Rows > 1 || slideTransition.$Clip;
829
830                        if (slideTransition.$Zoom || slideTransition.$Rotate) {
831                            var allowRotate = true;
832                            if ($Jssor$.$IsBrowserIE() && $Jssor$.$BrowserEngineVersion() < 9) {
833                                if (slideTransition.$Cols * slideTransition.$Rows > 1)
834                                    allowRotate = false;

835                                else
836                                    allowClip = false;
837                            }
838
839                            if (allowRotate) {
840                                _StyleEnd.$Zoom = slideTransition.$Zoom ? slideTransition.$Zoom - 1 : 1;
841                                _StyleStart.$Zoom = 1;
842
843                                if ($Jssor$.$IsBrowserIe9Earlier() || $Jssor$.$IsBrowserOpera())
844                                    _StyleEnd.$Zoom = Math.min(_StyleEnd.$Zoom, 2);
845
846                                var rotate = slideTransition.$Rotate;
847
848                                _StyleEnd.$Rotate = rotate * 360 * ((chessRotate) ? -1 : 1);
849                                _StyleStart.$Rotate = 0;
850                            }
851                        }
852
853                        if (allowClip) {
854                            if (slideTransition.$Clip) {
855                                var clipScale = slideTransition.$ScaleClip || 1;
856                                var blockOffset = _Block.$Offset = {};
857                                if (topBenchmark && bottomBenchmark) {
858                                    blockOffset.$Top = _Blocks.$Height / 2 * clipScale;
859                                    blockOffset.$Bottom = -blockOffset.$Top;
860                                }
861                                else if (topBenchmark) {
862                                    blockOffset.$Bottom = -_Blocks.$Height * clipScale;
863                                }
864                                else if (bottomBenchmark) {
865                                    blockOffset.$Top = _Blocks.$Height * clipScale;
866                                }
867
868                                if (leftBenchmark && rightBenchmark) {
869                                    blockOffset.$Left = _Blocks.$Width / 2 * clipScale;
870                                    blockOffset.$Right = -blockOffset.$Left;
871                                }
872                                else if (leftBenchmark) {
873                                    blockOffset.$Right = -_Blocks.$Width * clipScale;
874                                }
875                                else if (rightBenchmark) {
876                                    blockOffset.$Left = _Blocks.$Width * clipScale;
877                                }
878                            }
879
880                            _StyleDif.$Clip = _Block;
881                            _StyleStart.$Clip = _Blocks[columnRow];
882                        }
883
884                        //fly
885                        {
886                            var chessHor = chessHorizontal ? 1 : -1;
887                            var chessVer = chessVertical ? 1 : -1;
888
889                            if (slideTransition.x)
890                                _StyleEnd.$Left += slideContainerWidth * slideTransition.x * chessHor;
891
892                            if (slideTransition.y)
893                                _StyleEnd.$Top += slideContainerHeight * slideTransition.y * chessVer;
894                        }
895
896                        $Jssor$.$Each(_StyleEnd, function (propertyEnd, property) {
897                            if ($Jssor$.$IsNumeric(propertyEnd)) {
898                                if (propertyEnd != _StyleStart[property]) {
899                                    _StyleDif[property] = propertyEnd - _StyleStart[property];
900                                }
901                            }
902                        });
903
904                        _StartStylesArr[columnRow] = _SlideOut ? _StyleStart : _StyleEnd;
905
906                        var animationStylesArr = [];
907                        var virtualFrameCount = Math.round(order * slideTransition.$Delay / slideTransition.$Interval);
908                        _AnimationStylesArrs[columnRow] = new Array(virtualFrameCount);
909                        _AnimationStylesArrs[columnRow].$Min = virtualFrameCount;
910
911                        var framesCount = slideTransition.$FramesCount;
912                        for (var frameN = 0; frameN <= framesCount; frameN++) {
913                            var styleFrameN = {};
914
915                            $Jssor$.$Each(_StyleDif, function (propertyDiff, property) {
916                                var propertyEasings = slideTransition.$EasingInstance[property] || slideTransition.$EasingInstance.$Default;
917                                var propertyEasingArray = propertyEasings[slideTransition.$Round[property] || 1];
918
919                                var propertyDuring = slideTransition.$During[property] || [0, 1];
920                                var propertyFrameN = (frameN / framesCount - propertyDuring[0]) / propertyDuring[1] * framesCount;
921                                propertyFrameN = Math.round(Math.min(framesCount, Math.max(propertyFrameN, 0)));
922
923                                var propertyEasingValue = propertyEasingArray[propertyFrameN];
924
925                                if ($Jssor$.$IsNumeric(propertyDiff)) {
926                                    styleFrameN[property] = _StyleStart[property] + propertyDiff * propertyEasingValue;
927                                }
928                                else {
929                                    var value = styleFrameN[property] = $Jssor$.$Extend({}, _StyleStart[property]);
930                                    value.$Offset = [];
931                                    $Jssor$.$Each(propertyDiff.$Offset, function (rectX, n) {
932                                        var offsetValue = rectX * propertyEasingValue;
933                                        value.$Offset[n] = offsetValue;
934                                        value[n] += offsetValue;
935                                    });
936                                }
937                            });
938
939                            if (_StyleStart.$Zoom) {
940                                styleFrameN.$Transform = { $Rotate: styleFrameN.$Rotate || 0, $Scale: styleFrameN.$Zoom, $OriginalWidth: slideContainerWidth, $OriginalHeight: slideContainerHeight };
941                            }
942                            if (styleFrameN.$Clip && slideTransition.$Move) {
943                                var styleFrameNClipOffset = styleFrameN.$Clip.$Offset;
944                                var offsetY = (styleFrameNClipOffset.$Top || 0) + (styleFrameNClipOffset.$Bottom || 0);
945                                var offsetX = (styleFrameNClipOffset.$Left || 0) + (styleFrameNClipOffset.$Right || 0

945);
946
947                                styleFrameN.$Left = (styleFrameN.$Left || 0) + offsetX;
948                                styleFrameN.$Top = (styleFrameN.$Top || 0) + offsetY;
949                                styleFrameN.$Clip.$Left -= offsetX;
950                                styleFrameN.$Clip.$Right -= offsetX;
951                                styleFrameN.$Clip.$Top -= offsetY;
952                                styleFrameN.$Clip.$Bottom -= offsetY;
953                            }
954
955                            styleFrameN.$ZIndex = styleFrameN.$ZIndex || 1;
956
957                            _AnimationStylesArrs[columnRow].push(styleFrameN);
958                        }
959
960                    } //for
961                });
962            });
963
964            _FormationInstance.reverse();
965            $Jssor$.$Each(_FormationInstance, function (formationItems) {
966                $Jssor$.$Each(formationItems, function (formationItem) {
967                    var row = formationItem[0];
968                    var col = formationItem[1];
969
970                    var columnRow = row + ',' + col;
971
972                    var image = slideElement;
973                    if (col || row)
974                        image = $Jssor$.$CloneNode(slideElement);
975
976                    $Jssor$.$SetStyles(image, _StartStylesArr[columnRow]);
977                    $Jssor$.$CssOverflow(image, "hidden");
978
979                    $Jssor$.$CssPosition(image, "absolute");
980                    slideContainer.$AddClipElement(image);
981                    _AnimationBlockItems[columnRow] = image;
982                    $Jssor$.$ShowElement(image, !_SlideOut);
983                });
984            });
985        }
986    }
987
988    //JssorSlideshowRunner++++++++
989    var _SlideshowRunnerCount = 1;
990    $JssorSlideshowRunner$ = window.$JssorSlideshowRunner$ = function (slideContainer, slideContainerWidth, slideContainerHeight, slideshowOptions, handleTouchEventOnly) {
991
992        var _SelfSlideshowRunner = this;
993
994        //var _State = 0; //-1 fullfill, 0 clean, 1 initializing, 2 stay, 3 playing
995        var _EndTime;
996
997        var _SliderFrameCount;
998
999        var _SlideshowPlayerBelow;
1000        var _SlideshowPlayerAbove;
1001
1002        var _PrevItem;
1003        var _SlideItem;
1004
1005        var _TransitionIndex = 0;
1006        var _TransitionsOrder = slideshowOptions.$TransitionsOrder;
1007
1008        var _SlideshowTransition;
1009
1010        var _SlideshowPerformance = 8;
1011
1012        function SlideshowProcessor() {
1013            var _SelfSlideshowProcessor = this;
1014            var _CurrentTime = 0;
1015
1016            $JssorAnimator$.call(_SelfSlideshowProcessor, 0, _EndTime);
1017
1018            _SelfSlideshowProcessor.$OnPositionChange = function (oldPosition, newPosition) {
1019                if ((newPosition - _CurrentTime) > _SlideshowPerformance) {
1020                    _CurrentTime = newPosition;
1021
1022                    _SlideshowPlayerAbove && _SlideshowPlayerAbove.$ShowFrame(newPosition);
1023                    _SlideshowPlayerBelow && _SlideshowPlayerBelow.$ShowFrame(newPosition);
1024                }
1025            };
1026
1027            _SelfSlideshowProcessor.$Transition = _SlideshowTransition;
1028        }
1029
1030        //member functions
1031        _SelfSlideshowRunner.$GetTransition = function (slideCount) {
1032            var n = 0;
1033
1034            var transitions = slideshowOptions.$Transitions;
1035
1036            var transitionCount = transitions.length;
1037
1038            if (_TransitionsOrder) { /*Sequence*/
1039                //if (transitionCount > slideCount && ($Jssor$.$IsBrowserChrome() || $Jssor$.$IsBrowserSafari() || $Jssor$.$IsBrowserFireFox())) {
1040                //    transitionCount -= transitionCount % slideCount;
1041                //}
1042                n = _TransitionIndex++ % transitionCount;
1043            }
1044            else { /*Random*/
1045                n = Math.floor(Math.random() * transitionCount);
1046            }
1047
1048            transitions[n] && (transitions[n].$Index = n);
1049
1050            return transitions[n];
1051        };
1052
1053        _SelfSlideshowRunner.$Initialize = function (slideIndex, prevIndex, slideItem, prevItem, slideshowTransition) {
1054            $JssorDebug$.$Execute(function () {
1055                if (_SlideshowPlayerBelow) {
1056                    $JssorDebug$.$Fail("slideshow runner has not been cleared.");
1057                }
1058            });
1059
1060            _SlideshowTransition = slideshowTransition;
1061
1062            slideshowTransition = EnsureTransitionInstance(slideshowTransition, _SlideshowPerformance);
1063
1064            _SlideItem = slideItem;
1065            _PrevItem = prevItem;
1066
1067            var prevSlideElement = prevItem.$Item;
1068            var currentSlideElement = slideItem.$Item;
1069            prevSlideElement["no-image"] = !prevItem.$Image;

1070            currentSlideElement["no-image"] = !slideItem.$Image;
1071
1072            var slideElementAbove = prevSlideElement;
1073            var slideElementBelow = currentSlideElement;
1074
1075            var slideTransitionAbove = slideshowTransition;
1076            var slideTransitionBelow = slideshowTransition.$Brother || EnsureTransitionInstance({}, _SlideshowPerformance);
1077
1078            if (!slideshowTransition.$SlideOut) {
1079                slideElementAbove = currentSlideElement;
1080                slideElementBelow = prevSlideElement;
1081            }
1082
1083            var shift = slideTransitionBelow.$Shift || 0;
1084
1085            _SlideshowPlayerBelow = new JssorSlideshowPlayer(slideContainer, slideElementBelow, slideTransitionBelow, Math.max(shift - slideTransitionBelow.$Interval, 0), slideContainerWidth, slideContainerHeight);
1086            _SlideshowPlayerAbove = new JssorSlideshowPlayer(slideContainer, slideElementAbove, slideTransitionAbove, Math.max(slideTransitionBelow.$Interval - shift, 0), slideContainerWidth, slideContainerHeight);
1087
1088            _SlideshowPlayerBelow.$ShowFrame(0);
1089            _SlideshowPlayerAbove.$ShowFrame(0);
1090
1091            _EndTime = Math.max(_SlideshowPlayerBelow.$EndTime, _SlideshowPlayerAbove.$EndTime);
1092
1093            _SelfSlideshowRunner.$Index = slideIndex;
1094        };
1095
1096        _SelfSlideshowRunner.$Clear = function () {
1097            slideContainer.$Clear();
1098            _SlideshowPlayerBelow = null;
1099            _SlideshowPlayerAbove = null;
1100        };
1101
1102        _SelfSlideshowRunner.$GetProcessor = function () {
1103            var slideshowProcessor = null;
1104
1105            if (_SlideshowPlayerAbove)
1106                slideshowProcessor = new SlideshowProcessor();
1107
1108            return slideshowProcessor;
1109        };
1110
1111        //Constructor
1112        {
1113            if ($Jssor$.$IsBrowserIe9Earlier() || $Jssor$.$IsBrowserOpera() || (handleTouchEventOnly && $Jssor$.$WebKitVersion() < 537)) {
1114                _SlideshowPerformance = 16;
1115            }
1116
1117            $JssorObject$.call(_SelfSlideshowRunner);
1118            $JssorAnimator$.call(_SelfSlideshowRunner, -10000000, 10000000);
1119
1120            $JssorDebug$.$LiveStamp(_SelfSlideshowRunner, "slideshow_runner_" + _SlideshowRunnerCount++);
1121        }
1122    };
1123    //JssorSlideshowRunner--------
1124
1125    //JssorSlider
1126    function JssorSlider(elmt, options) {
1127        var _SelfSlider = this;
1128
1129        //private classes
1130        function Conveyor() {
1131            var _SelfConveyor = this;
1132            $JssorAnimator$.call(_SelfConveyor, -100000000, 200000000);
1133
1134            _SelfConveyor.$GetCurrentSlideInfo = function () {
1135                var positionDisplay = _SelfConveyor.$GetPosition_Display();
1136                var virtualIndex = Math.floor(positionDisplay);
1137                var slideIndex = GetRealIndex(virtualIndex);
1138                var slidePosition = positionDisplay - Math.floor(positionDisplay);
1139
1140                return { $Index: slideIndex, $VirtualIndex: virtualIndex, $Position: slidePosition };
1141            };
1142
1143            _SelfConveyor.$OnPositionChange = function (oldPosition, newPosition) {
1144
1145                var index = Math.floor(newPosition);
1146                if (index != newPosition && newPosition > oldPosition)
1147                    index++;
1148
1149                ResetNavigator(index, true);
1150
1151                _SelfSlider.$TriggerEvent(JssorSlider.$EVT_POSITION_CHANGE, GetRealIndex(newPosition), GetRealIndex(oldPosition), newPosition, oldPosition);
1152            };
1153        }
1154
1155        //Carousel
1156        function Carousel() {
1157            var _SelfCarousel = this;
1158
1159            $JssorAnimator$.call(_SelfCarousel, 0, 0, { $LoopLength: _SlideCount });
1160
1161            //Carousel Constructor
1162            {
1163                $Jssor$.$Each(_SlideItems, function (slideItem) {
1164                    (_Loop & 1) && slideItem.$SetLoopLength(_SlideCount);
1165                    _SelfCarousel.$Chain(slideItem);
1166                    slideItem.$Shift(_ParkingPosition / _StepLength);
1167                });
1168            }
1169        }
1170        //Carousel
1171
1172        //Slideshow
1173        function Slideshow() {
1174            var _SelfSlideshow = this;
1175            var _Wrapper = _SlideContainer.$Elmt;
1176
1177            $JssorAnimator$.call(_SelfSlideshow, -1, 2, { $Easing: $JssorEasing$.$EaseLinear, $Setter: { $Position: SetPosition }, $LoopLength: _SlideCount }, _Wrapper, { $Position: 1 }, { $Position: -1 });
1178
1179            _SelfSlideshow.$Wrapper = _Wrapper;
1180
1181            //Slideshow Constructor
1182            {
1183                $JssorDebug$.$Execute(function () {
1184                    $Jssor$.$Attribute(_SlideContainer.$Elmt, "debug

1184-id", "slide_container");
1185                });
1186            }
1187        }
1188        //Slideshow
1189
1190        //CarouselPlayer
1191        function CarouselPlayer(carousel, slideshow) {
1192            var _SelfCarouselPlayer = this;
1193            var _FromPosition;
1194            var _ToPosition;
1195            var _Duration;
1196            var _StandBy;
1197            var _StandByPosition;
1198
1199            $JssorAnimator$.call(_SelfCarouselPlayer, -100000000, 200000000, { $IntervalMax: 100 });
1200
1201            _SelfCarouselPlayer.$OnStart = function () {
1202                _IsSliding = true;
1203                _LoadingTicket = null;
1204
1205                //EVT_SWIPE_START
1206                _SelfSlider.$TriggerEvent(JssorSlider.$EVT_SWIPE_START, GetRealIndex(_Conveyor.$GetPosition()), _Conveyor.$GetPosition());
1207            };
1208
1209            _SelfCarouselPlayer.$OnStop = function () {
1210
1211                _IsSliding = false;
1212                _StandBy = false;
1213
1214                var currentSlideInfo = _Conveyor.$GetCurrentSlideInfo();
1215
1216                //EVT_SWIPE_END
1217                _SelfSlider.$TriggerEvent(JssorSlider.$EVT_SWIPE_END, GetRealIndex(_Conveyor.$GetPosition()), _Conveyor.$GetPosition());
1218
1219                if (!currentSlideInfo.$Position) {
1220                    OnPark(currentSlideInfo.$VirtualIndex, _CurrentSlideIndex);
1221                }
1222            };
1223
1224            _SelfCarouselPlayer.$OnPositionChange = function (oldPosition, newPosition) {
1225
1226                var toPosition;
1227
1228                if (_StandBy)
1229                    toPosition = _StandByPosition;
1230                else {
1231                    toPosition = _ToPosition;
1232
1233                    if (_Duration) {
1234                        var interPosition = newPosition / _Duration;
1235                        //if ($Jssor$.$IsBrowserChrome() || $Jssor$.$IsBrowserFireFox()) {
1236                        //    Math.round(interPosition * 8 / _Duration) / 8 * _Duration;
1237
1238                        //    if ($Jssor$.$BrowserVersion() < 38)
1239                        //        interPosition = parseFloat(interPosition.toFixed(4));
1240                        //}
1241                        toPosition = _Options.$SlideEasing(interPosition) * (_ToPosition - _FromPosition) + _FromPosition;
1242                    }
1243                }
1244
1245                _Conveyor.$GoToPosition(toPosition);
1246            };
1247
1248            _SelfCarouselPlayer.$PlayCarousel = function (fromPosition, toPosition, duration, callback) {
1249                $JssorDebug$.$Execute(function () {
1250                    if (_SelfCarouselPlayer.$IsPlaying())
1251                        $JssorDebug$.$Fail("The carousel is already playing.");
1252                });
1253
1254                _FromPosition = fromPosition;
1255                _ToPosition = toPosition;
1256                _Duration = duration;
1257
1258                _Conveyor.$GoToPosition(fromPosition);
1259                _SelfCarouselPlayer.$GoToPosition(0);
1260
1261                _SelfCarouselPlayer.$PlayToPosition(duration, callback);
1262            };
1263
1264            _SelfCarouselPlayer.$StandBy = function (standByPosition) {
1265                _StandBy = true;
1266                _StandByPosition = standByPosition;
1267                _SelfCarouselPlayer.$Play(standByPosition, null, true);
1268            };
1269
1270            _SelfCarouselPlayer.$SetStandByPosition = function (standByPosition) {
1271                _StandByPosition = standByPosition;
1272            };
1273
1274            _SelfCarouselPlayer.$MoveCarouselTo = function (position) {
1275                _Conveyor.$GoToPosition(position);
1276            };
1277
1278            //CarouselPlayer Constructor
1279            {
1280                _Conveyor = new Conveyor();
1281
1282                _Conveyor.$Combine(carousel);
1283                _Conveyor.$Combine(slideshow);
1284            }
1285        }
1286        //CarouselPlayer
1287
1288        //SlideContainer
1289        function SlideContainer() {
1290            var _Self = this;
1291            var elmt = CreatePanel();
1292
1293            $Jssor$.$CssZIndex(elmt, 0);
1294            $Jssor$.$Css(elmt, "pointerEvents", "none");
1295
1296            _Self.$Elmt = elmt;
1297
1298            _Self.$AddClipElement = function (clipElement) {
1299                $Jssor$.$AppendChild(elmt, clipElement);
1300                $Jssor$.$ShowElement(elmt);
1301            };
1302
1303            _Self.$Clear = function () {
1304                $Jssor$.$HideElement(elmt);
1305                $Jssor$.$ClearInnerHtml(elmt);
1306            };
1307        }
1308        //SlideContainer
1309
1310        //SlideItem
1311        function SlideItem(slideElmt, slideIndex) {
1312
1313            var _SelfSlideItem = this;
1314
1315            var _CaptionSliderIn;
1316            var _CaptionSliderOut;
1317            var _CaptionSliderCurrent;
1318            var _IsCaptionSliderPlayingWhenDragStart;
1319
1320            var _Wrapper;
1321            var _BaseElement = slideElmt;
1322
1323            var _LoadingScreen;
1324
1325            var _ImageItem;
1326            var _ImageElmts = [];
1327            var _LinkItemOrigin;
1328            var _LinkItem;
1329            var _ImageLoading;
1330            var _ImageLoaded;
1331            var _ImageLazyLoading;
1332            var _ContentRefreshed;
1333
1334            var _Processor;
1335
1336            var _PlayerInstanceElement;
1337            var _PlayerInstance;
1338
1339            var _SequenceNumber;    //for debug only
1340
1341            $JssorAnimator$.call(_SelfSlideItem, -_DisplayPieces, _DisplayPieces + 1, { $SlideItemAnimator: true });
1342
1343            function ResetCaptionSlider(fresh) {
1344                _CaptionSliderOut && _CaptionSliderOut.$Revert();
1345                _CaptionSliderIn && _CaptionSliderIn.$Revert();
1346
1347                RefreshContent(slideElmt, fresh);
1348                _ContentRefreshed = true;
1349
1350                _CaptionSliderIn = new _CaptionSliderOptions.$Class(slideElmt, _CaptionSliderOptions, 1);

1351                $JssorDebug$.$LiveStamp(_CaptionSliderIn, "caption_slider_" + _CaptionSliderCount + "_in");
1352                _CaptionSliderOut = new _CaptionSliderOptions.$Class(slideElmt, _CaptionSliderOptions);
1353                $JssorDebug$.$LiveStamp(_CaptionSliderOut, "caption_slider_" + _CaptionSliderCount + "_out");
1354
1355                $JssorDebug$.$Execute(function () {
1356                    _CaptionSliderCount++;
1357                });
1358
1359                _CaptionSliderOut.$GoToBegin();
1360                _CaptionSliderIn.$GoToBegin();
1361            }
1362
1363            function EnsureCaptionSliderVersion() {
1364                if (_CaptionSliderIn.$Version < _CaptionSliderOptions.$Version) {
1365                    ResetCaptionSlider();
1366                }
1367            }
1368
1369            //event handling begin
1370            function LoadImageCompleteEventHandler(completeCallback, loadingScreen, image) {
1371                if (!_ImageLoaded) {
1372                    _ImageLoaded = true;
1373
1374                    if (_ImageItem && image) {
1375                        var imageWidth = image.width;
1376                        var imageHeight = image.height;
1377                        var fillWidth = imageWidth;
1378                        var fillHeight = imageHeight;
1379
1380                        if (imageWidth && imageHeight && _Options.$FillMode) {
1381
1382                            //0 stretch, 1 contain (keep aspect ratio and put all inside slide), 2 cover (keep aspect ratio and cover whole slide), 4 actual size, 5 contain for large image, actual size for small image, default value is 0
1383                            if (_Options.$FillMode & 3 && (!(_Options.$FillMode & 4) || imageWidth > _SlideWidth || imageHeight > _SlideHeight)) {
1384                                var fitHeight = false;
1385                                var ratio = _SlideWidth / _SlideHeight * imageHeight / imageWidth;
1386
1387                                if (_Options.$FillMode & 1) {
1388                                    fitHeight = (ratio > 1);
1389                                }
1390                                else if (_Options.$FillMode & 2) {
1391                                    fitHeight = (ratio < 1);
1392                                }
1393                                fillWidth = fitHeight ? imageWidth * _SlideHeight / imageHeight : _SlideWidth;
1394                                fillHeight = fitHeight ? _SlideHeight : imageHeight * _SlideWidth / imageWidth;
1395                            }
1396
1397                            $Jssor$.$CssWidth(_ImageItem, fillWidth);
1398                            $Jssor$.$CssHeight(_ImageItem, fillHeight);
1399                            $Jssor$.$CssTop(_ImageItem, (_SlideHeight - fillHeight) / 2);
1400                            $Jssor$.$CssLeft(_ImageItem, (_SlideWidth - fillWidth) / 2);
1401                        }
1402
1403                        $Jssor$.$CssPosition(_ImageItem, "absolute");
1404
1405                        _SelfSlider.$TriggerEvent(JssorSlider.$EVT_LOAD_END, slideItem);
1406                    }
1407                }
1408
1409                $Jssor$.$HideElement(loadingScreen);
1410                completeCallback && completeCallback(_SelfSlideItem);
1411            }
1412
1413            function LoadSlideshowImageCompleteEventHandler(nextIndex, nextItem, slideshowTransition, loadingTicket) {
1414                if (loadingTicket == _LoadingTicket && _CurrentSlideIndex == slideIndex && _AutoPlay) {
1415                    if (!_Frozen) {
1416                        var nextRealIndex = GetRealIndex(nextIndex);
1417                        _SlideshowRunner.$Initialize(nextRealIndex, slideIndex, nextItem, _SelfSlideItem, slideshowTransition);
1418                        nextItem.$HideContentForSlideshow();
1419                        _Slideshow.$Locate(nextRealIndex, 1);
1420                        _Slideshow.$GoToPosition(nextRealIndex);
1421                        _CarouselPlayer.$PlayCarousel(nextIndex, nextIndex, 0);
1422                    }
1423                }
1424            }
1425
1426            function SlideReadyEventHandler(loadingTicket) {
1427                if (loadingTicket == _LoadingTicket && _CurrentSlideIndex == slideIndex) {
1428
1429                    if (!_Processor) {
1430                        var slideshowProcessor = null;
1431                        if (_SlideshowRunner) {
1432                            if (_SlideshowRunner.$Index == slideIndex)
1433                                slideshowProcessor = _SlideshowRunner.$GetProcessor();
1434                            else
1435                                _SlideshowRunner.$Clear();
1436                        }
1437
1438                        EnsureCaptionSliderVersion();
1439
1440                        _Processor = new Processor(slideElmt, slideIndex, slideshowProcessor, _SelfSlideItem.$GetCaptionSliderIn(), _SelfSlideItem.$GetCaptionSliderOut());
1441                        _Processor.$SetPlayer(_PlayerInstance);
1442                    }
1443
1444                    !_Processor.$IsPlaying() && _Processor.$Replay();
1445                }
1446            }
1447
1448            function ParkEventHandler(currentIndex, previousIndex, manualActivate) {
1449                if (currentIndex == slideIndex) {
1450
1451                    if (currentIndex != previousIndex)
1452                        _SlideItems[previousIndex] && _SlideItems[previousIndex].$ParkOut();
1453                    else
1454                        !manualActivate && _Processor && _Processor.$AdjustIdleOnPark();
1455
1456                    _PlayerInstance && _PlayerInstance.$Enable();
1457
1458                    //park in
1459                    var loadingTicket = _LoadingTicket = $Jssor$.$GetNow();
1460                    _SelfSlideItem.$LoadImage($Jssor$.$CreateCallback(null, SlideReadyEventHandler, loadingTicket));
1461                }
1462                else {
1463                    var distance = Math.abs(slideIndex - currentIndex);
1464                    var loadRange = _DisplayPieces + _Options.$LazyLoading;
1465                    if (!_ImageLazyLoading || distance <= loadRange || _SlideCount - distance <= loadRange) {
1466                        _SelfSlideItem.$LoadImage();
1467                    }
1468                }
1469            }
1470
1471            function SwipeStartEventHandler() {
1472                if (_CurrentSlideIndex == slideIndex && _Processor) {
1473                    _Processor.$Stop();
1474                    _PlayerInstance && _PlayerInstance.$Quit();
1475                    _PlayerInstance && _PlayerInstance.$Disable();
1476                    _Processor.$OpenSlideshowPanel();
1477                }
1478            }
1479
1480            function FreezeEventHandler() {
1481                if (_CurrentSlideIndex == slideIndex && _Processor) {
1482                    _Processor.$Stop();
1483                }
1484            }
1485
1486            function LinkClickEventHandler(event) {
1487                if (_LastDragSucceded) {
1488                    $Jssor$.$CancelEvent(event);
1489                }
1490                else {
1491                    _SelfSlider.$TriggerEvent(JssorSlider.$EVT_CLICK, slideIndex, event);
1492                }
1493            }
1494
1495            function PlayerAvailableEventHandler() {
1496                _PlayerInstance = _PlayerInstanceElement.pInstance;
1497                _Processor && _Processor.$SetPlayer(_PlayerInstance);
1498            }
1499
1500            _SelfSlideItem.$LoadImage = function (completeCallback, loadingScreen) {
1501                loadingScreen = loadingScreen || _LoadingScreen;
1502
1503                if (_ImageElmts.length && !_ImageLoaded) {
1504
1505                    $Jssor$.$ShowElement(loadingScreen);
1506
1507                    if (!_ImageLoading) {
1508                        _ImageLoading = true;
1509                        _SelfSlider.$TriggerEvent(JssorSlider.$EVT_LOAD_START);
1510
1511                        $Jssor$.$Each(_ImageElmts, function (imageElmt) {
1512
1513                            if (!imageElmt.src) {
1514                                imageElmt.src = $Jssor$.$AttributeEx(imageElmt, "src2");
1515                                $Jssor$.$CssDisplay(imageElmt, imageElmt["display-origin"]);
1516                            }
1517                        });
1518                    }
1519                    $Jssor$.$LoadImages(_ImageElmts, _ImageItem, $Jssor$.$CreateCallback(null, LoadImageCompleteEventHandler, completeCallback, loadingScreen));
1520                }
1521                else {
1522                    LoadImageCompleteEventHandler(completeCallback, loadingScreen);
1523                }
1524            };
1525
1526            _SelfSlideItem.$GoForNextSlide = function () {
1527                if (_SlideshowRunner) {
1528                    var slideshowTransition = _SlideshowRunner.$GetTransition(_SlideCount);
1529
1530                    if (slideshowTransition) {
1531                        var loadingTicket = _LoadingTicket = $Jssor$.$GetNow();
1532
1533                        var nextIndex = slideIndex + _PlayReverse;

1534                        var nextItem = _SlideItems[GetRealIndex(nextIndex)];
1535                        return nextItem.$LoadImage($Jssor$.$CreateCallback(null, LoadSlideshowImageCompleteEventHandler, nextIndex, nextItem, slideshowTransition, loadingTicket), _LoadingScreen);
1536                    }
1537                }
1538
1539                PlayTo(_CurrentSlideIndex + _Options.$AutoPlaySteps * _PlayReverse);
1540            };
1541
1542            _SelfSlideItem.$TryActivate = function () {
1543                ParkEventHandler(slideIndex, slideIndex, true);
1544            };
1545
1546            _SelfSlideItem.$ParkOut = function () {
1547                //park out
1548                _PlayerInstance && _PlayerInstance.$Quit();
1549                _PlayerInstance && _PlayerInstance.$Disable();
1550                _SelfSlideItem.$UnhideContentForSlideshow();
1551                _Processor && _Processor.$Abort();
1552                _Processor = null;
1553                ResetCaptionSlider();
1554            };
1555
1556            //for debug only
1557            _SelfSlideItem.$StampSlideItemElements = function (stamp) {
1558                stamp = _SequenceNumber + "_" + stamp;
1559
1560                $JssorDebug$.$Execute(function () {
1561                    if (_ImageItem)
1562                        $Jssor$.$Attribute(_ImageItem, "debug-id", stamp + "_slide_item_image_id");
1563
1564                    $Jssor$.$Attribute(slideElmt, "debug-id", stamp + "_slide_item_item_id");
1565                });
1566
1567                $JssorDebug$.$Execute(function () {
1568                    $Jssor$.$Attribute(_Wrapper, "debug-id", stamp + "_slide_item_wrapper_id");
1569                });
1570
1571                $JssorDebug$.$Execute(function () {
1572                    $Jssor$.$Attribute(_LoadingScreen, "debug-id", stamp + "_loading_container_id");
1573                });
1574            };
1575
1576            _SelfSlideItem.$HideContentForSlideshow = function () {
1577                $Jssor$.$HideElement(slideElmt);
1578            };
1579
1580            _SelfSlideItem.$UnhideContentForSlideshow = function () {
1581                $Jssor$.$ShowElement(slideElmt);
1582            };
1583
1584            _SelfSlideItem.$EnablePlayer = function () {
1585                _PlayerInstance && _PlayerInstance.$Enable();
1586            };
1587
1588            function RefreshContent(elmt, fresh, level) {
1589                if (elmt["jssor-slider"])
1590                    return;
1591
1592                level = level || 0;
1593
1594                if (!_ContentRefreshed) {
1595                    if (elmt.tagName == "IMG") {
1596                        _ImageElmts.push(elmt);
1597
1598                        if (!elmt.src) {
1599                            _ImageLazyLoading = true;
1600                            elmt["display-origin"] = $Jssor$.$CssDisplay(elmt);
1601                            $Jssor$.$HideElement(elmt);
1602                        }
1603                    }
1604                    if ($Jssor$.$IsBrowserIe9Earlier()) {
1605                        $Jssor$.$CssZIndex(elmt, ($Jssor$.$CssZIndex(elmt) || 0) + 1);
1606                    }
1607                    if (_Options.$HWA && $Jssor$.$WebKitVersion()) {
1608                        if (!_IsTouchDevice || $Jssor$.$WebKitVersion() < 534 || (!_SlideshowEnabled && !$Jssor$.$IsBrowserChrome())) {
1609                            $Jssor$.$EnableHWA(elmt);
1610                        }
1611                    }
1612                }
1613
1614                var childElements = $Jssor$.$Children(elmt);
1615
1616                $Jssor$.$Each(childElements, function (childElement, i) {
1617
1618                    var uAttribute = $Jssor$.$AttributeEx(childElement, "u");
1619                    if (uAttribute == "player" && !_PlayerInstanceElement) {
1620                        _PlayerInstanceElement = childElement;
1621                        if (_PlayerInstanceElement.pInstance) {
1622                            PlayerAvailableEventHandler();
1623                        }
1624                        else {
1625                            $Jssor$.$AddEvent(_PlayerInstanceElement, "dataavailable", PlayerAvailableEventHandler);
1626                        }
1627                    }
1628
1629                    if (uAttribute == "caption") {
1630                        if (!$Jssor$.$IsBrowserIE() && !fresh) {
1631                            var captionElement = $Jssor$.$CloneNode(childElement);
1632                            $Jssor$.$InsertBefore(elmt, captionElement, childElement);
1633                            $Jssor$.$RemoveChild(elmt, childElement);
1634                            childElement = captionElement;
1635
1636                            fresh = true;
1637                        }
1638                    }
1639                    else if (!_ContentRefreshed && !level && !_ImageItem && $Jssor$.$AttributeEx(childElement, "u") == "image") {
1640                        _ImageItem = childElement;
1641
1642                        if (_ImageItem) {
1643                            if (_ImageItem.tagName == "A") {
1644                                _LinkItemOrigin = _ImageItem;
1645                                $Jssor$.$SetStyles(_LinkItemOrigin, _StyleDef);
1646
1647                                _LinkItem = $Jssor$.$CloneNode(_ImageItem, true);
1648                                //cancel click event on <A> element when a drag of slide succeeded
1649                                $Jssor$.$AddEvent(_LinkItem, "click", LinkClickEventHandler);
1650
1651                                $Jssor$.$SetStyles(_LinkItem, _StyleDef);
1652                                $Jssor$.$CssDisplay(_LinkItem, "block");
1653                                $Jssor$.$CssOpacity(_LinkItem, 0);
1654                                $Jssor$.$Css(_LinkItem, "backgroundColor", "#000");
1655
1656                                _ImageItem = $Jssor$.$FindChildByTag(_ImageItem, "IMG");
1657
1658                                $JssorDebug$.$Execute(function () {
1659                                    if (!_ImageItem) {
1660                                        $JssorDebug$.$Error("slide html code definition error, no 'IMG' found in a 'image with link' slide.\r\n" + elmt.outerHTML);
1661                                    }
1662                                });
1663                            }
1664                            _ImageItem.border = 0;
1665
1666                            $Jssor$.$SetStyles(_ImageItem, _StyleDef);
1667                        }
1668                    }
1669

1670                    RefreshContent(childElement, fresh, level + 1);
1671                });
1672            }
1673
1674            _SelfSlideItem.$OnInnerOffsetChange = function (oldOffset, newOffset) {
1675                var slidePosition = _DisplayPieces - newOffset;
1676
1677                SetPosition(_Wrapper, slidePosition);
1678
1679                //following lines are for future usage, not ready yet
1680                //if (!_IsDragging || !_IsCaptionSliderPlayingWhenDragStart) {
1681                //    var _DealWithParallax;
1682                //    if (IsCurrentSlideIndex(slideIndex)) {
1683                //        if (_CaptionSliderOptions.$PlayOutMode == 2)
1684                //            _DealWithParallax = true;
1685                //    }
1686                //    else {
1687                //        if (!_CaptionSliderOptions.$PlayInMode) {
1688                //            //PlayInMode: 0 none
1689                //            _CaptionSliderIn.$GoToEnd();
1690                //        }
1691                //        //else if (_CaptionSliderOptions.$PlayInMode == 1) {
1692                //        //    //PlayInMode: 1 chain
1693                //        //    _CaptionSliderIn.$GoToBegin();
1694                //        //}
1695                //        else if (_CaptionSliderOptions.$PlayInMode == 2) {
1696                //            //PlayInMode: 2 parallel
1697                //            _DealWithParallax = true;
1698                //        }
1699                //    }
1700
1701                //    if (_DealWithParallax) {
1702                //        _CaptionSliderIn.$GoToPosition((_CaptionSliderIn.$GetPosition_OuterEnd() - _CaptionSliderIn.$GetPosition_OuterBegin()) * Math.abs(newOffset - 1) * .8 + _CaptionSliderIn.$GetPosition_OuterBegin());
1703                //    }
1704                //}
1705            };
1706
1707            _SelfSlideItem.$GetCaptionSliderIn = function () {
1708                return _CaptionSliderIn;
1709            };
1710
1711            _SelfSlideItem.$GetCaptionSliderOut = function () {
1712                return _CaptionSliderOut;
1713            };
1714
1715            _SelfSlideItem.$Index = slideIndex;
1716
1717            $JssorObject$.call(_SelfSlideItem);
1718
1719            //SlideItem Constructor
1720            {
1721
1722                var thumb = $Jssor$.$FindChild(slideElmt, "thumb", true);
1723                if (thumb) {
1724                    _SelfSlideItem.$Thumb = $Jssor$.$CloneNode(thumb);
1725                    $Jssor$.$RemoveAttribute(thumb, "id");
1726                    $Jssor$.$HideElement(thumb);
1727                }
1728                $Jssor$.$ShowElement(slideElmt);
1729
1730                _LoadingScreen = $Jssor$.$CloneNode(_LoadingContainer);
1731                $Jssor$.$CssZIndex(_LoadingScreen, 1000);
1732
1733                //cancel click event on <A> element when a drag of slide succeeded
1734                $Jssor$.$AddEvent(slideElmt, "click", LinkClickEventHandler);
1735
1736                ResetCaptionSlider(true);
1737
1738                _SelfSlideItem.$Image = _ImageItem;
1739                _SelfSlideItem.$Link = _LinkItem;
1740
1741                _SelfSlideItem.$Item = slideElmt;
1742
1743                _SelfSlideItem.$Wrapper = _Wrapper = slideElmt;
1744                $Jssor$.$AppendChild(_Wrapper, _LoadingScreen);
1745
1746                _SelfSlider.$On(203, ParkEventHandler);
1747                _SelfSlider.$On(28, FreezeEventHandler);
1748                _SelfSlider.$On(24, SwipeStartEventHandler);
1749
1750                $JssorDebug$.$Execute(function () {
1751                    _SequenceNumber = _SlideItemCreatedCount++;
1752                });
1753
1754                $JssorDebug$.$Execute(function () {
1755                    $Jssor$.$Attribute(_Wrapper, "debug-id", "slide-" + slideIndex);
1756                });
1757            }
1758        }
1759        //SlideItem
1760
1761        //Processor
1762        function Processor(slideElmt, slideIndex, slideshowProcessor, captionSliderIn, captionSliderOut) {
1763
1764            var _SelfProcessor = this;
1765
1766            var _ProgressBegin = 0;
1767            var _SlideshowBegin = 0;
1768            var _SlideshowEnd;
1769            var _CaptionInBegin;
1770            var _IdleBegin;
1771            var _IdleEnd;
1772            var _ProgressEnd;
1773
1774            var _IsSlideshowRunning;
1775            var _IsRollingBack;
1776
1777            var _PlayerInstance;
1778            var _IsPlayerOnService;
1779
1780            var slideItem = _SlideItems[slideIndex];
1781

1782            $JssorAnimator$.call(_SelfProcessor, 0, 0);
1783
1784            function UpdateLink() {
1785
1786                $Jssor$.$ClearChildren(_LinkContainer);
1787
1788                if (_ShowLink && _IsSlideshowRunning && slideItem.$Link) {
1789                    $Jssor$.$AppendChild(_LinkContainer, slideItem.$Link);
1790                }
1791
1792                $Jssor$.$ShowElement(_LinkContainer, !_IsSlideshowRunning && slideItem.$Image);
1793            }
1794
1795            function ProcessCompleteEventHandler() {
1796
1797                if (_IsRollingBack) {
1798                    _IsRollingBack = false;
1799                    _SelfSlider.$TriggerEvent(JssorSlider.$EVT_ROLLBACK_END, slideIndex, _IdleEnd, _ProgressBegin, _IdleBegin, _IdleEnd, _ProgressEnd);
1800                    _SelfProcessor.$GoToPosition(_IdleBegin);
1801                }
1802
1803                _SelfProcessor.$Replay();
1804            }
1805
1806            function PlayerSwitchEventHandler(isOnService) {
1807                _IsPlayerOnService = isOnService;
1808
1809                _SelfProcessor.$Stop();
1810                _SelfProcessor.$Replay();
1811            }
1812
1813            _SelfProcessor.$Replay = function () {
1814
1815                var currentPosition = _SelfProcessor.$GetPosition_Display();
1816
1817                if (!_IsDragging && !_IsSliding && !_IsPlayerOnService && _CurrentSlideIndex == slideIndex) {
1818
1819                    if (!currentPosition) {
1820                        if (_SlideshowEnd && !_IsSlideshowRunning) {
1821                            _IsSlideshowRunning = true;
1822
1823                            _SelfProcessor.$OpenSlideshowPanel(true);
1824
1825                            _SelfSlider.$TriggerEvent(JssorSlider.$EVT_SLIDESHOW_START, slideIndex, _ProgressBegin, _SlideshowBegin, _SlideshowEnd, _ProgressEnd);
1826                        }
1827
1828                        UpdateLink();
1829                    }
1830
1831                    var toPosition;
1832                    var stateEvent = JssorSlider.$EVT_STATE_CHANGE;
1833
1834                    if (currentPosition != _ProgressEnd) {
1835                        if (currentPosition == _IdleEnd) {
1836                            toPosition = _ProgressEnd;
1837                        }
1838                        else if (currentPosition == _IdleBegin) {
1839                            toPosition = _IdleEnd;
1840                        }
1841                        else if (!currentPosition) {
1842                            toPosition = _IdleBegin;
1843                        }
1844                        else if (currentPosition > _IdleEnd) {
1845                            _IsRollingBack = true;
1846                            toPosition = _IdleEnd;
1847                            stateEvent = JssorSlider.$EVT_ROLLBACK_START;
1848                        }
1849                        else {
1850                            //continue from break (by drag or lock)
1851                            toPosition = _SelfProcessor.$GetPlayToPosition();
1852                        }
1853                    }
1854
1855                    //$JssorDebug$.$Execute(function () {
1856                    //    if (currentPosition == _ProgressEnd) {
1857                    //        debugger;
1858                    //    }
1859                    //});
1860
1861                    _SelfSlider.$TriggerEvent(stateEvent, slideIndex, currentPosition, _ProgressBegin, _IdleBegin, _IdleEnd, _ProgressEnd);
1862
1863                    var allowAutoPlay = _AutoPlay && (!_HoverToPau

1863se || _NotOnHover);
1864
1865                    if (currentPosition == _ProgressEnd) {
1866                        (_IdleEnd != _ProgressEnd && !(_HoverToPause & 12) || allowAutoPlay) && slideItem.$GoForNextSlide();
1867                    }
1868                    else if (allowAutoPlay || currentPosition != _IdleEnd) {
1869                        _SelfProcessor.$PlayToPosition(toPosition, ProcessCompleteEventHandler);
1870                    }
1871                }
1872            };
1873
1874            _SelfProcessor.$AdjustIdleOnPark = function () {
1875                if (_IdleEnd == _ProgressEnd && _IdleEnd == _SelfProcessor.$GetPosition_Display())
1876                    _SelfProcessor.$GoToPosition(_IdleBegin);
1877            };
1878
1879            _SelfProcessor.$Abort = function () {
1880                _SlideshowRunner && _SlideshowRunner.$Index == slideIndex && _SlideshowRunner.$Clear();
1881
1882                var currentPosition = _SelfProcessor.$GetPosition_Display();
1883                if (currentPosition < _ProgressEnd) {
1884                    _SelfSlider.$TriggerEvent(JssorSlider.$EVT_STATE_CHANGE, slideIndex, -currentPosition -1, _ProgressBegin, _IdleBegin, _IdleEnd, _ProgressEnd);
1885                }
1886            };
1887
1888            _SelfProcessor.$OpenSlideshowPanel = function (open) {
1889                if (slideshowProcessor) {
1890                    $Jssor$.$CssOverflow(_SlideshowPanel, open && slideshowProcessor.$Transition.$Outside ? "" : "hidden");
1891                }
1892            };
1893
1894            _SelfProcessor.$OnInnerOffsetChange = function (oldPosition, newPosition) {
1895
1896                if (_IsSlideshowRunning && newPosition >= _SlideshowEnd) {
1897                    _IsSlideshowRunning = false;
1898                    UpdateLink();
1899                    slideItem.$UnhideContentForSlideshow();
1900                    _SlideshowRunner.$Clear();
1901
1902                    _SelfSlider.$TriggerEvent(JssorSlider.$EVT_SLIDESHOW_END, slideIndex, _ProgressBegin, _SlideshowBegin, _SlideshowEnd, _ProgressEnd);
1903                }
1904
1905                _SelfSlider.$TriggerEvent(JssorSlider.$EVT_PROGRESS_CHANGE, slideIndex, newPosition, _ProgressBegin, _IdleBegin, _IdleEnd, _ProgressEnd);
1906            };
1907
1908            _SelfProcessor.$SetPlayer = function (playerInstance) {
1909                if (playerInstance && !_PlayerInstance) {
1910                    _PlayerInstance = playerInstance;
1911
1912                    playerInstance.$On($JssorPlayer$.$EVT_SWITCH, PlayerSwitchEventHandler);
1913                }
1914            };
1915
1916            //Processor Constructor
1917            {
1918                if (slideshowProcessor) {
1919                    _SelfProcessor.$Chain(slideshowProcessor);
1920                }
1921
1922                _SlideshowEnd = _SelfProcessor.$GetPosition_OuterEnd();
1923                _CaptionInBegin = _SelfProcessor.$GetPosition_OuterEnd();
1924                _SelfProcessor.$Chain(captionSliderIn);
1925                _IdleBegin = captionSliderIn.$GetPosition_OuterEnd();
1926                _IdleEnd = _IdleBegin + ($Jssor$.$ParseFloat($Jssor$.$AttributeEx(slideElmt, "idle")) || _Options.$AutoPlayInterval);
1927
1928                captionSliderOut.$Shift(_IdleEnd);
1929                _SelfProcessor.$Combine(captionSliderOut);
1930                _ProgressEnd = _SelfProcessor.$GetPosition_OuterEnd();
1931            }
1932        }
1933        //Processor
1934        //private classes
1935
1936        function SetPosition(elmt, position) {
1937            var orientation = _DragOrientation > 0 ? _DragOrientation : _PlayOrientation;
1938            var x = _StepLengthX * position * (orientation & 1);
1939            var y = _StepLengthY * position * ((orientation >> 1) & 1);
1940
1941            if ($Jssor$.$IsBrowserChrome() && $Jssor$.$BrowserVersion() < 38) {
1942                x = x.toFixed(3);
1943                y = y.toFixed(3);
1944            }
1945            else {
1946                x = Math.round(x);
1947                y = Math.round(y);
1948            }
1949
1950            if ($Jssor$.$IsBrowserIE() && $Jssor$.$BrowserVersion() >= 10 && $Jssor$.$BrowserVersion() < 11) {
1951                elmt.style.msTransform = "translate(" + x + "px, " + y + "px)";
1952            }
1953            else if ($Jssor$.$IsBrowserChrome() && $Jssor$.$BrowserVersion() >= 30 && $Jssor$.$BrowserVersion() < 34) {
1954                elmt.style.WebkitTransition = "transform 0s";
1955                elmt.style.WebkitTransform = "translate3d(" + x + "px, " + y + "px, 0px) perspective(2000px)";
1956            }
1957            else {
1958                $Jssor$.$CssLeft(elmt, x);
1959                $Jssor$.$CssTop(elmt, y);
1960            }
1961        }
1962
1963        //Event handling begin
1964

1965        function OnMouseDown(event) {
1966            var tagName = $Jssor$.$EventSrc(event).tagName;
1967            if (!_DragOrientationRegistered && tagName != "INPUT" && tagName != "TEXTAREA" && tagName != "SELECT" && RegisterDrag()) {
1968                OnDragStart(event);
1969            }
1970        }
1971
1972        function RecordFreezePoint() {
1973
1974            _CarouselPlaying_OnFreeze = _IsSliding;
1975            _PlayToPosition_OnFreeze = _CarouselPlayer.$GetPlayToPosition();
1976            _Position_OnFreeze = _Conveyor.$GetPosition();
1977
1978        }
1979
1980        function Freeze() {
1981
1982            RecordFreezePoint();
1983
1984            if (_IsDragging || !_NotOnHover && (_HoverToPause & 12)) {
1985                _CarouselPlayer.$Stop();
1986
1987                _SelfSlider.$TriggerEvent(JssorSlider.$EVT_FREEZE);
1988            }
1989
1990        }
1991
1992        function Unfreeze(byDrag) {
1993
1994            byDrag && RecordFreezePoint();
1995
1996            if (!_IsDragging && (_NotOnHover || !(_HoverToPause & 12)) && !_CarouselPlayer.$IsPlaying()) {
1997
1998                var currentPosition = _Conveyor.$GetPosition();
1999                var toPosition = Math.ceil(_Position_OnFreeze);
2000
2001                if (byDrag && Math.abs(_DragOffsetTotal) >= _Options.$MinDragOffsetToSlide) {
2002                    toPosition = Math.ceil(currentPosition);
2003                    toPosition += _DragIndexAdjust;
2004                }
2005
2006                if (!(_Loop & 1)) {
2007                    toPosition = Math.min(_SlideCount - _DisplayPieces, Math.max(toPosition, 0));
2008                }
2009
2010                var t = Math.abs(toPosition - currentPosition);
2011                t = 1 - Math.pow(1 - t, 5);
2012
2013                if (!_LastDragSucceded && _CarouselPlaying_OnFreeze) {
2014                    _CarouselPlayer.$Continue(_PlayToPosition_OnFreeze);
2015                }
2016                else if (currentPosition == toPosition) {
2017                    _CurrentSlideItem.$EnablePlayer();
2018                    _CurrentSlideItem.$TryActivate();
2019                }
2020                else {
2021
2022                    _CarouselPlayer.$PlayCarousel(currentPosition, toPosition, t * _SlideDuration);
2023                }
2024            }
2025        }
2026
2027        function OnDragStart(event) {
2028
2029            _IsDragging = true;
2030            _DragInvalid = false;
2031            _LoadingTicket = null;
2032
2033            $Jssor$.$AddEvent(document, _MoveEvent, OnDragMove);
2034
2035            _LastTimeMoveByDrag = $Jssor$.$GetNow() - 50;
2036
2037            _LastDragSucceded = 0;
2038            Freeze();
2039
2040            if (!_CarouselPlaying_OnFreeze)
2041                _DragOrientation = 0;
2042
2043            if (_HandleTouchEventOnly) {
2044                var touchPoint = event.touches[0];
2045                _DragStartMouseX = touchPoint.clientX;
2046                _DragStartMouseY = touchPoint.clientY;
2047            }
2048            else {
2049                var mousePoint = $Jssor$.$MousePosition(event);
2050
2051                _DragStartMouseX = mousePoint.x;
2052                _DragStartMouseY = mousePoint.y;
2053
2054                $Jssor$.$CancelEvent(event);
2055            }
2056
2057            _DragOffsetTotal = 0;
2058            _DragOffsetLastTime = 0;
2059            _DragIndexAdjust = 0;
2060
2061            //Trigger EVT_DRAGSTART
2062            _SelfSlider.$TriggerEvent(JssorSlider.$EVT_DRAG_START, GetRealIndex(_Position_OnFreeze), _Position_OnFreeze, event);
2063        }
2064
2065        function OnDragMove(event) {
2066            if (_IsDragging && (!$Jssor$.$IsBrowserIe9Earlier() || event.button)) {
2067                var actionPoint;
2068
2069                if (_HandleTouchEventOnly) {
2070                    var touches = event.touches;
2071                    if (touches && touches.length > 0) {
2072                        actionPoint = { x: touches[0].clientX, y: touches[0].clientY };
2073                    }
2074                }
2075                else {
2076                    actionPoint = $Jssor$.$MousePosition(event);
2077                }
2078
2079                if (actionPoint) {
2080                    var distanceX = actionPoint.x - _DragStartMouseX;
2081                    var distanceY = actionPoint.y - _DragStartMouseY;
2082
2083
2084                    if (Math.floor(_Position_OnFreeze) != _Position_OnFreeze)
2085                        _DragOrientation = _DragOrientation || (_PlayOrientation & _DragOrientationRegistered);
2086
2087                    if ((distanceX || distanceY) && !_DragOrientation) {
2088                        if (_DragOrientationRegistered == 3) {
2089                            if (Math.abs(distanceY) > Math.abs(distanceX)) {
2090                                _DragOrientation = 2;
2091                            }
2092                            else
2093                                _DragOrientation = 1;
2094                        }
2095                        else {
2096                            _DragOrientation = _DragOrientationRegistered;
2097                        }
2098
2099                        if (_IsTouchDevice && _DragOrientation == 1 && Math.abs(distanceY) - Math.abs(distanceX) > 3) {
2100                            _DragInvalid = true;
2101                        }
2102                    }
2103
2104                    if (_DragOrientation) {
2105                        var distance = distanceY;
2106                        var stepLength = _StepLengthY;
2107
2108                        if (_DragOrientation == 1) {
2109                            distance = distanceX;
2110                            stepLength = _StepLengthX;
2111                        }
2112
2113                        if (!(_Loop & 1)) {
2114                            if (distance > 0) {
2115                                var normalDistance = stepLength * _CurrentSlideIndex;
2116                                var sqrtDistance = distance - normalDistance;
2117                                if (sqrtDistance > 0) {
2118                                    distance = normalDistance + Math.sqrt(sqrtDistance) * 5;
2119                                }
2120                            }
2121
2122                            if (distance < 0) {
2123                                var normalDistance = stepLength * (_SlideCount - _DisplayPieces - _CurrentSlideIndex);
2124                                var sqrtDistance = -distance - normalDistance;
2125
2126                                if (sqrtDistance > 0) {
2127                                    distance = -normalDistance - Math.sqrt(sqrtDistance) * 5;
2128                                }
2129                            }
2130                        }
2131
2132                        if (_DragOffsetTotal - _DragOffsetLastTime < -2) {
2133                            _DragIndexAdjust = 0;
2134                        }
2135                        else if (_DragOffsetTotal - _DragOffsetLastTime > 2) {
2136                            _DragIndexAdjust = -1;
2137                        }
2138
2139                        _DragOffsetLastTime = _DragOffsetTotal;
2140                        _DragOffsetTotal = distance;
2141                        _PositionToGoByDrag = _Position_OnFreeze - _DragOffsetTotal / stepLength / (_ScaleRatio || 1);
2142
2143                        if (_DragOffsetTotal && _DragOrientation && !_DragInvalid) {
2144                            $Jssor$.$CancelEvent(event);
2145                            if (!_IsSliding) {

2146                                _CarouselPlayer.$StandBy(_PositionToGoByDrag);
2147                            }
2148                            else
2149                                _CarouselPlayer.$SetStandByPosition(_PositionToGoByDrag);
2150                        }
2151                        else if ($Jssor$.$IsBrowserIe9Earlier()) {
2152                            $Jssor$.$CancelEvent(event);
2153                        }
2154                    }
2155                }
2156            }
2157            else {
2158                OnDragEnd(event);
2159            }
2160        }
2161
2162        function OnDragEnd(event) {
2163            UnregisterDrag();
2164
2165            if (_IsDragging) {
2166
2167                _IsDragging = false;
2168
2169                _LastTimeMoveByDrag = $Jssor$.$GetNow();
2170
2171                $Jssor$.$RemoveEvent(document, _MoveEvent, OnDragMove);
2172
2173                _LastDragSucceded = _DragOffsetTotal;
2174
2175                _LastDragSucceded && $Jssor$.$CancelEvent(event);
2176
2177                _CarouselPlayer.$Stop();
2178
2179                var currentPosition = _Conveyor.$GetPosition();
2180
2181                //Trigger EVT_DRAG_END
2182                _SelfSlider.$TriggerEvent(JssorSlider.$EVT_DRAG_END, GetRealIndex(currentPosition), currentPosition, GetRealIndex(_Position_OnFreeze), _Position_OnFreeze, event);
2183
2184                Unfreeze(true);
2185            }
2186        }
2187        //Event handling end
2188
2189        function SetCurrentSlideIndex(index) {
2190            _PrevSlideItem = _SlideItems[_CurrentSlideIndex];
2191            _PreviousSlideIndex = _CurrentSlideIndex;
2192            _CurrentSlideIndex = GetRealIndex(index);
2193            _CurrentSlideItem = _SlideItems[_CurrentSlideIndex];
2194            ResetNavigator(index);
2195            return _CurrentSlideIndex;
2196        }
2197
2198        function OnPark(slideIndex, prevIndex) {
2199            _DragOrientation = 0;
2200
2201            SetCurrentSlideIndex(slideIndex);
2202
2203            //Trigger EVT_PARK
2204            _SelfSlider.$TriggerEvent(JssorSlider.$EVT_PARK, GetRealIndex(slideIndex), prevIndex);
2205        }
2206
2207        function ResetNavigator(index, temp) {
2208            _TempSlideIndex = index;
2209            $Jssor$.$Each(_Navigators, function (navigator) {
2210                navigator.$SetCurrentIndex(GetRealIndex(index), index, temp);
2211            });
2212        }
2213
2214        function RegisterDrag() {
2215            var dragRegistry = JssorSlider.$DragRegistry || 0;
2216            var dragOrientation = _DragEnabled;
2217            if (_IsTouchDevice)
2218                (dragOrientation & 1) && (dragOrientation &= 1);
2219            JssorSlider.$DragRegistry |= dragOrientation;
2220
2221            return (_DragOrientationRegistered = dragOrientation & ~dragRegistry);
2222        }
2223
2224        function UnregisterDrag() {
2225            if (_DragOrientationRegistered) {
2226                JssorSlider.$DragRegistry &= ~_DragEnabled;
2227                _DragOrientationRegistered = 0;
2228            }
2229        }
2230
2231        function CreatePanel() {
2232            var div = $Jssor$.$CreateDiv();
2233
2234            $Jssor$.$SetStyles(div, _StyleDef);
2235            $Jssor$.$CssPosition(div, "absolute");
2236
2237            return div;
2238        }
2239
2240        function GetRealIndex(index) {
2241            return (index % _SlideCount + _SlideCount) % _SlideCount;
2242        }
2243
2244        function IsCurrentSlideIndex(index) {
2245            return GetRealIndex(index) == _CurrentSlideIndex;
2246        }
2247
2248        function IsPreviousSlideIndex(index) {
2249            return GetRealIndex(index) == _PreviousSlideIndex;
2250        }
2251
2252        //Navigation Request Handler
2253        function NavigationClickHandler(index, relative) {
2254            if (relative) {
2255                if (!_Loop) {
2256                    //Stop at threshold
2257                    index = Math.min(Math.max(index + _TempSlideIndex, 0), _SlideCount - _DisplayPieces);
2258                    relative = false;
2259                }
2260                else if (_Loop & 2) {
2261                    //Rewind
2262                    index = GetRealIndex(index + _TempSlideIndex);
2263                    relative = false;
2264                }
2265            }
2266            PlayTo(index, _Options.$SlideDuration, relative);
2267        }
2268
2269        function ShowNavigators() {
2270            $Jssor$.$Each(_Navigators, function (navigator) {
2271                navigator.$Show(navigator.$Options.$ChanceToShow <= _NotOnHover);
2272            });
2273        }
2274
2275        function MainContainerMouseLeaveEventHandler() {
2276            if (!_NotOnHover) {
2277

2278                //$JssorDebug$.$Log("mouseleave");
2279
2280                _NotOnHover = 1;
2281
2282                ShowNavigators();
2283
2284                if (!_IsDragging) {
2285                    (_HoverToPause & 12) && Unfreeze();
2286                    (_HoverToPause & 3) && _SlideItems[_CurrentSlideIndex].$TryActivate();
2287                }
2288            }
2289        }
2290
2291        function MainContainerMouseEnterEventHandler() {
2292
2293            if (_NotOnHover) {
2294
2295                //$JssorDebug$.$Log("mouseenter");
2296
2297                _NotOnHover = 0;
2298
2299                ShowNavigators();
2300
2301                _IsDragging || !(_HoverToPause & 12) || Freeze();
2302            }
2303        }
2304
2305        function AdjustSlidesContainerSize() {
2306            _StyleDef = { $Width: _SlideWidth, $Height: _SlideHeight, $Top: 0, $Left: 0 };
2307
2308            $Jssor$.$Each(_SlideElmts, function (slideElmt, i) {
2309
2310                $Jssor$.$SetStyles(slideElmt, _StyleDef);
2311                $Jssor$.$CssPosition(slideElmt, "absolute");
2312                $Jssor$.$CssOverflow(slideElmt, "hidden");
2313
2314                $Jssor$.$HideElement(slideElmt);
2315            });
2316
2317            $Jssor$.$SetStyles(_LoadingContainer, _StyleDef);
2318        }
2319
2320        function PlayToOffset(offset, slideDuration) {
2321            PlayTo(offset, slideDuration, true);
2322        }
2323
2324        function PlayTo(slideIndex, slideDuration, relative) {
2325            ///	<summary>
2326            ///		PlayTo( slideIndex [, slideDuration] ); //Play slider to position 'slideIndex' within a period calculated base on 'slideDuration'.
2327            ///	</summary>
2328            ///	<param name="slideIndex" type="Number">
2329            ///		slide slideIndex or position will be playing to
2330            ///	</param>
2331            ///	<param name="slideDuration" type="Number" optional="true">
2332            ///		base slide duration in milliseconds to calculate the whole duration to complete this play request.
2333            ///	    default value is '$SlideDuration' value which is specified when initialize the slider.
2334            ///	</param>
2335            /// http://msdn.microsoft.com/en-us/library/vstudio/bb385682.aspx
2336            /// http://msdn.microsoft.com/en-us/library/vstudio/hh542720.aspx
2337            if (_CarouselEnabled && (!_IsDragging || _Options.$NaviQuitDrag)) {
2338                _IsSliding = true;
2339                _IsDragging = false;
2340                _CarouselPlayer.$Stop();
2341
2342                {
2343                    //Slide Duration
2344                    if (slideDuration == undefined)
2345                        slideDuration = _SlideDuration;
2346
2347                    var positionDisplay = _Carousel.$GetPosition_Display();
2348                    var positionTo = slideIndex;
2349                    if (relative) {
2350                        positionTo = positionDisplay + slideIndex;
2351                        if (slideIndex > 0)
2352                            positionTo = Math.ceil(positionTo);
2353                        else
2354                            positionTo = Math.floor(positionTo);
2355                    }
2356
2357
2358                    if (!(_Loop & 1)) {
2359                        positionTo = GetRealIndex(positionTo);
2360                        positionTo = Math.max(0, Math.min(positionTo, _SlideCount - _DisplayPieces));
2361                    }
2362
2363                    var positionOffset = (positionTo - positionDisplay) % _SlideCount;
2364                    positionTo = positionDisplay + positionOffset;
2365
2366                    var duration = positionDisplay == positionTo ? 0 : slideDuration * Math.abs(positionOffset);
2367                    duration = Math.min(duration, slideDuration * _DisplayPieces * 1.5);
2368
2369                    _CarouselPlayer.$PlayCarousel(positionDisplay, positionTo, duration || 1);
2370                }
2371            }
2372        }
2373
2374        //private functions
2375
2376        //member functions
2377
2378        _SelfSlider.$PlayTo = PlayTo;
2379
2380        _SelfSlider.$GoTo = function (slideIndex) {
2381            ///	<summary>
2382            ///		instance.$GoTo( slideIndex );   //Go to the specifed slide immediately with no play.
2383            ///	</summary>
2384            PlayTo(slideIndex, 1);
2385        };
2386
2387        _SelfSlider.$Next = function () {
2388            ///	<summary>
2389            ///		instance.$Next();   //Play the slider to next slide.
2390            ///	</summary>
2391            PlayToOffset(1);
2392        };
2393
2394        _SelfSlider.$Prev = function () {
2395            ///	<summary>

2396            ///		instance.$Prev();   //Play the slider to previous slide.
2397            ///	</summary>
2398            PlayToOffset(-1);
2399        };
2400
2401        _SelfSlider.$Pause = function () {
2402            ///	<summary>
2403            ///		instance.$Pause();   //Pause the slider, prevent it from auto playing.
2404            ///	</summary>
2405            _AutoPlay = false;
2406        };
2407
2408        _SelfSlider.$Play = function () {
2409            ///	<summary>
2410            ///		instance.$Play();   //Start auto play if the slider is currently paused.
2411            ///	</summary>
2412            if (!_AutoPlay) {
2413                _AutoPlay = true;
2414                _SlideItems[_CurrentSlideIndex] && _SlideItems[_CurrentSlideIndex].$TryActivate();
2415            }
2416        };
2417
2418        _SelfSlider.$SetSlideshowTransitions = function (transitions) {
2419            ///	<summary>
2420            ///		instance.$SetSlideshowTransitions( transitions );   //Reset slideshow transitions for the slider.
2421            ///	</summary>
2422            $JssorDebug$.$Execute(function () {
2423                if (!transitions || !transitions.length) {
2424                    $JssorDebug$.$Error("Can not set slideshow transitions, no transitions specified.");
2425                }
2426            });
2427
2428            $Jssor$.$TranslateTransitions(transitions);    //for old transition compatibility
2429            _Options.$SlideshowOptions.$Transitions = transitions;
2430        };
2431
2432        _SelfSlider.$SetCaptionTransitions = function (transitions) {
2433            ///	<summary>
2434            ///		instance.$SetCaptionTransitions( transitions );   //Reset caption transitions for the slider.
2435            ///	</summary>
2436            $JssorDebug$.$Execute(function () {
2437                if (!transitions || !transitions.length) {
2438                    $JssorDebug$.$Error("Can not set caption transitions, no transitions specified");
2439                }
2440            });
2441
2442            $Jssor$.$TranslateTransitions(transitions);    //for old transition compatibility
2443            _CaptionSliderOptions.$CaptionTransitions = transitions;
2444            _CaptionSliderOptions.$Version = $Jssor$.$GetNow();
2445        };
2446
2447        _SelfSlider.$SlidesCount = function () {
2448            ///	<summary>
2449            ///		instance.$SlidesCount();   //Retrieve slides count of the slider.
2450            ///	</summary>
2451            return _SlideElmts.length;
2452        };
2453
2454        _SelfSlider.$CurrentIndex = function () {
2455            ///	<summary>
2456            ///		instance.$CurrentIndex();   //Retrieve current slide index of the slider.
2457            ///	</summary>
2458            return _CurrentSlideIndex;
2459        };
2460
2461        _SelfSlider.$IsAutoPlaying = function () {
2462            ///	<summary>
2463            ///		instance.$IsAutoPlaying();   //Retrieve auto play status of the slider.
2464            ///	</summary>
2465            return _AutoPlay;
2466        };
2467
2468        _SelfSlider.$IsDragging = function () {
2469            ///	<summary>
2470            ///		instance.$IsDragging();   //Retrieve drag status of the slider.
2471            ///	</summary>
2472            return _IsDragging;
2473        };
2474
2475        _SelfSlider.$IsSliding = function () {
2476            ///	<summary>
2477            ///		instance.$IsSliding();   //Retrieve right<-->left sliding status of the slider.
2478            ///	</summary>
2479            return _IsSliding;
2480        };
2481
2482        _SelfSlider.$IsMouseOver = function () {
2483            ///	<summary>
2484            ///		instance.$IsMouseOver();   //Retrieve mouse over status of the slider.
2485            ///	</summary>
2486            return !_NotOnHover;
2487        };
2488
2489        _SelfSlider.$LastDragSucceded = function () {
2490            ///	<summary>
2491            ///		instance.$IsLastDragSucceded();   //Retrieve last drag succeded status, returns 0 if failed, returns drag offset if succeded
2492            ///	</summary>
2493            return _LastDragSucceded;
2494        };
2495
2496        function OriginalWidth() {
2497            ///	<summary>
2498            ///		instance.$OriginalWidth();   //Retrieve original width of the slider.
2499            ///	</summary>
2500            return $Jssor$.$CssWidth(_ScaleWrapper || elmt);
2501        }
2502
2503        function OriginalHeight() {
2504            ///	<summary>
2505            ///		instance.$OriginalHeight();   //Retrieve original height of the slider.
2506            ///	</summary>
2507            return $Jssor$.$CssHeight(_ScaleWrapper || elmt);
2508        }
2509
2510        _SelfSlider.$OriginalWidth = _SelfSlider.$GetOriginalWidth = OriginalWidth;
2511
2512        _SelfSlider.$OriginalHeight = _SelfSlider.$GetOriginalHeight = OriginalHeight;
2513
2514        function Scale(dimension, isHeight) {
2515            ///	<summary>
2516            ///		instance.$ScaleWidth();   //Retrieve scaled dimension the slider currently displays.
2517            ///		instance.$ScaleWidth( dimension );   //Scale the slider to new width and keep aspect ratio.
2518            ///	</summary>
2519
2520            if (dimension == undefined)
2521                return $Jssor$.$CssWidth(elmt);
2522
2523            $JssorDebug$.$Execute(function () {
2524                if (!dimension || dimension < 0) {
2525                    $JssorDebug$.$Fail("'$ScaleWidth' error, 'dimension' should be positive value.");
2526                }
2527            });
2528
2529            if (!_ScaleWrapper) {
2530                $JssorDebug$.$Execute(function () {
2531                    var originalWidthStr = $Jssor$.$Css(elmt, "width");
2532                    var originalHeightStr = $Jssor$.$Css(elmt, "height");
2533                    var originalWidth = $Jssor$.$CssP(elmt, "width");
2534                    var originalHeight = $Jssor$.$CssP(elmt, "height");
2535
2536                    if (!originalWidthStr) {
2537                        $JssorDebug$.$Fail("Cannot scale jssor slider, 'dimension' of 'outer container' not specified. Please specify 'dimension' in pixel. e.g. 'dimension: 600px;'");
2538                    }
2539
2540                    if (!originalHeightStr) {
2541                        $JssorDebug$.$Fail("Cannot scale jssor slider, 'he

2541ight' of 'outer container' not specified. Please specify 'height' in pixel. e.g. 'height: 300px;'");
2542                    }
2543
2544                    if (originalWidthStr.indexOf('%') != -1) {
2545                        $JssorDebug$.$Fail("Cannot scale jssor slider, 'dimension' of 'outer container' not valid. Please specify 'dimension' in pixel. e.g. 'dimension: 600px;'");
2546                    }
2547
2548                    if (originalHeightStr.indexOf('%') != -1) {
2549                        $JssorDebug$.$Fail("Cannot scale jssor slider, 'height' of 'outer container' not valid. Please specify 'height' in pixel. e.g. 'height: 300px;'");
2550                    }
2551
2552                    if (!originalWidth) {
2553                        $JssorDebug$.$Fail("Cannot scale jssor slider, 'dimension' of 'outer container' not valid. 'dimension' of 'outer container' should be positive number. e.g. 'dimension: 600px;'");
2554                    }
2555
2556                    if (!originalHeight) {
2557                        $JssorDebug$.$Fail("Cannot scale jssor slider, 'height' of 'outer container' not valid. 'height' of 'outer container' should be positive number. e.g. 'height: 300px;'");
2558                    }
2559                });
2560
2561                var innerWrapper = $Jssor$.$CreateDiv(document);
2562                $Jssor$.$CssCssText(innerWrapper, $Jssor$.$CssCssText(elmt));
2563                $Jssor$.$ClassName(innerWrapper, $Jssor$.$ClassName(elmt));
2564
2565                $Jssor$.$CssPosition(innerWrapper, "relative");
2566                $Jssor$.$CssTop(innerWrapper, 0);
2567                $Jssor$.$CssLeft(innerWrapper, 0);
2568                $Jssor$.$CssOverflow(innerWrapper, "visible");
2569
2570                _ScaleWrapper = $Jssor$.$CreateDiv(document);
2571
2572                $Jssor$.$CssPosition(_ScaleWrapper, "absolute");
2573                $Jssor$.$CssTop(_ScaleWrapper, 0);
2574                $Jssor$.$CssLeft(_ScaleWrapper, 0);
2575                $Jssor$.$CssWidth(_ScaleWrapper, $Jssor$.$CssWidth(elmt));
2576                $Jssor$.$CssHeight(_ScaleWrapper, $Jssor$.$CssHeight(elmt));
2577                $Jssor$.$SetStyleTransformOrigin(_ScaleWrapper, "0 0");
2578
2579                $Jssor$.$AppendChild(_ScaleWrapper, innerWrapper);
2580
2581                var children = $Jssor$.$Children(elmt);
2582                $Jssor$.$AppendChild(elmt, _ScaleWrapper);
2583
2584                $Jssor$.$Css(elmt, "backgroundImage", "");
2585
2586                var noMoveElmts = {
2587                    "navigator": _BulletNavigatorOptions && _BulletNavigatorOptions.$Scale == false,
2588                    "arrowleft": _ArrowNavigatorOptions && _ArrowNavigatorOptions.$Scale == false,
2589                    "arrowright": _ArrowNavigatorOptions && _ArrowNavigatorOptions.$Scale == false,
2590                    "thumbnavigator": _ThumbnailNavigatorOptions && _ThumbnailNavigatorOptions.$Scale == false,
2591                    "thumbwrapper": _ThumbnailNavigatorOptions && _ThumbnailNavigatorOptions.$Scale == false
2592                };
2593
2594                $Jssor$.$Each(children, function (child) {
2595                    $Jssor$.$AppendChild(noMoveElmts[$Jssor$.$AttributeEx(child, "u")] ? elmt : innerWrapper, child);
2596                });
2597
2598                $Jssor$.$ShowElement(innerWrapper);
2599                $Jssor$.$ShowElement(_ScaleWrapper);
2600            }
2601
2602            $JssorDebug$.$Execute(function () {
2603                if (!_InitialScrollWidth) {
2604                    _InitialScrollWidth = _SelfSlider.$Elmt.scrollWidth;
2605                }
2606            });
2607
2608            _ScaleRatio = dimension /  (isHeight? $Jssor$.$CssHeight : $Jssor$.$CssWidth)(_ScaleWrapper);
2609            $Jssor$.$CssScale(_ScaleWrapper, _ScaleRatio);
2610
2611            var scaleWidth = isHeight ? (_ScaleRatio * OriginalWidth()) : dimension;
2612            var scaleHeight = isHeight ? dimension : (_ScaleRatio * OriginalHeight());
2613
2614            $Jssor$.$CssWidth(elmt, scaleWidth);
2615            $Jssor$.$CssHeight(elmt, scaleHeight);
2616
2617            $Jssor$.$Each(_Navigators, function (navigator) {
2618                navigator.$Relocate(scaleWidth, scaleHeight);
2619            });
2620        }
2621
2622        _SelfSlider.$ScaleHeight = _SelfSlider.$GetScaleHeight = function (height) {
2623            ///	<summary>
2624            ///		instance.$ScaleHeight();   //Retrieve scaled height the slider currently displays.
2625            ///		instance.$ScaleHeight( dimension );   //Scale the slider to new height and keep aspect ratio.
2626            ///	</summary>
2627
2628            if (height == undefined)
2629                return $Jssor$.$CssHeight(elmt);
2630
2631            Scale(height, true);
2632        };
2633
2634        _SelfSlider.$ScaleWidth = _SelfSlider.$SetScaleWidth = _SelfSlider.$GetScaleWidth = Scale;
2635
2636        _SelfSlider.$GetVirtualIndex = function (index) {
2637            var parkingIndex = Math.ceil(GetRealIndex(_ParkingPosition / _StepLength));
2638            var displayIndex = GetRealIndex(index - _CurrentSlideIndex + parkingIndex);
2639
2640            if (displayIndex > _DisplayPieces) {
2641                if (index - _CurrentSlideIndex > _SlideCount / 2)
2642                    index -= _SlideCount;
2643                else if (index - _CurrentSlideIndex <= -_SlideCount / 2)
2644                    index += _SlideCount;
2645            }
2646            else {
2647                index = _CurrentSlideIndex + displayIndex - parkingIndex;
2648            }
2649
2650            return index;
2651        };
2652
2653        //member functions
2654
2655        $JssorObject$.call(_SelfSlider);
2656
2657        $JssorDebug$.$Execute(function () {
2658            var outerContainerElmt = $Jssor$.$GetElement(elmt);
2659            if (!outerContainerElmt)
2660                $JssorDebug$.$Fail("Outer container '" + elmt + "' not found.");
2661        });
2662
2663        //initialize member variables
2664        _SelfSlider.$Elmt = elmt = $Jssor$.$GetElement(elmt);
2665        //initialize member variables
2666
2667        var _InitialScrollWidth;    //for debug only
2668        var _CaptionSliderCount = 1;    //for debug only
2669
2670        var _Options = $Jssor$.$Extend({
2671            $FillMode: 0,                   //[Optional] The way to fill image in slide, 0 stretch, 1 contain (keep aspect ratio and put all inside slide), 2 cover (keep aspect ratio and cover whole slide), 4 actual size, 5 contain for large image, actual size for small image, default value is 0
2672            $LazyLoading: 1,                //[Optional] For image with  lazy loading format (<IMG src2="url" .../>), by default it will be loaded only when the slide comes.

2673            //But an integer value (maybe 0, 1, 2 or 3) indicates that how far of nearby slides should be loaded immediately as well, default value is 1.
2674            $StartIndex: 0,                 //[Optional] Index of slide to display when initialize, default value is 0
2675            $AutoPlay: false,               //[Optional] Whether to auto play, default value is false
2676            $Loop: 1,                       //[Optional] Enable loop(circular) of carousel or not, 0: stop, 1: loop, 2 rewind, default value is 1
2677            $HWA: true,                     //[Optional] Enable hardware acceleration or not, default value is true
2678            $NaviQuitDrag: true,
2679            $AutoPlaySteps: 1,              //[Optional] Steps to go of every play (this options applys only when slideshow disabled), default value is 1
2680            $AutoPlayInterval: 3000,        //[Optional] Interval to play next slide since the previous stopped if a slideshow is auto playing, default value is 3000
2681            $PauseOnHover: 1,               //[Optional] Whether to pause when mouse over if a slider is auto playing, 0 no pause, 1 pause for desktop, 2 pause for touch device, 3 pause for desktop and touch device, 4 freeze for desktop, 8 freeze for touch device, 12 freeze for desktop and touch device, default value is 1
2682
2683            $SlideDuration: 500,            //[Optional] Specifies default duration (swipe) for slide in milliseconds, default value is 400
2684            $SlideEasing: $JssorEasing$.$EaseOutQuad,   //[Optional] Specifies easing for right to left animation, default value is $JssorEasing$.$EaseOutQuad
2685            $MinDragOffsetToSlide: 20,      //[Optional] Minimum drag offset that trigger slide, default value is 20
2686            $SlideSpacing: 0, 				//[Optional] Space between each slide in pixels, default value is 0
2687            $DisplayPieces: 1,              //[Optional] Number of pieces to display (the slideshow would be disabled if the value is set to greater than 1), default value is 1
2688            $ParkingPosition: 0,            //[Optional] The offset position to park slide (this options applys only when slideshow disabled), default value is 0.
2689            $UISearchMode: 1,               //[Optional] The way (0 parellel, 1 recursive, default value is recursive) to search UI components (slides container, loading screen, navigator container, arrow navigator container, thumbnail navigator container etc.
2690            $PlayOrientation: 1,            //[Optional] Orientation to play slide (for auto play, navigation), 1 horizental, 2 vertical, 5 horizental reverse, 6 vertical reverse, default value is 1
2691            $DragOrientation: 1             //[Optional] Orientation to drag slide, 0 no drag, 1 horizental, 2 vertical, 3 both, default value is 1 (Note that the $DragOrientation should be the same as $PlayOrientation when $DisplayPieces is greater than 1, or parking position is not 0)
2692
2693        }, options);
2694
2695        //Sodo statement for development time intellisence only
2696        $JssorDebug$.$Execute(function () {
2697            _Options = $Jssor$.$Extend({
2698                $ArrowKeyNavigation: undefined,
2699                $SlideWidth: undefined,
2700                $SlideHeight: undefined,
2701                $SlideshowOptions: undefined,
2702                $CaptionSliderOptions: undefined,
2703                $BulletNavigatorOptions: undefined,
2704                $ArrowNavigatorOptions: undefined,
2705                $ThumbnailNavigatorOptions: undefined
2706            },
2707            _Options);
2708        });
2709
2710        var _PlayOrientation = _Options.$PlayOrientation & 3;
2711        var _PlayReverse = (_Options.$PlayOrientation & 4) / -4 || 1;
2712
2713        var _SlideshowOptions = _Options.$SlideshowOptions;
2714        var _CaptionSliderOptions = $Jssor$.$Extend({ $Class: $JssorCaptionSliderBase$, $PlayInMode: 1, $PlayOutMode: 1 }, _Options.$CaptionSliderOptions);
2715        $Jssor$.$TranslateTransitions(_CaptionSliderOptions.$CaptionTransitions); //for old transition compatibility
2716        var _BulletNavigatorOptions = _Options.$BulletNavigatorOptions;
2717        var _ArrowNavigatorOptions = _Options.$ArrowNavigatorOptions;
2718        var _ThumbnailNavigatorOptions = _Options.$ThumbnailNavigatorOptions;
2719
2720        $JssorDebug$.$Execute(function () {
2721            if (_SlideshowOptions && !_SlideshowOptions.$Class) {
2722                $JssorDebug$.$Fail("Option $SlideshowOptions error, class not specified.");
2723            }
2724        });
2725
2726        $JssorDebug$.$Execute(function () {
2727            if (_Options.$CaptionSliderOptions && !_Options.$CaptionSliderOptions.$Class) {
2728                $JssorDebug$.$Fail("Option $CaptionSliderOptions error, class not specified.");
2729            }
2730        });
2731
2732        $JssorDebug$.$Execute(function () {
2733            if (_BulletNavigatorOptions && !_BulletNavigatorOptions.$Class) {
2734                $JssorDebug$.$Fail("Option $BulletNavigatorOptions error, class not specified.");
2735            }
2736        });
2737
2738        $JssorDebug$.$Execute(function () {
2739            if (_ArrowNavigatorOptions && !_ArrowNavigatorOptions.$Class) {
2740                $JssorDebug$.$Fail("Option $ArrowNavigatorOptions error, class not specified.");
2741            }
2742        });
2743
2744        $JssorDebug$.$Execute(function () {
2745            if (_ThumbnailNavigatorOptions && !_ThumbnailNavigatorOptions.$Class) {
2746                $JssorDebug$.$Fail("Option $ThumbnailNavigatorOptions error, class not specified.");
2747            }
2748        });
2749
2750        var _UISearchNoDeep = !_Options.$UISearchMode;

2751        var _ScaleWrapper;
2752        var _SlidesContainer = $Jssor$.$FindChild(elmt, "slides", _UISearchNoDeep);
2753        var _LoadingContainer = $Jssor$.$FindChild(elmt, "loading", _UISearchNoDeep) || $Jssor$.$CreateDiv(document);
2754
2755        var _BulletNavigatorContainer = $Jssor$.$FindChild(elmt, "navigator", _UISearchNoDeep);
2756
2757        var _ArrowLeft = $Jssor$.$FindChild(elmt, "arrowleft", _UISearchNoDeep);
2758        var _ArrowRight = $Jssor$.$FindChild(elmt, "arrowright", _UISearchNoDeep);
2759
2760        var _ThumbnailNavigatorContainer = $Jssor$.$FindChild(elmt, "thumbnavigator", _UISearchNoDeep);
2761
2762        $JssorDebug$.$Execute(function () {
2763            //if (_BulletNavigatorOptions && !_BulletNavigatorContainer) {
2764            //    throw new Error("$BulletNavigatorOptions specified but bullet navigator container (<div u=\"navigator\" ...) not defined.");
2765            //}
2766            if (_BulletNavigatorContainer && !_BulletNavigatorOptions) {
2767                throw new Error("Bullet navigator container defined but $BulletNavigatorOptions not specified.");
2768            }
2769
2770            //if (_ArrowNavigatorOptions) {
2771            //    if (!_ArrowLeft) {
2772            //        throw new Error("$ArrowNavigatorOptions specified, but arrowleft (<span u=\"arrowleft\" ...) not defined.");
2773            //    }
2774
2775            //    if (!_ArrowRight) {
2776            //        throw new Error("$ArrowNavigatorOptions specified, but arrowright (<span u=\"arrowright\" ...) not defined.");
2777            //    }
2778            //}
2779
2780            if ((_ArrowLeft || _ArrowRight) && !_ArrowNavigatorOptions) {
2781                throw new Error("arrowleft or arrowright defined, but $ArrowNavigatorOptions not specified.");
2782            }
2783
2784            //if (_ThumbnailNavigatorOptions && !_ThumbnailNavigatorContainer) {
2785            //    throw new Error("$ThumbnailNavigatorOptions specified, but thumbnail navigator container (<div u=\"thumbnavigator\" ...) not defined.");
2786            //}
2787
2788            if (_ThumbnailNavigatorContainer && !_ThumbnailNavigatorOptions) {

2789                throw new Error("Thumbnail navigator container defined, but $ThumbnailNavigatorOptions not specified.");
2790            }
2791        });
2792
2793        var _SlidesContainerWidth = $Jssor$.$CssWidth(_SlidesContainer);
2794        var _SlidesContainerHeight = $Jssor$.$CssHeight(_SlidesContainer);
2795
2796        $JssorDebug$.$Execute(function () {
2797            if (isNaN(_SlidesContainerWidth))
2798                $JssorDebug$.$Fail("Width of slides container wrong specification, it should be specified in pixel (like style='width: 600px;').");
2799
2800            if (_SlidesContainerWidth == undefined)
2801                $JssorDebug$.$Fail("Width of slides container not specified, it should be specified in pixel (like style='width: 600px;').");
2802
2803            if (isNaN(_SlidesContainerHeight))
2804                $JssorDebug$.$Fail("Height of slides container wrong specification, it should be specified in pixel (like style='height: 300px;').");
2805
2806            if (_SlidesContainerHeight == undefined)
2807                $JssorDebug$.$Fail("Height of slides container not specified, it should be specified in pixel (like style='height: 300px;').");
2808
2809            var slidesContainerOverflow = $Jssor$.$CssOverflow(_SlidesContainer);
2810            var slidesContainerOverflowX = $Jssor$.$Css(_SlidesContainer, "overflowX");
2811            var slidesContainerOverflowY = $Jssor$.$Css(_SlidesContainer, "overflowY");
2812            if (slidesContainerOverflow != "hidden" && (slidesContainerOverflowX != "hidden" || slidesContainerOverflowY != "hidden"))
2813                $JssorDebug$.$Fail("Overflow of slides container wrong specification, it should be specified as 'hidden' (style='overflow:hidden;').");
2814
2815            //var slidesContainerTop = $Jssor$.$CssTop(_SlidesContainer);
2816            //var slidesContainerLeft = $Jssor$.$CssLeft(_SlidesContainer);
2817
2818            //if (isNaN(slidesContainerTop))
2819            //    $JssorDebug$.$Fail("Top of slides container wrong specification, it should be specified in pixel (like style='top: 0px;').");
2820
2821            //if (slidesContainerTop == undefined)
2822            //    $JssorDebug$.$Fail("Top of slides container not specified, it should be specified in pixel (like style='top: 0px;').");
2823
2824            //if (isNaN(slidesContainerLeft))
2825            //    $JssorDebug$.$Fail("Left of slides container wrong specification, it should be specified in pixel (like style='left: 0px;').");
2826
2827            //if (slidesContainerLeft == undefined)
2828            //    $JssorDebug$.$Fail("Left of slides container not specified, it should be specified in pixel (like style='left: 0px;').");
2829        });
2830
2831        $JssorDebug$.$Execute(function () {
2832            if (!$Jssor$.$IsNumeric(_Options.$DisplayPieces))
2833                $JssorDebug$.$Fail("Option $DisplayPieces error, it should be a numeric value and greater than or equal to 1.");
2834
2835            if (_Options.$DisplayPieces < 1)
2836                $JssorDebug$.$Fail("Option $DisplayPieces error, it should be greater than or equal to 1.");
2837
2838            if (_Options.$DisplayPieces > 1 && _Options.$DragOrientation && _Options.$DragOrientation != _PlayOrientation)
2839                $JssorDebug$.$Fail("Option $DragOrientation error, it should be 0 or the same of $PlayOrientation when $DisplayPieces is greater than 1.");
2840
2841            if (!$Jssor$.$IsNumeric(_Options.$ParkingPosition))
2842                $JssorDebug$.$Fail("Option $ParkingPosition error, it should be a numeric value.");
2843
2844            if (_Options.$ParkingPosition && _Options.$DragOrientation && _Options.$DragOrientation != _PlayOrientation)
2845                $JssorDebug$.$Fail("Option $DragOrientation error, it should be 0 or the same of $PlayOrientation when $ParkingPosition is not equal to 0.");
2846        });
2847
2848        var _StyleDef;
2849
2850        var _SlideElmts = [];
2851
2852        {
2853            var slideElmts = $Jssor$.$Children(_SlidesContainer);
2854            $Jssor$.$Each(slideElmts, function (slideElmt) {
2855                if (slideElmt.tagName == "DIV" && !$Jssor$.$AttributeEx(slideElmt, "u")) {
2856                    _SlideElmts.push(slideElmt);
2857                }
2858            });
2859        }
2860
2861        $JssorDebug$.$Execute(function () {
2862            if (_SlideElmts.length < 1) {
2863                $JssorDebug$.$Error("Slides html code definition error, there must be at least 1 slide to initialize a slider.");
2864            }
2865        });
2866
2867        var _SlideItemCreatedCount = 0; //for debug only
2868        var _SlideItemReleasedCount = 0;    //for debug only
2869
2870        var _PreviousSlideIndex;
2871        var _CurrentSlideIndex = -1;
2872        var _TempSlideIndex;
2873        var _PrevSlideItem;
2874        var _CurrentSlideItem;
2875        var _SlideCount = _SlideElmts.length;
2876
2877        var _SlideWidth = _Options.$SlideWidth || _SlidesContainerWidth;
2878        var _SlideHeight = _Options.$SlideHeight || _SlidesContainerHeight;
2879
2880        var _SlideSpacing = _Options.$SlideSpacing;
2881        var _StepLengthX = _SlideWidth + _SlideSpacing;
2882        var _StepLengthY = _SlideHeight + _SlideSpacing;
2883        var _StepLength = (_PlayOrientation & 1) ? _StepLengthX : _StepLengthY;
2884        var _DisplayPieces = Math.min(_Options.$DisplayPieces, _SlideCount);
2885
2886        var _SlideshowPanel;
2887        var _CurrentBoardIndex = 0;
2888        var _DragOrientation;
2889        var _DragOrientationRegistered;
2890        var _DragInvalid;
2891
2892        var _HandleTouchEventOnly;
2893        var _IsTouchDevice;
2894
2895        var _Navigators = [];
2896        var _BulletNavigator;
2897        var _ArrowNavigator;
2898        var _ThumbnailNavigator;
2899
2900        var _ShowLink;
2901
2902        var _Frozen;
2903        var _AutoPlay;
2904        var _AutoPlaySteps = _Options.$AutoPlaySteps;

2905        var _HoverToPause = _Options.$PauseOnHover;
2906        var _AutoPlayInterval = _Options.$AutoPlayInterval;
2907        var _SlideDuration = _Options.$SlideDuration;
2908
2909        var _SlideshowRunnerClass;
2910        var _TransitionsOrder;
2911
2912        var _SlideshowEnabled;
2913        var _ParkingPosition;
2914        var _CarouselEnabled = _DisplayPieces < _SlideCount;
2915        var _Loop = _CarouselEnabled ? _Options.$Loop : 0;
2916
2917        var _DragEnabled;
2918        var _LastDragSucceded;
2919
2920        var _NotOnHover = 1;   //0 Hovering, 1 Not hovering
2921
2922        //Variable Definition
2923        var _IsSliding;
2924        var _IsDragging;
2925        var _LoadingTicket;
2926
2927        //The X position of mouse/touch when a drag start
2928        var _DragStartMouseX = 0;
2929        //The Y position of mouse/touch when a drag start
2930        var _DragStartMouseY = 0;
2931        var _DragOffsetTotal;
2932        var _DragOffsetLastTime;
2933        var _DragIndexAdjust;
2934
2935        var _Carousel;
2936        var _Conveyor;
2937        var _Slideshow;
2938        var _CarouselPlayer;
2939        var _SlideContainer = new SlideContainer();
2940        var _ScaleRatio;
2941
2942        //$JssorSlider$ Constructor
2943        {
2944            _AutoPlay = _Options.$AutoPlay;
2945            _SelfSlider.$Options = options;
2946
2947            AdjustSlidesContainerSize();
2948
2949            elmt["jssor-slider"] = true;
2950
2951            //_SlideshowPanel = CreatePanel();
2952            //$Jssor$.$CssZIndex(elmt, $Jssor$.$CssZIndex(elmt));
2953            //$Jssor$.$CssLeft(_SlideshowPanel, $Jssor$.$CssLeft(_SlidesContainer));
2954            //$Jssor$.$CssZIndex(_SlidesContainer, $Jssor$.$CssZIndex(_SlidesContainer));
2955            //$Jssor$.$CssTop(_SlideshowPanel, $Jssor$.$CssTop(_SlidesContainer));
2956            $Jssor$.$CssZIndex(_SlidesContainer, $Jssor$.$CssZIndex(_SlidesContainer) || 0);
2957            $Jssor$.$CssPosition(_SlidesContainer, "absolute");
2958            _SlideshowPanel = $Jssor$.$CloneNode(_SlidesContainer);
2959            $Jssor$.$InsertBefore($Jssor$.$ParentNode(_SlidesContainer), _SlideshowPanel, _SlidesContainer);
2960
2961            if (_SlideshowOptions) {
2962                _ShowLink = _SlideshowOptions.$ShowLink;
2963                _SlideshowRunnerClass = _SlideshowOptions.$Class;
2964
2965                $JssorDebug$.$Execute(function () {
2966                    if (!_SlideshowOptions.$Transitions || !_SlideshowOptions.$Transitions.length) {
2967                        $JssorDebug$.$Error("Invalid '$SlideshowOptions', no '$Transitions' specified.");
2968                    }
2969                });
2970
2971                $Jssor$.$TranslateTransitions(_SlideshowOptions.$Transitions); //for old transition compatibility
2972
2973                _SlideshowEnabled = _DisplayPieces == 1 && _SlideCount > 1 && _SlideshowRunnerClass && (!$Jssor$.$IsBrowserIE() || $Jssor$.$BrowserVersion() >= 8);
2974            }
2975
2976            _ParkingPosition = (_SlideshowEnabled || _DisplayPieces >= _SlideCount || !(_Loop & 1)) ? 0 : _Options.$ParkingPosition;
2977
2978            _DragEnabled = ((_DisplayPieces > 1 || _ParkingPosition) ? _PlayOrientation : -1) & _Options.$DragOrientation;
2979
2980            //SlideBoard
2981            var _SlideboardElmt = _SlidesContainer;
2982            var _SlideItems = [];
2983
2984            var _SlideshowRunner;
2985            var _LinkContainer;
2986
2987            var _DownEvent = "mousedown";
2988            var _MoveEvent = "mousemove";
2989            var _UpEvent = "mouseup";
2990            var _CancelEvent;
2991
2992            var _LastTimeMoveByDrag;
2993            var _Position_OnFreeze;
2994            var _CarouselPlaying_OnFreeze;
2995            var _PlayToPosition_OnFreeze;
2996            var _PositionToGoByDrag;
2997
2998            //SlideBoard Constructor
2999            {
3000                var msPrefix;
3001                if (window.navigator.pointerEnabled || (msPrefix = window.navigator.msPointerEnabled)) {
3002                    _IsTouchDevice = true;
3003
3004                    _DownEvent = msPrefix ? "MSPointerDown" : "pointerdown";
3005                    _MoveEvent = msPrefix ? "MSPointerMove" : "pointermove";
3006                    _UpEvent = msPrefix ? "MSPointerUp" : "pointerup";
3007                    _CancelEvent = msPrefix ? "MSPointerCancel" : "pointercancel";
3008
3009                    if (_DragEnabled) {
3010                        var touchAction = "auto";
3011                        if (_DragEnabled == 2) {
3012                            touchAction = "pan-x";
3013                        }
3014                        else if (_DragEnabled) {
3015                            touchAction = "pan-y";
3016                        }
3017
3018                        $Jssor$.$Css(_SlideboardElmt, msPrefix ? "msTouchAction" : "touchAction", touchAction);
3019                    }
3020                }
3021                else if ("ontouchstart" in window || "createTouch" in document) {
3022                    _HandleTouchEventOnly = true;
3023                    _IsTouchDevice = true;
3024
3025                    _DownEvent = "touchstart";
3026                    _MoveEvent = "touchmove";
3027                    _UpEvent = "touchend";
3028                    _CancelEvent = "touchcancel";
3029                }
3030
3031                _Slideshow = new Slideshow();
3032
3033                if (_SlideshowEnabled)
3034                    _SlideshowRunner = new _SlideshowRunnerClass(_SlideContainer, _SlideWidth, _SlideHeight, _SlideshowOptions, _HandleTouchEventOnly);
3035
3036                $Jssor$.$AppendChild(_SlideshowPanel, _Slideshow.$Wrapper);
3037                $Jssor$.$CssOverflow(_SlidesContainer, "hidden");
3038
3039                //link container
3040                {
3041                    _LinkContainer = CreatePanel();
3042                    $Jssor$.$Css(_LinkContainer, "backgroundColor", "#000");
3043                    $Jssor$.$CssOpacity(_LinkContainer, 0);
3044                    $Jssor$.$InsertBefore(_SlideboardElmt, _LinkContainer, _SlideboardElmt.firstChild);
3045                }
3046
3047                for (var i = 0; i < _SlideElmts.length; i++) {
3048                    var slideElmt = _SlideElmts[i];
3049                    var slideItem = new SlideItem(slideElmt, i);
3050                    _SlideItems.push(slideItem);
3051                }
3052
3053                $Jssor$.$HideElement(_LoadingContainer);
3054
3055                $JssorDebug$.$Execute(function () {
3056                    $Jssor$.$Attribute(_LoadingContainer, "debug

3056-id", "loading-container");
3057                });
3058
3059                _Carousel = new Carousel()
3060                _CarouselPlayer = new CarouselPlayer(_Carousel, _Slideshow);
3061
3062                $JssorDebug$.$Execute(function () {
3063                    $Jssor$.$Attribute(_SlideboardElmt, "debug-id", "slide-board");
3064                });
3065
3066                if (_DragEnabled) {
3067                    $Jssor$.$AddEvent(_SlidesContainer, _DownEvent, OnMouseDown);
3068                    $Jssor$.$AddEvent(document, _UpEvent, OnDragEnd);
3069                    _CancelEvent && $Jssor$.$AddEvent(document, _CancelEvent, OnDragEnd);
3070                }
3071            }
3072            //SlideBoard
3073
3074            _HoverToPause &= (_IsTouchDevice ? 10 : 5);
3075
3076            //Bullet Navigator
3077            if (_BulletNavigatorContainer && _BulletNavigatorOptions) {
3078                _BulletNavigator = new _BulletNavigatorOptions.$Class(_BulletNavigatorContainer, _BulletNavigatorOptions, OriginalWidth(), OriginalHeight());
3079                _Navigators.push(_BulletNavigator);
3080            }
3081
3082            //Arrow Navigator
3083            if (_ArrowNavigatorOptions && _ArrowLeft && _ArrowRight) {
3084                _ArrowNavigator = new _ArrowNavigatorOptions.$Class(_ArrowLeft, _ArrowRight, _ArrowNavigatorOptions, OriginalWidth(), OriginalHeight());
3085                _Navigators.push(_ArrowNavigator);
3086            }
3087
3088            //Thumbnail Navigator
3089            if (_ThumbnailNavigatorContainer && _ThumbnailNavigatorOptions) {
3090                _ThumbnailNavigatorOptions.$StartIndex = _Options.$StartIndex;
3091                _ThumbnailNavigator = new _ThumbnailNavigatorOptions.$Class(_ThumbnailNavigatorContainer, _ThumbnailNavigatorOptions);
3092                _Navigators.push(_ThumbnailNavigator);
3093            }
3094
3095            $Jssor$.$Each(_Navigators, function (navigator) {
3096                navigator.$Reset(_SlideCount, _SlideItems, _LoadingContainer);
3097                navigator.$On($JssorNavigatorEvents$.$NAVIGATIONREQUEST, NavigationClickHandler);
3098            });
3099
3100            Scale(OriginalWidth());
3101
3102            $Jssor$.$AddEvent(elmt, "mouseout", $Jssor$.$MouseOverOutFilter(MainContainerMouseLeaveEventHandler, elmt));
3103            $Jssor$.$AddEvent(elmt, "mouseover", $Jssor$.$MouseOverOutFilter(MainContainerMouseEnterEventHandler, elmt));
3104
3105            ShowNavigators();
3106
3107            //Keyboard Navigation
3108            if (_Options.$ArrowKeyNavigation) {
3109                $Jssor$.$AddEvent(document, "keydown", function (e) {
3110                    if (e.keyCode == $JssorKeyCode$.$LEFT) {
3111                        //Arrow Left
3112                        PlayToOffset(-1);
3113                    }
3114                    else if (e.keyCode == $JssorKeyCode$.$RIGHT) {
3115                        //Arrow Right
3116                        PlayToOffset(1);
3117                    }
3118                });
3119            }
3120
3121            var startPosition = _Options.$StartIndex;
3122            if (!(_Loop & 1)) {
3123                startPosition = Math.max(0, Math.min(startPosition, _SlideCount - _DisplayPieces));
3124            }
3125            _CarouselPlayer.$PlayCarousel(startPosition, startPosition, 0);
3126        }
3127    }
3128    //Jssor Slider
3129
3130    //JssorSlider.$ASSEMBLY_BOTTOM_LEFT = ASSEMBLY_BOTTOM_LEFT;
3131    //JssorSlider.$ASSEMBLY_BOTTOM_RIGHT = ASSEMBLY_BOTTOM_RIGHT;
3132    //JssorSlider.$ASSEMBLY_TOP_LEFT = ASSEMBLY_TOP_LEFT;
3133    //JssorSlider.$ASSEMBLY_TOP_RIGHT = ASSEMBLY_TOP_RIGHT;
3134    //JssorSlider.$ASSEMBLY_LEFT_TOP = ASSEMBLY_LEFT_TOP;
3135    //JssorSlider.$ASSEMBLY_LEFT_BOTTOM = ASSEMBLY_LEFT_BOTTOM;
3136    //JssorSlider.$ASSEMBLY_RIGHT_TOP = ASSEMBLY_RIGHT_TOP;
3137    //JssorSlider.$ASSEMBLY_RIGHT_BOTTOM = ASSEMBLY_RIGHT_BOTTOM;
3138
3139    JssorSlider.$EVT_CLICK = 21;
3140    JssorSlider.$EVT_DRAG_START = 22;
3141    JssorSlider.$EVT_DRAG_END = 23;
3142    JssorSlider.$EVT_SWIPE_START = 24;
3143    JssorSlider.$EVT_SWIPE_END = 25;
3144
3145    JssorSlider.$EVT_LOAD_START = 26;
3146    JssorSlider.$EVT_LOAD_END = 27;
3147    JssorSlider.$EVT_FREEZE = 28;
3148
3149    JssorSlider.$EVT_POSITION_CHANGE = 202;
3150    JssorSlider.$EVT_PARK = 203;
3151
3152    JssorSlider.$EVT_SLIDESHOW_START = 206;
3153    JssorSlider.$EVT_SLIDESHOW_END = 207;
3154
3155    JssorSlider.$EVT_PROGRESS_CHANGE = 208;
3156    JssorSlider.$EVT_STATE_CHANGE = 209;
3157    JssorSlider.$EVT_ROLLBACK_START = 210;
3158    JssorSlider.$EVT_ROLLBACK_END = 211;
3159
3160    window.$JssorSlider$ = $JssorSlider$ = JssorSlider;
3161
3162    //(function ($) {
3163    //    jQuery.fn.jssorSlider = function (options) {
3164    //        return this.each(function () {
3165    //            return $(this).data('jssorSlider') || $(this).data('jssorSlider', new JssorSlider(this, options));
3166    //        });
3167    //    };
3168    //})(jQuery);
3169
3170    //window.jQuery && (jQuery.fn.jssorSlider = function (options) {
3171    //    return this.each(function () {
3172    //        return jQuery(this).data('jssorSlider') || jQuery(this).data('jssorSlider', new JssorSlider(this, options));
3173    //    });
3174    //});
3175};
3176
3177//$JssorBulletNavigator$
3178var $JssorNavigatorEvents$ = {
3179    $NAVIGATIONREQUEST: 1,
3180    $INDEXCHANGE: 2,
3181    $RESET: 3
3182};
3183
3184var $JssorBulletNavigator$ = window.$JssorBulletNavigator$ = function (elmt, options, containerWidth, containerHeight) {
3185    var self = this;
3186    $JssorObject$.call(self);
3187
3188    elmt = $Jssor$.$GetElement(elmt);
3189
3190    var _Count;
3191    var _Length;
3192    var _Width;
3193    var _Height;
3194    var _CurrentIndex;
3195    var _CurrentInnerIndex = 0;
3196    var _Options;
3197    var _Steps;
3198    var _Lanes;
3199    var _SpacingX;
3200    var _SpacingY;
3201    var _Orientation;
3202    var _ItemPrototype;
3203    var _PrototypeWidth;
3204    var _PrototypeHeight;
3205
3206    var _ButtonElements = [];
3207    var _Buttons = [];
3208
3209    function Highlight(index) {
3210        if (index != -1)
3211            _Buttons[index].$Activate(index == _CurrentInnerIndex);
3212    }
3213
3214    function OnNavigationRequest(index) {
3215        self.$TriggerEvent($JssorNavigatorEvents$.$NAVIGATIONREQUEST, index * _Steps);
3216    }
3217
3218    self.$Elmt = elmt;
3219    self.$GetCurrentIndex = function () {
3220        return _CurrentIndex;
3221    };
3222
3223    self.$SetCurrentIndex = function (index) {
3224        if (index != _CurrentIndex) {
3225            var lastInnerIndex = _CurrentInnerIndex;
3226            var innerIndex = Math.floor(index / _Steps);
3227            _CurrentInnerIndex = innerIndex;
3228            _CurrentIndex = index;
3229
3230            Highlight(lastInnerIndex);
3231            Highlight(innerIndex);
3232
3233            //self.$TriggerEvent($JssorNavigatorEvents$.$INDEXCHANGE, index);
3234        }
3235    };
3236
3237    self.$Show = function (hide) {
3238        $Jssor$.$ShowElement(elmt, hide);
3239    };
3240
3241    var _Located;
3242    self.$Relocate = function (containerWidth, containerHeight) {
3243        if (!_Located || _Options.$Scale == false) {

3244            if (_Options.$AutoCenter & 1) {
3245                $Jssor$.$CssLeft(elmt, (containerWidth - _Width) / 2);
3246            }
3247            if (_Options.$AutoCenter & 2) {
3248                $Jssor$.$CssTop(elmt, (containerHeight - _Height) / 2);
3249            }
3250
3251            _Located = true;
3252        }
3253    };
3254
3255    var _Initialized;
3256    self.$Reset = function (length) {
3257        if (!_Initialized) {
3258            _Length = length;
3259            _Count = Math.ceil(length / _Steps);
3260            _CurrentInnerIndex = 0;
3261
3262            var itemOffsetX = _PrototypeWidth + _SpacingX;
3263            var itemOffsetY = _PrototypeHeight + _SpacingY;
3264
3265            var maxIndex = Math.ceil(_Count / _Lanes) - 1;
3266
3267            _Width = _PrototypeWidth + itemOffsetX * (!_Orientation ? maxIndex : _Lanes - 1);
3268            _Height = _PrototypeHeight + itemOffsetY * (_Orientation ? maxIndex : _Lanes - 1);
3269
3270            $Jssor$.$CssWidth(elmt, _Width);
3271            $Jssor$.$CssHeight(elmt, _Height);
3272
3273            for (var buttonIndex = 0; buttonIndex < _Count; buttonIndex++) {
3274
3275                var numberDiv = $Jssor$.$CreateSpan();
3276                $Jssor$.$InnerText(numberDiv, buttonIndex + 1);
3277
3278                var div = $Jssor$.$BuildElement(_ItemPrototype, "numbertemplate", numberDiv, true);
3279                $Jssor$.$CssPosition(div, "absolute");
3280
3281                var columnIndex = buttonIndex % (maxIndex + 1);
3282                $Jssor$.$CssLeft(div, !_Orientation ? itemOffsetX * columnIndex : buttonIndex % _Lanes * itemOffsetX);
3283                $Jssor$.$CssTop(div, _Orientation ? itemOffsetY * columnIndex : Math.floor(buttonIndex / (maxIndex + 1)) * itemOffsetY);
3284
3285                $Jssor$.$AppendChild(elmt, div);
3286                _ButtonElements[buttonIndex] = div;
3287
3288                if (_Options.$ActionMode & 1)
3289                    $Jssor$.$AddEvent(div, "click", $Jssor$.$CreateCallback(null, OnNavigationRequest, buttonIndex));
3290
3291                if (_Options.$ActionMode & 2)
3292                    $Jssor$.$AddEvent(div, "mouseover", $Jssor$.$MouseOverOutFilter($Jssor$.$CreateCallback(null, OnNavigationRequest, buttonIndex), div));
3293
3294                _Buttons[buttonIndex] = $Jssor$.$Buttonize(div);
3295            }
3296
3297            //self.$TriggerEvent($JssorNavigatorEvents$.$RESET);
3298            _Initialized = true;
3299        }
3300    };
3301
3302    //JssorBulletNavigator Constructor
3303    {
3304        self.$Options = _Options = $Jssor$.$Extend({
3305            $SpacingX: 0,
3306            $SpacingY: 0,
3307            $Orientation: 1,
3308            $ActionMode: 1
3309        }, options);
3310
3311        //Sodo statement for development time intellisence only
3312        $JssorDebug$.$Execute(function () {
3313            _Options = $Jssor$.$Extend({
3314                $Steps: undefined,
3315                $Lanes: undefined
3316            }, _Options);
3317        });
3318
3319        _ItemPrototype = $Jssor$.$FindChild(elmt, "prototype");
3320
3321        $JssorDebug$.$Execute(function () {
3322            if (!_ItemPrototype)
3323                $JssorDebug$.$Fail("Navigator item prototype not defined.");
3324
3325            if (isNaN($Jssor$.$CssWidth(_ItemPrototype))) {
3326                $JssorDebug$.$Fail("Width of 'navigator item prototype' not specified.");
3327            }
3328
3329            if (isNaN($Jssor$.$CssHeight(_ItemPrototype))) {
3330                $JssorDebug$.$Fail("Height of 'navigator item prototype' not specified.");
3331            }
3332        });
3333
3334        _PrototypeWidth = $Jssor$.$CssWidth(_ItemPrototype);
3335        _PrototypeHeight = $Jssor$.$CssHeight(_ItemPrototype);
3336
3337        $Jssor$.$RemoveChild(elmt, _ItemPrototype);
3338
3339        _Steps = _Options.$Steps || 1;
3340        _Lanes = _Options.$Lanes || 1;
3341        _SpacingX = _Options.$SpacingX;
3342        _SpacingY = _Options.$SpacingY;
3343        _Orientation = _Options.$Orientation - 1;
3344    }
3345};
3346
3347var $JssorArrowNavigator$ = window.$JssorArrowNavigator$ = function (arrowLeft, arrowRight, options, containerWidth, containerHeight) {
3348    var self = this;
3349    $JssorObject$.call(self);
3350
3351    $JssorDebug$.$Execute(function () {
3352
3353        if (!arrowLeft)
3354            $JssorDebug$.$Fail("Option '$ArrowNavigatorOptions' spepcified, but UI 'arrowleft' not defined. Define 'arrowleft' to enable direct navigation, or remove option '$ArrowNavigatorOptions' to disable direct navigation.");
3355
3356        if (!arrowRight)
3357            $JssorDebug$.$Fail("Option '$ArrowNavigatorOptions' spepcified, but UI 'arrowright' not defined. Define 'arrowright' to enable direct navigation, or remove option '$ArrowNavigatorOptions' to disable direct navigation.");
3358
3359        if (isNaN($Jssor$.$CssWidth(arrowLeft))) {
3360            $JssorDebug$.$Fail("Width of 'arrow left' not specified.");
3361        }
3362
3363        if (isNaN($Jssor$.$CssWidth(arrowRight))) {
3364            $JssorDebug$.$Fail("Width of 'arrow right' not specified.");
3365        }
3366

3367        if (isNaN($Jssor$.$CssHeight(arrowLeft))) {
3368            $JssorDebug$.$Fail("Height of 'arrow left' not specified.");
3369        }
3370
3371        if (isNaN($Jssor$.$CssHeight(arrowRight))) {
3372            $JssorDebug$.$Fail("Height of 'arrow right' not specified.");
3373        }
3374    });
3375
3376    var _Length;
3377    var _CurrentIndex;
3378    var _Options;
3379    var _Steps;
3380    var _ArrowWidth = $Jssor$.$CssWidth(arrowLeft);
3381    var _ArrowHeight = $Jssor$.$CssHeight(arrowLeft);
3382
3383    function OnNavigationRequest(steps) {
3384        self.$TriggerEvent($JssorNavigatorEvents$.$NAVIGATIONREQUEST, steps, true);
3385    }
3386
3387    self.$GetCurrentIndex = function () {
3388        return _CurrentIndex;
3389    };
3390
3391    self.$SetCurrentIndex = function (index, virtualIndex, temp) {
3392        if (temp) {
3393            _CurrentIndex = virtualIndex;
3394        }
3395        else {
3396            _CurrentIndex = index;
3397        }
3398        //self.$TriggerEvent($JssorNavigatorEvents$.$INDEXCHANGE, index);
3399    };
3400
3401    self.$Show = function (hide) {
3402        $Jssor$.$ShowElement(arrowLeft, hide);
3403        $Jssor$.$ShowElement(arrowRight, hide);
3404    };
3405
3406    var _Located;
3407    self.$Relocate = function (conainerWidth, containerHeight) {
3408        if (!_Located || _Options.$Scale == false) {
3409
3410            if (_Options.$AutoCenter & 1) {
3411                $Jssor$.$CssLeft(arrowLeft, (containerWidth - _ArrowWidth) / 2);
3412                $Jssor$.$CssLeft(arrowRight, (containerWidth - _ArrowWidth) / 2);
3413            }
3414
3415            if (_Options.$AutoCenter & 2) {
3416                $Jssor$.$CssTop(arrowLeft, (containerHeight - _ArrowHeight) / 2);
3417                $Jssor$.$CssTop(arrowRight, (containerHeight - _ArrowHeight) / 2);
3418            }
3419
3420            _Located = true;
3421        }
3422    };
3423
3424    var _Initialized;
3425    self.$Reset = function (length) {
3426        _Length = length;
3427        _CurrentIndex = 0;
3428
3429        if (!_Initialized) {
3430
3431            $Jssor$.$AddEvent(arrowLeft, "click", $Jssor$.$CreateCallback(null, OnNavigationRequest, -_Steps));
3432            $Jssor$.$AddEvent(arrowRight, "click", $Jssor$.$CreateCallback(null, OnNavigationRequest, _Steps));
3433
3434            $Jssor$.$Buttonize(arrowLeft);
3435            $Jssor$.$Buttonize(arrowRight);
3436
3437            _Initialized = true;
3438        }
3439
3440        //self.$TriggerEvent($JssorNavigatorEvents$.$RESET);
3441    };
3442
3443    //JssorArrowNavigator Constructor
3444    {
3445        self.$Options = _Options = $Jssor$.$Extend({
3446            $Steps: 1
3447        }, options);
3448
3449        _Steps = _Options.$Steps;
3450    }
3451};
3452
3453//$JssorThumbnailNavigator$
3454var $JssorThumbnailNavigator$ = window.$JssorThumbnailNavigator$ = function (elmt, options) {
3455    var _Self = this;
3456    var _Length;
3457    var _Count;
3458    var _CurrentIndex;
3459    var _Options;
3460    var _NavigationItems = [];
3461
3462    var _Width;
3463    var _Height;
3464    var _Lanes;
3465    var _SpacingX;
3466    var _SpacingY;
3467    var _PrototypeWidth;
3468    var _PrototypeHeight;
3469    var _DisplayPieces;
3470
3471    var _Slider;
3472    var _CurrentMouseOverIndex = -1;
3473
3474    var _SlidesContainer;
3475    var _ThumbnailPrototype;
3476
3477    $JssorObject$.call(_Self);
3478    elmt = $Jssor$.$GetElement(elmt);
3479
3480    function NavigationItem(item, index) {
3481        var self = this;
3482        var _Wrapper;
3483        var _Button;
3484        var _Thumbnail;
3485
3486        function Highlight(mouseStatus) {
3487            _Button.$Activate(_CurrentIndex == index);
3488        }
3489
3490        function OnNavigationRequest(event) {
3491            if (!_Slider.$LastDragSucceded()) {
3492                var tail = _Lanes - index % _Lanes;
3493                var slideVirtualIndex = _Slider.$GetVirtualIndex((index + tail) / _Lanes - 1);
3494                var itemVirtualIndex = slideVirtualIndex * _Lanes + _Lanes - tail;
3495                _Self.$TriggerEvent($JssorNavigatorEvents$.$NAVIGATIONREQUEST, itemVirtualIndex);
3496            }
3497
3498            //$JssorDebug$.$Log("navigation request");
3499        }
3500
3501        $JssorDebug$.$Execute(function () {
3502            self.$Wrapper = undefined;
3503        });
3504
3505        self.$Index = index;
3506
3507        self.$Highlight = Highlight;
3508
3509        //NavigationItem Constructor
3510        {
3511            _Thumbnail = item.$Thumb || item.$Image || $Jssor$.$CreateDiv();

3512            self.$Wrapper = _Wrapper = $Jssor$.$BuildElement(_ThumbnailPrototype, "thumbnailtemplate", _Thumbnail, true);
3513
3514            _Button = $Jssor$.$Buttonize(_Wrapper);
3515            if (_Options.$ActionMode & 1)
3516                $Jssor$.$AddEvent(_Wrapper, "click", OnNavigationRequest);
3517            if (_Options.$ActionMode & 2)
3518                $Jssor$.$AddEvent(_Wrapper, "mouseover", $Jssor$.$MouseOverOutFilter(OnNavigationRequest, _Wrapper));
3519        }
3520    }
3521
3522    _Self.$GetCurrentIndex = function () {
3523        return _CurrentIndex;
3524    };
3525
3526    _Self.$SetCurrentIndex = function (index, virtualIndex, temp) {
3527        var oldIndex = _CurrentIndex;
3528        _CurrentIndex = index;
3529        if (oldIndex != -1)
3530            _NavigationItems[oldIndex].$Highlight();
3531        _NavigationItems[index].$Highlight();
3532
3533        if (!temp) {
3534            _Slider.$PlayTo(_Slider.$GetVirtualIndex(Math.floor(virtualIndex / _Lanes)));
3535        }
3536    };
3537
3538    _Self.$Show = function (hide) {
3539        $Jssor$.$ShowElement(elmt, hide);
3540    };
3541
3542    _Self.$Relocate = $Jssor$.$EmptyFunction;
3543
3544    var _Initialized;
3545    _Self.$Reset = function (length, items, loadingContainer) {
3546        if (!_Initialized) {
3547            _Length = length;
3548            _Count = Math.ceil(_Length / _Lanes);
3549            _CurrentIndex = -1;
3550            _DisplayPieces = Math.min(_DisplayPieces, items.length);
3551
3552            var horizontal = _Options.$Orientation & 1;
3553
3554            var slideWidth = _PrototypeWidth + (_PrototypeWidth + _SpacingX) * (_Lanes - 1) * (1 - horizontal);
3555            var slideHeight = _PrototypeHeight + (_PrototypeHeight + _SpacingY) * (_Lanes - 1) * horizontal;
3556
3557            var slidesContainerWidth = slideWidth + (slideWidth + _SpacingX) * (_DisplayPieces - 1) * horizontal;
3558            var slidesContainerHeight = slideHeight + (slideHeight + _SpacingY) * (_DisplayPieces - 1) * (1 - horizontal);
3559
3560            $Jssor$.$CssPosition(_SlidesContainer, "absolute");
3561            $Jssor$.$CssOverflow(_SlidesContainer, "hidden");
3562            if (_Options.$AutoCenter & 1) {
3563                $Jssor$.$CssLeft(_SlidesContainer, (_Width - slidesContainerWidth) / 2);
3564            }
3565            if (_Options.$AutoCenter & 2) {
3566                $Jssor$.$CssTop(_SlidesContainer, (_Height - slidesContainerHeight) / 2);
3567            }
3568            //$JssorDebug$.$Execute(function () {
3569            //    if (!_Options.$AutoCenter) {
3570            //        var slidesContainerTop = $Jssor$.$CssTop(_SlidesContainer);
3571            //        var slidesContainerLeft = $Jssor$.$CssLeft(_SlidesContainer);
3572
3573            //        if (isNaN(slidesContainerTop)) {
3574            //            $JssorDebug$.$Fail("Position 'top' wrong specification of thumbnail navigator slides container (<div u=\"thumbnavigator\">...<div u=\"slides\">), \r\nwhen option $ThumbnailNavigatorOptions.$AutoCenter set to 0, it should be specified in pixel (like <div u=\"slides\" style=\"top: 0px;\">)");
3575            //        }
3576
3577            //        if (isNaN(slidesContainerLeft)) {
3578            //            $JssorDebug$.$Fail("Position 'left' wrong specification of thumbnail navigator slides container (<div u=\"thumbnavigator\">...<div u=\"slides\">), \r\nwhen option $ThumbnailNavigatorOptions.$AutoCenter set to 0, it should be specified in pixel (like <div u=\"slides\" style=\"left: 0px;\">)");
3579            //        }
3580            //    }
3581            //});
3582            $Jssor$.$CssWidth(_SlidesContainer, slidesContainerWidth);
3583            $Jssor$.$CssHeight(_SlidesContainer, slidesContainerHeight);
3584
3585            var slideItemElmts = [];
3586            $Jssor$.$Each(items, function (item, index) {
3587                var navigationItem = new NavigationItem(item, index);
3588                var navigationItemWrapper = navigationItem.$Wrapper;
3589
3590                var columnIndex = Math.floor(index / _Lanes);
3591                var laneIndex = index % _Lanes;
3592
3593                $Jssor$.$CssLeft(navigationItemWrapper, (_PrototypeWidth + _SpacingX) * laneIndex * (1 - horizontal));
3594                $Jssor$.$CssTop(navigationItemWrapper, (_PrototypeHeight + _SpacingY) * laneIndex * horizontal);
3595
3596                if (!slideItemElmts[columnIndex]) {
3597                    slideItemElmts[columnIndex] = $Jssor$.$CreateDiv();
3598                    $Jssor$.$AppendChild(_SlidesContainer, slideItemElmts[columnIndex]);
3599                }
3600
3601                $Jssor$.$AppendChild(slideItemElmts[columnIndex], navigationItemWrapper);
3602
3603                _NavigationItems.push(navigationItem);
3604            });
3605
3606            var thumbnailSliderOptions = $Jssor$.$Extend({
3607                $HWA: false,

3608                $AutoPlay: false,
3609                $NaviQuitDrag: false,
3610                $SlideWidth: slideWidth,
3611                $SlideHeight: slideHeight,
3612                $SlideSpacing: _SpacingX * horizontal + _SpacingY * (1 - horizontal),
3613                $MinDragOffsetToSlide: 12,
3614                $SlideDuration: 200,
3615                $PauseOnHover: 1,
3616                $PlayOrientation: _Options.$Orientation,
3617                $DragOrientation: _Options.$DisableDrag ? 0 : _Options.$Orientation
3618            }, _Options);
3619
3620            _Slider = new $JssorSlider$(elmt, thumbnailSliderOptions);
3621
3622            _Initialized = true;
3623        }
3624
3625        //_Self.$TriggerEvent($JssorNavigatorEvents$.$RESET);
3626    };
3627
3628    //JssorThumbnailNavigator Constructor
3629    {
3630        _Self.$Options = _Options = $Jssor$.$Extend({
3631            $SpacingX: 3,
3632            $SpacingY: 3,
3633            $DisplayPieces: 1,
3634            $Orientation: 1,
3635            $AutoCenter: 3,
3636            $ActionMode: 1
3637        }, options);
3638
3639        //Sodo statement for development time intellisence only
3640        $JssorDebug$.$Execute(function () {
3641            _Options = $Jssor$.$Extend({
3642                $Lanes: undefined,
3643                $Width: undefined,
3644                $Height: undefined
3645            }, _Options);
3646        });
3647
3648        _Width = $Jssor$.$CssWidth(elmt);
3649        _Height = $Jssor$.$CssHeight(elmt);
3650
3651        $JssorDebug$.$Execute(function () {
3652            if (!_Width)
3653                $JssorDebug$.$Fail("width of 'thumbnavigator' container not specified.");
3654            if (!_Height)
3655                $JssorDebug$.$Fail("height of 'thumbnavigator' container not specified.");
3656        });
3657
3658        _SlidesContainer = $Jssor$.$FindChild(elmt, "slides", true);
3659        _ThumbnailPrototype = $Jssor$.$FindChild(_SlidesContainer, "prototype");
3660
3661        $JssorDebug$.$Execute(function () {
3662            if (!_ThumbnailPrototype)
3663                $JssorDebug$.$Fail("prototype of 'thumbnavigator' not defined.");
3664        });
3665
3666        _PrototypeWidth = $Jssor$.$CssWidth(_ThumbnailPrototype);
3667        _PrototypeHeight = $Jssor$.$CssHeight(_ThumbnailPrototype);
3668
3669        $Jssor$.$RemoveChild(_SlidesContainer, _ThumbnailPrototype);
3670
3671        _Lanes = _Options.$Lanes || 1;
3672        _SpacingX = _Options.$SpacingX;
3673        _SpacingY = _Options.$SpacingY;
3674        _DisplayPieces = _Options.$DisplayPieces;
3675    }
3676};
3677
3678//$JssorCaptionSliderBase$
3679function $JssorCaptionSliderBase$() {
3680    $JssorAnimator$.call(this, 0, 0);
3681    this.$Revert = $Jssor$.$EmptyFunction;
3682}
3683
3684var $JssorCaptionSlider$ = window.$JssorCaptionSlider$ = function (container, captionSlideOptions, playIn) {
3685    $JssorDebug$.$Execute(function () {
3686        if (!captionSlideOptions.$CaptionTransitions) {
3687            $JssorDebug$.$Error("'$CaptionSliderOptions' option error, '$CaptionSliderOptions.$CaptionTransitions' not specified.");
3688        }
3689        //else if (!$Jssor$.$IsArray(captionSlideOptions.$CaptionTransitions)) {
3690        //    $JssorDebug$.$Error("'$CaptionSliderOptions' option error, '$CaptionSliderOptions.$CaptionTransitions' is not an array.");
3691        //}
3692    });
3693
3694    var _Self = this;
3695    var _ImmediateOutCaptionHanger;
3696    var _PlayMode = playIn ? captionSlideOptions.$PlayInMode : captionSlideOptions.$PlayOutMode;
3697
3698    var _CaptionTransitions = captionSlideOptions.$CaptionTransitions;
3699    var _CaptionTuningFetcher = { $Transition: "t", $Delay: "d", $Duration: "du", x: "x", y: "y", $Rotate: "r", $Zoom: "z", $Opacity: "f", $BeginTime: "b" };
3700    var _CaptionTuningTransfer = {
3701        $Default: function (value, tuningValue) {
3702            if (!isNaN(tuningValue.$Value))
3703                value = tuningValue.$Value;
3704            else
3705                value *= tuningValue.$Percent;
3706
3707            return value;
3708        },
3709        $Opacity: function (value, tuningValue) {
3710            return this.$Default(value - 1, tuningValue);
3711        }
3712    };
3713    _CaptionTuningTransfer.$Zoom = _CaptionTuningTransfer.$Opacity;
3714
3715    $JssorAnimator$.call(_Self, 0, 0);
3716
3717    function GetCaptionItems(element, level) {
3718
3719        var itemsToPlay = [];
3720        var lastTransitionName;
3721        var namedTransitions = [];
3722        var namedTransitionOrders = [];
3723
3724        //$JssorDebug$.$Execute(function () {
3725
3726        //    var debugInfoElement = $Jssor$.$GetElement("debugInfo");
3727
3728        //    if (debugInfoElement && playIn) {
3729
3730        //        var text = $Jssor.$InnerHtml(debugInfoElement) + "<br>";
3731
3732        //        $Jssor$.$InnerHtml(debugInfoElement, text);
3733        //    }
3734        //});
3735
3736        function FetchRawTransition(captionElmt, index) {
3737            var rawTransition = {};
3738
3739            $Jssor$.$Each(_CaptionTuningFetcher, function (fetchAttribute, fetchProperty) {
3740                var attributeValue = $Jssor$.$AttributeEx(captionElmt, fetchAttribute + (index || ""));
3741                if (attributeValue) {
3742                    var propertyValue = {};
3743
3744                    if (fetchAttribute == "t") {
3745                        //if (($Jssor$.$IsBrowserChrome() || $Jssor$.$IsBrowserSafari() || $Jssor$.$IsBrowserFireFox()) && attributeValue == "*") {
3746                        //    attributeValue = Math.floor(Math.random() * captionSlideOptions.$CaptionTransitions.length);
3747                        //    $Jssor$.$Attribute(captionElmt, fetchAttribute + (index || ""), attributeValue);
3748                        //}
3749
3750                        propertyValue.$Value = attributeValue;
3751                    }
3752                    else if (attributeValue.indexOf("%") + 1)
3753                        propertyValue.$Percent = $Jssor$.$ParseFloat(attributeValue) / 100;
3754                    else
3755                        propertyValue.$Value = $Jssor$.$ParseFloat(attributeValue);
3756
3757                    rawTransition[fetchProperty] = propertyValue;
3758                }
3759            });
3760
3761            return rawTransition;
3762        }
3763
3764        function GetRandomTransition() {
3765            return _CaptionTransitions[Math.floor(Math.random() * _CaptionTransitions.length)];
3766        }
3767
3768        function EvaluateCaptionTransition(transitionName) {
3769
3770            var transition;
3771
3772            if (transitionName == "*") {
3773                transition = GetRandomTransition();
3774            }
3775            else if (transitionName) {
3776
3777                //indexed transition allowed, just the same as named transition
3778                var tempTransition = _CaptionTransitions[$Jssor$.$ParseInt(transitionName)] || _CaptionTransitions[transitionName];
3779
3780                if ($Jssor$.$IsArray(tempTransition)) {
3781                    if (transitionName != lastTransitionName) {
3782                        lastTransitionName = transitionName;
3783                        namedTransitionOrders[transitionName] = 0;
3784
3785                        namedTransitions[transitionName] = tempTransition[Math.floor(Math.random() * tempTransition.length)];
3786                    }
3787                    else {
3788                        namedTransitionOrders[transitionName]++;
3789                    }
3790
3791                    tempTransition = namedTransitions[transitionName];
3792
3793                    if ($Jssor$.$IsArray(tempTransition)) {
3794                        tempTransition = tempTransition.length && tempTransition[namedTransitionOrders[transitionName] % tempTransition.length];
3795
3796                        if ($Jssor$.$IsArray(tempTransition)) {
3797                            //got transition from array level 3, random for all captions
3798                            tempTransition = tempTransition[Math.floor(Math.random() * tempTransition.length)];
3799                        }
3800                        //else {
3801                        //    //got transition from array level 2, in sequence for all adjacent captions with same name specified
3802                        //    transition = tempTransition;
3803                        //}
3804                    }
3805                    //else {
3806                    //    //got transition from array level 1, random but same for all adjacent captions with same name specified
3807                    //    transition = tempTransition;
3808                    //}
3809                }
3810                //else {
3811                //    //got transition directly from a simple transition object
3812                //    transition = tempTransition;
3813                //}
3814
3815                transition = tempTransition;
3816
3817                if ($Jssor$.$IsString(transition))
3818                    transition = EvaluateCaptionTransition(transition);
3819            }
3820
3821            return transition;
3822        }
3823
3824        var captionElmts = $Jssor$.$Children(element);
3825        $Jssor$.$Each(captionElmts, function (captionElmt, i) {
3826
3827            var transitionsWithTuning = [];
3828            transitionsWithTuning.$Elmt = captionElmt;
3829            var isCaption = $Jssor$.$AttributeEx(captionElmt, "u") == "caption";
3830
3831            $Jssor$.$Each(playIn ? [0, 3] : [2], function (j, k) {
3832
3833                if (isCaption) {
3834                    var transition;
3835                    var rawTransition;
3836
3837                    if (j != 2 || !$Jssor$.$AttributeEx(captionElmt, "t3")) {
3838                        rawTransition = FetchRawTransition(captionElmt, j);
3839
3840                        if (j == 2 && !rawTransition.$Transition) {
3841                            rawTransition.$Delay = rawTransition.$Delay || { $Value: 0 };
3842                            rawTransition = $Jssor$.$Extend(FetchRawTransition(captionElmt, 0), rawTransition);
3843                        }
3844                    }
3845
3846                    if (rawTransition && rawTransition.$Transition) {
3847
3848                        transition = EvaluateCaptionTransition(rawTransition.$Transition.$Value);
3849
3850                        if (transition) {
3851
3852                            //var transitionWithTuning = $Jssor$.$Extend({ $Delay: 0, $ScaleHorizontal: 1, $ScaleVertical: 1 }, transition);
3853                            var transitionWithTuning = $Jssor$.$Extend({ $Delay: 0 }, transition);
3854
3855                            $Jssor$.$Each(rawTransition, function (rawPropertyValue, propertyName) {
3856                                var tuningPropertyValue = (_CaptionTuningTransfer[propertyName] || _CaptionTuningTransfer.$Default).apply(_CaptionTuningTransfer, [transitionWithTuning[propertyName], rawTransition[propertyName]]);
3857                                if (!isNaN(tuningPropertyValue))
3858                                    transitionWithTuning[propertyName] = tuningPropertyValue;
3859                            });
3860
3861                            if (!k) {
3862                                if (rawTransition.$BeginTime)
3863                                    transitionWithTuning.$BeginTime = rawTransition.$BeginTime.$Value || 0;
3864                                else if ((_PlayMode) & 2)
3865                                    transitionWithTuning.$BeginTime = 0;
3866                            }
3867                        }
3868                    }
3869
3870                    transitionsWithTuning.push(transitionWithTuning);
3871                }
3872
3873                if ((level % 2) && !k) {
3874                    //transitionsWithTuning.$Children = GetCaptionItems(captionElmt, lastTransitionName, [].concat(namedTransitions), [].concat(namedTransitionOrders), level

3874+ 1);
3875                    transitionsWithTuning.$Children = GetCaptionItems(captionElmt, level + 1);
3876                }
3877            });
3878
3879            itemsToPlay.push(transitionsWithTuning);
3880        });
3881
3882        return itemsToPlay;
3883    }
3884
3885    function CreateAnimator(item, transition, immediateOut) {
3886
3887        var animatorOptions = {
3888            $Easing: transition.$Easing,
3889            $Round: transition.$Round,
3890            $During: transition.$During,
3891            $Reverse: playIn && !immediateOut,
3892            $Optimize: true
3893        };
3894
3895        $JssorDebug$.$Execute(function () {
3896            animatorOptions.$CaptionAnimator = true;
3897        });
3898
3899        var captionItem = item;
3900        var captionParent = $Jssor$.$ParentNode(item);
3901
3902        var captionItemWidth = $Jssor$.$CssWidth(captionItem);
3903        var captionItemHeight = $Jssor$.$CssHeight(captionItem);
3904        var captionParentWidth = $Jssor$.$CssWidth(captionParent);
3905        var captionParentHeight = $Jssor$.$CssHeight(captionParent);
3906
3907        var toStyles = {};
3908        var fromStyles = {};
3909        var scaleClip = transition.$ScaleClip || 1;
3910
3911        //Opacity
3912        if (transition.$Opacity) {
3913            toStyles.$Opacity = 2 - transition.$Opacity;
3914        }
3915
3916        animatorOptions.$OriginalWidth = captionItemWidth;
3917        animatorOptions.$OriginalHeight = captionItemHeight;
3918
3919        //Transform
3920        if (transition.$Zoom || transition.$Rotate) {
3921            toStyles.$Zoom = transition.$Zoom ? transition.$Zoom - 1 : 1;
3922
3923            if ($Jssor$.$IsBrowserIe9Earlier() || $Jssor$.$IsBrowserOpera())
3924                toStyles.$Zoom = Math.min(toStyles.$Zoom, 2);
3925
3926            fromStyles.$Zoom = 1;
3927
3928            var rotate = transition.$Rotate || 0;
3929
3930            toStyles.$Rotate = rotate * 360;
3931            fromStyles.$Rotate = 0;
3932        }
3933            //Clip
3934        else if (transition.$Clip) {
3935            var fromStyleClip = { $Top: 0, $Right: captionItemWidth, $Bottom: captionItemHeight, $Left: 0 };
3936            var toStyleClip = $Jssor$.$Extend({}, fromStyleClip);
3937
3938            var blockOffset = toStyleClip.$Offset = {};
3939
3940            var topBenchmark = transition.$Clip & 4;
3941            var bottomBenchmark = transition.$Clip & 8;
3942            var leftBenchmark = transition.$Clip & 1;
3943            var rightBenchmark = transition.$Clip & 2;
3944
3945            if (topBenchmark && bottomBenchmark) {
3946                blockOffset.$Top = captionItemHeight / 2 * scaleClip;
3947                blockOffset.$Bottom = -blockOffset.$Top;
3948            }
3949            else if (topBenchmark)
3950                blockOffset.$Bottom = -captionItemHeight * scaleClip;
3951            else if (bottomBenchmark)
3952                blockOffset.$Top = captionItemHeight * scaleClip;
3953
3954            if (leftBenchmark && rightBenchmark) {
3955                blockOffset.$Left = captionItemWidth / 2 * scaleClip;
3956                blockOffset.$Right = -blockOffset.$Left;
3957            }
3958            else if (leftBenchmark)
3959                blockOffset.$Right = -captionItemWidth * scaleClip;
3960            else if (rightBenchmark)
3961                blockOffset.$Left = captionItemWidth * scaleClip;
3962
3963            animatorOptions.$Move = transition.$Move;
3964            toStyles.$Clip = toStyleClip;
3965            fromStyles.$Clip = fromStyleClip;
3966        }
3967
3968        //Fly
3969        {
3970            var toLeft = 0;
3971            var toTop = 0;
3972
3973            if (transition.x)
3974                toLeft -= captionParentWidth * transition.x;
3975
3976            if (transition.y)
3977                toTop -= captionParentHeight * transition.y;
3978
3979            if (toLeft || toTop || animatorOptions.$Move) {
3980                toStyles.$Left = toLeft + $Jssor$.$CssLeft(captionItem);
3981                toStyles.$Top = toTop + $Jssor$.$CssTop(captionItem);
3982            }
3983        }
3984
3985        //duration
3986        var duration = transition.$Duration;
3987
3988        fromStyles = $Jssor$.$Extend(fromStyles, $Jssor$.$GetStyles(captionItem, toStyles));
3989
3990        animatorOptions.$Setter = $Jssor$.$StyleSetterEx();
3991
3992        return new $JssorAnimator$(transition.$Delay, duration, animatorOptions, captionItem, fromStyles, toStyles);
3993    }
3994
3995    function CreateAnimators(streamLineLength, captionItems) {
3996
3997        $Jssor$.$Each(captionItems, function (captionItem, i) {
3998
3999            $JssorDebug$.$Execute(function () {
4000                if (captionItem.length) {
4001                    var top = $Jssor$.$CssTop(captionItem.$Elmt);
4002                    var left = $Jssor$.$CssLeft(captionItem.$Elmt);
4003                    var width = $Jssor$.$CssWidth(captionItem.$Elmt);
4004                    var height = $Jssor$.$CssHeight(captionItem.$Elmt);
4005
4006                    var error = null;
4007
4008                    if (isNaN(top))
4009                        error = "Style 'top' for caption not specified. Please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
4010                    else if (isNaN(left))
4011                        error = "Style 'left' not specified. Please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
4012                    else if (isNaN(width))
4013                        error = "Style 'width' not specified. Please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
4014                    else if (isNaN(height))
4015                        error = "Style 'height' not specified. Please always specify caption like 'position: absolute; top: ...px; left: ...px; width: ...px; height: ...px;'.";
4016
4017                    if (error)
4018                        $JssorDebug$.$Error("Caption " + (i + 1) + " definition error, \r\n" + error + "\r\n" + captionItem.$Elmt.outerHTML);
4019                }
4020            });
4021
4022            var animator;
4023            var captionElmt = captionItem.$Elmt;
4024            var transition = captionItem[0];
4025            var transition3 = captionItem[1];
4026
4027            if (transition) {
4028
4029                animator = CreateAnimator(captionElmt, transition);
4030                streamLineLength = animator.$Locate(transition.$BeginTime == undefined ? streamLineLength : transition.$BeginTime, 1);
4031            }
4032
4033            streamLineLength = CreateAnimators(streamLineLength, captionItem.$Children);
4034
4035            if (transition3) {
4036                var animator3 = CreateAnimator(captionElmt, transition3, 1);

4037                animator3.$Locate(streamLineLength, 1);
4038                _Self.$Combine(animator3);
4039                _ImmediateOutCaptionHanger.$Combine(animator3);
4040            }
4041
4042            if (animator)
4043                _Self.$Combine(animator);
4044        });
4045
4046        return streamLineLength;
4047    }
4048
4049    _Self.$Revert = function () {
4050        _Self.$GoToPosition(_Self.$GetPosition_OuterEnd() * (playIn || 0));
4051        _ImmediateOutCaptionHanger.$GoToBegin();
4052    };
4053
4054    //Constructor
4055    {
4056        _ImmediateOutCaptionHanger = new $JssorAnimator$(0, 0);
4057
4058        //var streamLineLength = 0;
4059        //var captionItems = GetCaptionItems(container, null, [], [], 1);
4060
4061        CreateAnimators(0, _PlayMode ? GetCaptionItems(container, 1) : []);
4062    }
4063};
4064
4065//Event Table
4066
4067//$EVT_CLICK = 21;			    function(slideIndex[, event])
4068//$EVT_DRAG_START = 22;		    function(position[, virtualPosition, event])
4069//$EVT_DRAG_END = 23;		    function(position, startPosition[, virtualPosition, virtualStartPosition, event])
4070//$EVT_SWIPE_START = 24;		function(position[, virtualPosition])
4071//$EVT_SWIPE_END = 25;		    function(position[, virtualPosition])
4072
4073//$EVT_LOAD_START = 26;			function(slideIndex)
4074//$EVT_LOAD_END = 27;			function(slideIndex)
4075
4076//$EVT_POSITION_CHANGE = 202;	function(position, fromPosition[, virtualPosition, virtualFromPosition])
4077//$EVT_PARK = 203;			    function(slideIndex, fromIndex)
4078
4079//$EVT_PROGRESS_CHANGE = 208;	function(slideIndex, progress[, progressBegin, idleBegin, idleEnd, progressEnd])
4080//$EVT_STATE_CHANGE = 209;	    function(slideIndex, progress[, progressBegin, idleBegin, idleEnd, progressEnd])
4081
4082//$EVT_ROLLBACK_START = 210;	function(slideIndex, progress[, progressBegin, idleBegin, idleEnd, progressEnd])
4083//$EVT_ROLLBACK_END = 211;	    function(slideIndex, progress[, progressBegin, idleBegin, idleEnd, progressEnd])
4084
4085//$EVT_SLIDESHOW_START = 206;   function(slideIndex[, progressBegin, slideshowBegin, slideshowEnd, progressEnd])
4086//$EVT_SLIDESHOW_END = 207;     function(slideIndex[, progressBegin, slideshowBegin, slideshowEnd, progressEnd])
4087
4088//http://www.jssor.com/development/reference-api.html

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.