1/** -------------- TextPanel class ---------------------*/ 2 3function UGTextPanel(){ 4 5 var t = this; 6 var g_objPanel, g_objParent, g_objTitle, g_objDesc; 7 var g_objBG, g_objTextWrapper, g_gallery; 8 var g_functions = new UGFunctions(), g_optionsPrefix = ""; 9 10 var g_options = { 11 textpanel_align:"bottom", //(top , bottom), textpanel align according the parent 12 textpanel_margin:0, //margin from the textpanel position according the textpanel_align 13 textpanel_text_valign:"middle", //middle, top, bottom - text vertical align 14 textpanel_padding_top:10, //textpanel padding top 15 textpanel_padding_bottom:10, //textpanel padding bottom 16 textpanel_height: null, //textpanel height. if null it will be set dynamically 17 textpanel_padding_title_description: 5, //the space between the title and the description 18 textpanel_padding_right: 11, //cut some space for text from right 19 textpanel_padding_left: 11, //cut some space for text from left 20 textpanel_fade_duration: 200, //the fade duration of textpanel appear 21 textpanel_enable_title: true, //enable the title text 22 textpanel_enable_description: true, //enable the description text 23 textpanel_enable_bg: true, //enable the textpanel background 24 textpanel_bg_color:"#000000", //textpanel background color 25 textpanel_bg_opacity: 0.4, //textpanel background opacity 26 27 textpanel_title_color:null, //textpanel title color. if null - take from css 28 textpanel_title_font_family:null, //textpanel title font family. if null - take from css 29 textpanel_title_text_align:null, //textpanel title text align. if null - take from css 30 textpanel_title_font_size:null, //textpanel title font size. if null - take from css 31 textpanel_title_bold:null, //textpanel title bold. if null - take from css 32 textpanel_css_title:{}, //textpanel additional css of the title 33 34 textpanel_desc_color:null, //textpanel description font family. if null - take from css 35 textpanel_desc_font_family:null, //textpanel description font family. if null - take from css 36 textpanel_desc_text_align:null, //textpanel description text align. if null - take from css 37 textpanel_desc_font_size:null, //textpanel description font size. if null - take from css 38 textpanel_desc_bold:null, //textpanel description bold. if null - take from css 39 textpanel_css_description:{}, //textpanel additional css of the description 40 41 textpanel_desc_style_as_title: false, //set that the description style will be as title 42 43 textpanel_bg_css:{} //textpanel background css 44 }; 45 46 var g_temp = { 47 isFirstTime: true, 48 setInternalHeight: true, //flag if set internal height or not 49 lastTitleBottom: 0, 50 lastDescHeight: 0 51 }; 52 53 54 /** 55 * position elements from top 56 */ 57 function positionElementsTop(animateHeight, startY){ 58 59 if(!startY) 60 var startY = g_options.textpanel_padding_top; 61 62 //place title 63 var maxy = startY; 64 65 //place title 66 if(g_objTitle){ 67 var titleY = maxy; 68 g_functions.placeElement(g_objTitle, 0, titleY); 69 70 var isTitleVisible = g_objTitle.is(":visible"); 71 if(isTitleVisible == true){ 72 var objTitleSize = g_functions.getElementSize(g_objTitle); 73 74 var maxy = objTitleSize.bottom; 75 if(maxy > 0) 76 g_temp.lastTitleBottom = maxy; 77 }else{ 78 var maxy = 20; //get last or assumed maxy 79 80 if(g_temp.lastTitleBottom > 0) 81 maxy = g_temp.lastTitleBottom; 82 } 83 84 } 85 86 87 //place description 88 var textDesc = ""; 89 if(g_objDesc) 90 textDesc = jQuery.trim(g_objDesc.text()); 91 92 if(textDesc != ""){ 93 94 var descY = maxy; 95 96 if(g_objTitle) 97 descY += g_options.textpanel_padding_title_description; 98 99 g_functions.placeElement(g_objDesc, 0, descY); 100 101 var isVisible = jQuery(g_objDesc).is(":visible"); 102 103 if(isVisible == true){ 104 var objDescSize = g_functions.getElementSize(g_objDesc); 105 maxy = objDescSize.bottom; 106 107 if(objDescSize.height > 0) 108 g_temp.lastDescHeight = objDescSize.height; 109 110 }else{ 111 var descHeight = 16; //take from last saved 112 if(g_temp.lastDescHeight > 0) 113 descHeight = g_temp.lastDescHeight; 114 115 maxy = descY + descHeight; 116 } 117 118 } 119 120 121 //change panel height 122 if(!g_options.textpanel_height && g_temp.setInternalHeight == true){ 123 124 var panelHeight = maxy + g_options.textpanel_padding_bottom; 125 126 setHeight(panelHeight, animateHeight); 127 } 128 129 } 130 131 /** 132 * get total text and description height 133 */ 134 function getTotalTextHeight(){ 135 var totalHeight = 0; 136 137 if(g_objTitle) 138 totalHeight += g_objTitle.outerHeight(); 139 140 if(g_objDesc){ 141 var textDesc = ""; 142 if(g_objDesc) 143 textDesc = jQuery.trim(g_objDesc.text()); 144 145 if(textDesc != ""){ 146 if(g_objTitle) 147 totalHeight += g_options.textpanel_padding_title_description; 148 149 totalHeight += g_objDesc.outerHeight(); 150 } 151 152 } 153 154 155 return(totalHeight); 156 } 157 158 159 /** 160 * position elements to center 161 */ 162 function positionElementsMiddle(){ 163
164 var totalTextHeight = getTotalTextHeight(); 165 var startY = (g_objTextWrapper.height() - totalTextHeight) / 2; 166 167 positionElementsTop(false, startY); 168 } 169 170 171 /** 172 * position elements to bottom 173 */ 174 function positionElementBottom(){ 175 176 var totalTextHeight = getTotalTextHeight(); 177 var startY = g_objTextWrapper.height() - totalTextHeight - g_options.textpanel_padding_bottom; 178 179 positionElementsTop(false, startY); 180 } 181 182 183 /** 184 * position elements inside the panel 185 */ 186 this.positionElements = function(animateHeight){ 187 188 //if(g_objPanel.is(":visible") == false) 189 //trace("the text panel is hidden. can't position elements") 190 191 //if height not set, position only top 192 if(!g_options.textpanel_height || g_options.textpanel_text_valign == "top"){ 193 positionElementsTop(animateHeight); 194 return(false); 195 } 196 197 switch(g_options.textpanel_text_valign){ 198 default: 199 case "top": 200 positionElementsTop(false); //no animation in this case 201 break; 202 case "bottom": 203 positionElementBottom(); 204 break; 205 case "center": 206 case "middle": 207 positionElementsMiddle(); 208 break; 209 } 210 211 } 212 213 214 /** 215 * set new panel height 216 */ 217 function setHeight(height, animateHeight){ 218 219 if(!animateHeight) 220 var animateHeight = false; 221 222 if(animateHeight == true){ 223 224 if(g_objBG){ 225 226 //avoid background jumps 227 var currentHeight = g_objBG.height(); 228 if(height > currentHeight) 229 g_objBG.height(height); 230 } 231 232 var objCss = {height: height+"px"}; 233 g_objPanel.add(g_objTextWrapper).animate(objCss, g_options.textpanel_fade_duration); 234 235 }else{ 236 237 if(g_objBG) 238 g_objBG.height(height); 239 240 g_objPanel.add(g_objTextWrapper).height(height); 241 } 242 243 } 244 245 246 247 248 /** 249 * init the panel 250 */ 251 this.init = function(objGallery, customOptions, optionsPrefix){ 252 253 g_gallery = objGallery; 254 255 //change options by prefix 256 if(optionsPrefix){ 257 g_optionsPrefix = optionsPrefix; 258 customOptions = g_functions.convertCustomPrefixOptions(customOptions,g_optionsPrefix,"textpanel"); 259 260 } 261 262 if(customOptions) 263 g_options = jQuery.extend(g_options, customOptions); 264 265 //validation: 266 if(g_options.textpanel_enable_title == false && g_options.textpanel_enable_description == false) 267 throw new Error("Textpanel Error: The title or description must be enabled"); 268 269 if(g_options.textpanel_height && g_options.textpanel_height < 0) 270 g_options.textpanel_height = null; 271 272 //copy desc style from title 273 if(g_options.textpanel_desc_style_as_title == true){ 274 if(!g_options.textpanel_desc_color) 275 g_options.textpanel_desc_color = g_options.textpanel_title_color; 276 277 if(!g_options.textpanel_desc_bold) 278 g_options.textpanel_desc_bold = g_options.textpanel_title_bold; 279 280 if(!g_options.textpanel_desc_font_family) 281 g_options.textpanel_desc_font_family = g_options.textpanel_title_font_family; 282 283 if(!g_options.textpanel_desc_font_size) 284 g_options.textpanel_desc_font_size = g_options.textpanel_title_font_size; 285 286 if(!g_options.textpanel_desc_text_align) 287 g_options.textpanel_desc_text_align = g_options.textpanel_title_text_align; 288 } 289 290 } 291 292 293 /** 294 * append the bullets html to some parent 295 */ 296 this.appendHTML = function(objParent, addClass){ 297 g_objParent = objParent; 298 299 if(addClass){ 300 addClass = " "+addClass; 301 }else 302 addClass = ""; 303 304 var html = "<div class='ug-textpanel"+addClass+"'>"; 305 306 if(g_options.textpanel_enable_bg == true) 307 html += "<div class='ug-textpanel-bg"+addClass+"'></div>"; 308 309 html += "<div class='ug-textpanel-textwrapper"+addClass+"'>"; 310 311 if(g_options.textpanel_enable_title == true) 312 html += "<div class='ug-textpanel-title"+addClass+"'></div>"; 313 314 if(g_options.textpanel_enable_description == true) 315 html += "<div class='ug-textpanel-description"+addClass+"'></div>"; 316 317 html += "</div></div>"; 318 319 objParent.append(html); 320 321 g_objPanel = objParent.children(".ug-textpanel"); 322 g_objTextWrapper = g_objPanel.children(".ug-textpanel-textwrapper"); 323 324 setCss(); 325 326 } 327 328 329 /** 330 * set panel css according the options 331 */ 332 function setCss(){ 333 334 //set background css 335 if(g_options.textpanel_enable_bg == true){ 336 g_objBG = g_objPanel.children(".ug-textpanel-bg"); 337 g_objBG.fadeTo(0,g_options.textpanel_bg_opacity); 338 339 var objCssBG = {"background-color":g_options.textpanel_bg_color}; 340 objCssBG = jQuery.extend(objCssBG, g_options.textpanel_bg_css); 341 342 g_objBG.css(objCssBG); 343 } 344 345 346 //set title css from options 347 if(g_options.textpanel_enable_title == true){ 348 g_objTitle = g_objTextWrapper.children(".ug-textpanel-title"); 349 var objCssTitle = {}; 350 351 if(g_options.textpanel_title_color !== null) 352 objCssTitle["color"] = g_options.textpanel_title_color; 353 354 if(g_options.textpanel_title_font_family !== null) 355 objCssTitle["font-family"] = g_options.textpanel_title_font_family; 356 357 if(g_options.textpanel_title_text_align !== null) 358 objCssTitle["text-align"] = g_options.textpanel_title_text_align; 359 360 if(g_options.textpanel_title_font_size !== null) 361 objCssTitle["font-size"] = g_options.textpanel_title_font_size+"px"; 362 363 if(g_options.textpanel_title_bold !== null){ 364 365 if(g_options.textpanel_title_bold === true) 366 objCssTitle["font-weight"] = "bold"; 367 else 368 objCssTitle["font-weight"] = "normal"; 369 370 } 371 372 //set additional css 373 if(g_options.textpanel_css_title) 374 objCssTitle = jQuery.extend(objCssTitle, g_options.textpanel_css_title); 375 376 g_objTitle.css(objCssTitle); 377 } 378 379 //set description css 380 if(g_options.textpanel_enable_description == true){ 381 g_objDesc = g_objTextWrapper.children(".ug-textpanel-description"); 382 383 var objCssDesc = {}; 384 385 if(g_options.textpanel_desc_color !== null) 386 objCssDesc["color"] = g_options.textpanel_desc_color; 387 388 if(g_options.textpanel_desc_font_family !== null) 389 objCssDesc["font-family"] = g_options.textpanel_desc_font_family; 390 391 if(g_options.textpanel_desc_text_align !== null) 392 objCssDesc["text-align"] = g_options.textpanel_desc_text_align; 393 394 if(g_options.textpanel_desc_font_size !== null) 395 objCssDesc["font-size"] = g_options.textpanel_desc_font_size+"px"; 396 397 if(g_options.textpanel_desc_bold !== null){ 398 399 if(g_options.textpanel_desc_bold === true) 400 objCssDesc["font-weight"] = "bold"; 401 else 402 objCssDesc["font-weight"] = "normal"; 403 404 } 405 406 //set additional css 407 if(g_options.textpanel_css_title) 408 objCssDesc = jQuery.extend(objCssDesc, g_options.textpanel_css_description); 409 410 g_objDesc.css(objCssDesc); 411 } 412 413 } 414 415 /** 416 * on item change, set the text 417 */ 418 function onItemChange(){ 419 var objItem = g_gallery.getSelectedItem(); 420 t.setText(objItem.title, objItem.description); 421 } 422 423 424 /** 425 * init events 426 */ 427 function initEvents(){ 428 429 //on item change, set the text in the slider. 430 jQuery(g_gallery).on(g_gallery.events.ITEM_CHANGE, onItemChange); 431 } 432 433 434 /** 435 * destroy the events 436 */ 437 this.destroy = function(){ 438 jQuery(g_gallery).off(g_gallery.events.ITEM_CHANGE); 439 } 440 441 /** 442 * run the text panel 443 */ 444 this.run = function(){ 445 446 t.setSizeByParent(); 447 448 initEvents(); 449 } 450 451 /** 452 * set panel size 453 */ 454 this.setPanelSize = function(panelWidth, panelHeight){ 455 456 g_temp.setInternalHeight = true; 457 458 if(!panelHeight) 459 var panelHeight = 80; //some default number 460 else 461 g_temp.setInternalHeight = false;
462 463 if(g_options.textpanel_height) 464 panelHeight = g_options.textpanel_height; 465 466 g_objPanel.width(panelWidth); 467 g_objPanel.height(panelHeight); 468 469 //set background size 470 if(g_objBG){ 471 g_objBG.width(panelWidth); 472 g_objBG.height(panelHeight); 473 } 474 475 //set textwrapper size and position 476 var textWrapperWidth = panelWidth - g_options.textpanel_padding_left - g_options.textpanel_padding_right; 477 var textWrapperLeft = g_options.textpanel_padding_left; 478 479 g_functions.setElementSizeAndPosition(g_objTextWrapper, textWrapperLeft, 0, textWrapperWidth, panelHeight); 480 481 //set text width 482 if(g_objTitle) 483 g_objTitle.width(textWrapperWidth); 484 485 //set description height 486 if(g_objDesc) 487 g_objDesc.width(textWrapperWidth); 488 489 if(g_temp.isFirstTime == false) 490 t.positionElements(false); 491 } 492 493 494 /** 495 * set size by parent. the height is set to default meanwhile 496 */ 497 this.setSizeByParent = function(){ 498 499 var objSize = g_functions.getElementSize(g_objParent); 500 t.setPanelSize(objSize.width); 501 } 502 503 /** 504 * set plain sext without other manipulations 505 */ 506 this.setTextPlain = function(title, description){ 507 508 if(g_objTitle) 509 g_objTitle.html(title); 510 511 if(g_objDesc) 512 g_objDesc.html(description); 513 514 } 515 516 517 /** 518 * set html text 519 */ 520 this.setText = function(title, description){ 521 522 if(g_temp.isFirstTime == true){ 523 524 t.setTextPlain(title, description); 525 526 g_temp.isFirstTime = false; 527 528 t.positionElements(false); 529 530 }else{ //width animation 531 532 g_objTextWrapper.stop().fadeTo(g_options.textpanel_fade_duration,0,function(){ 533 534 t.setTextPlain(title, description); 535 536 t.positionElements(true); 537 538 jQuery(this).fadeTo(g_options.textpanel_fade_duration,1); 539 }); 540 541 } 542 543 } 544 545 546 547 548 /** 549 * position the panel 550 */ 551 this.positionPanel = function(customTop, customLeft){ 552 553 var objCss = {}; 554 555 if(customTop !== undefined && customTop !== null){ 556 objCss.top = customTop; 557 objCss.bottom = "auto"; 558 }else{ 559 560 switch(g_options.textpanel_align){ 561 case "top": 562 objCss.top = g_options.textpanel_margin + "px"; 563 break; 564 case "bottom": 565 objCss.top = "auto"; 566 objCss.bottom = g_options.textpanel_margin + "px"; 567 break; 568 case "middle": 569 objCss.top = g_functions.getElementRelativePos(g_objPanel, "middle", g_options.textpanel_margin); 570 break; 571 } 572 573 } 574 575 if(customLeft !== undefined && customLeft !== null) 576 objCss.left = customLeft; 577 578 g_objPanel.css(objCss); 579 } 580 581 582 /** 583 * set custom options 584 */ 585 this.setOptions = function(objOptions){ 586 587 if(g_optionsPrefix) 588 objOptions = g_functions.convertCustomPrefixOptions(objOptions, g_optionsPrefix, "textpanel"); 589 590 g_options = jQuery.extend(g_options, objOptions); 591 592 } 593 594 595 /** 596 * get html element 597 */ 598 this.getElement = function(){ 599 600 return(g_objPanel); 601 } 602 603 /** 604 * get element size 605 */ 606 this.getSize = function(){ 607 608 var objSize = g_functions.getElementSize(g_objPanel); 609 return(objSize); 610 } 611 612 613 /** 614 * refresh panel size, position and contents 615 */ 616 this.refresh = function(toShow, noPosition, panelWidth, panelHeight){ 617 618 setCss(); 619 620 if(!panelWidth) 621 t.setSizeByParent(); 622 else 623 t.setPanelSize(panelWidth, panelHeight); 624 625 t.positionElements(false); 626 627 if(noPosition !== true) 628 t.positionPanel(); 629 630 if(toShow === true) 631 t.show(); 632 } 633 634 635 /** 636 * hide the panel 637 */ 638 this.hide = function(){ 639 640 g_objPanel.hide(); 641 } 642 643 /** 644 * show the panel 645 */ 646 this.show = function(){ 647 g_objPanel.show(); 648 } 649 650 /** 651 * get options 652 */ 653 this.getOptions = function(){ 654 return(g_options); 655 } 656 657 /** 658 * get text panel option 659 */ 660 this.getOption = function(optionName){ 661 662 if(g_options.hasOwnProperty(optionName) == false) 663 return(null); 664 665 return(g_options[optionName]); 666 } 667 668 669} 670 671/** -------------- UGZoomButtonsPanel class ---------------------*/ 672 673/** 674 * zoom buttons panel class 675 */ 676function UGZoomButtonsPanel(){ 677 678 var t = this; 679 var g_objPanel, g_objParent, g_objButtonPlus, g_objButtonMinus, g_objButtonReturn; 680 var g_slider = new UGSlider; 681 var g_functions = new UGFunctions(); 682 683 var g_options = { 684 slider_zoompanel_skin: "" //skin of the zoom panel, if empty inherit from gallery skin 685 }; 686 687 var g_temp = { 688 689 }; 690 691 692 /** 693 * init the panel 694 */ 695 this.init = function(objSlider, customOptions){ 696 697 g_slider = objSlider; 698 699 if(customOptions) 700 g_options = jQuery.extend(g_options, customOptions); 701 } 702 703 704 /** 705 * append the bullets html to some parent 706 */ 707 this.appendHTML = function(objParent){ 708 g_objParent = objParent; 709 710 var html = "<div class='ug-slider-control ug-zoompanel ug-skin-"+g_options.slider_zoompanel_skin+"'>"; 711 712 html += "<div class='ug-zoompanel-button ug-zoompanel-plus'></div>"; 713 html += "<div class='ug-zoompanel-button ug-zoompanel-minus ug-zoompanel-button-disabled'></div>"; 714 html += "<div class='ug-zoompanel-button ug-zoompanel-return ug-zoompanel-button-disabled'></div>"; 715 716 html += "</div>"; 717 718 objParent.append(html); 719 720 g_objPanel = objParent.children(".ug-zoompanel"); 721 g_objButtonPlus = g_objPanel.children(".ug-zoompanel-plus"); 722 g_objButtonMinus = g_objPanel.children(".ug-zoompanel-minus"); 723 g_objButtonReturn = g_objPanel.children(".ug-zoompanel-return"); 724 725 } 726 727 728 /** 729 * set objects - use it instead insert html 730 */ 731 this.setObjects = function(objButtonPlus, objButtonMinus, objButtonReturn){ 732
733 g_objButtonPlus = objButtonPlus; 734 g_objButtonMinus = objButtonMinus; 735 g_objButtonReturn = objButtonReturn; 736 737 if(g_objButtonMinus) 738 g_objButtonMinus.addClass("ug-zoompanel-button-disabled"); 739 740 if(g_objButtonReturn) 741 g_objButtonReturn.addClass("ug-zoompanel-button-disabled"); 742 743 } 744 745 746 /** 747 * get buttons element 748 */ 749 this.getElement = function(){ 750 751 return(g_objPanel); 752 } 753 754 755 /** 756 * check if the button disabled 757 */ 758 function isButtonDisabled(objButton){ 759 760 if(!objButton) 761 return(true); 762 763 if(objButton.hasClass("ug-zoompanel-button-disabled")) 764 return(true); 765 766 return(false); 767 } 768 769 770 /** 771 * disable some button 772 */ 773 function disableButton(objButton){ 774 775 if(objButton) 776 objButton.addClass("ug-zoompanel-button-disabled"); 777 } 778 779 /** 780 * enable some button 781 */ 782 function enableButton(objButton){ 783 784 if(objButton) 785 objButton.removeClass("ug-zoompanel-button-disabled"); 786 } 787 788 789 /** 790 * on zoom change 791 */ 792 function onZoomChange(){ 793 794 //skip not image types 795 if(g_slider.isCurrentSlideType("image") == false) 796 return(true); 797 798 var isFit = g_slider.isCurrentSlideImageFit(); 799 800 if(isFit == true){ //if fit, disable buttons 801 802 if(isButtonDisabled(g_objButtonMinus) == false){ 803 disableButton(g_objButtonMinus); 804 disableButton(g_objButtonReturn); 805 } 806 807 }else{ //if not fit, enable minus buttons 808 809 if(isButtonDisabled(g_objButtonMinus) == true){ 810 enableButton(g_objButtonMinus); 811 enableButton(g_objButtonReturn); 812 } 813 814 } 815 816 } 817 818 /** 819 * init zoompanel events 820 */ 821 t.initEvents = function(){ 822 823 //add hover class on buttons 824 g_functions.addClassOnHover(g_objButtonPlus, "ug-button-hover"); 825 g_functions.addClassOnHover(g_objButtonMinus, "ug-button-hover"); 826 g_functions.addClassOnHover(g_objButtonReturn, "ug-button-hover"); 827 828 //set buttons click events 829 830 g_functions.setButtonOnClick(g_objButtonPlus, function(){ 831 832 if(isButtonDisabled(g_objButtonPlus) == true) 833 return(true); 834 835 g_slider.zoomIn(); 836 }); 837 838 g_functions.setButtonOnClick(g_objButtonMinus, function(){ 839 840 if(isButtonDisabled(g_objButtonMinus) == true) 841 return(true); 842 843 g_slider.zoomOut(); 844 }); 845 846 g_functions.setButtonOnClick(g_objButtonReturn, function(){ 847 848 if(isButtonDisabled(g_objButtonReturn) == true) 849 return(true); 850 851 g_slider.zoomBack(); 852 }); 853 854 //on zoom change event 855 jQuery(g_slider).on(g_slider.events.ZOOM_CHANGE,onZoomChange); 856 jQuery(g_slider).on(g_slider.events.ITEM_CHANGED,onZoomChange); 857 858 } 859 860 861} 862 863 864/** -------------- UgBullets class ---------------------*/ 865 866function UGBullets(){ 867 868 var t = this, g_numBullets = 0, g_gallery = new UniteGalleryMain(); 869 var g_objBullets, g_objParent, g_activeIndex = -1, g_bulletWidth; 870 var g_functions = new UGFunctions(); 871 872 var g_temp = { 873 isInited:false 874 }; 875 876 var g_options = { 877 bullets_skin: "", //bullets_skin: "" //skin of the bullets, if empty inherit from gallery skin 878 bullets_addclass: "", //bullets object class addition 879 bullets_space_between:-1 //set the space between bullets. If -1 then will be set default space from the skins 880 } 881 882 883 /** 884 * the events 885 */ 886 this.events = { 887 BULLET_CLICK : "bullet_click" 888 }; 889 890 /** 891 * init the bullets 892 */ 893 this.init = function(gallery, customOptions, numBullets){ 894 g_gallery = gallery; 895 896 if(numBullets) 897 g_numBullets = numBullets; 898 else 899 g_numBullets = g_gallery.getNumItems(); 900 901 g_temp.isInited = true; 902 g_options = jQuery.extend(g_options, customOptions); 903 904 if(g_options.bullets_skin == "") 905 g_options.bullets_skin = g_options.gallery_skin; 906 907 } 908 909 /** 910 * add bullets to the html 911 */ 912 function setHtmlBullets(){ 913 var html = ""; 914 915 var addHtml = ""; 916 if(g_options.bullets_space_between != -1) 917 addHtml = " style='margin-left:" + g_options.bullets_space_between + "px'"; 918 919 for(var i=0; i< g_numBullets; i++){ 920 if(i == 0) 921 html += "<div class='ug-bullet'></div>"; 922 else 923 html += "<div class='ug-bullet'"+addHtml+"></div>"; 924 } 925 926 g_objBullets.html(html); 927 928 //set bullet width value 929 if(!g_bulletWidth){
930 var objBullet = g_objBullets.find(".ug-bullet:first-child"); 931 if(objBullet.length) 932 g_bulletWidth = objBullet.width(); 933 } 934 } 935 936 /** 937 * get total bullets width 938 */ 939 this.getBulletsWidth = function(){ 940 if(g_numBullets == 0) 941 return(0); 942 943 if(!g_bulletWidth) 944 return(0); 945 946 var totalWidth = g_numBullets*g_bulletWidth+(g_numBullets-1)*g_options.bullets_space_between; 947 return(totalWidth); 948 } 949 950 951 /** 952 * append the bullets html to some parent 953 */ 954 this.appendHTML = function(objParent){ 955 g_objParent = objParent; 956 957 validateInited(); 958 var addClass = ""; 959 if(g_options.bullets_addclass != "") 960 addClass = " " + g_options.bullets_addclass; 961 962 var html = "<div class='ug-slider-control ug-bullets ug-skin-"+g_options.bullets_skin + addClass+"'>"; 963 964 html += "</div>"; 965 966 g_objBullets = jQuery(html); 967 968 objParent.append(g_objBullets); 969 970 setHtmlBullets(); 971 972 initEvents(); 973 } 974 975 976 /** 977 * update number of bullets 978 */ 979 this.updateNumBullets = function(numBullets){ 980 981 g_numBullets = numBullets; 982 setHtmlBullets(); 983 initEvents(); 984 } 985 986 987 /** 988 * 989 * on bullet click 990 */ 991 function onBulletClick(objBullet){ 992 993 //filter not active only 994 if(t.isActive(objBullet) == true) 995 return(true); 996 997 var index = objBullet.index(); 998 999 jQuery(t).trigger(t.events.BULLET_CLICK, index); 1000 } 1001 1002 1003 /** 1004 * init the bullets events 1005 * trigger bullet click event 1006 */ 1007 function initEvents(){ 1008 1009 var objBullets = g_objBullets.children(".ug-bullet"); 1010 1011 g_functions.setButtonOnClick(objBullets, onBulletClick); 1012 1013 objBullets.on("mousedown mouseup",function(event){ 1014 //event.preventDefault(); 1015 return(false); 1016 }); 1017 1018 } 1019 1020 1021 /** 1022 * get the bullets element 1023 */ 1024 this.getElement = function(){ 1025 return g_objBullets; 1026 } 1027 1028 1029 /** 1030 * set some item active 1031 */ 1032 this.setActive = function(index){ 1033 validateInited(); 1034 validateIndex(index); 1035 1036 var children = g_objBullets.children(".ug-bullet"); 1037 children.removeClass("ug-bullet-active"); 1038 1039 var bullet = jQuery(children[index]); 1040 bullet.addClass("ug-bullet-active"); 1041 1042 g_activeIndex = index; 1043 } 1044 1045 1046 /** 1047 * check if the bullet is active 1048 */ 1049 this.isActive = function(index){ 1050 validateIndex(index); 1051 1052 if(typeof index != "number") 1053 var objBullet = index; 1054 else{ 1055 var objBullet = g_objBullets.children(".ug-bullet")[index]; 1056 } 1057 1058 if(objBullet.hasClass("ug-bullet-active")) 1059 return(true); 1060 1061 return(false); 1062 } 1063 1064 1065 /** 1066 * get bullets number 1067 */ 1068 this.getNumBullets = function(){ 1069 return(g_numBullets); 1070 } 1071 1072 /** 1073 * validate bullets index 1074 */ 1075 function validateIndex(index){ 1076 if(index < 0 || index >= g_numBullets) 1077 throw new Error("wrong bullet index: " + index); 1078 } 1079 1080 1081 /** 1082 * validate that the bullets are inited 1083 */ 1084 function validateInited(){ 1085 1086 if(g_temp.isInited == true) 1087 return(true); 1088 1089 throw new Error("The bullets are not inited!"); 1090 } 1091 1092 1093 1094} 1095 1096/** -------------- UgProgressBar class ---------------------*/ 1097 1098function UGProgressBar(){ 1099 1100 var t = this, g_isInited = false; 1101 var g_percent = 0, g_objBar, g_objInner, g_functions = new UGFunctions(); 1102 1103 var g_options = { 1104 slider_progressbar_color:"#ffffff", //progress bar color 1105 slider_progressbar_opacity: 0.6, //progress bar opacity 1106 slider_progressbar_line_width: 5 //progress bar line width 1107 } 1108 1109 1110 /** 1111 * put progress pie to some wrapper 1112 */ 1113 this.put = function(g_objWrapper, userOptions){ 1114 1115 if(userOptions) 1116 g_options = jQuery.extend(g_options, userOptions); 1117 1118 g_objWrapper.append("<div class='ug-progress-bar'><div class='ug-progress-bar-inner'></div></div>"); 1119 g_objBar = g_objWrapper.children(".ug-progress-bar"); 1120 g_objInner = g_objBar.children(".ug-progress-bar-inner"); 1121 1122 //init the objects 1123 g_objInner.css("background-color", g_options.slider_progressbar_color); 1124 g_objBar.height(g_options.slider_progressbar_line_width); 1125 g_objInner.height(g_options.slider_progressbar_line_width); 1126 g_objInner.width("0%"); 1127 1128 //set opacity old way (because ie bug) 1129 var opacity = g_options.slider_progressbar_opacity; 1130 1131 var objInnerHTML = g_objInner[0]; 1132 objInnerHTML.style.opacity = opacity; 1133 objInnerHTML.style.filter = 'alpha(opacity=' + opacity*100 + ')'; 1134 } 1135 1136 1137 /** 1138 * put the pie hidden 1139 */ 1140 this.putHidden = function(g_objWrapper, userOptions){ 1141 t.put(g_objWrapper, userOptions); 1142 g_objBar.hide(); 1143 } 1144 1145 /** 1146 * get the bar object 1147 */ 1148 this.getElement = function(){ 1149 1150 return(g_objBar); 1151 } 1152 1153 /** 1154 * set progress bar size 1155 */ 1156 this.setSize = function(width){ 1157 1158 g_objBar.width(width); 1159 g_objInner.width(width); 1160 t.draw(); 1161 } 1162 1163 1164 /** 1165 * set position 1166 */ 1167 this.setPosition = function(left, top, offsetLeft, offsetTop){ 1168 1169 g_functions.placeElement(g_objBar, left, top, offsetLeft, offsetTop); 1170 } 1171 1172 1173 /** 1174 * draw the progress bar 1175 */ 1176 this.draw = function(){ 1177 var innerWidth = g_percent * 100; 1178 1179 g_objInner.width(innerWidth + "%"); 1180 } 1181 1182 1183 /** 1184 * set and draw the progress 1185 */ 1186 this.setProgress = function(percent){ 1187 1188 g_percent = g_functions.normalizePercent(percent); 1189 1190 //debugLine(g_percent, true); 1191 1192 t.draw(); 1193 } 1194 1195 /** 1196 * get type string 1197 */ 1198 this.getType = function(){ 1199 return("bar"); 1200 } 1201 1202} 1203 1204/** -------------- UgProgressPie class ---------------------*/ 1205 1206function UGProgressPie(){ 1207 1208 var t = this, g_isInited = false;
1209 var g_percent, g_objPie, g_functions = new UGFunctions(); 1210 1211 var g_options = { 1212 slider_progresspie_type_fill: false, //false is stroke, true is fill - the progress pie type, stroke of fill 1213 slider_progresspie_color1: "#B5B5B5", //the first color of the progress pie 1214 slider_progresspie_color2: "#E5E5E5", //progress pie second color 1215 slider_progresspie_stroke_width: 6, //progress pie stroke width 1216 slider_progresspie_width: 30, //progess pie width 1217 slider_progresspie_height:30 //progress pie height 1218 } 1219 1220 1221 /** 1222 * put progress pie to some wrapper 1223 */ 1224 this.put = function(g_objWrapper, userOptions){ 1225 1226 if(userOptions) 1227 g_options = jQuery.extend(g_options, userOptions); 1228 1229 g_objWrapper.append("<canvas class='ug-canvas-pie' width='"+g_options.slider_progresspie_width+"' height='"+g_options.slider_progresspie_height+"'></canvas>"); 1230 g_objPie = g_objWrapper.children(".ug-canvas-pie"); 1231 } 1232 1233 1234 /** 1235 * put the pie hidden 1236 */ 1237 this.putHidden = function(g_objWrapper, userOptions){ 1238 t.put(g_objWrapper, userOptions); 1239 draw(0.1); 1240 g_objPie.hide(); 1241 } 1242 1243 1244 /** 1245 * get jquery object 1246 */ 1247 this.getElement = function(){ 1248 return(g_objPie); 1249 } 1250 1251 /** 1252 * set position 1253 */ 1254 this.setPosition = function(left, top){ 1255 1256 g_functions.placeElement(g_objPie, left, top); 1257 1258 } 1259 1260 /** 1261 * get the height and width of the object 1262 */ 1263 this.getSize = function(){ 1264 1265 var obj = { 1266 width: g_options.slider_progresspie_width, 1267 height: g_options.slider_progresspie_height 1268 }; 1269 1270 return(obj); 1271 } 1272 1273 /** 1274 * draw the progress pie 1275 */ 1276 function draw(percent){ 1277 1278 if(!percent) 1279 var percent = 0; 1280 1281 var radius = Math.min(g_options.slider_progresspie_width, g_options.slider_progresspie_height) / 2; 1282 1283 var ctx = g_objPie[0].getContext('2d'); 1284 1285 //init the context 1286 if(g_isInited == false){ 1287 1288 g_isInited = true; 1289 1290 ctx.rotate(Math.PI*(3/2)); 1291 ctx.translate(-2 * radius,0); 1292 } 1293 1294 ctx.clearRect(0,0,g_options.slider_progresspie_width, g_options.slider_progresspie_height); 1295 1296 var centerX = g_options.slider_progresspie_width / 2; 1297 var centerY = g_options.slider_progresspie_height / 2; 1298 1299 //draw main arc 1300 var startPoint = 0; 1301 var endPoint = percent * Math.PI * 2; 1302 1303 1304 if(g_options.slider_progresspie_type_fill == true){ //fill 1305 1306 ctx.beginPath(); 1307 ctx.moveTo(centerX, centerY); 1308 ctx.arc(centerX,centerY,radius,startPoint, endPoint); 1309 ctx.lineTo(centerX, centerY); 1310 1311 ctx.fillStyle = g_options.slider_progresspie_color1; 1312 ctx.fill(); 1313 ctx.closePath(); 1314 1315 }else{ //stroke 1316 ctx.globalCompositeOperation = "source-over"; 1317 1318 ctx.beginPath(); 1319 ctx.moveTo(centerX, centerY); 1320 ctx.arc(centerX,centerY,radius,startPoint, endPoint); 1321 ctx.lineTo(centerX, centerY); 1322 1323 ctx.fillStyle = g_options.slider_progresspie_color1; 1324 ctx.fill(); 1325 ctx.closePath(); 1326 1327 ctx.globalCompositeOperation = "destination-out"; 1328 1329 var radius2 = radius - g_options.slider_progresspie_stroke_width; 1330 1331 ctx.beginPath(); 1332 1333 ctx.moveTo(centerX, centerY); 1334 ctx.arc(centerX,centerY,radius2,startPoint, endPoint); 1335 ctx.lineTo(centerX, centerY); 1336 1337 ctx.fillStyle = g_options.slider_progresspie_color1; 1338 ctx.fill(); 1339 1340 ctx.closePath(); 1341 } 1342 1343 1344 //draw rest arc (only on fill type): 1345 if(g_options.slider_progresspie_type_fill == true){ 1346 startPoint = endPoint; 1347 endPoint = Math.PI * 2; 1348 ctx.beginPath(); 1349 ctx.arc(centerX,centerY,radius,startPoint, endPoint); 1350 ctx.lineTo(centerX, centerY); 1351 ctx.fillStyle = g_options.slider_progresspie_color2; 1352 ctx.fill(); 1353 ctx.closePath(); 1354 } 1355 1356 } 1357 1358 1359 /** 1360 * set progress (0-1) 1361 */ 1362 this.setProgress = function(percent){ 1363 1364 percent = g_functions.normalizePercent(percent); 1365 1366 g_percent = percent; 1367 draw(percent); 1368 } 1369 1370 /** 1371 * get type string 1372 */ 1373 this.getType = function(){ 1374 return("pie"); 1375 } 1376 1377}
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.