Otaku-Projects /
AngularJS-CRUD-PHP
| @@ 3662-3829 (lines=168) @@ | ||
| 3659 | ||
| 3660 | })(UIkit2); |
|
| 3661 | ||
| 3662 | (function(UI) { |
|
| 3663 | ||
| 3664 | "use strict"; |
|
| 3665 | ||
| 3666 | UI.component('tab', { |
|
| 3667 | ||
| 3668 | defaults: { |
|
| 3669 | target : '>li:not(.uk-tab-responsive, .uk-disabled)', |
|
| 3670 | connect : false, |
|
| 3671 | active : 0, |
|
| 3672 | animation : false, |
|
| 3673 | duration : 200, |
|
| 3674 | swiping : true |
|
| 3675 | }, |
|
| 3676 | ||
| 3677 | boot: function() { |
|
| 3678 | ||
| 3679 | // init code |
|
| 3680 | UI.ready(function(context) { |
|
| 3681 | ||
| 3682 | UI.$('[data-uk-tab]', context).each(function() { |
|
| 3683 | ||
| 3684 | var tab = UI.$(this); |
|
| 3685 | ||
| 3686 | if (!tab.data('tab')) { |
|
| 3687 | var obj = UI.tab(tab, UI.Utils.options(tab.attr('data-uk-tab'))); |
|
| 3688 | } |
|
| 3689 | }); |
|
| 3690 | }); |
|
| 3691 | }, |
|
| 3692 | ||
| 3693 | init: function() { |
|
| 3694 | ||
| 3695 | var $this = this; |
|
| 3696 | ||
| 3697 | this.current = false; |
|
| 3698 | ||
| 3699 | this.on('click.uk.tab', this.options.target, function(e) { |
|
| 3700 | ||
| 3701 | e.preventDefault(); |
|
| 3702 | ||
| 3703 | if ($this.switcher && $this.switcher.animating) { |
|
| 3704 | return; |
|
| 3705 | } |
|
| 3706 | ||
| 3707 | var current = $this.find($this.options.target).not(this); |
|
| 3708 | ||
| 3709 | current.removeClass('uk-active').blur(); |
|
| 3710 | ||
| 3711 | $this.trigger('change.uk.tab', [UI.$(this).addClass('uk-active'), $this.current]); |
|
| 3712 | ||
| 3713 | $this.current = UI.$(this); |
|
| 3714 | ||
| 3715 | // Update ARIA |
|
| 3716 | if (!$this.options.connect) { |
|
| 3717 | current.attr('aria-expanded', 'false'); |
|
| 3718 | UI.$(this).attr('aria-expanded', 'true'); |
|
| 3719 | } |
|
| 3720 | }); |
|
| 3721 | ||
| 3722 | if (this.options.connect) { |
|
| 3723 | this.connect = UI.$(this.options.connect); |
|
| 3724 | } |
|
| 3725 | ||
| 3726 | // init responsive tab |
|
| 3727 | this.responsivetab = UI.$('<li class="uk-tab-responsive uk-active"><a></a></li>').append('<div class="uk-dropdown uk-dropdown-small"><ul class="uk-nav uk-nav-dropdown"></ul><div>'); |
|
| 3728 | ||
| 3729 | this.responsivetab.dropdown = this.responsivetab.find('.uk-dropdown'); |
|
| 3730 | this.responsivetab.lst = this.responsivetab.dropdown.find('ul'); |
|
| 3731 | this.responsivetab.caption = this.responsivetab.find('a:first'); |
|
| 3732 | ||
| 3733 | if (this.element.hasClass('uk-tab-bottom')) this.responsivetab.dropdown.addClass('uk-dropdown-up'); |
|
| 3734 | ||
| 3735 | // handle click |
|
| 3736 | this.responsivetab.lst.on('click.uk.tab', 'a', function(e) { |
|
| 3737 | ||
| 3738 | e.preventDefault(); |
|
| 3739 | e.stopPropagation(); |
|
| 3740 | ||
| 3741 | var link = UI.$(this); |
|
| 3742 | ||
| 3743 | $this.element.children('li:not(.uk-tab-responsive)').eq(link.data('index')).trigger('click'); |
|
| 3744 | }); |
|
| 3745 | ||
| 3746 | this.on('show.uk.switcher change.uk.tab', function(e, tab) { |
|
| 3747 | $this.responsivetab.caption.html(tab.text()); |
|
| 3748 | }); |
|
| 3749 | ||
| 3750 | this.element.append(this.responsivetab); |
|
| 3751 | ||
| 3752 | // init UIkit components |
|
| 3753 | if (this.options.connect) { |
|
| 3754 | ||
| 3755 | this.switcher = UI.switcher(this.element, { |
|
| 3756 | toggle : '>li:not(.uk-tab-responsive)', |
|
| 3757 | connect : this.options.connect, |
|
| 3758 | active : this.options.active, |
|
| 3759 | animation : this.options.animation, |
|
| 3760 | duration : this.options.duration, |
|
| 3761 | swiping : this.options.swiping |
|
| 3762 | }); |
|
| 3763 | } |
|
| 3764 | ||
| 3765 | UI.dropdown(this.responsivetab, {mode: 'click', preventflip: 'y'}); |
|
| 3766 | ||
| 3767 | // init |
|
| 3768 | $this.trigger('change.uk.tab', [this.element.find(this.options.target).not('.uk-tab-responsive').filter('.uk-active')]); |
|
| 3769 | ||
| 3770 | this.check(); |
|
| 3771 | ||
| 3772 | UI.$win.on('resize orientationchange', UI.Utils.debounce(function(){ |
|
| 3773 | if ($this.element.is(':visible')) $this.check(); |
|
| 3774 | }, 100)); |
|
| 3775 | ||
| 3776 | this.on('display.uk.check', function(){ |
|
| 3777 | if ($this.element.is(':visible')) $this.check(); |
|
| 3778 | }); |
|
| 3779 | }, |
|
| 3780 | ||
| 3781 | check: function() { |
|
| 3782 | ||
| 3783 | var children = this.element.children('li:not(.uk-tab-responsive)').removeClass('uk-hidden'); |
|
| 3784 | ||
| 3785 | if (!children.length) { |
|
| 3786 | this.responsivetab.addClass('uk-hidden'); |
|
| 3787 | return; |
|
| 3788 | } |
|
| 3789 | ||
| 3790 | var top = (children.eq(0).offset().top + Math.ceil(children.eq(0).height()/2)), |
|
| 3791 | doresponsive = false, |
|
| 3792 | item, link, clone; |
|
| 3793 | ||
| 3794 | this.responsivetab.lst.empty(); |
|
| 3795 | ||
| 3796 | children.each(function(){ |
|
| 3797 | ||
| 3798 | if (UI.$(this).offset().top > top) { |
|
| 3799 | doresponsive = true; |
|
| 3800 | } |
|
| 3801 | }); |
|
| 3802 | ||
| 3803 | if (doresponsive) { |
|
| 3804 | ||
| 3805 | for (var i = 0; i < children.length; i++) { |
|
| 3806 | ||
| 3807 | item = UI.$(children.eq(i)); |
|
| 3808 | link = item.find('a'); |
|
| 3809 | ||
| 3810 | if (item.css('float') != 'none' && !item.attr('uk-dropdown')) { |
|
| 3811 | ||
| 3812 | if (!item.hasClass('uk-disabled')) { |
|
| 3813 | ||
| 3814 | clone = UI.$(item[0].outerHTML); |
|
| 3815 | clone.find('a').data('index', i); |
|
| 3816 | ||
| 3817 | this.responsivetab.lst.append(clone); |
|
| 3818 | } |
|
| 3819 | ||
| 3820 | item.addClass('uk-hidden'); |
|
| 3821 | } |
|
| 3822 | } |
|
| 3823 | } |
|
| 3824 | ||
| 3825 | this.responsivetab[this.responsivetab.lst.children('li').length ? 'removeClass':'addClass']('uk-hidden'); |
|
| 3826 | } |
|
| 3827 | }); |
|
| 3828 | ||
| 3829 | })(UIkit2); |
|
| 3830 | ||
| 3831 | (function(UI){ |
|
| 3832 | ||
| @@ 2-169 (lines=168) @@ | ||
| 1 | /*! UIkit 2.27.4 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ |
|
| 2 | (function(UI) { |
|
| 3 | ||
| 4 | "use strict"; |
|
| 5 | ||
| 6 | UI.component('tab', { |
|
| 7 | ||
| 8 | defaults: { |
|
| 9 | target : '>li:not(.uk-tab-responsive, .uk-disabled)', |
|
| 10 | connect : false, |
|
| 11 | active : 0, |
|
| 12 | animation : false, |
|
| 13 | duration : 200, |
|
| 14 | swiping : true |
|
| 15 | }, |
|
| 16 | ||
| 17 | boot: function() { |
|
| 18 | ||
| 19 | // init code |
|
| 20 | UI.ready(function(context) { |
|
| 21 | ||
| 22 | UI.$('[data-uk-tab]', context).each(function() { |
|
| 23 | ||
| 24 | var tab = UI.$(this); |
|
| 25 | ||
| 26 | if (!tab.data('tab')) { |
|
| 27 | var obj = UI.tab(tab, UI.Utils.options(tab.attr('data-uk-tab'))); |
|
| 28 | } |
|
| 29 | }); |
|
| 30 | }); |
|
| 31 | }, |
|
| 32 | ||
| 33 | init: function() { |
|
| 34 | ||
| 35 | var $this = this; |
|
| 36 | ||
| 37 | this.current = false; |
|
| 38 | ||
| 39 | this.on('click.uk.tab', this.options.target, function(e) { |
|
| 40 | ||
| 41 | e.preventDefault(); |
|
| 42 | ||
| 43 | if ($this.switcher && $this.switcher.animating) { |
|
| 44 | return; |
|
| 45 | } |
|
| 46 | ||
| 47 | var current = $this.find($this.options.target).not(this); |
|
| 48 | ||
| 49 | current.removeClass('uk-active').blur(); |
|
| 50 | ||
| 51 | $this.trigger('change.uk.tab', [UI.$(this).addClass('uk-active'), $this.current]); |
|
| 52 | ||
| 53 | $this.current = UI.$(this); |
|
| 54 | ||
| 55 | // Update ARIA |
|
| 56 | if (!$this.options.connect) { |
|
| 57 | current.attr('aria-expanded', 'false'); |
|
| 58 | UI.$(this).attr('aria-expanded', 'true'); |
|
| 59 | } |
|
| 60 | }); |
|
| 61 | ||
| 62 | if (this.options.connect) { |
|
| 63 | this.connect = UI.$(this.options.connect); |
|
| 64 | } |
|
| 65 | ||
| 66 | // init responsive tab |
|
| 67 | this.responsivetab = UI.$('<li class="uk-tab-responsive uk-active"><a></a></li>').append('<div class="uk-dropdown uk-dropdown-small"><ul class="uk-nav uk-nav-dropdown"></ul><div>'); |
|
| 68 | ||
| 69 | this.responsivetab.dropdown = this.responsivetab.find('.uk-dropdown'); |
|
| 70 | this.responsivetab.lst = this.responsivetab.dropdown.find('ul'); |
|
| 71 | this.responsivetab.caption = this.responsivetab.find('a:first'); |
|
| 72 | ||
| 73 | if (this.element.hasClass('uk-tab-bottom')) this.responsivetab.dropdown.addClass('uk-dropdown-up'); |
|
| 74 | ||
| 75 | // handle click |
|
| 76 | this.responsivetab.lst.on('click.uk.tab', 'a', function(e) { |
|
| 77 | ||
| 78 | e.preventDefault(); |
|
| 79 | e.stopPropagation(); |
|
| 80 | ||
| 81 | var link = UI.$(this); |
|
| 82 | ||
| 83 | $this.element.children('li:not(.uk-tab-responsive)').eq(link.data('index')).trigger('click'); |
|
| 84 | }); |
|
| 85 | ||
| 86 | this.on('show.uk.switcher change.uk.tab', function(e, tab) { |
|
| 87 | $this.responsivetab.caption.html(tab.text()); |
|
| 88 | }); |
|
| 89 | ||
| 90 | this.element.append(this.responsivetab); |
|
| 91 | ||
| 92 | // init UIkit components |
|
| 93 | if (this.options.connect) { |
|
| 94 | ||
| 95 | this.switcher = UI.switcher(this.element, { |
|
| 96 | toggle : '>li:not(.uk-tab-responsive)', |
|
| 97 | connect : this.options.connect, |
|
| 98 | active : this.options.active, |
|
| 99 | animation : this.options.animation, |
|
| 100 | duration : this.options.duration, |
|
| 101 | swiping : this.options.swiping |
|
| 102 | }); |
|
| 103 | } |
|
| 104 | ||
| 105 | UI.dropdown(this.responsivetab, {mode: 'click', preventflip: 'y'}); |
|
| 106 | ||
| 107 | // init |
|
| 108 | $this.trigger('change.uk.tab', [this.element.find(this.options.target).not('.uk-tab-responsive').filter('.uk-active')]); |
|
| 109 | ||
| 110 | this.check(); |
|
| 111 | ||
| 112 | UI.$win.on('resize orientationchange', UI.Utils.debounce(function(){ |
|
| 113 | if ($this.element.is(':visible')) $this.check(); |
|
| 114 | }, 100)); |
|
| 115 | ||
| 116 | this.on('display.uk.check', function(){ |
|
| 117 | if ($this.element.is(':visible')) $this.check(); |
|
| 118 | }); |
|
| 119 | }, |
|
| 120 | ||
| 121 | check: function() { |
|
| 122 | ||
| 123 | var children = this.element.children('li:not(.uk-tab-responsive)').removeClass('uk-hidden'); |
|
| 124 | ||
| 125 | if (!children.length) { |
|
| 126 | this.responsivetab.addClass('uk-hidden'); |
|
| 127 | return; |
|
| 128 | } |
|
| 129 | ||
| 130 | var top = (children.eq(0).offset().top + Math.ceil(children.eq(0).height()/2)), |
|
| 131 | doresponsive = false, |
|
| 132 | item, link, clone; |
|
| 133 | ||
| 134 | this.responsivetab.lst.empty(); |
|
| 135 | ||
| 136 | children.each(function(){ |
|
| 137 | ||
| 138 | if (UI.$(this).offset().top > top) { |
|
| 139 | doresponsive = true; |
|
| 140 | } |
|
| 141 | }); |
|
| 142 | ||
| 143 | if (doresponsive) { |
|
| 144 | ||
| 145 | for (var i = 0; i < children.length; i++) { |
|
| 146 | ||
| 147 | item = UI.$(children.eq(i)); |
|
| 148 | link = item.find('a'); |
|
| 149 | ||
| 150 | if (item.css('float') != 'none' && !item.attr('uk-dropdown')) { |
|
| 151 | ||
| 152 | if (!item.hasClass('uk-disabled')) { |
|
| 153 | ||
| 154 | clone = UI.$(item[0].outerHTML); |
|
| 155 | clone.find('a').data('index', i); |
|
| 156 | ||
| 157 | this.responsivetab.lst.append(clone); |
|
| 158 | } |
|
| 159 | ||
| 160 | item.addClass('uk-hidden'); |
|
| 161 | } |
|
| 162 | } |
|
| 163 | } |
|
| 164 | ||
| 165 | this.responsivetab[this.responsivetab.lst.children('li').length ? 'removeClass':'addClass']('uk-hidden'); |
|
| 166 | } |
|
| 167 | }); |
|
| 168 | ||
| 169 | })(UIkit2); |
|
| 170 | ||
