1/* 2 3 * Sudo Slider ver 1.0.11 - jQuery plugin 4 5 * Written by Erik Kristensen [email protected]. 6 7 * Based on Easy Slider 1.7 by Alen Grakalic http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider 8 9 * 10 11 * Dual licensed under the MIT 12 13 * and GPL licenses. 14 15 * 16 17 * Built for jQuery library 18 19 * http://jquery.com 20 21 * 22 23 */ 24 25 /* 26 27 TODO: 28 29 Finding and fixing bugs. (No known bugs atm.) 30 31 32 33 TODO for next major version: (i've had 10 minor versions now, don't think i'm ever going to do a major). 34 35 joining firstshow & firsthtml etc. 36 37 */ 38 39(function($) 40 41{ 42 43 $.fn.sudoSlider = function(options) 44 45 { 46 47 if (typeof(options) != 'object' && options != '' && options) 48 49 { 50 51 // Here, i just trigger it to do something, it's way down the actual action happens. 52 53 this.each(function(){ 54 55 $(this).trigger("sudoSliderEvent", [options]); 56 57 }); 58 59 } 60 61 else 62 63 { 64 65 // default configuration properties 66 67 var defaults = { 68 69 prevNext: true, 70 71 prevHtml: '<a href="#" class="prevBtn"> previous </a>', 72 73 nextHtml: '<a href="#" class="nextBtn"> next </a>', 74 75 controlsShow: true, 76 77 controlsAttr: 'id="controls"', 78 79 controlsFadeSpeed: '400', 80 81 controlsFade: true, 82 83 insertAfter: true, 84 85 firstShow: false, 86 87 firstHtml: '<a href="#" class="firstBtn"> first </a>', 88 89 lastShow: false, 90 91 lastHtml: '<a href="#" class="lastBtn"> last </a>', 92 93 numericAttr: 'class="controls"', 94 95 numericText: ['1'], 96 97 vertical: false, 98 99 speed: '800', 100 101 ease: 'swing', 102 103 auto: false, 104 105 pause: '2000', 106 107 continuous: false, 108 109 clickableAni: false, 110 111 numeric: false, 112 113 updateBefore: false, 114 115 history: false, 116 117 speedhistory: '400', 118 119 autoheight: true, 120 121 customLink: false, 122 123 fade: false, 124 125 crossFade: true, 126 127 fadespeed: '1000', 128 129 ajax: false, 130 131 loadingText: false, 132 133 preloadAjax: false, 134 135 startSlide: false, 136 137 imgAjaxFunction: false, 138 139 docAjaxFunction: false, 140 141 beforeAniFunc: false, 142 143 afterAniFunc: false, 144 145 uncurrentFunc: false, 146 147 currentFunc: false 148 149 }; 150 151 var options = $.extend(defaults, options); 152 153 154 155 // To make it smaller when minimized. 156 157 // Not including the variables only used once in the code. 158 159 // I just found out that this (as in now, not the same as final release) makes the script 572 bytes smaller. (That's about 6%) 160 161 //var optionscontrolsShow = options.controlsShow; // Only used once. 162 163 var optionscontrolsFadeSpeed = options.controlsFadeSpeed; 164 165 //var optionscontrolsBefore = options.controlsBefore; // Only used once. 166 167 //var optionscontrolsAfter = options.controlsAfter; // Only used once. 168 169 var optionscontrolsFade = options.controlsFade; 170 171 //var optionsinsertAfter = options.insertAfter;// Only used once. 172 173 var optionsfirstShow = options.firstShow; 174 175 var optionslastShow = options.lastShow; 176 177 var optionsvertical = options.vertical; 178 179 var optionsspeed = options.speed; 180 181 var optionsease = options.ease; 182 183 var optionsauto = options.auto; 184 185 var optionspause = options.pause; 186 187 var optionscontinuous = options.continuous; 188 189 var optionsprevNext = options.prevNext; 190 191 var optionsnumeric = options.numeric; 192 193 var optionsnumericAttr = options.numericAttr; 194 195 var optionsnumericText = options.numericText; 196 197 //var optionsclickableAni = options.clickableAni; // Only used once. 198 199 var optionshistory = options.history; 200 201 var optionsspeedhistory = options.speedhistory; 202 203 var optionsautoheight = options.autoheight; 204 205 var optionscustomLink = options.customLink; 206 207 var optionsfade = options.fade; 208 209 var optionscrossFade = options.crossFade; 210 211 var optionsfadespeed = options.fadespeed; 212 213 var optionsupdateBefore = options.updateBefore; 214 215 var optionsajax = options.ajax; 216 217 //var optionspreloadAjax= options.preloadAjax; // Only used once. 218 219 var optionsstartSlide = options.startSlide; 220 221 var optionsimgAjaxFunction = options.imgAjaxFunction; 222 223 var optionsdocAjaxFunction = options.docAjaxFunction; 224 225 var optionsbeforeAniFunc = options.beforeAniFunc; 226 227 var optionsafterAniFunc = options.afterAniFunc; 228 229 var optionsuncurrentFunc = options.uncurrentFunc; 230 231 var optionscurrentFunc = options.currentFunc; 232 233 234 235 return this.each(function() 236 237 { 238 239 // There are some things we don't do at init. 240 241 var init = true; // I know it's an ugly workaround, but it works. 242 243 // If auto is on, so is continuous. (People tend to forget things they don't think about :p) 244 245 if (optionsauto) optionscontinuous = true; 246 247 248 249 // Setting up some variables. 250 251 var obj = $(this); 252 253 254 255 // Fix for nested list items 256 257 var ul = obj.children("ul"); 258 259 var li = ul.children("li"); 260 261 262 263 // Some variables i'm gonna use alot. 264 265 var s = li.length; 266 267 var w = li.eq(0).width();
267 // All slides must be same width, so this shouldn't be a problem. 268 269 var h = obj.height(); 270 271 272 273 // Now we are going to fix the document, if it's 'broken'. (No <ul> or no <li>). 274 275 // I assume that it's can only be broken, if ajax is enabled. If it's broken without Ajax being enabled, the script doesn't have anything to fill the holes. 276 277 if (optionsajax) 278 279 { 280 281 // Is the ul element there? 282 283 if (ul.length == 0) 284 285 { 286 287 // No it's not, lets create it. 288 289 obj.append('<ul></ul>'); 290 291 ul = obj.children("ul"); 292 293 } 294 295 296 297 // Do we have enough list elements to fill out all the ajax documents. 298 299 if (optionsajax.length > s) 300 301 { 302 303 // No we dont. 304 305 for (var i = 1; i <= optionsajax.length - s; i++) ul.append('<li><p>' + returnFunnyLoadingText() + '</p></li>'); 306 307 li = ul.children("li"); 308 309 s = li.length; 310 311 w = li.eq(0).width(); 312 313 } 314 315 } 316 317 // i just love stackoverflow (http://stackoverflow.com/questions/182112/what-are-some-funny-loading-statements-to-keep-users-amused-closed) 318 319 // i know this is just an easter egg, because you really should never see it. 320 321 // But what the heck, i want it. 322 323 function returnFunnyLoadingText() 324 325 { 326 327 var funnyLoadingTexts = [ 328 329 //"Locating the required gigapixels to render", 330 331 "Spinning up the hamster", 332 333 //"π × 1337% == 42", 334 335 //"π × 1337% != 42!", 336 337 //"Shovelling coal into the server", 338 339 "Programming the flux capacitor", 340 341 //"The last time I tried this the monkey didn't survive", 342 343 "Testing data on Timmy... ... ... We need another Timmy", 344 345 //"I should have had a V8 this morning", 346 347 //"My other load screen is much faster. You should try that one instead", 348 349 //"The version I have of this in testing has much funnier load screens", 350 351 "Warming up Large Hadron Collider", 352 353 "It looks like you're waiting for something to load" 354 355 ]; 356 357 return options.loadingText ? options.loadingText : (funnyLoadingTexts[Math.round(Math.random()*(funnyLoadingTexts.length-1))] + '...'); 358 359 }; 360 361 362 363 364 365 // Continuing with the variables. 366 367 var t = 0; 368 369 var ot = t; 370 371 var nt = t; 372 373 var ts = s-1; 374 375 376 377 var clickable = true; 378 379 var buttonclicked = false; 380 381 var fading = false; 382 383 var ajaxloading = false; 384 385 var autoheightdocument = 0; 386 387 var numericControls = new Array(); 388 389 var numericContainer = false; 390 391 var destroyed = false; 392 393 394 395 // Set obj overflow to hidden (and position to relative <strike>, if fade is enabled. </strike>) 396 397 obj.css("overflow","hidden"); 398 399 if (obj.css("position") == "static") obj.css("position","relative"); // Fixed a lot of IE6 + IE7 bugs. 400 401 402 403 // Float items to the left 404 405 li.css('float', 'left'); 406 407 408 409 // They doens't always put a text in the numericText. 410 411 // With this, if the user dont, the code will. 412
413 for(var i=0;i<s;i++) 414 415 { 416 417 if (optionsnumericText[i] == undefined) optionsnumericText[i] = (i+1); 418 419 // Same thing for ajax thingy. 420 421 if (optionsajax && optionsajax[i] == undefined) optionsajax[i] = false; 422 423 } 424 425 426 427 // Clone elements for continuous scrolling 428 429 if(optionscontinuous) 430 431 { 432 433 if(optionsvertical) 434 435 { 436 437 // First we create the elements, pretending AJAX is a city in Russia. 438 439 ul.prepend(li.filter(":last-child").clone().css("margin-top","-"+ h +"px")); 440 441 ul.append(li.filter(":nth-child(2)").clone()); 442 443 ul.height((s+1)*h); 444 445 } else { 446 447 // First we create the elements, pretending AJAX is a city in Russia. 448 449 ul.prepend(li.filter(":last-child").clone().css("margin-left","-"+ w +"px")); 450 451 ul.append(li.filter(":nth-child(2)").clone()); 452 453 ul.width((s+1)*w); 454 455 } 456 457 // Now, lets check if AJAX really is a city in Russia. 458 459 if (optionsajax) 460 461 { 462 463 // Now we move from Russia back to reallity (nothing bad about the Russians, it's just a saying in Denmark.) 464 465 // Starting with putting the first document after the last. 466 467 if (optionsajax[0]) { 468 469 ajaxLoad('last', 0, false, 0); 470 471 // ajaxLoad(0, 0, false, 0); //And this would just be a waste of brandwith. 472 473 } 474 475 // And putting the last document before the first. 476 477 if (optionsajax[s-1]) 478 479 { 480 481 ajaxLoad('first', (s-1), false, 0); 482 483 // And then preloading the last document (the same document, but into it's entended position). No need to preload the first slide, it gets loaded elsewhere. 484 485 ajaxLoad(ts, ts, false, 0); 486 487 optionsajax[s-1] = false; 488 489 } 490 491 } 492 493 } 494 495 else // <strike>Bug fix</strike> feature. 496 497 { 498 499 if(optionsvertical) ul.height(s*h); 500 501 else ul.width(s*w); 502 503 }; 504 505 506 507 // Display the controls. 508 509 if(options.controlsShow) 510 511 { 512 513 var controls = $('<span ' + options.controlsAttr + '></span>'); 514 515 if (options.insertAfter) $(obj).after(controls); 516 517 else $(obj).before(controls); 518 519 520 521 var html = options.controlsBefore; 522 523 if(optionsnumeric) { 524 525 numericContainer = controls.prepend('<ol '+ optionsnumericAttr +'></ol>').children(); 526 527 for(var i=0;i<s;i++) 528 529 { 530 531 numericControls[i] = $(document.createElement("li")) 532 533 .attr({'rel' : (i+1)}) 534 535 .html('<a href="#"><span>'+ optionsnumericText[i] +'</span></a>') 536 537 .appendTo(numericContainer) 538 539 .click(function(){ 540 541 goToSlide($(this).attr('rel') - 1, true); 542 543 return false; 544 545 }); 546 547 }; 548 549 } 550 551 if(optionsfirstShow) { 552 553 var firstbutton = makecontrol(options.firstHtml, "first"); 554 555 } 556 557 if(optionslastShow) { 558 559 var lastbutton = makecontrol(options.lastHtml, "last"); 560 561 } 562 563 if(optionsprevNext){ 564 565 var nextbutton = makecontrol(options.nextHtml, "next"); 566 567 var prevbutton = makecontrol(options.prevHtml, "prev"); 568 569 } 570 571 }; 572 573 574 575 // Preload elements. 576 577 if (options.preloadAjax) 578 579 { 580 581 for (var i=0;i<=ts;i++) // Preload everything. 582 583 { 584 585 586 587 if (optionsajax[i]) 588 589 { 590 591 // If somethings is to be loaded, lets load it. 592 593 ajaxLoad(i, i, false, 0); 594 595 // Making sure it aint loaded again. 596 597 optionsajax[i] = false; 598 599 } 600 601 } 602 603 } 604 605 606 607 function goToSlide(i, clicked) 608 609 { 610 611 if (!destroyed) 612 613 { 614 615 if (optionsfade) 616 617 { 618 619 fadeto(i, clicked); 620 621 } else { 622 623 animate(i,clicked,true); 624 625 } 626 627 } 628 629 }; 630 631 // I go a long way to save lines of code. 632 633 function makecontrol(html, action) 634 635 { 636 637 var button = $(html); 638 639 controls.prepend(button); 640 641 button.click(function(){ 642 643 goToSlide(action, true); 644 645 return false; 646 647 }); 648 649 return button; 650 651 } 652 653 654 655 // Lets make those fast/normal/fast into some numbers we can make calculations with. 656 657 optionscontrolsFadeSpeed = textSpeedToNumber(optionscontrolsFadeSpeed); 658 659 optionsspeed = textSpeedToNumber(optionsspeed); 660 661 optionspause = textSpeedToNumber(optionspause); 662 663 optionsspeedhistory = textSpeedToNumber(optionsspeedhistory); 664 665 optionsfadespeed = textSpeedToNumber(optionsfadespeed); 666 667 // The functions do the magic. 668 669 function textSpeedToNumber(speed) 670 671 { 672 673 if (parseInt(speed)) var returnspeed = parseInt(speed); 674 675 else 676 677 { 678 679 switch(speed) 680 681 { 682 683 case 'fast': 684 685 var returnspeed = 200; 686 687 break; 688 689 case 'normal': 690 691 var returnspeed = 400; 692 693 break; 694 695 case 'medium': 696 697 var returnspeed = 400; 698 699 break; 700 701 case 'slow': 702 703 var returnspeed = 600; 704 705 break; 706 707 default: 708 709 var returnspeed = 400; 710 711 } 712 713 } 714 715 return returnspeed; 716 717 }; 718 719 function runOnImagesLoaded(e,_cb) 720 721 { 722 723 // This function is based on the onImagesLoaded plugin by soundphed, that was in a comment on this page "http://engineeredweb.com/blog/09/12/preloading-images-jquery-and-javascript#comment-92". 724 725 e.each(function() { 726 727 var $imgs = (this.tagName.toLowerCase()==='img')?$(this):$('img',this), 728 729 _cont = this, 730 731 i = 0, 732 733 _done=function() { 734 735 if( typeof _cb === 'function' ) _cb(_cont); 736 737 }; 738 739 740 741 if( $imgs.length ) { 742 743 $imgs.each(function() { 744 745 var _img = this, 746 747 _checki=function(e) { 748 749 if((_img.complete) || (_img.readyState=='complete'&&e.type=='readystatechange') ) 750 751 { 752 753 if( ++i===$imgs.length ) _done(); 754 755 } 756 757 else if( _img.readyState === undefined ) // dont for IE 758 759 { 760 761 $(_img).attr('src',$(_img).attr('src')); // re-fire load event 762 763 } 764 765 }; // _checki \\ 766 767 $(_img).bind('load readystatechange', function(e){_checki(e);}); 768 769 _checki({type:'readystatechange'}); // bind to 'load' event... 770 771 }); 772 773 } else _done(); 774 775 }); 776 777 }; 778 779 780 781 // Is the file a image? (This function is not only used in the Ajaxload function) 782 783 function imageCheck(file) 784 785 { 786 787 var image = false;
788 789 790 791 var len = file.length; 792 793 var ext = file.substr(len-4, 4); 794 795 796 797 if (ext == '.jpg' || ext == '.png' || ext == '.bmp' || ext == '.gif') 798 799 { 800 801 image = true; 802 803 } 804 805 var ext = file.substr(len-5, 5); 806 807 if (ext == '.jpeg') 808 809 { 810 811 image = true; 812 813 } 814 815 816 817 return image; 818 819 } 820 821 function fadeControl (fadeOpacity,fadetime,nextcontrol) 822 823 { 824 825 if (nextcontrol) 826 827 { 828 829 var eA = nextbutton; 830 831 var eB = lastbutton; 832 833 var directionA = 'next'; 834 835 var directionB = 'last'; 836 837 var firstlastshow = optionslastShow; 838 839 } 840 841 else 842 843 { 844 845 var eA = prevbutton; 846 847 var eB = firstbutton; 848 849 var directionA = 'prev'; 850 851 var directionB = 'first'; 852 853 var firstlastshow = optionsfirstShow; 854 855 } 856 857 if (!optionscontinuous) 858 859 { 860 861 if (optionsprevNext) eA.fadeTo(fadetime, fadeOpacity, function() { if (fadeOpacity == 0) $(this).hide();}); 862 863 if (firstlastshow) eB.fadeTo(fadetime, fadeOpacity, function() { if (fadeOpacity == 0) $(this).hide();}); 864 865 if(optionscustomLink) 866 867 { 868 869 $(optionscustomLink) 870 871 .filter(function(index) { 872 873 return ($(this).attr("rel") == directionA || $(this).attr("rel") == directionB); 874 875 }) 876 877 .fadeTo(fadetime, fadeOpacity, function() { if (fadeOpacity == 0) $(this).hide();}); 878 879 } 880 881 } 882 883 }; 884 885 // Fade the controls, if we are at the end of the slide. 886 887 // It's all the different kind of controls. 888 889 function fadeControls (a,fadetime) 890 891 { 892 893 if(a==0) fadeControl (0,fadetime,false); 894 895 else fadeControl (1,fadetime,false); 896 897 898 899 if(a==ts) fadeControl (0,fadetime,true); 900 901 else fadeControl (1,fadetime,true); 902 903 }; 904 905 906 907 908 909 910 911 // Updating the 'current' class 912 913 function setCurrent(i) 914 915 { 916 917 i = parseInt((i>ts) ? i=0 : ((i<0)? i=ts: i)) + 1; 918 919 for(var a=0;a<numericControls.length;a++) setCurrentElement(numericControls[a], i); 920 921 if(optionscustomLink) setCurrentElement(optionscustomLink, i); 922 923 }; 924 925 function setCurrentElement(element,i) 926 927 { 928 929 $(element) 930 931 .filter(".current") 932 933 .removeClass("current") 934 935 .each(function() { 936 937 if ($.isFunction(optionsuncurrentFunc)){ optionsuncurrentFunc.call(this, $(this).attr("rel")); } 938 939 }); 940 941 $(element) 942 943 .filter(function() { 944 945 return $(this).attr("rel") == i; 946 947 }) 948 949 .addClass("current") 950 951 .each(function(index) { 952 953 if ($.isFunction(optionscurrentFunc)){ optionscurrentFunc.call(this, i); } 954 955 }); 956 957 }; 958 959 // Find out wich numericText fits the current url. 960 961 function filterUrlHash(t) 962 963 { 964 965 var te = 0; 966 967 for (var i=0;i<=s;i=i+1) if (optionsnumericText[i] == t) te = i; 968 969 return te; 970 971 }; 972 973 // Automaticly adjust the height, i love this function. 974 975 function autoheight(i, speed) 976 977 { 978 979 if (i == s) i = 0; 980 981 // First i run it. In case there are no images. 982 983 var target = li.eq(i); 984 985 var nheight = target.height(); 986 987 if (nheight != 0) setHeight(nheight, speed); 988 989 // Then i run it again after the images has been loaded. (If any) 990 991 runOnImagesLoaded(target,function(imgtarget){ 992 993 nheight = $(imgtarget).height(); 994 995 if (nheight != 0) setHeight(nheight, speed); 996 997 }); 998 999 }; 1000 1001 function setHeight(nheight, speed) 1002 1003 { 1004 1005 obj.animate( 1006 1007 { height:nheight}, 1008 1009 { 1010 1011 queue:false, 1012 1013 duration:speed, 1014 1015 easing:optionsease 1016 1017 } 1018 1019 ); 1020 1021 }; 1022 1023 // When the animation finishes (fade or sliding), we need to adjust the slider. 1024 1025 function adjust() 1026 1027 { 1028 1029 if(t>ts) t=0; 1030 1031 if(t<0) t=ts; 1032 1033 if (!optionsupdateBefore) setCurrent(t); 1034 1035 if(optionsvertical) ul.css("margin-top",(t*h*-1)); 1036 1037 else ul.css("margin-left",(t*w*-1)); 1038 1039 clickable = true; 1040 1041 if(optionshistory && buttonclicked) window.location.hash = optionsnumericText[t]; 1042 1043 if (!fading) 1044 1045 { 1046 1047 // Lets run the after animation function. 1048 1049 if ($.isFunction(optionsafterAniFunc)){optionsafterAniFunc.call(li.eq(t) , t + 1);} 1050 1051 } 1052 1053 }; 1054 1055 // Convert the direction into a usefull number. 1056 1057 function filterDir(dir, ot) 1058 1059 { 1060 1061 var nt = t; // i dont want to mess with the 't' variable. 1062 1063 switch(dir) 1064 1065 { 1066 1067 case "next": 1068 1069 nt = (ot>=ts) ? (optionscontinuous ? nt+1 : ts) : nt+1; 1070 1071 break; 1072 1073 case "prev": 1074 1075 nt = (t<=0) ? (optionscontinuous ? nt-1 : 0) : nt-1; 1076 1077 break; 1078 1079 case "first": 1080 1081 nt = 0; 1082 1083 break; 1084 1085 case "last": 1086 1087 nt = ts; 1088 1089 break; 1090 1091 default: 1092 1093 nt = parseInt(dir); 1094 1095 break; 1096 1097 }; 1098 1099 return nt; 1100 1101 }; 1102 1103 // Load a ajax document (or i image) into a list element. 1104 1105 // If testing this locally (loading everything from a harddisk instead of the internet), it may not work. 1106 1107 // But then try to upload it to a server, and see it shine. 1108 1109 function ajaxLoad(i, l, adjust, speed) 1110 1111 { 1112 1113 var targetslide = false;
1114 1115 if (parseInt(i) || i == 0) targetslide = li.eq(i); 1116 1117 else 1118 1119 { 1120 1121 if (i == 'last') targetslide = $('li:last', obj); 1122 1123 else targetslide = $('li:first', obj); 1124 1125 } 1126 1127 // What speed should the autoheight function animate with? 1128 1129 var ajaxspeed = (fading) ? (!optionscrossFade ? parseInt(optionsfadespeed * (2/5)) : optionsfadespeed) : speed; 1130 1131 // The script itself is not using the 'tt' variable. But a custom function can use it. 1132 1133 var tt = l + 1; 1134 1135 if (imageCheck(optionsajax[l])) 1136 1137 { 1138 1139 // Load the image. 1140 1141 targetslide.html(' ').append($(new Image()).attr('src', optionsajax[l])); 1142 1143 // When the document is ready again, we launch a autoheight event. 1144 1145 runOnImagesLoaded(targetslide,function(img){ 1146 1147 var target = $(img).children(); 1148 1149 // If the image is to wide, shrink it. 1150 1151 var width = target.width(); 1152 1153 var height = target.height(); 1154 1155 target.attr({'oldheight' : height, 'oldwidth' : width}); 1156 1157 if (width > w) target.animate({ width: w, height: (height/width)*w}, 0); 1158 1159 // If we want, we can launch a function here. 1160 1161 if ($.isFunction(optionsimgAjaxFunction)){optionsimgAjaxFunction.call($(img), tt);} 1162 1163 // Then do the autoheight. 1164 1165 if (optionsautoheight && adjust) autoheight(t, ajaxspeed); 1166 1167 }); 1168 1169 } 1170 1171 else 1172 1173 { 1174 1175 1176 1177 // Load the document into the list element. 1178 1179 targetslide.load(optionsajax[l], function(response, status, xhr) { 1180 1181 if (status == "error" || !$(this).html()) $(this).html("Sorry but there was an error: " + (xhr.status ? xhr.status: 'no content') + " " + xhr.statusText); 1182 1183 // If we want, we can launch a function here. 1184 1185 if (status != "error" && $.isFunction(optionsdocAjaxFunction)){optionsdocAjaxFunction.call($(this), tt);} 1186 1187 // Lets adjust the height, i don't care if there's an error or not. 1188 1189 var nheight = $(this).height(); 1190 1191 if (optionsautoheight && adjust) autoheight(l, ajaxspeed); 1192 1193 }); 1194 1195 } 1196 1197 }; 1198 1199 // It's not only a slider, it can also fade from slide to slide. 1200 1201 function fadeto(i, clicked) 1202 1203 { 1204 1205 if (i != t && !destroyed) // We doesn't want something to happen all the time. The URL can change a lot, and cause som "flickering". 1206 1207 { 1208 1209 if (clickable) 1210 1211 { 1212 1213 ajaxloading = false; 1214 1215 // Stop auto if cliked. 1216 1217 if(clicked) clearTimeout(timeout); 1218 1219 // Update the current class of the buttons. 1220 1221 if (optionsupdateBefore) setCurrent(filterDir(i, ot)); 1222 1223 // Only clickable if not clicked. 1224 1225 clickable = !clicked; 1226 1227 // Setting the speed. 1228 1229 var speed = (!clicked && !optionsauto && optionshistory) ? optionsfadespeed * (optionsspeedhistory / optionsspeed) : optionsfadespeed; 1230 1231 var ll = filterDir(i, ot); 1232 1233 // Lets make sure that the target actually exists. 1234 1235 if(ll>ts) ll=0; 1236 1237 if(ll<0) ll=ts; 1238 1239 // Lets make sure the prev/next buttons also fade. 1240 1241 if(optionscontrolsFade) fadeControls (ll,optionscontrolsFadeSpeed); 1242 1243 // Lets adjust the height, but not if the ajax document isn't loaded. 1244 1245 if (optionsautoheight) 1246 1247 { 1248 1249 if (optionsajax) 1250 1251 { 1252 1253 // If Ajax is enabled 1254 1255 if (!optionsajax[ll]) autoheight(ll,optionsfadespeed); // we only want to change the height, if the document we are fading to, is allready loaded. 1256 1257 } 1258 1259 else autoheight(ll,optionsfadespeed); // The height animation takes the full lenght of the fade animation (fadein + fadeout if it's not crossfading). 1260 1261 } 1262 1263 // Define the target. 1264 1265 var target = li.eq(ll); 1266 1267 // So lets run the function. 1268 1269 if ($.isFunction(optionsbeforeAniFunc)){optionsbeforeAniFunc.call(target, ll + 1);} 1270 1271 // Crossfading? 1272 1273 if (optionscrossFade) 1274 1275 { 1276 1277 // I clone the target, and fade it in, then hide the cloned element while adjusting the slider to show the real target. 1278 1279 // I dont hide it right away, because that breaks the autoheight function, and the function that auto-resizes ajax-loaded images. 1280 1281 var fadeIntarget = target.clone().prependTo(obj).css({'z-index' : '100000', 'position' : 'absolute', 'list-style' : 'none', 'top' : '0', 'left' : '0'}); 1282
1283 // Maybe we need to load some content into it first? 1284 1285 if (optionsajax[ll]) 1286 1287 { 1288 1289 // I have to load the Ajax-content into the target clone, and the target itself. 1290 1291 // First the target clone. 1292 1293 ajaxLoad(0, ll, false, speed); 1294 1295 // Then the target. 1296 1297 if (imageCheck(optionsajax[ll])) // Weird bugs, weird fixes. But this works. 1298 1299 { 1300 1301 ajaxLoad(ll+1, ll, false, speed); 1302 1303 runOnImagesLoaded(li.eq(ll+1),function(){ 1304 1305 if (optionsautoheight) autoheight(ll, optionsfadespeed); 1306 1307 }); 1308 1309 } 1310 1311 else 1312 1313 { 1314 1315 ajaxLoad(ll+1, ll, true, speed); 1316 1317 } 1318 1319 optionsajax[ll] = false; 1320 1321 } 1322 1323 // Lets fade it in. 1324 1325 fadeIntarget.hide().fadeIn(optionsfadespeed, function() { 1326 1327 // So the animate function knows what to do. 1328 1329 clickable = true; 1330 1331 fading = true; 1332 1333 animate(i,false,false); // Moving to the correct place. 1334 1335 // Removing it again, if i dont, it will just be a pain in the .... 1336 1337 $(this).remove(); 1338 1339 if(optionshistory && clicked) window.location.hash = optionsnumericText[t]; // It's just one line of code, no need to make a function of it. 1340 1341 // Lets put that variable back to the default (and not during animation) value. 1342 1343 fading = false; 1344 1345 // Now run that after animation function. 1346 1347 // We already got the target and the slider number from earlier. 1348 1349 // So lets run the function. 1350 1351 if ($.isFunction(optionsafterAniFunc)){optionsafterAniFunc.call(target, ll + 1);} 1352 1353 }); 1354 1355 } 1356 1357 else 1358 1359 { 1360 1361 // fadeOut and fadeIn. 1362 1363 var fadeinspeed = parseInt((speed)*(3/5)); 1364 1365 var fadeoutspeed = speed - fadeinspeed; 1366 1367 // I set the opacity to something higher than 0, because if it's 0, the content that i try to read (to make the autoheight work etc.) aint there. 1368 1369 obj.children().fadeTo(fadeoutspeed, 0.00001, function(){ 1370 1371 // So the animation function knows what to do. 1372 1373 clickable = true; 1374 1375 fading = true; 1376 1377 animate(i,false,false); // Moving to the correct place. 1378 1379 // Only clickable if not clicked. 1380 1381 clickable = !clicked; 1382 1383 // Now, lets fade the slider back in. 1384 1385 obj.children().fadeTo(fadeinspeed, 1, function(){ 1386 1387 if(optionshistory && clicked) window.location.hash = optionsnumericText[t]; // It's just one line of code, no need to make a function of it. 1388 1389 clickable = true; 1390 1391 fading = false; 1392 1393 // Now run that after animation function. 1394 1395 // We already got the target and the slider number from earlier. 1396 1397 // So lets run the function. 1398 1399 if ($.isFunction(optionsafterAniFunc)){optionsafterAniFunc.call(target, ll + 1);} 1400 1401 }); 1402 1403 }); 1404 1405 } 1406 1407 } 1408 1409 } 1410 1411 }; 1412 1413 function animate(dir,clicked,time) // (Direction, did the user click something, is this to be done in >1ms?) 1414 1415 { 1416 1417 if (clickable && !destroyed) 1418 1419 { 1420 1421 ajaxloading = false; 1422 1423 clickable = (!clicked && !optionsauto) ? true : options.clickableAni; 1424 1425 // to the adjust function. 1426 1427 buttonclicked = clicked; 1428 1429 ot = t; 1430 1431 t = filterDir(dir, ot); 1432 1433 if (optionsupdateBefore) setCurrent(t); 1434 1435 // Calculating the speed to do the animation with. 1436 1437 var diff = Math.sqrt(Math.abs(ot-t)); 1438 1439 var speed = parseInt(diff*optionsspeed); 1440 1441 if (!clicked && !optionsauto) speed = parseInt(diff*optionsspeedhistory); // Auto:true and history:true doens't work well together, and they ain't supposed to. 1442 1443 if (!time) speed = 0; 1444 1445 1446 1447 // Ajax begins here 1448 1449 // I also these variables in the below code (running custom function). 1450 1451 var i = t; 1452 1453 if(t>ts) i=0; 1454 1455 if(t<0) i=ts; 1456 1457 if (optionsajax) 1458 1459 { 1460 1461 // Loading the target slide, if not already loaded. 1462 1463 if (optionsajax[i]) 1464 1465 { 1466 1467 ajaxLoad(i, i, true, speed); 1468 1469 optionsajax[i] = false; 1470 1471 ajaxloading = true; 1472 1473 } 1474 1475 // It can look stupid the script scroll over some not-loaded slides. Therefore, they are loaded. 1476 1477 // It can produce some heavy load, so the script wont do it, it it's more than 10 slides. 1478 1479 if (!fading) 1480 1481 { 1482 1483 // I dont like copypasting the same code, but this is the most efficient way i can think of atm. 1484 1485 var countajax = 0; 1486 1487 if (ot > t) 1488 1489 { 1490 1491 for (a = t; a <= ot; a++) 1492 1493 { 1494 1495 if (a<=ts && a>=0) 1496 1497 { 1498 1499 if (optionsajax[a]) 1500 1501 { 1502 1503 ajaxLoad(a, a, false, speed); 1504 1505 optionsajax[a] = false; 1506 1507 countajax++; 1508 1509 } 1510 1511 } 1512 1513 if (countajax == 10) a = ot; 1514 1515 } 1516 1517 } 1518 1519 else 1520 1521 { 1522 1523 for (a = ot; a <= t; a++) 1524 1525 { 1526 1527 if (a<=ts && a>=0) 1528 1529 { 1530 1531 if (optionsajax[a]) 1532 1533 { 1534 1535 ajaxLoad(a, a, false, speed); 1536 1537 optionsajax[a] = false; 1538 1539 countajax++; 1540 1541 } 1542 1543 } 1544 1545 if (countajax == 10) a = t; 1546 1547 } 1548 1549 } 1550 1551 } 1552 1553 // Then we have to preload the next one. 1554 1555 if ((i + 1 <= ts) && !init) 1556 1557 { 1558 1559 if (optionsajax[i + 1]) 1560 1561 { 1562 1563 ajaxLoad(i + 1, i + 1, false, 0); 1564 1565 optionsajax[i + 1] = false;
1566 1567 } 1568 1569 } 1570 1571 // And the previous one. 1572 1573 if (i - 1 >= 0 && !init) 1574 1575 { 1576 1577 if (optionsajax[i - 1]) 1578 1579 { 1580 1581 ajaxLoad(i - 1, i - 1, false, 0); 1582 1583 optionsajax[i - 1] = false; 1584 1585 } 1586 1587 } 1588 1589 } 1590 1591 // Ajax ends here 1592 1593 if (!fading) 1594 1595 { 1596 1597 // Lets run the before animation function. 1598 1599 if ($.isFunction(optionsbeforeAniFunc)){ 1600 1601 optionsbeforeAniFunc.call(li.eq(i), i + 1); 1602 1603 if (t == -1 || t == s) optionsbeforeAniFunc.call(ul.children("li").eq((t == -1) ? 0 : -1), i + 1); 1604 1605 } 1606 1607 1608 1609 } 1610 1611 // Start animation. 1612 1613 if(!optionsvertical) { 1614 1615 if (optionsautoheight && !fading && !ajaxloading) autoheight(t, speed); 1616 1617 p = (t*w*-1); 1618 1619 ul.animate( 1620 1621 { marginLeft: p}, 1622 1623 { 1624 1625 queue:false, 1626 1627 duration:speed, 1628 1629 easing:optionsease, 1630 1631 complete:adjust 1632 1633 } 1634 1635 ); 1636 1637 } else { 1638 1639 p = (t*h*-1); 1640 1641 ul.animate( 1642 1643 { marginTop: p }, 1644 1645 { 1646 1647 queue:false, 1648 1649 duration:speed, 1650 1651 easing:optionsease, 1652 1653 complete:adjust 1654 1655 } 1656 1657 ); 1658 1659 }; 1660 1661 // End animation. 1662 1663 1664 1665 // Fading the next/prev/last/first controls in/out if needed. 1666 1667 if(optionscontrolsFade) 1668 1669 { 1670 1671 var fadetime = optionscontrolsFadeSpeed; 1672 1673 if (!clicked && !optionsauto) fadetime = (optionsspeedhistory / optionsspeed) * optionscontrolsFadeSpeed; 1674 1675 if (!time) fadetime = 0; 1676 1677 if (fading) fadetime = parseInt((optionsfadespeed)*(3/5)); 1678 1679 fadeControls (t,fadetime); 1680 1681 } 1682 1683 1684 1685 // Stopping auto if clicked. 1686 1687 if(clicked) clearTimeout(timeout); 1688 1689 // Continuing if not clicked. 1690 1691 if(optionsauto && dir=="next" && !clicked){ 1692 1693 timeout = startAuto(optionspause + optionsspeed); 1694 1695 }; 1696 1697 }; 1698 1699 }; 1700 1701 // init 1702 1703 var timeout; 1704 1705 1706 1707 // Starting auto. 1708 1709 if(optionsauto){ 1710 1711 timeout = startAuto(optionspause); 1712 1713 }; 1714 1715 function startAuto(pause) 1716 1717 { 1718 1719 return setTimeout(function(){ 1720 1721 goToSlide("next", false); 1722 1723 },pause); 1724 1725 } 1726 1727 if (optionscustomLink) // customLinks. Easy to make, great to use. 1728 1729 { 1730 1731 // Using live, that way javascript ajax-loaded buttons and javascript generated content will work. 1732 1733 $(optionscustomLink).live('click', function() { //høns 1734 1735 var a = $(this).attr('rel'); 1736 1737 if (a) doExternalInput(a); 1738 1739 return false; 1740 1741 }); 1742 1743 } 1744 1745 obj.bind('sudoSliderEvent', function(e, a) { 1746 1747 doExternalInput(a); 1748 1749 }); 1750 1751 function doExternalInput(a) 1752 1753 { 1754 1755 // Check for special events 1756 1757 if (a == 'stop') clearTimeout(timeout) 1758 1759 else if (a == 'start') 1760 1761 { 1762 1763 timeout = startAuto(optionspause); 1764 1765 optionsauto = true; 1766 1767 } 1768 1769 else if (a == 'block') clickable = false; 1770 1771 else if (a == 'unblock') clickable = true; 1772 1773 else if (a == 'action') alert('The slider just performed an action'); 1774 1775 else if (a == 'destroy') 1776 1777 { 1778 1779 // First, i remove the controls. 1780 1781 controls.remove(); // that's it. 1782 1783 // Now to set a variable, so nothing is run. 1784 1785 destroyed = true; // No animation, no fading, no clicking from now. 1786 1787 // Then remove the customLink bindings: 1788 1789 $(optionscustomLink).die("click"); 1790 1791 // Now remove the "continuous clones". 1792 1793 if (optionscontinuous) 1794 1795 { 1796 1797 ul.children("li").eq(0).remove(); 1798 1799 ul.children("li").eq(-1).remove(); 1800 1801 } 1802 1803 } 1804 1805 // The general case. 1806 1807 // That means, typeof(a) == numbers and first,last,next,prev 1808 1809 // I dont make any kind of input validation, meaning that it's quite easy to break the script with non-valid input. 1810 1811 else if (clickable) goToSlide((a == parseInt(a)) ? a - 1 : a, true); 1812 1813 }; 1814 1815 // Done. 1816 1817 init = false; //nasty workaround, but it works. 1818 1819 1820 1821 1822 1823 // Lets make those bookmarks and back/forward buttons work. 1824 1825 if (optionshistory) { 1826 1827 // Going to the correct slide at load. 1828 1829 $.address.init(function(e) { 1830 1831 var i = filterUrlHash(e.value); 1832 1833 animate(i,false,false); 1834 1835 }) 1836 1837 // Sliding/fading to the correct slide, on url change. 1838 1839 .change(function(e) { 1840 1841 var i = filterUrlHash(e.value); 1842 1843 if (i != t) goToSlide(i, false); 1844 1845 }); 1846 1847 } 1848 1849 // The startSlide setting only require one line of code. And here it is: 1850 1851 else if (optionsstartSlide) animate(optionsstartSlide - 1,false,false); 1852 1853 // doing it anyway. good way to fix bugs. 1854 1855 // And i only preload the next and previous slide after init (which this is). So i'm doing it. 1856 1857 // + if i didn't do this, a lot of things wouldn't happen on page load. By always animating, i ensure that everthing that's supposed to happen, do happen. 1858 1859 else animate(0,false,false); 1860 1861 }); 1862 1863 } 1864 1865 }; 1866 1867})(jQuery);
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.