| Tang Cheng | 60ba803 | 2016-06-20 15:31:17 +0800 | [diff] [blame^] | 1 | /*! |
| 2 | * Buttons helper for fancyBox |
| 3 | * version: 1.0.5 (Mon, 15 Oct 2012) |
| 4 | * @requires fancyBox v2.0 or later |
| 5 | * |
| 6 | * Usage: |
| 7 | * $(".fancybox").fancybox({ |
| 8 | * helpers : { |
| 9 | * buttons: { |
| 10 | * position : 'top' |
| 11 | * } |
| 12 | * } |
| 13 | * }); |
| 14 | * |
| 15 | */ |
| 16 | ;(function ($) { |
| 17 | //Shortcut for fancyBox object |
| 18 | var F = $.fancybox; |
| 19 | |
| 20 | //Add helper object |
| 21 | F.helpers.buttons = { |
| 22 | defaults : { |
| 23 | skipSingle : false, // disables if gallery contains single image |
| 24 | position : 'top', // 'top' or 'bottom' |
| 25 | tpl : '<div id="fancybox-buttons"><ul><li><a class="btnPrev" title="Previous" href="javascript:;"></a></li><li><a class="btnPlay" title="Start slideshow" href="javascript:;"></a></li><li><a class="btnNext" title="Next" href="javascript:;"></a></li><li><a class="btnToggle" title="Toggle size" href="javascript:;"></a></li><li><a class="btnClose" title="Close" href="javascript:;"></a></li></ul></div>' |
| 26 | }, |
| 27 | |
| 28 | list : null, |
| 29 | buttons: null, |
| 30 | |
| 31 | beforeLoad: function (opts, obj) { |
| 32 | //Remove self if gallery do not have at least two items |
| 33 | |
| 34 | if (opts.skipSingle && obj.group.length < 2) { |
| 35 | obj.helpers.buttons = false; |
| 36 | obj.closeBtn = true; |
| 37 | |
| 38 | return; |
| 39 | } |
| 40 | |
| 41 | //Increase top margin to give space for buttons |
| 42 | obj.margin[ opts.position === 'bottom' ? 2 : 0 ] += 30; |
| 43 | }, |
| 44 | |
| 45 | onPlayStart: function () { |
| 46 | if (this.buttons) { |
| 47 | this.buttons.play.attr('title', 'Pause slideshow').addClass('btnPlayOn'); |
| 48 | } |
| 49 | }, |
| 50 | |
| 51 | onPlayEnd: function () { |
| 52 | if (this.buttons) { |
| 53 | this.buttons.play.attr('title', 'Start slideshow').removeClass('btnPlayOn'); |
| 54 | } |
| 55 | }, |
| 56 | |
| 57 | afterShow: function (opts, obj) { |
| 58 | var buttons = this.buttons; |
| 59 | |
| 60 | if (!buttons) { |
| 61 | this.list = $(opts.tpl).addClass(opts.position).appendTo('body'); |
| 62 | |
| 63 | buttons = { |
| 64 | prev : this.list.find('.btnPrev').click( F.prev ), |
| 65 | next : this.list.find('.btnNext').click( F.next ), |
| 66 | play : this.list.find('.btnPlay').click( F.play ), |
| 67 | toggle : this.list.find('.btnToggle').click( F.toggle ), |
| 68 | close : this.list.find('.btnClose').click( F.close ) |
| 69 | } |
| 70 | } |
| 71 | |
| 72 | //Prev |
| 73 | if (obj.index > 0 || obj.loop) { |
| 74 | buttons.prev.removeClass('btnDisabled'); |
| 75 | } else { |
| 76 | buttons.prev.addClass('btnDisabled'); |
| 77 | } |
| 78 | |
| 79 | //Next / Play |
| 80 | if (obj.loop || obj.index < obj.group.length - 1) { |
| 81 | buttons.next.removeClass('btnDisabled'); |
| 82 | buttons.play.removeClass('btnDisabled'); |
| 83 | |
| 84 | } else { |
| 85 | buttons.next.addClass('btnDisabled'); |
| 86 | buttons.play.addClass('btnDisabled'); |
| 87 | } |
| 88 | |
| 89 | this.buttons = buttons; |
| 90 | |
| 91 | this.onUpdate(opts, obj); |
| 92 | }, |
| 93 | |
| 94 | onUpdate: function (opts, obj) { |
| 95 | var toggle; |
| 96 | |
| 97 | if (!this.buttons) { |
| 98 | return; |
| 99 | } |
| 100 | |
| 101 | toggle = this.buttons.toggle.removeClass('btnDisabled btnToggleOn'); |
| 102 | |
| 103 | //Size toggle button |
| 104 | if (obj.canShrink) { |
| 105 | toggle.addClass('btnToggleOn'); |
| 106 | |
| 107 | } else if (!obj.canExpand) { |
| 108 | toggle.addClass('btnDisabled'); |
| 109 | } |
| 110 | }, |
| 111 | |
| 112 | beforeClose: function () { |
| 113 | if (this.list) { |
| 114 | this.list.remove(); |
| 115 | } |
| 116 | |
| 117 | this.list = null; |
| 118 | this.buttons = null; |
| 119 | } |
| 120 | }; |
| 121 | |
| 122 | }(jQuery)); |