1 2if(typeof g_ugFunctions != "undefined") 3 g_ugFunctions.registerTheme("default"); 4else 5 jQuery(document).ready(function(){g_ugFunctions.registerTheme("default")}); 6 7 8/** 9 * Default gallery theme 10 */ 11function UGTheme_default(){ 12 13 var t = this; 14 var g_gallery = new UniteGalleryMain(), g_objGallery, g_objects, g_objWrapper; 15 var g_objButtonFullscreen, g_objButtonPlay, g_objButtonHidePanel; 16 var g_objSlider, g_objPanel, g_objStripPanel, g_objTextPanel; 17 var g_functions = new UGFunctions(); 18 19 //theme options 20 var g_options = { 21 theme_load_slider:true, //this option for debugging only 22 theme_load_panel:true, //this option for debugging only 23 24 theme_enable_fullscreen_button: true, //show, hide the theme fullscreen button. The position in the theme is constant 25 theme_enable_play_button: true, //show, hide the theme play button. The position in the theme is constant 26 theme_enable_hidepanel_button: true, //show, hide the hidepanel button 27 theme_enable_text_panel: true, //enable the panel text panel. 28 29 theme_text_padding_left: 20, //left padding of the text in the textpanel 30 theme_text_padding_right: 5, //right paddin of the text in the textpanel 31 theme_text_align: "left", //left, center, right - the align of the text in the textpanel 32 theme_text_type: "description", //title, description, both - text that will be shown on the text panel, title or description or both 33 34 theme_hide_panel_under_width: 480 //hide panel under certain browser width, if null, don't hide 35 }; 36 37 38 //default item options: 39 var g_defaults = { 40 41 //slider options: 42 slider_controls_always_on: true, 43 slider_zoompanel_align_vert: "top", 44 slider_zoompanel_offset_vert: 12, 45 46 //textpanel options: 47 slider_textpanel_padding_top: 0, 48 slider_textpanel_enable_title: false, 49 slider_textpanel_enable_description: true, 50 slider_vertical_scroll_ondrag: true, 51 52 //strippanel options 53 strippanel_background_color:"#232323", 54 strippanel_padding_top:10 55 }; 56 57 58 //options that could not be changed by user 59 var g_mustOptions = { 60 61 slider_enable_text_panel: false, 62 slider_enable_play_button:false, 63 slider_enable_fullscreen_button: false, 64 65 //text panel options 66 slider_enable_text_panel: false, 67 slider_textpanel_height: 50, 68 slider_textpanel_align:"top", 69 }; 70 71 72 var g_temp = { 73 isPanelHidden: false 74 }; 75 76 77 /** 78 * init the theme 79 */ 80 function initTheme(gallery, customOptions){ 81 82 g_gallery = gallery; 83 84 g_options = jQuery.extend(g_options, g_defaults); 85 g_options = jQuery.extend(g_options, customOptions); 86 g_options = jQuery.extend(g_options, g_mustOptions); 87 88 modifyOptions(); 89 90 //set gallery options 91 g_gallery.setOptions(g_options); 92 93 //include gallery elements 94 if(g_options.theme_load_panel == true){ 95 g_objStripPanel = new UGStripPanel(); 96 g_objStripPanel.init(gallery, g_options); 97 } 98 99 if(g_options.theme_load_slider == true) 100 g_gallery.initSlider(g_options); 101 102 g_objects = gallery.getObjects(); 103 104 //get some objects for local use 105 g_objGallery = jQuery(gallery); 106 g_objWrapper = g_objects.g_objWrapper; 107 108 if(g_options.theme_load_slider == true) 109 g_objSlider = g_objects.g_objSlider; 110 111 //init text panel 112 if(g_options.theme_enable_text_panel == true){ 113 g_objTextPanel = new UGTextPanel(); 114 g_objTextPanel.init(g_gallery, g_options, "slider"); 115 } 116 117 } 118 119 120 /** 121 * run the theme 122 */ 123 function runTheme(){ 124 125 setHtml(); 126 127 initAndPlaceElements(); 128 129 initEvents(); 130 } 131 132 133 /** 134 * modify some options before implimenting 135 */ 136 function modifyOptions(){ 137 138 var moreOptions = { 139 slider_textpanel_css_title:{}, //additional css of the title 140 slider_textpanel_css_description:{} //additional css of the description 141 }; 142 143 g_options = jQuery.extend(moreOptions, g_options); 144 145 g_options.slider_textpanel_css_title["text-align"] = g_options.theme_text_align; 146 g_options.slider_textpanel_css_description["text-align"] = g_options.theme_text_align; 147 148 switch(g_options.theme_text_type){ 149 case "title": 150 g_options.slider_textpanel_enable_title = true; 151 g_options.slider_textpanel_enable_description = false; 152 break; 153 case "both": 154 g_options.slider_textpanel_enable_title = true; 155 g_options.slider_textpanel_enable_description = true; 156 break; 157 default: 158 case "description": //the description is the default 159 } 160 161 } 162 163 164 165 /** 166 * set gallery html elements 167 */ 168 function setHtml(){ 169 170 //add html elements 171 g_objWrapper.addClass("ug-theme-default"); 172 173 var htmlAdd = ""; 174 175 //add panel 176 htmlAdd += "<div class='ug-theme-panel'>"; 177 178 var classButtonFullscreen = 'ug-default-button-fullscreen'; 179 var classButtonPlay = 'ug-default-button-play'; 180 var classCaptureButtonFullscreen = '.ug-default-button-fullscreen'; 181 var classCaptureButtonPlay = '.ug-default-button-play'; 182 183 184 if(!g_objTextPanel){ //take the buttons from default theme 185 classButtonFullscreen = 'ug-default-button-fullscreen-single'; 186 classButtonPlay = 'ug-default-button-play-single'; 187 classCaptureButtonFullscreen = '.ug-default-button-fullscreen-single'; 188 classCaptureButtonPlay = '.ug-default-button-play-single'; 189 } 190 191 //add fullscreen button to the panel 192 if(g_options.theme_enable_fullscreen_button == true) 193 htmlAdd += "<div class='"+classButtonFullscreen+"'></div>"; 194 195 //add play button to the panel 196 if(g_options.theme_enable_play_button == true) 197 htmlAdd += "<div class='"+classButtonPlay+"'></div>"; 198 199 //add hide panel button 200 if(g_options.theme_enable_hidepanel_button) 201 htmlAdd += "<div class='ug-default-button-hidepanel'><div class='ug-default-button-hidepanel-bg'></div> <div class='ug-default-button-hidepanel-tip'></div></div>"; 202 203 htmlAdd += "</div>"; 204 205 g_objWrapper.append(htmlAdd); 206 207 //set elements 208 g_objPanel = g_objWrapper.children(".ug-theme-panel"); 209 210 if(g_options.theme_enable_fullscreen_button == true) 211 g_objButtonFullscreen = g_objPanel.children(classCaptureButtonFullscreen); 212 213 if(g_options.theme_enable_play_button == true) 214 g_objButtonPlay = g_objPanel.children(classCaptureButtonPlay); 215 216 if(g_options.theme_enable_hidepanel_button == true) 217 g_objButtonHidePanel = g_objPanel.children(".ug-default-button-hidepanel"); 218 219 //set html strip panel to the panel 220 g_objStripPanel.setHtml(g_objPanel); 221 222 //set text panel html to the panel 223 if(g_objTextPanel) 224 g_objTextPanel.appendHTML(g_objPanel); 225 226 //set slider html 227 if(g_objSlider) 228 g_objSlider.setHtml(); 229 230 } 231 232 233 /** 234 * init all the theme's elements and set them to their places 235 * according gallery's dimentions. 236 * this function should work on resize too. 237 */ 238 function initAndPlaceElements(){ 239 240 //create and place thumbs panel: 241 if(g_options.theme_load_panel){ 242 initPanel(); 243 placePanel(); 244 } 245 246 //place the slider 247 if(g_objSlider){ 248 placeSlider(); 249 g_objSlider.run(); 250 } 251 252 } 253 254 255 /** 256 * init size of the thumbs panel 257 */ 258 function initPanel(){ 259
260 var objGallerySize = g_gallery.getSize(); 261 var galleryWidth = objGallerySize.width; 262 263 //init srip panel width 264 g_objStripPanel.setOrientation("bottom"); 265 g_objStripPanel.setWidth(galleryWidth); 266 g_objStripPanel.run(); 267 268 //set panel size 269 var objStripPanelSize = g_objStripPanel.getSize(); 270 var panelHeight = objStripPanelSize.height; 271 272 if(g_objTextPanel){ 273 panelHeight += g_mustOptions.slider_textpanel_height; 274 275 if(g_objButtonHidePanel){ 276 var hideButtonHeight = g_objButtonHidePanel.outerHeight(); 277 panelHeight += hideButtonHeight; 278 } 279 } 280 else{ 281 var maxButtonsHeight = 0; 282 283 if(g_objButtonHidePanel) 284 maxButtonsHeight = Math.max(g_objButtonHidePanel.outerHeight(), maxButtonsHeight); 285 286 if(g_objButtonFullscreen) 287 maxButtonsHeight = Math.max(g_objButtonFullscreen.outerHeight(), maxButtonsHeight); 288 289 if(g_objButtonPlay) 290 maxButtonsHeight = Math.max(g_objButtonPlay.outerHeight(), maxButtonsHeight); 291 292 panelHeight += maxButtonsHeight; 293 294 } 295 296 g_functions.setElementSize(g_objPanel, galleryWidth, panelHeight); 297 298 //position strip panel 299 var stripPanelElement = g_objStripPanel.getElement(); 300 g_functions.placeElement(stripPanelElement, "left", "bottom"); 301 302 //init hide panel button 303 if(g_objButtonHidePanel){ 304 var buttonTip = g_objButtonHidePanel.children(".ug-default-button-hidepanel-tip"); 305 g_functions.placeElement(buttonTip, "center", "middle"); 306 307 //set opacity and bg color from the text panel 308 if(g_objTextPanel){ 309 var objHideButtonBG = g_objButtonHidePanel.children(".ug-default-button-hidepanel-bg"); 310 311 var hidePanelOpacity = g_objTextPanel.getOption("textpanel_bg_opacity"); 312 objHideButtonBG.fadeTo(0, hidePanelOpacity); 313 314 var bgColor = g_objTextPanel.getOption("textpanel_bg_color"); 315 objHideButtonBG.css({"background-color":bgColor}); 316 } 317 318 } 319 320 //position buttons on the text panel: 321 var paddingPlayButton = 0; 322 var panelButtonsOffsetY = 0; 323 if(g_objButtonHidePanel){ 324 panelButtonsOffsetY = hideButtonHeight; 325 } 326 327 if(g_objButtonFullscreen){ 328 g_functions.placeElement(g_objButtonFullscreen, "right", "top",0 , panelButtonsOffsetY); 329 paddingPlayButton = g_objButtonFullscreen.outerWidth(); 330 } 331 332 if(g_objButtonPlay){ 333 var buttonPlayOffsetY = panelButtonsOffsetY; 334 if(!g_objTextPanel) 335 buttonPlayOffsetY++; 336 337 g_functions.placeElement(g_objButtonPlay, "right", "top", paddingPlayButton, buttonPlayOffsetY); 338 paddingPlayButton += g_objButtonPlay.outerWidth(); 339 } 340 341 //run the text panel 342 if(g_objTextPanel){ 343 344 var textPanelOptions = {}; 345 textPanelOptions.slider_textpanel_padding_right = g_options.theme_text_padding_right + paddingPlayButton; 346 textPanelOptions.slider_textpanel_padding_left = g_options.theme_text_padding_left; 347 348 if(g_objButtonHidePanel){ 349 textPanelOptions.slider_textpanel_margin = hideButtonHeight; 350 } 351 352 g_objTextPanel.setOptions(textPanelOptions); 353 354 g_objTextPanel.positionPanel(); 355 g_objTextPanel.run(); 356 } 357 358 //place hide panel button 359 if(g_objButtonHidePanel){ 360 361 if(g_objTextPanel) //place at the beginning of hte panel 362 g_functions.placeElement(g_objButtonHidePanel,"left", "top"); 363 364 else{ //place above the strip panel 365 var stripPanelHeight = stripPanelElement.outerHeight(); 366 g_functions.placeElement(g_objButtonHidePanel,"left", "bottom", 0, stripPanelHeight); 367 } 368 } 369 370 } 371 372 373 /** 374 * place thumbs panel according the settings 375 */ 376 function placePanel(){ 377 378 if(g_temp.isPanelHidden || isPanelNeedToHide() == true){ 379 380 //place panel hidden 381 var newPanelPosY = getHiddenPanelPosition(); 382 g_functions.placeElement(g_objPanel, 0, newPanelPosY); 383 g_temp.isPanelHidden = true; 384 385 }else //place panel normal 386 g_functions.placeElement(g_objPanel, 0, "bottom"); 387 388 389 } 390 391 392 /** 393 * place the slider according the thumbs panel size and position 394 */ 395 function placeSlider(){ 396 397 var sliderTop = 0; 398 var sliderLeft = 0; 399 var galleryHeight = g_gallery.getHeight(); 400 var sliderHeight = galleryHeight; 401 402 if(g_objStripPanel && isPanelHidden() == false){ 403 var panelSize = g_objStripPanel.getSize(); 404 sliderHeight = galleryHeight - panelSize.height; 405 } 406 407 var sliderWidth = g_gallery.getWidth(); 408 409 //set parent container the panel 410 g_objSlider.setSize(sliderWidth, sliderHeight); 411 g_objSlider.setPosition(sliderLeft, sliderTop); 412 } 413 414 415 /** 416 * check if need to hide the panel according the options. 417 */ 418 function isPanelNeedToHide(){ 419 420 if(!g_options.theme_hide_panel_under_width) 421 return(false); 422 423 var windowWidth = jQuery(window).width(); 424 var hidePanelValue = g_options.theme_hide_panel_under_width; 425 426 if(windowWidth <= hidePanelValue) 427 return(true); 428 429 return(false); 430 } 431 432 /** 433 * check if need to hide or show panel according the theme_hide_panel_under_width option 434 */ 435 function checkHidePanel(){ 436
437 //check hide panel: 438 if(!g_options.theme_hide_panel_under_width) 439 return(false); 440 441 var needToHide = isPanelNeedToHide(); 442 443 if(needToHide == true) 444 hidePanel(true); 445 else 446 showPanel(true); 447 } 448 449 450 /** 451 * on gallery size change - resize the theme. 452 */ 453 function onSizeChange(){ 454 455 initAndPlaceElements(); 456 457 checkHidePanel(); 458 } 459 460 461 /** 462 * get if the panel is hidden 463 */ 464 function isPanelHidden(){ 465 466 return(g_temp.isPanelHidden); 467 } 468 469 470 /** 471 * place panel with some animation 472 */ 473 function placePanelAnimation(panelY, functionOnComplete){ 474 475 var objCss = {top: panelY + "px"}; 476 477 g_objPanel.stop(true).animate(objCss ,{ 478 duration: 300, 479 easing: "easeInOutQuad", 480 queue: false, 481 complete: function(){ 482 if(functionOnComplete) 483 functionOnComplete(); 484 } 485 }); 486 487 } 488 489 490 /** 491 * get position of the hidden panel 492 */ 493 function getHiddenPanelPosition(){ 494 495 var galleryHeight = g_objWrapper.height(); 496 var newPanelPosY = galleryHeight; 497 if(g_objButtonHidePanel){ 498 var objButtonSize = g_functions.getElementSize(g_objButtonHidePanel); 499 newPanelPosY -= objButtonSize.bottom; 500 } 501 502 return(newPanelPosY); 503 } 504 505 506 /** 507 * hide the panel 508 */ 509 function hidePanel(noAnimation){ 510 511 if(!noAnimation) 512 var noAnimation = false; 513 514 if(isPanelHidden() == true) 515 return(false); 516 517 var newPanelPosY = getHiddenPanelPosition(); 518 519 if(noAnimation == true) 520 g_functions.placeElement(g_objPanel, 0, newPanelPosY); 521 else 522 placePanelAnimation(newPanelPosY, placeSlider); 523 524 if(g_objButtonHidePanel) 525 g_objButtonHidePanel.addClass("ug-button-hidden-mode"); 526 527 g_temp.isPanelHidden = true; 528 529 } 530 531 532 /** 533 * show the panel 534 */ 535 function showPanel(noAnimation){ 536 537 if(!noAnimation) 538 var noAnimation = false; 539 540 if(isPanelHidden() == false) 541 return(false); 542 543 var galleryHeight = g_objWrapper.height(); 544 var panelHeight = g_objPanel.outerHeight(); 545 546 var newPanelPosY = galleryHeight - panelHeight; 547 548 if(noAnimation == true) 549 g_functions.placeElement(g_objPanel, 0, newPanelPosY); 550 else 551 placePanelAnimation(newPanelPosY, placeSlider); 552 553 if(g_objButtonHidePanel) 554 g_objButtonHidePanel.removeClass("ug-button-hidden-mode"); 555 556 g_temp.isPanelHidden = false; 557 } 558 559 560 /** 561 * on hide panel click 562 */ 563 function onHidePanelClick(event){ 564 565 event.stopPropagation(); 566 event.stopImmediatePropagation(); 567 568 if(g_functions.validateClickTouchstartEvent(event.type) == false) 569 return(true); 570 571 if(isPanelHidden() == true) 572 showPanel(); 573 else 574 hidePanel(); 575 } 576 577 /** 578 * before items request: hide items, show preloader 579 */ 580 function onBeforeReqestItems(){ 581 582 g_gallery.showDisabledOverlay(); 583 584 } 585 586 587 /** 588 * init buttons functionality and events 589 */ 590 function initEvents(){ 591 592 g_objGallery.on(g_gallery.events.SIZE_CHANGE,onSizeChange); 593 g_objGallery.on(g_gallery.events.GALLERY_BEFORE_REQUEST_ITEMS, onBeforeReqestItems); 594 595 //set the panel buttons 596 if(g_objButtonPlay){ 597 g_functions.addClassOnHover(g_objButtonPlay, "ug-button-hover"); 598 g_gallery.setPlayButton(g_objButtonPlay); 599 } 600 601 //init fullscreen button 602 if(g_objButtonFullscreen){ 603 g_functions.addClassOnHover(g_objButtonFullscreen, "ug-button-hover"); 604 g_gallery.setFullScreenToggleButton(g_objButtonFullscreen); 605 } 606 607 //init hide panel button 608 if(g_objButtonHidePanel){ 609 g_functions.setButtonMobileReady(g_objButtonHidePanel); 610 g_functions.addClassOnHover(g_objButtonHidePanel, "ug-button-hover"); 611 g_objButtonHidePanel.on("click touchstart", onHidePanelClick); 612 } 613 614 //on gallery media player events, bring the element to front 615 g_objGallery.on(g_gallery.events.SLIDER_ACTION_START, function(){ 616 617 //set slider to front 618 g_objPanel.css("z-index","1"); 619 g_objSlider.getElement().css("z-index","11"); 620 }); 621 622 g_objGallery.on(g_gallery.events.SLIDER_ACTION_END, function(){ 623 624 //set the panel to front 625 g_objPanel.css("z-index","11"); 626 g_objSlider.getElement().css("z-index","1"); 627 }); 628 629 } 630 631 /** 632 * destroy the gallery events and objects 633 */ 634 this.destroy = function(){ 635 636 g_objGallery.off(g_gallery.events.SIZE_CHANGE); 637 g_objGallery.off(g_gallery.events.GALLERY_BEFORE_REQUEST_ITEMS); 638 639 //set the panel buttons 640 if(g_objButtonPlay) 641 g_gallery.destroyPlayButton(g_objButtonPlay); 642 643 //init fullscreen button 644 if(g_objButtonFullscreen) 645 g_gallery.destroyFullscreenButton(g_objButtonFullscreen); 646 647 //init hide panel button 648 if(g_objButtonHidePanel) 649 g_functions.destroyButton(g_objButtonHidePanel); 650 651 g_objGallery.off(g_gallery.events.SLIDER_ACTION_START); 652 g_objGallery.off(g_gallery.events.SLIDER_ACTION_END); 653 654 if(g_objSlider) 655 g_objSlider.destroy(); 656 657 if(g_objStripPanel) 658 g_objStripPanel.destroy(); 659 660 if(g_objTextPanel) 661 g_objTextPanel.destroy(); 662 663 } 664 665 666 /** 667 * run the theme setting 668 */ 669 this.run = function(){ 670 671 runTheme(); 672 } 673 674 675 /** 676 * init 677 */ 678 this.init = function(gallery, customOptions){ 679 initTheme(gallery, customOptions); 680 } 681 682}
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.