Changeset 23370 for gs2-extensions/video-and-audio/trunk
- Timestamp:
- 2010-12-01T14:45:35+13:00 (13 years ago)
- Location:
- gs2-extensions/video-and-audio/trunk/src/web
- Files:
-
- 5 added
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
gs2-extensions/video-and-audio/trunk/src/web/script/replayer.js
r23295 r23370 1 1 /*! 2 * Replayme Player v1. 0.13 * Based on JQuery UI v1.8.42 * Replayme Player v1.5.0 3 * Based on JQuery UI v1.8.4 4 4 * 5 5 * 6 * Copyright 2010, Maxime Ro uast6 * Copyright 2010, Maxime Roüast 7 7 * Released under the GPL 2 License. 8 8 * … … 14 14 var user_is_dragging=0; 15 15 var checkStatusTimer; 16 var checkStatusTimer_is_on=0; 16 17 var checkVideoSizeTimer; 17 18 var previousHeight=0; … … 23 24 function checkStatus() 24 25 { 25 26 if(vlc.subtitle.count < 1) 27 { 28 $( "#subtitles" ).button( "option", "disabled", true ); 29 } 30 else if (vlc.subtitle.count > 0) 31 { 32 $( "#subtitles" ).button( "option", "disabled", false ); 33 } 34 35 if (vlc.input.state == 0) { 36 // current media has stopped 37 //onStop(); 38 } 39 else if (vlc.input.state == 1) { 40 // current media is connecting 41 onOpening(); 42 } 43 else if (vlc.input.state == 2) { 44 // current media is buffering data 45 onBuffering(); 46 } 47 else if (vlc.input.state == 3) { 48 // current media is now playing 49 onPlaying(); 50 } 51 else if (vlc.input.state == 4) { 52 // current media is now paused 53 //onPaused(); 54 } 55 else if (vlc.input.state == 5) { 56 // current media is stopping 57 //onStopping(); 58 } 59 else if (vlc.input.state == 6) { 60 // current media has finished playback 61 onEnd(); 62 } 63 64 checkStatusTimer=setTimeout(function(){checkStatus()},1000); 26 if (!checkStatusTimer_is_on) 27 { 28 checkStatusTimer_is_on=1; 29 30 if(vlc.subtitle.count < 1) 31 { 32 $( "#subtitles" ).button( "option", "disabled", true ); 33 } 34 else if (vlc.subtitle.count > 0) 35 { 36 $( "#subtitles" ).button( "option", "disabled", false ); 37 $( "#subtitles" ).button( "option", "label", "Subtitles: " + vlc.subtitle.description(vlc.subtitle.track)); 38 } 39 40 41 //For the audio tracks we only enable the button if there is more than two tracks (in vlc world disabled count for one track) 42 if(vlc.audio.count < 3) 43 { 44 $( "#audiotracks" ).button( "option", "disabled", true ); 45 $( "#audiotracks" ).button( "option", "label", vlc.audio.description(vlc.audio.track)); 46 } 47 else if (vlc.audio.count > 2) 48 { 49 $( "#audiotracks" ).button( "option", "disabled", false ); 50 $( "#audiotracks" ).button( "option", "label", vlc.audio.description(vlc.audio.track)); 51 } 52 53 54 if (vlc.input.state == 0) { 55 // current media has stopped 56 //onStop(); 57 } 58 else if (vlc.input.state == 1) { 59 // current media is connecting 60 onOpening(); 61 } 62 else if (vlc.input.state == 2) { 63 // current media is buffering data 64 onBuffering(); 65 } 66 else if (vlc.input.state == 3) { 67 // current media is now playing 68 onPlaying(); 69 } 70 else if (vlc.input.state == 4) { 71 // current media is now paused 72 //onPaused(); 73 } 74 else if (vlc.input.state == 5) { 75 // current media is stopping 76 //onStopping(); 77 } 78 else if (vlc.input.state == 6) { 79 // current media has finished playback 80 onEnd(); 81 } 82 83 checkStatusTimer=setTimeout(function(){checkStatus()},5000); 84 } 65 85 }; 66 86 … … 108 128 }); 109 129 $( "#subtitles" ).button( "option", "disabled", true ); 130 $( "#audiotracks" ).button( "option", "disabled", true); 110 131 } 111 132 … … 117 138 setTimeout(function(){vlc.playlist.add(safeMRL)},350); 118 139 setTimeout(function(){play()},500); 119 setTimeout(function(){checkStatus()}, 500);140 setTimeout(function(){checkStatus()},1000); 120 141 }; 121 142 … … 123 144 { 124 145 vlc.playlist.play(); 125 vlc.video.deinterlace.enable("blend"); 126 //if (relPosTimer_is_on!=1) 127 //{ 128 relPosTimer_is_on=1; 129 showRelPos(); 130 //} 146 vlc.video.deinterlace.enable("Yadif"); 147 relPosTimer_is_on=1; 148 showRelPos(); 149 150 if (!checkStatusTimer_is_on) 151 { 152 setTimeout(function(){checkStatus()},1000); 153 } 131 154 }; 132 155 … … 147 170 clearTimeout(relpos); 148 171 clearTimeout(checkStatusTimer); 172 checkStatusTimer_is_on=0; 149 173 relPosTimer_is_on=0; 150 174 vlc.playlist.stop(); … … 152 176 $('#slider').slider( "option", "value", 0 ); 153 177 $( "#subtitles" ).button( "option", "label", "Subtitles"); 178 $( "#subtitles" ).button( "option", "disabled", true ); 179 $( "#audiotracks" ).button( "option", "label", "Audio Track(s)"); 180 $( "#audiotracks" ).button( "option", "disabled", true); 154 181 }; 155 182 … … 180 207 } 181 208 else { 182 // Quirks mode209 // in Quirks mode 183 210 xWidth = document.body.clientWidth; 184 211 } … … 203 230 } 204 231 else { 205 // Quirks mode232 // in Quirks mode 206 233 xHeight = document.body.clientHeight; 207 234 } … … 223 250 function toggleFullscreen() 224 251 { 225 vlc.video.toggleFullscreen(); 226 227 if (vlc.video.fullscreen == true) 252 if (vlc.input.state == 3) 228 253 { 229 previousHeight = $( "#replaymePlayer" ).dialog( "option", "height" ); 230 previousWidth = $( "#replaymePlayer" ).dialog( "option", "width" ); 231 setFullscreenSize(); 254 vlc.video.toggleFullscreen(); 255 256 if (vlc.video.fullscreen == true) 257 { 258 previousHeight = $( "#replaymePlayer" ).dialog( "option", "height" ); 259 previousWidth = $( "#replaymePlayer" ).dialog( "option", "width" ); 260 setFullscreenSize(); 261 } 262 else if (vlc.video.fullscreen == false) 263 { 264 clearTimeout(checkVideoSizeTimer); 265 $( "#replaymePlayer" ).dialog( "option", "height", previousHeight ); 266 $( "#replaymePlayer" ).dialog( "option", "width", previousWidth ); 267 setPlayerSize(); 268 $( "#replaymePlayer" ).dialog( "option", "position", 'center' ); 269 } 232 270 } 233 else if (vlc.video.fullscreen == false)271 else 234 272 { 235 clearTimeout(checkVideoSizeTimer); 236 $( "#replaymePlayer" ).dialog( "option", "height", previousHeight ); 237 $( "#replaymePlayer" ).dialog( "option", "width", previousWidth ); 238 setPlayerSize(); 239 $( "#replaymePlayer" ).dialog( "option", "position", 'center' ); 273 alert("You can switch between fullscreen and windowed mode only when playing the video."); 240 274 } 241 275 }; … … 249 283 else 250 284 { 251 vlc.subtitle.track = vlc.subtitle.track +1;285 vlc.subtitle.track += 1; 252 286 } 253 $( "#subtitles" ).button( "option", "label", "Subtitles: " + vlc.subtitle.description(vlc.subtitle.track) ); 287 $( "#subtitles" ).button( "option", "label", "Subtitles: " + vlc.subtitle.description(vlc.subtitle.track)); 288 }; 289 290 function changeAudioTrack() 291 { 292 if (vlc.audio.track == vlc.audio.count - 1) 293 { 294 vlc.audio.track = 1; 295 } 296 else 297 { 298 vlc.audio.track += 1; 299 } 300 $( "#audiotracks" ).button( "option", "label", vlc.audio.description(vlc.audio.track)); 254 301 }; 255 302 … … 267 314 height = $( "#replaymePlayer" ).dialog( "option", "height" ); 268 315 width = width - 25; 269 height = height - 1 30;316 height = height - 150; 270 317 271 318 if (document.getElementById("vlc") != null) … … 278 325 //JQuery Stuff 279 326 $(function() { 327 328 //Section taken from JQuery UI 1.8.4 and adapted to properly show dialog over VLC plugin in Firefox 329 //it actually disable the rounded corners for that window, to use it use "mydialog" instead of "dialog" 330 var uiMyDialogClasses = 331 'ui-dialog ' + 332 'ui-widget ' + 333 'ui-widget-content '; 334 335 $.widget("ui.mydialog", { 336 options: { 337 autoOpen: true, 338 buttons: {}, 339 closeOnEscape: true, 340 closeText: 'close', 341 dialogClass: '', 342 draggable: true, 343 hide: null, 344 height: 'auto', 345 maxHeight: false, 346 maxWidth: false, 347 minHeight: 150, 348 minWidth: 150, 349 modal: false, 350 position: { 351 my: 'center', 352 at: 'center', 353 of: window, 354 collision: 'fit', 355 // ensure that the titlebar is never outside the document 356 using: function(pos) { 357 var topOffset = $(this).css(pos).offset().top; 358 if (topOffset < 0) { 359 $(this).css('top', pos.top - topOffset); 360 } 361 } 362 }, 363 resizable: true, 364 show: null, 365 stack: true, 366 title: '', 367 width: 300, 368 zIndex: 1000 369 }, 370 371 _create: function() { 372 this.originalTitle = this.element.attr('title'); 373 // #5742 - .attr() might return a DOMElement 374 if ( typeof this.originalTitle !== "string" ) { 375 this.originalTitle = ""; 376 } 377 378 var self = this, 379 options = self.options, 380 381 title = options.title || self.originalTitle || ' ', 382 titleId = $.ui.mydialog.getTitleId(self.element), 383 384 uiMyDialog = (self.uiMyDialog = $('<div></div>')) 385 .appendTo(document.body) 386 .hide() 387 .addClass(uiMyDialogClasses + options.dialogClass) 388 .css({ 389 zIndex: options.zIndex 390 }) 391 // setting tabIndex makes the div focusable 392 // setting outline to 0 prevents a border on focus in Mozilla 393 .attr('tabIndex', -1).css('outline', 0).keydown(function(event) { 394 if (options.closeOnEscape && event.keyCode && 395 event.keyCode === $.ui.keyCode.ESCAPE) { 396 397 self.close(event); 398 event.preventDefault(); 399 } 400 }) 401 .attr({ 402 role: 'dialog', 403 'aria-labelledby': titleId 404 }) 405 .mousedown(function(event) { 406 self.moveToTop(false, event); 407 }), 408 409 uiMyDialogContent = self.element 410 .show() 411 .removeAttr('title') 412 .addClass( 413 'ui-dialog-content ' + 414 'ui-widget-content') 415 .appendTo(uiMyDialog), 416 417 uiMyDialogTitlebar = (self.uiMyDialogTitlebar = $('<div></div>')) 418 .addClass( 419 'ui-dialog-titlebar ' + 420 'ui-widget-header ' + 421 'ui-helper-clearfix' 422 ) 423 .prependTo(uiMyDialog), 424 425 uiMyDialogTitlebarClose = $('<a href="#"></a>') 426 .addClass( 427 'ui-dialog-titlebar-close ' 428 ) 429 .attr('role', 'button') 430 .hover( 431 function() { 432 uiMyDialogTitlebarClose.addClass('ui-state-hover'); 433 }, 434 function() { 435 uiMyDialogTitlebarClose.removeClass('ui-state-hover'); 436 } 437 ) 438 .focus(function() { 439 uiMyDialogTitlebarClose.addClass('ui-state-focus'); 440 }) 441 .blur(function() { 442 uiMyDialogTitlebarClose.removeClass('ui-state-focus'); 443 }) 444 .click(function(event) { 445 self.close(event); 446 return false; 447 }) 448 .appendTo(uiMyDialogTitlebar), 449 450 uiMyDialogTitlebarCloseText = (self.uiMyDialogTitlebarCloseText = $('<span></span>')) 451 .addClass( 452 'ui-icon ' + 453 'ui-icon-closethick' 454 ) 455 .text(options.closeText) 456 .appendTo(uiMyDialogTitlebarClose), 457 458 uiMyDialogTitle = $('<span></span>') 459 .addClass('ui-dialog-title') 460 .attr('id', titleId) 461 .html(title) 462 .prependTo(uiMyDialogTitlebar); 463 464 //handling of deprecated beforeclose (vs beforeClose) option 465 //Ticket #4669 http://dev.jqueryui.com/ticket/4669 466 //TODO: remove in 1.9pre 467 if ($.isFunction(options.beforeclose) && !$.isFunction(options.beforeClose)) { 468 options.beforeClose = options.beforeclose; 469 } 470 471 uiMyDialogTitlebar.find("*").add(uiMyDialogTitlebar).disableSelection(); 472 473 if (options.draggable && $.fn.draggable) { 474 self._makeDraggable(); 475 } 476 if (options.resizable && $.fn.resizable) { 477 self._makeResizable(); 478 } 479 480 self._createButtons(options.buttons); 481 self._isOpen = false; 482 483 if ($.fn.bgiframe) { 484 uiMyDialog.bgiframe(); 485 } 486 }, 487 488 _init: function() { 489 if ( this.options.autoOpen ) { 490 this.open(); 491 } 492 }, 493 494 destroy: function() { 495 var self = this; 496 497 if (self.overlay) { 498 self.overlay.destroy(); 499 } 500 self.uiMyDialog.hide(); 501 self.element 502 .unbind('.dialog') 503 .removeData('dialog') 504 .removeClass('ui-dialog-content ui-widget-content') 505 .hide().appendTo('body'); 506 self.uiMyDialog.remove(); 507 508 if (self.originalTitle) { 509 self.element.attr('title', self.originalTitle); 510 } 511 512 return self; 513 }, 514 515 widget: function() { 516 return this.uiMyDialog; 517 }, 518 519 close: function(event) { 520 var self = this, 521 maxZ; 522 523 if (false === self._trigger('beforeClose', event)) { 524 return; 525 } 526 527 if (self.overlay) { 528 self.overlay.destroy(); 529 } 530 self.uiMyDialog.unbind('keypress.ui-dialog'); 531 532 self._isOpen = false; 533 534 if (self.options.hide) { 535 self.uiMyDialog.hide(self.options.hide, function() { 536 self._trigger('close', event); 537 }); 538 } else { 539 self.uiMyDialog.hide(); 540 self._trigger('close', event); 541 } 542 543 $.ui.mydialog.overlay.resize(); 544 545 // adjust the maxZ to allow other modal dialogs to continue to work (see #4309) 546 if (self.options.modal) { 547 maxZ = 0; 548 $('.ui-dialog').each(function() { 549 if (this !== self.uiMyDialog[0]) { 550 maxZ = Math.max(maxZ, $(this).css('z-index')); 551 } 552 }); 553 $.ui.mydialog.maxZ = maxZ; 554 } 555 556 return self; 557 }, 558 559 isOpen: function() { 560 return this._isOpen; 561 }, 562 563 // the force parameter allows us to move modal dialogs to their correct 564 // position on open 565 moveToTop: function(force, event) { 566 var self = this, 567 options = self.options, 568 saveScroll; 569 570 if ((options.modal && !force) || 571 (!options.stack && !options.modal)) { 572 return self._trigger('focus', event); 573 } 574 575 if (options.zIndex > $.ui.mydialog.maxZ) { 576 $.ui.mydialog.maxZ = options.zIndex; 577 } 578 if (self.overlay) { 579 $.ui.mydialog.maxZ += 1; 580 self.overlay.$el.css('z-index', $.ui.mydialog.overlay.maxZ = $.ui.mydialog.maxZ); 581 } 582 583 //Save and then restore scroll since Opera 9.5+ resets when parent z-Index is changed. 584 // http://ui.jquery.com/bugs/ticket/3193 585 saveScroll = { scrollTop: self.element.attr('scrollTop'), scrollLeft: self.element.attr('scrollLeft') }; 586 $.ui.mydialog.maxZ += 1; 587 self.uiMyDialog.css('z-index', $.ui.mydialog.maxZ); 588 self.element.attr(saveScroll); 589 self._trigger('focus', event); 590 591 return self; 592 }, 593 594 open: function() { 595 if (this._isOpen) { return; } 596 597 var self = this, 598 options = self.options, 599 uiMyDialog = self.uiMyDialog; 600 601 self.overlay = options.modal ? new $.ui.mydialog.overlay(self) : null; 602 if (uiMyDialog.next().length) { 603 uiMyDialog.appendTo('body'); 604 } 605 self._size(); 606 self._position(options.position); 607 uiMyDialog.show(options.show); 608 self.moveToTop(true); 609 610 // prevent tabbing out of modal dialogs 611 if (options.modal) { 612 uiMyDialog.bind('keypress.ui-dialog', function(event) { 613 if (event.keyCode !== $.ui.keyCode.TAB) { 614 return; 615 } 616 617 var tabbables = $(':tabbable', this), 618 first = tabbables.filter(':first'), 619 last = tabbables.filter(':last'); 620 621 if (event.target === last[0] && !event.shiftKey) { 622 first.focus(1); 623 return false; 624 } else if (event.target === first[0] && event.shiftKey) { 625 last.focus(1); 626 return false; 627 } 628 }); 629 } 630 631 // set focus to the first tabbable element in the content area or the first button 632 // if there are no tabbable elements, set focus on the dialog itself 633 $(self.element.find(':tabbable').get().concat( 634 uiMyDialog.find('.ui-dialog-buttonpane :tabbable').get().concat( 635 uiMyDialog.get()))).eq(0).focus(); 636 637 self._trigger('open'); 638 self._isOpen = true; 639 640 return self; 641 }, 642 643 _createButtons: function(buttons) { 644 var self = this, 645 hasButtons = false, 646 uiMyDialogButtonPane = $('<div></div>') 647 .addClass( 648 'ui-dialog-buttonpane ' + 649 'ui-widget-content ' + 650 'ui-helper-clearfix' 651 ), 652 uiButtonSet = $( "<div></div>" ) 653 .addClass( "ui-dialog-buttonset" ) 654 .appendTo( uiMyDialogButtonPane ); 655 656 // if we already have a button pane, remove it 657 self.uiMyDialog.find('.ui-dialog-buttonpane').remove(); 658 659 if (typeof buttons === 'object' && buttons !== null) { 660 $.each(buttons, function() { 661 return !(hasButtons = true); 662 }); 663 } 664 if (hasButtons) { 665 $.each(buttons, function(name, fn) { 666 var button = $('<button type="button"></button>') 667 .text(name) 668 .click(function() { fn.apply(self.element[0], arguments); }) 669 .appendTo(uiButtonSet); 670 if ($.fn.button) { 671 button.button(); 672 } 673 }); 674 uiMyDialogButtonPane.appendTo(self.uiMyDialog); 675 } 676 }, 677 678 _makeDraggable: function() { 679 var self = this, 680 options = self.options, 681 doc = $(document), 682 heightBeforeDrag; 683 684 function filteredUi(ui) { 685 return { 686 position: ui.position, 687 offset: ui.offset 688 }; 689 } 690 691 self.uiMyDialog.draggable({ 692 cancel: '.ui-dialog-content, .ui-dialog-titlebar-close', 693 handle: '.ui-dialog-titlebar', 694 containment: 'document', 695 start: function(event, ui) { 696 heightBeforeDrag = options.height === "auto" ? "auto" : $(this).height(); 697 $(this).height($(this).height()).addClass("ui-dialog-dragging"); 698 self._trigger('dragStart', event, filteredUi(ui)); 699 }, 700 drag: function(event, ui) { 701 self._trigger('drag', event, filteredUi(ui)); 702 }, 703 stop: function(event, ui) { 704 options.position = [ui.position.left - doc.scrollLeft(), 705 ui.position.top - doc.scrollTop()]; 706 $(this).removeClass("ui-dialog-dragging").height(heightBeforeDrag); 707 self._trigger('dragStop', event, filteredUi(ui)); 708 $.ui.mydialog.overlay.resize(); 709 } 710 }); 711 }, 712 713 _makeResizable: function(handles) { 714 handles = (handles === undefined ? this.options.resizable : handles); 715 var self = this, 716 options = self.options, 717 // .ui-resizable has position: relative defined in the stylesheet 718 // but dialogs have to use absolute or fixed positioning 719 position = self.uiMyDialog.css('position'), 720 resizeHandles = (typeof handles === 'string' ? 721 handles : 722 'n,e,s,w,se,sw,ne,nw' 723 ); 724 725 function filteredUi(ui) { 726 return { 727 originalPosition: ui.originalPosition, 728 originalSize: ui.originalSize, 729 position: ui.position, 730 size: ui.size 731 }; 732 } 733 734 self.uiMyDialog.resizable({ 735 cancel: '.ui-dialog-content', 736 containment: 'document', 737 alsoResize: self.element, 738 maxWidth: options.maxWidth, 739 maxHeight: options.maxHeight, 740 minWidth: options.minWidth, 741 minHeight: self._minHeight(), 742 handles: resizeHandles, 743 start: function(event, ui) { 744 $(this).addClass("ui-dialog-resizing"); 745 self._trigger('resizeStart', event, filteredUi(ui)); 746 }, 747 resize: function(event, ui) { 748 self._trigger('resize', event, filteredUi(ui)); 749 }, 750 stop: function(event, ui) { 751 $(this).removeClass("ui-dialog-resizing"); 752 options.height = $(this).height(); 753 options.width = $(this).width(); 754 self._trigger('resizeStop', event, filteredUi(ui)); 755 $.ui.mydialog.overlay.resize(); 756 } 757 }) 758 .css('position', position) 759 .find('.ui-resizable-se').addClass('ui-icon ui-icon-grip-diagonal-se'); 760 }, 761 762 _minHeight: function() { 763 var options = this.options; 764 765 if (options.height === 'auto') { 766 return options.minHeight; 767 } else { 768 return Math.min(options.minHeight, options.height); 769 } 770 }, 771 772 _position: function(position) { 773 var myAt = [], 774 offset = [0, 0], 775 isVisible; 776 777 if (position) { 778 // deep extending converts arrays to objects in jQuery <= 1.3.2 :-( 779 // if (typeof position == 'string' || $.isArray(position)) { 780 // myAt = $.isArray(position) ? position : position.split(' '); 781 782 if (typeof position === 'string' || (typeof position === 'object' && '0' in position)) { 783 myAt = position.split ? position.split(' ') : [position[0], position[1]]; 784 if (myAt.length === 1) { 785 myAt[1] = myAt[0]; 786 } 787 788 $.each(['left', 'top'], function(i, offsetPosition) { 789 if (+myAt[i] === myAt[i]) { 790 offset[i] = myAt[i]; 791 myAt[i] = offsetPosition; 792 } 793 }); 794 795 position = { 796 my: myAt.join(" "), 797 at: myAt.join(" "), 798 offset: offset.join(" ") 799 }; 800 } 801 802 position = $.extend({}, $.ui.mydialog.prototype.options.position, position); 803 } else { 804 position = $.ui.mydialog.prototype.options.position; 805 } 806 807 // need to show the dialog to get the actual offset in the position plugin 808 isVisible = this.uiMyDialog.is(':visible'); 809 if (!isVisible) { 810 this.uiMyDialog.show(); 811 } 812 this.uiMyDialog 813 // workaround for jQuery bug #5781 http://dev.jquery.com/ticket/5781 814 .css({ top: 0, left: 0 }) 815 .position(position); 816 if (!isVisible) { 817 this.uiMyDialog.hide(); 818 } 819 }, 820 821 _setOption: function(key, value){ 822 var self = this, 823 uiMyDialog = self.uiMyDialog, 824 isResizable = uiMyDialog.is(':data(resizable)'), 825 resize = false; 826 827 switch (key) { 828 //handling of deprecated beforeclose (vs beforeClose) option 829 //Ticket #4669 http://dev.jqueryui.com/ticket/4669 830 //TODO: remove in 1.9pre 831 case "beforeclose": 832 key = "beforeClose"; 833 break; 834 case "buttons": 835 self._createButtons(value); 836 resize = true; 837 break; 838 case "closeText": 839 // convert whatever was passed in to a string, for text() to not throw up 840 self.uiMyDialogTitlebarCloseText.text("" + value); 841 break; 842 case "dialogClass": 843 uiMyDialog 844 .removeClass(self.options.dialogClass) 845 .addClass(uiMyDialogClasses + value); 846 break; 847 case "disabled": 848 if (value) { 849 uiMyDialog.addClass('ui-dialog-disabled'); 850 } else { 851 uiMyDialog.removeClass('ui-dialog-disabled'); 852 } 853 break; 854 case "draggable": 855 if (value) { 856 self._makeDraggable(); 857 } else { 858 uiMyDialog.draggable('destroy'); 859 } 860 break; 861 case "height": 862 resize = true; 863 break; 864 case "maxHeight": 865 if (isResizable) { 866 uiMyDialog.resizable('option', 'maxHeight', value); 867 } 868 resize = true; 869 break; 870 case "maxWidth": 871 if (isResizable) { 872 uiMyDialog.resizable('option', 'maxWidth', value); 873 } 874 resize = true; 875 break; 876 case "minHeight": 877 if (isResizable) { 878 uiMyDialog.resizable('option', 'minHeight', value); 879 } 880 resize = true; 881 break; 882 case "minWidth": 883 if (isResizable) { 884 uiMyDialog.resizable('option', 'minWidth', value); 885 } 886 resize = true; 887 break; 888 case "position": 889 self._position(value); 890 break; 891 case "resizable": 892 // currently resizable, becoming non-resizable 893 if (isResizable && !value) { 894 uiMyDialog.resizable('destroy'); 895 } 896 897 // currently resizable, changing handles 898 if (isResizable && typeof value === 'string') { 899 uiMyDialog.resizable('option', 'handles', value); 900 } 901 902 // currently non-resizable, becoming resizable 903 if (!isResizable && value !== false) { 904 self._makeResizable(value); 905 } 906 break; 907 case "title": 908 // convert whatever was passed in o a string, for html() to not throw up 909 $(".ui-dialog-title", self.uiMyDialogTitlebar).html("" + (value || ' ')); 910 break; 911 case "width": 912 resize = true; 913 break; 914 } 915 916 $.Widget.prototype._setOption.apply(self, arguments); 917 if (resize) { 918 self._size(); 919 } 920 }, 921 922 _size: function() { 923 /* If the user has resized the dialog, the .ui-dialog and .ui-dialog-content 924 * divs will both have width and height set, so we need to reset them 925 */ 926 var options = this.options, 927 nonContentHeight; 928 929 // reset content sizing 930 // hide for non content measurement because height: 0 doesn't work in IE quirks mode (see #4350) 931 this.element.css({ 932 width: 'auto', 933 minHeight: 0, 934 height: 0 935 }); 936 937 if (options.minWidth > options.width) { 938 options.width = options.minWidth; 939 } 940 941 // reset wrapper sizing 942 // determine the height of all the non-content elements 943 nonContentHeight = this.uiMyDialog.css({ 944 height: 'auto', 945 width: options.width 946 }) 947 .height(); 948 949 this.element 950 .css(options.height === 'auto' ? { 951 minHeight: Math.max(options.minHeight - nonContentHeight, 0), 952 height: 'auto' 953 } : { 954 minHeight: 0, 955 height: Math.max(options.height - nonContentHeight, 0) 956 }) 957 .show(); 958 959 if (this.uiMyDialog.is(':data(resizable)')) { 960 this.uiMyDialog.resizable('option', 'minHeight', this._minHeight()); 961 } 962 } 963 }); 964 965 966 $.extend($.ui.mydialog, { 967 version: "1.8.4", 968 969 uuid: 0, 970 maxZ: 0, 971 972 getTitleId: function($el) { 973 var id = $el.attr('id'); 974 if (!id) { 975 this.uuid += 1; 976 id = this.uuid; 977 } 978 return 'ui-dialog-title-' + id; 979 }, 980 981 overlay: function(dialog) { 982 this.$el = $.ui.mydialog.overlay.create(dialog); 983 } 984 }); 985 986 987 $.extend($.ui.mydialog.overlay, { 988 instances: [], 989 // reuse old instances due to IE memory leak with alpha transparency (see #5185) 990 oldInstances: [], 991 maxZ: 0, 992 events: $.map('focus,mousedown,mouseup,keydown,keypress,click'.split(','), 993 function(event) { return event + '.dialog-overlay'; }).join(' '), 994 create: function(dialog) { 995 if (this.instances.length === 0) { 996 // prevent use of anchors and inputs 997 // we use a setTimeout in case the overlay is created from an 998 // event that we're going to be cancelling (see #2804) 999 setTimeout(function() { 1000 // handle $(el).dialog().dialog('close') (see #4065) 1001 if ($.ui.mydialog.overlay.instances.length) { 1002 $(document).bind($.ui.mydialog.overlay.events, function(event) { 1003 // stop events if the z-index of the target is < the z-index of the overlay 1004 return ($(event.target).zIndex() >= $.ui.mydialog.overlay.maxZ); 1005 }); 1006 } 1007 }, 1); 1008 1009 // allow closing by pressing the escape key 1010 $(document).bind('keydown.dialog-overlay', function(event) { 1011 if (dialog.options.closeOnEscape && event.keyCode && 1012 event.keyCode === $.ui.keyCode.ESCAPE) { 1013 1014 dialog.close(event); 1015 event.preventDefault(); 1016 } 1017 }); 1018 1019 // handle window resize 1020 $(window).bind('resize.dialog-overlay', $.ui.mydialog.overlay.resize); 1021 } 1022 1023 var $el = (this.oldInstances.pop() || $('<div></div>').addClass('ui-widget-overlay')) 1024 .appendTo(document.body) 1025 .css({ 1026 width: this.width(), 1027 height: this.height() 1028 }); 1029 1030 if ($.fn.bgiframe) { 1031 $el.bgiframe(); 1032 } 1033 1034 this.instances.push($el); 1035 return $el; 1036 }, 1037 1038 destroy: function($el) { 1039 this.oldInstances.push(this.instances.splice($.inArray($el, this.instances), 1)[0]); 1040 1041 if (this.instances.length === 0) { 1042 $([document, window]).unbind('.dialog-overlay'); 1043 } 1044 1045 $el.remove(); 1046 1047 // adjust the maxZ to allow other modal dialogs to continue to work (see #4309) 1048 var maxZ = 0; 1049 $.each(this.instances, function() { 1050 maxZ = Math.max(maxZ, this.css('z-index')); 1051 }); 1052 this.maxZ = maxZ; 1053 }, 1054 1055 height: function() { 1056 var scrollHeight, 1057 offsetHeight; 1058 // handle IE 6 1059 if ($.browser.msie && $.browser.version < 7) { 1060 scrollHeight = Math.max( 1061 document.documentElement.scrollHeight, 1062 document.body.scrollHeight 1063 ); 1064 offsetHeight = Math.max( 1065 document.documentElement.offsetHeight, 1066 document.body.offsetHeight 1067 ); 1068 1069 if (scrollHeight < offsetHeight) { 1070 return $(window).height() + 'px'; 1071 } else { 1072 return scrollHeight + 'px'; 1073 } 1074 // handle "good" browsers 1075 } else { 1076 return $(document).height() + 'px'; 1077 } 1078 }, 1079 1080 width: function() { 1081 var scrollWidth, 1082 offsetWidth; 1083 // handle IE 6 1084 if ($.browser.msie && $.browser.version < 7) { 1085 scrollWidth = Math.max( 1086 document.documentElement.scrollWidth, 1087 document.body.scrollWidth 1088 ); 1089 offsetWidth = Math.max( 1090 document.documentElement.offsetWidth, 1091 document.body.offsetWidth 1092 ); 1093 1094 if (scrollWidth < offsetWidth) { 1095 return $(window).width() + 'px'; 1096 } else { 1097 return scrollWidth + 'px'; 1098 } 1099 // handle "good" browsers 1100 } else { 1101 return $(document).width() + 'px'; 1102 } 1103 }, 1104 1105 resize: function() { 1106 /* If the dialog is draggable and the user drags it past the 1107 * right edge of the window, the document becomes wider so we 1108 * need to stretch the overlay. If the user then drags the 1109 * dialog back to the left, the document will become narrower, 1110 * so we need to shrink the overlay to the appropriate size. 1111 * This is handled by shrinking the overlay before setting it 1112 * to the full document size. 1113 */ 1114 var $overlays = $([]); 1115 $.each($.ui.mydialog.overlay.instances, function() { 1116 $overlays = $overlays.add(this); 1117 }); 1118 1119 $overlays.css({ 1120 width: 0, 1121 height: 0 1122 }).css({ 1123 width: $.ui.mydialog.overlay.width(), 1124 height: $.ui.mydialog.overlay.height() 1125 }); 1126 } 1127 }); 1128 1129 $.extend($.ui.mydialog.overlay.prototype, { 1130 destroy: function() { 1131 $.ui.mydialog.overlay.destroy(this.$el); 1132 } 1133 }); 1134 280 1135 281 1136 // Open Video Player link … … 290 1145 autoOpen: false, 291 1146 height: 620, 292 width: 645,1147 width: 785, 293 1148 modal: true, 294 1149 beforeclose: function(event, ui) { … … 301 1156 }); 302 1157 $( "#subtitles" ).button( "option", "label", "Subtitles"); 1158 $( "#audiotracks" ).button( "option", "label", "Audio Track(s)"); 303 1159 }, 304 1160 resizeStart: function(event, ui) { … … 307 1163 resizeStop: function(event, ui) { setPlayerSize(); } 308 1164 }); 1165 1166 1167 //Video Player info sub-window 1168 $( "#infodialog" ).mydialog({ 1169 autoOpen: false, 1170 zIndex: 100000, 1171 show: "clip", 1172 hide: "clip", 1173 position: 'top', 1174 width: 460, 1175 buttons: { 1176 Ok: function() { 1177 $( this ).mydialog( "close" ); 1178 } 1179 } 1180 }); 1181 309 1182 310 1183 //Hover states on the Video Player link … … 406 1279 }); 407 1280 1281 $('#audiotracks').button({ 1282 icons: {primary: 'ui-icon-comment'}, 1283 disabled: true 1284 }) 1285 .click(function() { 1286 changeAudioTrack(); 1287 }); 1288 1289 $('#info').button({ 1290 text: false, 1291 icons: { 1292 primary: 'ui-icon-info' 1293 } 1294 }) 1295 .click(function() { 1296 $('#infodialog').mydialog('open'); 1297 }); 1298 408 1299 //Seeking bar 409 1300 $('#slider').slider({
Note:
See TracChangeset
for help on using the changeset viewer.