1/** 2 * thumbs class 3 * addon to strip gallery 4 */ 5function UGThumbsGrid(){ 6 7 var t = this, g_objThis = jQuery(this); 8 var g_gallery = new UniteGalleryMain(), g_objGallery, g_objects, g_objWrapper; 9 var g_functions = new UGFunctions(), g_arrItems, g_objGrid, g_objInner; 10 var g_thumbs = new UGThumbsGeneral(), g_tilesDesign = new UGTileDesign(); 11 12 var g_options = { 13 grid_panes_direction: "left", //where panes will move -> left, bottom 14 grid_num_cols: 2, //number of grid columns 15 grid_min_cols: 2, //minimum number of columns (for horizontal type) - the tile size is dynamic 16 grid_num_rows: 2, //number of grid rows (for horizontal type) 17 grid_space_between_cols: 10, //space between columns 18 grid_space_between_rows: 10, //space between rows 19 grid_space_between_mobile: 10, //space between rows and cols mobile 20 grid_transition_duration: 300, //transition of the panes change duration 21 grid_transition_easing: "easeInOutQuad", //transition of the panes change easing function 22 grid_carousel: false, //next pane goes to first when last 23 grid_padding: 0, //set padding to the grid 24 grid_vertical_scroll_ondrag: false //scroll the gallery on vertical drag 25 }; 26 27 this.events = { 28 PANE_CHANGE: "pane_change" 29 }; 30 31 var g_temp = { 32 eventSizeChange: "thumb_size_change", 33 isHorizontal: false, 34 isMaxHeight:false, //set if the height that set is max height. In that case need a height correction 35 isMaxWidth:false, //set if the height that set is max height. In that case need a height correction 36 gridHeight: 0, 37 gridWidth: 0, 38 innerWidth: 0, 39 innerHeight:0, 40 numPanes:0, 41 arrPanes:0, 42 numThumbs:0, 43 currentPane:0, 44 numThumbsInPane:0, 45 isNavigationVertical:false, 46 touchActive: false, 47 startScrollPos:0, 48 isFirstTimeRun:true, 49 isTilesMode: false, 50 storedEventID: "thumbsgrid", 51 tileMaxWidth:null, 52 tileMaxHeight:null, 53 spaceBetweenCols: null, 54 spaceBetweenRows: null 55 }; 56 57 58 function __________GENERAL_________(){}; 59 60 /** 61 * init the gallery 62 */ 63 function init(gallery, customOptions, isTilesMode){ 64 65 g_objects = gallery.getObjects(); 66 g_gallery = gallery; 67 68 g_gallery.attachThumbsPanel("grid", t); 69 70 g_objGallery = jQuery(gallery); 71 g_objWrapper = g_objects.g_objWrapper; 72 g_arrItems = g_objects.g_arrItems; 73 74 if(isTilesMode === true) 75 g_temp.isTilesMode = true; 76 77 g_temp.numThumbs = g_arrItems.length; 78 79 setOptions(customOptions); 80 81 if(g_temp.isTilesMode == true){ 82 83 g_tilesDesign.setFixedMode(); 84 g_tilesDesign.setApproveClickFunction(isApproveTileClick); 85 g_tilesDesign.init(gallery, g_options); 86 87 var options_td = g_tilesDesign.getOptions(); 88 g_temp.tileMaxHeight = options_td.tile_height; 89 g_temp.tileMaxWidth = options_td.tile_width; 90 91 g_thumbs = g_tilesDesign.getObjThumbs(); 92 }else{ 93 94 //disable the dynamic size in thumbs 95 customOptions.thumb_fixed_size = true; 96 97 g_thumbs.init(gallery, customOptions); 98 } 99 100 } 101 102 103 /** 104 * set the grid panel html 105 */ 106 function setHtml(parentContainer){ 107 108 var objParent = g_objWrapper; 109 110 if(parentContainer) 111 objParent = parentContainer; 112 113 objParent.append("<div class='ug-thumbs-grid'><div class='ug-thumbs-grid-inner'></div></div>"); 114 g_objGrid = objParent.children(".ug-thumbs-grid"); 115 g_objInner = g_objGrid.children(".ug-thumbs-grid-inner"); 116 117 //put the thumbs to inner strip 118 119 if(g_temp.isTilesMode == true) 120 g_tilesDesign.setHtml(g_objInner); 121 else 122 g_thumbs.setHtmlThumbs(g_objInner); 123 124 } 125 126 127 /** 128 * validate before running the grid 129 */ 130 function validateBeforeRun(){ 131 132 if(g_temp.isHorizontal == false){ //vertical type 133 if(g_temp.gridHeight == 0) 134 throw new Error("You must set height before run."); 135 }else{ 136 if(g_temp.gridWidth == 0) 137 throw new Error("You must set width before run."); 138 } 139 140 } 141 142 143 /** 144 * run the gallery after init and set html 145 */ 146 function run(){ 147 148 var selectedItem = g_gallery.getSelectedItem(); 149 150 validateBeforeRun(); 151 152 if(g_temp.isFirstTimeRun == true){ 153 154 initEvents(); 155 156 if(g_temp.isTilesMode == true){ 157 158 initGridDynamicSize(); 159 initSizeParams(); 160 g_tilesDesign.run(); 161 162 }else{ 163 g_thumbs.setHtmlProperties(); 164 initSizeParams(); 165 g_thumbs.loadThumbsImages(); 166 } 167 168 }else{ 169 170 if(g_temp.isTilesMode == true){ 171 172 //check if dynamic size changed. If do, run the thumbs again 173 var isChanged = initGridDynamicSize(); 174 175 if(isChanged == true){ 176 initSizeParams(); 177 g_tilesDesign.run(); 178 } 179 } 180 181 } 182 183 positionThumbs(); 184 185 if(g_temp.isFirstTimeRun == true && g_temp.isTilesMode){ 186 187 var objTiles = g_thumbs.getThumbs(); 188 189 //fire size change event 190 objTiles.each(function(index, tile){ 191 192 g_objWrapper.trigger(g_temp.eventSizeChange, jQuery(tile)); 193 }); 194 195 objTiles.fadeTo(0,1); 196 } 197 198 if(selectedItem != null) 199 scrollToThumb(selectedItem.index); 200 201 //trigger pane change event on the start 202 g_objThis.trigger(t.events.PANE_CHANGE, g_temp.currentPane); 203
204 g_temp.isFirstTimeRun = false; 205 } 206 207 /** 208 * get thumb size object 209 */ 210 function getThumbsSize(){ 211 if(g_temp.isTilesMode == true) 212 var objThumbSize = g_tilesDesign.getGlobalTileSize(); 213 else 214 var objThumbSize = g_thumbs.getGlobalThumbSize(); 215 216 return(objThumbSize); 217 } 218 219 220 /** 221 * init grid dynamic size (tiles mode) 222 */ 223 function initGridDynamicSize(){ 224 225 if(g_temp.isTilesMode == false) 226 throw new Error("Dynamic size can be set only in tiles mode"); 227 228 var isChanged = false; 229 var isMobile = g_gallery.isMobileMode(); 230 231 //--- set space between cols and rows 232 233 var spaceOld = g_temp.spaceBetweenCols; 234 235 if(isMobile == true){ 236 g_temp.spaceBetweenCols = g_options.grid_space_between_mobile; 237 g_temp.spaceBetweenRows = g_options.grid_space_between_mobile; 238 }else{ 239 g_temp.spaceBetweenCols = g_options.grid_space_between_cols; 240 g_temp.spaceBetweenRows = g_options.grid_space_between_rows; 241 } 242 243 if(g_temp.spaceBetweenCols != spaceOld) 244 isChanged = true; 245 246 //set tile size 247 248 var lastThumbSize = getThumbsSize(); 249 var lastThumbWidth = lastThumbSize.width; 250 251 var tileWidth = g_temp.tileMaxWidth; 252 var numCols = g_functions.getNumItemsInSpace(g_temp.gridWidth, g_temp.tileMaxWidth, g_temp.spaceBetweenCols); 253 254 if(numCols < g_options.grid_min_cols){ 255 tileWidth = g_functions.getItemSizeInSpace(g_temp.gridWidth, g_options.grid_min_cols, g_temp.spaceBetweenCols); 256 } 257 258 g_tilesDesign.setTileSizeOptions(tileWidth); 259 260 if(tileWidth != lastThumbWidth) 261 isChanged = true; 262 263 264 return(isChanged); 265 } 266 267 268 /** 269 * init grid size horizontal 270 * get height param 271 */ 272 function initSizeParamsHor(){ 273 274 var objThumbSize = getThumbsSize(); 275 276 var thumbsHeight = objThumbSize.height; 277 278 //set grid size 279 var gridWidth = g_temp.gridWidth; 280 var gridHeight = g_options.grid_num_rows * thumbsHeight + (g_options.grid_num_rows-1) * g_temp.spaceBetweenRows + g_options.grid_padding*2; 281 282 g_temp.gridHeight = gridHeight; 283 284 g_functions.setElementSize(g_objGrid, gridWidth, gridHeight); 285 286 //set inner size (as grid size, will be corrected after placing thumbs 287 g_functions.setElementSize(g_objInner, gridWidth, gridHeight); 288 289 //set initial inner size params 290 g_temp.innerWidth = gridWidth; 291 g_temp.innerHeight = gridHeight; 292 } 293 294 295 /** 296 * init size params vertical 297 */ 298 function initSizeParamsVert(){ 299 300 var objThumbSize = getThumbsSize(); 301 302 var thumbsWidth = objThumbSize.width; 303 304 //set grid size 305 var gridWidth = g_options.grid_num_cols * thumbsWidth + (g_options.grid_num_cols-1) * g_temp.spaceBetweenCols + g_options.grid_padding*2; 306 var gridHeight = g_temp.gridHeight; 307 308 g_temp.gridWidth = gridWidth; 309 310 g_functions.setElementSize(g_objGrid, gridWidth, gridHeight); 311 312 //set inner size (as grid size, will be corrected after placing thumbs 313 g_functions.setElementSize(g_objInner, gridWidth, gridHeight); 314 315 //set initial inner size params 316 g_temp.innerWidth = gridWidth; 317 g_temp.innerHeight = gridHeight; 318 319 } 320 321 /** 322 * init grid size 323 */ 324 function initSizeParams(){ 325 326 if(g_temp.isHorizontal == false) 327 initSizeParamsVert(); 328 else 329 initSizeParamsHor(); 330 331 } 332 333 334 335 /** 336 * goto pane by index 337 */ 338 function scrollToThumb(thumbIndex){ 339 340 var paneIndex = getPaneIndexByThumbIndex(thumbIndex); 341 if(paneIndex == -1) 342 return(false); 343 344 t.gotoPane(paneIndex, "scroll"); 345 346 } 347 348 349 /** 350 * set the options of the strip 351 */ 352 function setOptions(objOptions){ 353 354 g_options = jQuery.extend(g_options, objOptions); 355 356 g_thumbs.setOptions(objOptions); 357 358 //set vertical or horizon 359 g_temp.isNavigationVertical = (g_options.grid_panes_direction == "top" || g_options.grid_panes_direction == "bottom") 360 361 g_temp.spaceBetweenCols = g_options.grid_space_between_cols; 362 g_temp.spaceBetweenRows = g_options.grid_space_between_rows; 363 364 } 365 366 367 /** 368 * position the thumbs and init panes horizontally 369 */ 370 function positionThumb_hor(){ 371 372 var arrThumbs = g_objInner.children(".ug-thumb-wrapper"); 373 374 var posx = 0; 375 var posy = 0; 376 var counter = 0; 377 var baseX = 0; 378 var maxx = 0, maxy = 0; 379 g_temp.innerWidth = 0; 380 g_temp.numPanes = 1; 381 g_temp.arrPanes = []; 382 g_temp.numThumbsInPane = 0; 383 384 //set first pane position 385 g_temp.arrPanes.push(baseX); 386 387 var numThumbs = arrThumbs.length; 388 389 for(i=0;i < numThumbs; i++){ 390 var objThumb = jQuery(arrThumbs[i]); 391 g_functions.placeElement(objThumb, posx, posy); 392 393 var thumbWidth = objThumb.outerWidth();
394 var thumbHeight = objThumb.outerHeight(); 395 396 //count maxx 397 if(posx > maxx) 398 maxx = posx; 399 400 //count maxy 401 var endY = posy + thumbHeight; 402 if(endY > maxy) 403 maxy = endY; 404 405 //count maxx end 406 var endX = maxx + thumbWidth; 407 if(endX > g_temp.innerWidth) 408 g_temp.innerWidth = endX; 409 410 posx += thumbWidth + g_temp.spaceBetweenCols; 411 412 //next row 413 counter++; 414 if(counter >= g_options.grid_num_cols){ 415 posy += thumbHeight + g_temp.spaceBetweenRows; 416 posx = baseX; 417 counter = 0; 418 } 419 420 //count number thumbs in pane 421 if(g_temp.numPanes == 1) 422 g_temp.numThumbsInPane++; 423 424 //prepare next pane 425 if((posy + thumbHeight) > g_temp.gridHeight){ 426 posy = 0; 427 baseX = g_temp.innerWidth + g_temp.spaceBetweenCols; 428 posx = baseX; 429 counter = 0; 430 431 //correct max height size (do it once only) 432 if(g_temp.isMaxHeight == true && g_temp.numPanes == 1){ 433 g_temp.gridHeight = maxy; 434 g_objGrid.height(g_temp.gridHeight); 435 } 436 437 //save next pane props (if exists) 438 if(i < (numThumbs - 1)){ 439 g_temp.numPanes++; 440 441 //set next pane position 442 g_temp.arrPanes.push(baseX); 443 444 } 445 } 446 } 447 448 449 //set inner strip width and height 450 g_objInner.width(g_temp.innerWidth); 451 452 //set grid height 453 if(g_temp.isMaxHeight == true && g_temp.numPanes == 1){ 454 g_temp.gridHeight = maxy; 455 g_objGrid.height(maxy); 456 } 457 458 } 459 460 461 /** 462 * position the thumbs and init panes vertically 463 */ 464 function positionThumb_vert(){ 465 var arrThumbs = g_objInner.children(".ug-thumb-wrapper"); 466 467 var posx = 0; 468 var posy = 0; 469 var maxy = 0; 470 var counter = 0; 471 var baseX = 0; 472 var paneStartY = 0; 473 474 g_temp.innerWidth = 0; 475 g_temp.numPanes = 1; 476 g_temp.arrPanes = []; 477 g_temp.numThumbsInPane = 0; 478 479 //set first pane position 480 g_temp.arrPanes.push(baseX); 481 482 var numThumbs = arrThumbs.length; 483 484 for(i=0;i < numThumbs; i++){ 485 var objThumb = jQuery(arrThumbs[i]); 486 g_functions.placeElement(objThumb, posx, posy); 487 488 var thumbWidth = objThumb.outerWidth(); 489 var thumbHeight = objThumb.outerHeight(); 490 491 posx += thumbWidth + g_temp.spaceBetweenCols; 492 493 var endy = (posy + thumbHeight); 494 if(endy > maxy) 495 maxy = endy; 496 497 //next row 498 counter++; 499 if(counter >= g_options.grid_num_cols){ 500 posy += thumbHeight + g_temp.spaceBetweenRows; 501 posx = baseX; 502 counter = 0; 503 } 504 505 //count number thumbs in pane 506 if(g_temp.numPanes == 1) 507 g_temp.numThumbsInPane++; 508 509 //prepare next pane 510 endy = (posy + thumbHeight); 511 var paneMaxY = paneStartY + g_temp.gridHeight; 512 513 //advance next pane 514 if(endy > paneMaxY){ 515 516 //correct max height size (do it once only) 517 if(g_temp.isMaxHeight == true && g_temp.numPanes == 1){ 518 g_temp.gridHeight = maxy; 519 g_objGrid.height(g_temp.gridHeight); 520 paneMaxY = g_temp.gridHeight; 521 } 522 523 posy = paneMaxY + g_temp.spaceBetweenRows; 524 paneStartY = posy; 525 baseX = 0; 526 posx = baseX; 527 counter = 0; 528 529 //save next pane props (if exists) 530 if(i < (numThumbs - 1)){ 531 g_temp.numPanes++; 532 533 //set next pane position 534 g_temp.arrPanes.push(posy); 535 536 } 537 } 538 539 }//for 540 541 //set inner height 542 g_objInner.height(maxy); 543 g_temp.innerHeight = maxy; 544 545 //set grid height 546 if(g_temp.isMaxHeight == true && g_temp.numPanes == 1){ 547 g_temp.gridHeight = maxy; 548 g_objGrid.height(maxy); 549 } 550 551 } 552 553 554 /** 555 * position the thumbs horizontal type 556 */ 557 function positionThumb_hortype(){ 558 559 var arrThumbs = g_objInner.children(".ug-thumb-wrapper"); 560 561 var baseX = g_options.grid_padding; 562 var baseY = g_options.grid_padding; 563 var posy = baseY; 564 var posx = baseX; 565 var maxx = 0, maxy = 0, paneMaxY = 0, gridMaxY = 0; 566 var rowsCounter = 0; 567 568 g_temp.innerWidth = 0; 569 g_temp.numPanes = 1; 570 g_temp.arrPanes = []; 571 g_temp.numThumbsInPane = 0; 572 573 //set first pane position 574 g_temp.arrPanes.push(baseX-g_options.grid_padding); 575 576 var numThumbs = arrThumbs.length; 577 578 for(i=0;i < numThumbs; i++){ 579 var objThumb = jQuery(arrThumbs[i]); 580 581 var thumbWidth = objThumb.outerWidth();
582 var thumbHeight = objThumb.outerHeight(); 583 584 //check end of the size, start a new row 585 if((posx - baseX + thumbWidth) > g_temp.gridWidth){ 586 rowsCounter++; 587 posy = 0; 588 589 if(rowsCounter >= g_options.grid_num_rows){ 590 591 //change to a new pane 592 rowsCounter = 0; 593 baseX = posx; 594 posy = baseY; 595 paneMaxY = 0; 596 597 //change grid width to max width 598 if(g_temp.numPanes == 1){ 599 g_temp.gridWidth = maxx+g_options.grid_padding; 600 g_objGrid.width(g_temp.gridWidth); 601 602 g_temp.gridHeight = gridMaxY + g_options.grid_padding; 603 g_objGrid.height(g_temp.gridHeight); 604 605 } 606 607 g_temp.numPanes++; 608 g_temp.arrPanes.push(baseX-g_options.grid_padding); 609 610 }else{ //start new line in existing pane 611 posx = baseX; 612 posy = paneMaxY + g_temp.spaceBetweenRows; 613 } 614 } 615 616 //place the thumb 617 g_functions.placeElement(objThumb, posx, posy); 618 619 //count maxx 620 var endX = posx + thumbWidth; 621 if(endX > maxx) 622 maxx = endX; 623 624 //count maxy 625 var endY = posy + thumbHeight; 626 627 if(endY > paneMaxY) //pane height 628 paneMaxY = endY; 629 630 if(endY > gridMaxY) //total height 631 gridMaxY = endY; 632 633 if(endY > maxy) 634 maxy = endY; 635 636 //count maxx end 637 var endX = maxx + thumbWidth; 638 if(endX > g_temp.innerWidth) 639 g_temp.innerWidth = endX; 640 641 posx += thumbWidth + g_temp.spaceBetweenCols; 642 643 //count number thumbs in pane 644 if(g_temp.numPanes == 1) 645 g_temp.numThumbsInPane++; 646 647 648 }//end for 649 650 //set inner strip width and height 651 g_temp.innerWidth = maxx + g_options.grid_padding; 652 g_temp.innerHeight = gridMaxY + g_options.grid_padding; 653 654 g_objInner.width(g_temp.innerWidth); 655 g_objInner.height(g_temp.innerHeight); 656 657 658 //set grid height 659 if(g_temp.numPanes == 1){ 660 g_temp.gridWidth = maxx + g_options.grid_padding; 661 g_temp.gridHeight = gridMaxY + g_options.grid_padding; 662 663 g_objGrid.width(g_temp.gridWidth); 664 g_objGrid.height(g_temp.gridHeight); 665 666 } 667 668 669 } 670 671 672 /** 673 * position the thumbs and init panes related and width related vars 674 */ 675 function positionThumbs(){ 676 677 if(g_temp.isHorizontal == false){ //position vertical type 678 679 if(g_temp.isNavigationVertical) 680 positionThumb_vert(); 681 else 682 positionThumb_hor(); 683 684 }else{ 685 positionThumb_hortype(); 686 } 687 688 } 689 690 691 /** 692 * validate thumb index 693 */ 694 function validateThumbIndex(thumbIndex){ 695 696 if(thumbIndex < 0 || thumbIndex >= g_temp.numThumbs){ 697 throw new Error("Thumb not exists: " + thumbIndex); 698 return(false); 699 } 700 701 return(true); 702 } 703 704 705 /** 706 * 707 * validate that the pane index exists 708 */ 709 function validatePaneIndex(paneIndex){ 710 711 if(paneIndex >= g_temp.numPanes || paneIndex < 0){ 712 throw new Error("Pane " + index + " doesn't exists."); 713 return(false); 714 } 715 716 return(true); 717 } 718 719 /** 720 * validate inner position 721 */ 722 function validateInnerPos(pos){ 723 724 var absPos = Math.abs(pos); 725 726 if(g_temp.isNavigationVertical == false){ 727 728 if(absPos < 0 || absPos >= g_temp.innerWidth){ 729 throw new Error("wrong inner x position: " + pos); 730 return(false); 731 } 732 733 }else{ 734 735 if(absPos < 0 || absPos >= g_temp.innerHeight){ 736 throw new Error("wrong inner y position: " + pos); 737 return(false); 738 } 739 740 } 741 742 return(true); 743 } 744 745 746 747 748 /** 749 * 750 * set inner strip position 751 */ 752 function setInnerPos(pos){ 753 754 var objCss = getInnerPosObj(pos); 755 if(objCss == false) 756 return(false); 757 758 g_objInner.css(objCss); 759 } 760 761 762 /** 763 * animate inner to some position 764 */ 765 function animateInnerTo(pos){ 766 767 var objCss = getInnerPosObj(pos); 768 if(objCss == false) 769 return(false); 770 771 g_objInner.stop(true).animate(objCss ,{ 772 duration: g_options.grid_transition_duration, 773 easing: g_options.grid_transition_easing, 774 queue: false 775 }); 776 777 } 778 779 /** 780 * animate back to current pane 781 */ 782 function animateToCurrentPane(){ 783 784 var innerPos = -g_temp.arrPanes[g_temp.currentPane]; 785 animateInnerTo(innerPos); 786 } 787 788 789 790 function __________GETTERS_________(){}; 791 792 /** 793 * get inner object size according the orientation 794 */ 795 function getInnerSize(){ 796 797 if(g_temp.isNavigationVertical == true) 798 return(g_temp.innerHeight); 799 else 800 return(g_temp.innerWidth); 801 } 802 803 804 /** 805 * get pane width or height according the orientation 806 */ 807 function getPaneSize(){ 808 809 if(g_temp.isNavigationVertical == true) 810 return(g_temp.gridHeight); 811 else 812 return(g_temp.gridWidth); 813 } 814 815 816 /** 817 * get object of iner position move 818 */ 819 function getInnerPosObj(pos){ 820 821 var obj = {}; 822 if(g_temp.isNavigationVertical == true) 823 obj.top = pos + "px"; 824 else 825 obj.left = pos + "px"; 826 827 return(obj); 828 } 829 830 831 /** 832 * get mouse position according the orientation 833 */ 834 function getMousePos(event){ 835 836 var mousePos = g_functions.getMousePosition(event); 837 838 if(g_temp.isNavigationVertical == true) 839 return(mousePos.pageY); 840 else 841 return(mousePos.pageX); 842 843 } 844 845 846 /** 847 * get inner position according the orientation 848 */ 849 function getInnerPos(){ 850 851 var objSize = g_functions.getElementSize(g_objInner); 852 853 if(g_temp.isNavigationVertical == true) 854 return(objSize.top); 855 else 856 return(objSize.left); 857 858 } 859 860 /** 861 * get pane by thumb index 862 */ 863 function getPaneIndexByThumbIndex(thumbIndex){ 864 865 //validate thumb index 866 if(validateThumbIndex(thumbIndex) == false) 867 return(-1); 868 869 var numPane = Math.floor(thumbIndex / g_temp.numThumbsInPane); 870
871 return(numPane); 872 } 873 874 /** 875 * get position of some pane 876 */ 877 function getPanePosition(index){ 878 879 var pos = g_temp.arrPanes[index]; 880 return(pos); 881 } 882 883 884 /** 885 * return if passed some significant movement, for thumb click 886 */ 887 function isSignificantPassed(){ 888 889 if(g_temp.numPanes == 1) 890 return(false); 891 892 var objData = g_functions.getStoredEventData(g_temp.storedEventID); 893 894 var passedTime = objData.diffTime; 895 896 var currentInnerPos = getInnerPos(); 897 var passedDistanceAbs = Math.abs(currentInnerPos - objData.startInnerPos); 898 899 if(passedDistanceAbs > 30) 900 return(true); 901 902 if(passedDistanceAbs > 5 && passedTime > 300) 903 return(true); 904 905 return(false); 906 } 907 908 909 910 /** 911 * check if the movement that was held is valid for pane change 912 */ 913 function isMovementValidForChange(){ 914 915 var objData = g_functions.getStoredEventData(g_temp.storedEventID); 916 917 //check position, if more then half, move 918 var currentInnerPos = getInnerPos(); 919 diffPos = Math.abs(objData.startInnerPos - currentInnerPos); 920 921 var paneSize = getPaneSize(); 922 var breakSize = Math.round(paneSize * 3 / 8); 923 924 if(diffPos >= breakSize) 925 return(true); 926 927 if(objData.diffTime < 300 && diffPos > 25) 928 return(true); 929 930 return(false); 931 } 932 933 934 /** 935 * return if passed some significant movement 936 */ 937 function isApproveTileClick(){ 938 939 if(g_temp.numPanes == 1) 940 return(true); 941 942 var isApprove = g_functions.isApproveStoredEventClick(g_temp.storedEventID, g_temp.isNavigationVertical); 943 944 return(isApprove); 945 } 946 947 948 function __________EVENTS_______(){}; 949 950 951 /** 952 * on thumb click event 953 */ 954 function onThumbClick(event){ 955 956 //event.preventDefault(); 957 if(isSignificantPassed() == true) 958 return(true); 959 960 //run select item operation 961 var objThumb = jQuery(this); 962 var objItem = g_thumbs.getItemByThumb(objThumb); 963 964 g_gallery.selectItem(objItem); 965 } 966 967 968 /** 969 * on touch start 970 */ 971 function onTouchStart(event){ 972 973 if(g_temp.numPanes == 1) 974 return(true); 975 976 if(g_temp.touchActive == true) 977 return(true); 978 979 if(g_temp.isTilesMode == false) 980 event.preventDefault(); 981 982 g_temp.touchActive = true; 983 984 var addData = { 985 startInnerPos: getInnerPos() 986 }; 987 988 g_functions.storeEventData(event, g_temp.storedEventID, addData); 989 990 } 991 992 993 /** 994 * handle scroll top, return if scroll mode or not 995 */ 996 function handleScrollTop(){ 997 998 if(g_options.grid_vertical_scroll_ondrag == false) 999 return(false); 1000 1001 if(g_temp.isNavigationVertical == true) 1002 return(false); 1003 1004 var scrollDir = g_functions.handleScrollTop(g_temp.storedEventID); 1005 1006 if(scrollDir === "vert") 1007 return(true); 1008 1009 return(false); 1010 } 1011 1012 1013 /** 1014 * on touch move 1015 */ 1016 function onTouchMove(event){ 1017 1018 if(g_temp.touchActive == false) 1019 return(true); 1020 1021 event.preventDefault(); 1022 1023 g_functions.updateStoredEventData(event, g_temp.storedEventID); 1024 1025 var objData = g_functions.getStoredEventData(g_temp.storedEventID, g_temp.isNavigationVertical); 1026 1027 //check if was vertical scroll 1028 var isScroll = handleScrollTop(); 1029 if(isScroll) 1030 return(true); 1031 1032 1033 var diff = objData.diffMousePos; 1034 var innerPos = objData.startInnerPos + diff; 1035 var direction = (diff > 0) ? "prev":"next"; 1036 var lastPaneSize = g_temp.arrPanes[g_temp.numPanes-1]; 1037 1038 //slow down when off limits 1039 if(g_options.grid_carousel == false && innerPos > 0 && direction == "prev"){ 1040 innerPos = innerPos / 3; 1041 } 1042 1043 //debugLine({lastSize:lastPaneSize,innerPos: innerPos}); 1044 1045 if(g_options.grid_carousel == false && innerPos < -lastPaneSize && direction == "next"){ 1046 innerPos = objData.startInnerPos + diff / 3; 1047 } 1048 1049 setInnerPos(innerPos); 1050 1051 } 1052 1053 1054 /** 1055 * on touch end 1056 * change panes or return to current pane 1057 */ 1058 function onTouchEnd(event){ 1059 1060 if(g_temp.touchActive == false) 1061 return(true); 1062 1063 g_functions.updateStoredEventData(event, g_temp.storedEventID); 1064 var objData = g_functions.getStoredEventData(g_temp.storedEventID, g_temp.isNavigationVertical); 1065 1066 //event.preventDefault(); 1067 g_temp.touchActive = false; 1068 1069 if(isMovementValidForChange() == false){ 1070 animateToCurrentPane(); 1071 return(true); 1072 } 1073 1074 //move pane or return back 1075 var innerPos = getInnerPos(); 1076 var diff = innerPos - objData.startInnerPos; 1077 var direction = (diff > 0) ? "prev":"next"; 1078 1079 if(direction == "next"){ 1080 1081 if(g_options.grid_carousel == false && t.isLastPane()) 1082 animateToCurrentPane(); 1083 else 1084 t.nextPane(); 1085 } 1086 else{ 1087 1088 if(g_options.grid_carousel == false && t.isFirstPane()){ 1089 animateToCurrentPane(); 1090 } 1091 else 1092 t.prevPane(); 1093 } 1094 1095 } 1096 1097 1098 /** 1099 * on item change 1100 */ 1101 function onItemChange(){ 1102 1103 var objItem = g_gallery.getSelectedItem(); 1104 g_thumbs.setThumbSelected(objItem.objThumbWrapper); 1105 1106 scrollToThumb(objItem.index); 1107 1108 } 1109 1110 1111 /** 1112 * init panel events 1113 */ 1114 function initEvents(){ 1115 1116 if(g_temp.isTilesMode == false){ 1117 1118 g_thumbs.initEvents(); 1119 var objThumbs = g_objGrid.find(".ug-thumb-wrapper"); 1120 objThumbs.on("click touchend",onThumbClick); 1121 1122 g_objGallery.on(g_gallery.events.ITEM_CHANGE, onItemChange); 1123 1124 }else{ 1125 g_tilesDesign.initEvents(); 1126 } 1127 1128 //touch drag events 1129
1130 //slider mouse down - drag start 1131 g_objGrid.bind("mousedown touchstart",onTouchStart); 1132 1133 //on body move 1134 jQuery("body").bind("mousemove touchmove",onTouchMove); 1135 1136 //on body mouse up - drag end 1137 jQuery(window).add("body").bind("mouseup touchend", onTouchEnd); 1138 1139 } 1140 1141 1142 /** 1143 * destroy the events 1144 */ 1145 this.destroy = function(){ 1146 1147 if(g_temp.isTilesMode == false){ 1148 1149 var objThumbs = g_objGrid.find(".ug-thumb-wrapper"); 1150 objThumbs.off("click"); 1151 objThumbs.off("touchend"); 1152 g_objGallery.on(g_gallery.events.ITEM_CHANGE); 1153 g_thumbs.destroy(); 1154 1155 }else{ 1156 g_tilesDesign.destroy(); 1157 } 1158 1159 g_objGrid.unbind("mousedown"); 1160 g_objGrid.unbind("touchstart"); 1161 jQuery("body").unbind("mousemove"); 1162 jQuery("body").unbind("touchmove"); 1163 1164 jQuery(window).add("body").unbind("touchend"); 1165 jQuery(window).add("body").unbind("mouseup"); 1166 1167 g_objThis.off(t.events.PANE_CHANGE); 1168 1169 } 1170 1171 1172 1173 this.__________EXTERNAL_GENERAL_________ = function(){}; 1174 1175 /** 1176 * set the thumb unselected state 1177 */ 1178 this.setThumbUnselected = function(objThumbWrapper){ 1179 1180 g_thumbs.setThumbUnselected(objThumbWrapper); 1181 1182 } 1183 1184 /** 1185 * check if thmb item visible, means inside the visible part of the inner strip 1186 */ 1187 this.isItemThumbVisible = function(objItem){ 1188 var itemIndex = objItem.index; 1189 var paneIndex = getPaneIndexByThumbIndex(itemIndex); 1190 1191 if(paneIndex == g_temp.currentPane) 1192 return(true); 1193 1194 return(false); 1195 } 1196 1197 1198 this.__________EXTERNAL_API_________ = function(){}; 1199 1200 /** 1201 * get estimation of number of panes by the height of the grid. 1202 */ 1203 this.getNumPanesEstimationByHeight = function(gridHeight){ 1204 1205 if(g_temp.isTilesMode == true){ 1206 1207 var thumbHeight = g_options.tile_height; 1208 1209 }else{ 1210 var thumbsOptions = g_thumbs.getOptions(); 1211 var thumbHeight = thumbsOptions.thumb_height; 1212 } 1213 1214 var numThumbs = g_thumbs.getNumThumbs(); 1215 var numRows = Math.ceil(numThumbs / g_options.grid_num_cols); 1216 1217 var totalHeight = numRows * thumbHeight + (numRows-1) * g_temp.spaceBetweenRows; 1218 1219 var numPanes = Math.ceil(totalHeight / gridHeight); 1220 1221 return(numPanes); 1222 } 1223 1224 /** 1225 * get estimation of number of panes by the width of the grid. 1226 */ 1227 this.getNumPanesEstimationByWidth = function(gridWidth){ 1228 1229 if(g_temp.isTilesMode){ 1230 var thumbWidth = g_options.tile_width; 1231 }else{ 1232 var thumbsOptions = g_thumbs.getOptions(); 1233 var thumbWidth = thumbsOptions.thumb_width; 1234 } 1235 1236 var numThumbs = g_thumbs.getNumThumbs(); 1237 var numCols = Math.ceil(numThumbs / g_options.grid_num_rows); 1238 1239 var totalWidth = numCols * thumbWidth + (numCols-1) * g_temp.spaceBetweenCols; 1240 1241 var numPanes = Math.ceil(totalWidth / gridWidth); 1242 1243 return(numPanes); 1244 } 1245 1246 1247 /** 1248 * get height estimation by width, works only in tiles mode 1249 */ 1250 this.getHeightEstimationByWidth = function(width){ 1251 1252 if(g_temp.isTilesMode == false) 1253 throw new Error("This function works only with tiles mode"); 1254 1255 var numThumbs = g_thumbs.getNumThumbs(); 1256 var numCols = g_functions.getNumItemsInSpace(width, g_options.tile_width, g_temp.spaceBetweenCols); 1257 var numRows = Math.ceil(numThumbs / numCols); 1258 1259 if(numRows > g_options.grid_num_rows) 1260 numRows = g_options.grid_num_rows; 1261 1262 var gridHeight = g_functions.getSpaceByNumItems(numRows, g_options.tile_height, g_temp.spaceBetweenRows); 1263 gridHeight += g_options.grid_padding * 2; 1264 1265 return(gridHeight); 1266 } 1267 1268 /** 1269 * get the grid element 1270 */ 1271 this.getElement = function(){ 1272 return(g_objGrid); 1273 } 1274 1275 /** 1276 * get element size and position 1277 */ 1278 this.getSize = function(){ 1279 1280 var objSize = g_functions.getElementSize(g_objGrid); 1281 return(objSize); 1282 1283 } 1284 1285 /** 1286 * get number of panes 1287 */ 1288 this.getNumPanes = function(){ 1289 1290 return(g_temp.numPanes); 1291 } 1292 1293 /** 1294 * get if the current pane is first 1295 */ 1296 this.isFirstPane = function(){ 1297 1298 if(g_temp.currentPane == 0) 1299 return(true); 1300 1301 return(false); 1302 } 1303 1304 1305 /** 1306 * get if the current pane is last 1307 */ 1308 this.isLastPane = function(){ 1309 1310 if(g_temp.currentPane == (g_temp.numPanes -1) ) 1311 return(true); 1312 1313 return(false); 1314 } 1315 1316 1317 /** 1318 * get pane number, and num panes 1319 */ 1320 this.getPaneInfo = function(){ 1321 1322 var obj = { 1323 pane: g_temp.currentPane, 1324 total: g_temp.numPanes 1325 }; 1326 1327 return(obj); 1328 } 1329 1330 1331 /** 1332 * get current pane 1333 */ 1334 this.getPane = function(){ 1335 1336 return(g_temp.currentPane); 1337 } 1338 1339 1340 /** 1341 * set grid width (horizontal type) 1342 */ 1343 this.setWidth = function(gridWidth){ 1344 g_temp.gridWidth = gridWidth; 1345 g_temp.isHorizontal = true; 1346 } 1347 1348 /** 1349 * set max width, the width will be corrected by the number of items 1350 * set vertical type 1351 */ 1352 this.setMaxWidth = function(maxWidth){ 1353 g_temp.gridWidth = maxWidth; 1354 g_temp.isMaxWidth = true; 1355 g_temp.isHorizontal = true; 1356 } 1357 1358 1359 /** 1360 * set grid height (vertical type) 1361 */ 1362 this.setHeight = function(gridHeight){ 1363 g_temp.gridHeight = gridHeight; 1364 g_temp.isHorizontal = false;
1365 1366 } 1367 1368 /** 1369 * set max height, the height will be corrected by the number of items 1370 * set the vertical type 1371 */ 1372 this.setMaxHeight = function(maxHeight){ 1373 g_temp.gridHeight = maxHeight; 1374 g_temp.isMaxHeight = true; 1375 g_temp.isHorizontal = false; 1376 } 1377 1378 1379 /** 1380 * goto some pane 1381 * force skip current pane checks 1382 */ 1383 this.gotoPane = function(index, fromWhere){ 1384 1385 if(validatePaneIndex(index) == false) 1386 return(false); 1387 1388 if(index == g_temp.currentPane) 1389 return(false); 1390 1391 var innerPos = -g_temp.arrPanes[index]; 1392 1393 g_temp.currentPane = index; 1394 animateInnerTo(innerPos); 1395 1396 //trigger pane change event 1397 g_objThis.trigger(t.events.PANE_CHANGE, index); 1398 } 1399 1400 1401 /** 1402 * foreward to the next pane 1403 */ 1404 this.nextPane = function(){ 1405 1406 var nextPaneIndex = g_temp.currentPane+1; 1407 1408 if(nextPaneIndex >= g_temp.numPanes){ 1409 1410 if(g_options.grid_carousel == false) 1411 return(true); 1412 1413 nextPaneIndex = 0; 1414 } 1415 1416 t.gotoPane(nextPaneIndex, "next"); 1417 } 1418 1419 1420 /** 1421 * foreward to the next pane 1422 */ 1423 this.prevPane = function(){ 1424 1425 var prevPaneIndex = g_temp.currentPane-1; 1426 if(prevPaneIndex < 0){ 1427 prevPaneIndex = g_temp.numPanes-1; 1428 1429 if(g_options.grid_carousel == false) 1430 return(false); 1431 } 1432 1433 t.gotoPane(prevPaneIndex, "prev"); 1434 } 1435 1436 1437 /** 1438 * set next pane button 1439 */ 1440 this.attachNextPaneButton = function(objButton){ 1441 1442 g_functions.setButtonOnClick(objButton, t.nextPane); 1443 1444 if(g_options.grid_carousel == true) 1445 return(true); 1446 1447 if(t.isLastPane()) 1448 objButton.addClass("ug-button-disabled"); 1449 1450 //set disabled button class if first pane 1451 g_objThis.on(t.events.PANE_CHANGE, function(){ 1452 1453 if(t.isLastPane()) 1454 objButton.addClass("ug-button-disabled"); 1455 else 1456 objButton.removeClass("ug-button-disabled"); 1457 1458 }); 1459 1460 } 1461 1462 1463 /** 1464 * set prev pane button 1465 */ 1466 this.attachPrevPaneButton = function(objButton){ 1467 1468 g_functions.setButtonOnClick(objButton, t.prevPane); 1469 1470 if(g_options.grid_carousel == true) 1471 return(true); 1472 1473 if(t.isFirstPane()) 1474 objButton.addClass("ug-button-disabled"); 1475 1476 //set disabled button class if first pane 1477 g_objThis.on(t.events.PANE_CHANGE, function(){ 1478 1479 if(t.isFirstPane()) 1480 objButton.addClass("ug-button-disabled"); 1481 else 1482 objButton.removeClass("ug-button-disabled"); 1483 1484 }); 1485 1486 } 1487 1488 1489 /** 1490 * attach bullets object 1491 */ 1492 this.attachBullets = function(objBullets){ 1493 1494 objBullets.setActive(g_temp.currentPane); 1495 1496 jQuery(objBullets).on(objBullets.events.BULLET_CLICK, function(data, numBullet){ 1497 t.gotoPane(numBullet, "theme"); 1498 objBullets.setActive(numBullet); 1499 }); 1500 1501 jQuery(t).on(t.events.PANE_CHANGE, function(data, numPane){ 1502 objBullets.setActive(numPane); 1503 }); 1504 1505 } 1506 1507 1508 /** 1509 * get tile design object 1510 */ 1511 this.getObjTileDesign = function(){ 1512 return g_tilesDesign; 1513 } 1514 1515 1516 /** 1517 * init function 1518 */ 1519 this.init = function(gallery, customOptions, isTilesMode){ 1520 1521 init(gallery, customOptions, isTilesMode); 1522 } 1523 1524 1525 1526 /** 1527 * set html and properties 1528 */ 1529 this.run = function(){ 1530 run(); 1531 } 1532 1533 1534 /** 1535 * set html 1536 */ 1537 this.setHtml = function(parentContainer){ 1538 1539 setHtml(parentContainer); 1540 } 1541 1542} 1543 1544
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.