<commit_before>Kwf.onContentReady(function() {
    var els = Ext.query('div.kwfTabs');
    els.forEach(function(el) {
        el = Ext.get(el);
        if (!el.tabsObject) {
            el.tabsObject = new Kwf.Tabs(el);
        }
    });
});


Kwf.Tabs = function(el) {
    this.addEvents({
        'beforeTabActivate': true,
        'tabActivate': true
    });

    this.el = el;
    this.el.addClass('kwfTabsFx');
    this._activeTabIdx = null;
    this.switchEls = Ext.query('> .kwfTabsLink', this.el.dom);
    this.contentEls = Ext.query('> .kwfTabsContent', this.el.dom);
    this.fxDuration = .5;

    this.tabsContents = this.el.createChild({
        tag: 'div', cls: 'kwfTabsContents'
    }, this.el.first());
    var tabsLinks = this.el.createChild({
        tag: 'div', cls: 'kwfTabsLinks'
    }, this.tabsContents);

    for (var i = 0; i < this.contentEls.length; i++) {
        this.tabsContents.appendChild(this.contentEls[i]);
    }

    var activeTabIdx = false;
    for (var i = 0; i < this.switchEls.length; i++) {
        tabsLinks.appendChild(this.switchEls[i]);
        var swEl = Ext.get(this.switchEls[i]);

        Ext.get(this.contentEls[i]).enableDisplayMode('block');
        Ext.get(this.contentEls[i]).setVisible(false);
        Ext.get(this.switchEls[i]).removeClass('kwfTabsLinkActive');

        // if it is important, show on startup
        if (Ext.get(this.contentEls[i]).child('.kwfImportant')) {
            activeTabIdx = i;
        }

        if (activeTabIdx === false && Ext.get(this.contentEls[i]).hasClass('kwfTabsContentActive')) {
            activeTabIdx = i;
            Ext.get(this.contentEls[i]).removeClass('kwfTabsContentActive');
        }

        swEl.on('click', function() {
            this.tabsObject.activateTab(this.idx);
        }, { tabsObject: this, idx: i } );
    }


    tabsLinks.createChild({
        tag: 'div', cls: 'clear'
    });

    //show first tab as default
    if (activeTabIdx === false && this.switchEls.length) {
        activeTabIdx = 0;
    }

    if (activeTabIdx !== false) {
        Ext.get(this.switchEls[activeTabIdx]).addClass('kwfTabsLinkActive');
        Ext.get(this.contentEls[activeTabIdx]).setVisible(true);
        this._activeTabIdx = activeTabIdx;
    }
};

Ext.extend(Kwf.Tabs, Ext.util.Observable, {
    activateTab: function(idx) {
        // passed arguments are: tabsObject, newIndex, oldIndex
        this.fireEvent('beforeTabActivate', this, idx, this._activeTabIdx);
        if (this._activeTabIdx == idx) return;

        var newContentEl = Ext.get(this.contentEls[idx]);
        Ext.get(this.switchEls[idx]).addClass('kwfTabsLinkActive');
        newContentEl.setStyle('z-index', '1');
        newContentEl.setOpacity(1);
        newContentEl.setVisible(true);
        newContentEl.addClass('kwfTabsContentActive');

        var oldContentEl = Ext.get(this.contentEls[this._activeTabIdx]);

        oldContentEl.stopFx();
        newContentEl.stopFx();
        this.tabsContents.stopFx();

        if (this._activeTabIdx !== null) {
            Ext.get(this.switchEls[this._activeTabIdx]).removeClass('kwfTabsLinkActive');
            oldContentEl.setStyle('position', 'absolute');
            newContentEl.setStyle('position', 'absolute');
            oldContentEl.setStyle('z-index', '2');
            newContentEl.setStyle('z-index', '1');
            oldContentEl.setVisible(false);
        }
        Kwf.callOnContentReady(this.contentEls[idx], {newRender: false});
        if (this._activeTabIdx !== null) {
            oldContentEl.setVisible(true);

            newContentEl.fadeIn({
                duration: this.fxDuration
            });
            oldContentEl.fadeOut({
                duration: this.fxDuration,
                callback: function(el) {
                    this.oldEl.setStyle('position', 'static');
                    this.oldEl.removeClass('kwfTabsContentActive');

                    this.newEl.setStyle('position', 'static');
                    this.newEl.setVisible(true);
                    this.newEl.setOpacity(1);
                },
                scope: {
                    oldEl: oldContentEl,
                    newEl: newContentEl<commit_msg>do the callonContentReady before changing the position to absolute<commit_after>Kwf.onContentReady(function() {
    var els = Ext.query('div.kwfTabs');
    els.forEach(function(el) {
        el = Ext.get(el);
        if (!el.tabsObject) {
            el.tabsObject = new Kwf.Tabs(el);
        }
    });
});


Kwf.Tabs = function(el) {
    this.addEvents({
        'beforeTabActivate': true,
        'tabActivate': true
    });

    this.el = el;
    this.el.addClass('kwfTabsFx');
    this._activeTabIdx = null;
    this.switchEls = Ext.query('> .kwfTabsLink', this.el.dom);
    this.contentEls = Ext.query('> .kwfTabsContent', this.el.dom);
    this.fxDuration = .5;

    this.tabsContents = this.el.createChild({
        tag: 'div', cls: 'kwfTabsContents'
    }, this.el.first());
    var tabsLinks = this.el.createChild({
        tag: 'div', cls: 'kwfTabsLinks'
    }, this.tabsContents);

    for (var i = 0; i < this.contentEls.length; i++) {
        this.tabsContents.appendChild(this.contentEls[i]);
    }

    var activeTabIdx = false;
    for (var i = 0; i < this.switchEls.length; i++) {
        tabsLinks.appendChild(this.switchEls[i]);
        var swEl = Ext.get(this.switchEls[i]);

        Ext.get(this.contentEls[i]).enableDisplayMode('block');
        Ext.get(this.contentEls[i]).setVisible(false);
        Ext.get(this.switchEls[i]).removeClass('kwfTabsLinkActive');

        // if it is important, show on startup
        if (Ext.get(this.contentEls[i]).child('.kwfImportant')) {
            activeTabIdx = i;
        }

        if (activeTabIdx === false && Ext.get(this.contentEls[i]).hasClass('kwfTabsContentActive')) {
            activeTabIdx = i;
            Ext.get(this.contentEls[i]).removeClass('kwfTabsContentActive');
        }

        swEl.on('click', function() {
            this.tabsObject.activateTab(this.idx);
        }, { tabsObject: this, idx: i } );
    }


    tabsLinks.createChild({
        tag: 'div', cls: 'clear'
    });

    //show first tab as default
    if (activeTabIdx === false && this.switchEls.length) {
        activeTabIdx = 0;
    }

    if (activeTabIdx !== false) {
        Ext.get(this.switchEls[activeTabIdx]).addClass('kwfTabsLinkActive');
        Ext.get(this.contentEls[activeTabIdx]).setVisible(true);
        this._activeTabIdx = activeTabIdx;
    }
};

Ext.extend(Kwf.Tabs, Ext.util.Observable, {
    activateTab: function(idx) {
        // passed arguments are: tabsObject, newIndex, oldIndex
        this.fireEvent('beforeTabActivate', this, idx, this._activeTabIdx);
        if (this._activeTabIdx == idx) return;

        var newContentEl = Ext.get(this.contentEls[idx]);
        Ext.get(this.switchEls[idx]).addClass('kwfTabsLinkActive');
        newContentEl.setStyle('z-index', '1');
        newContentEl.setOpacity(1);
        newContentEl.setVisible(true);
        newContentEl.addClass('kwfTabsContentActive');

        var oldContentEl = Ext.get(this.contentEls[this._activeTabIdx]);

        oldContentEl.stopFx();
        newContentEl.stopFx();
        this.tabsContents.stopFx();
        if (this._activeTabIdx !== null) {
            Ext.get(this.switchEls[this._activeTabIdx]).removeClass('kwfTabsLinkActive');
            oldContentEl.setStyle('z-index', '2');
            newContentEl.setStyle('z-index', '1');
            Kwf.callOnContentReady(this.contentEls[idx], {newRender: false});
            oldContentEl.setStyle('position', 'absolute');
            newContentEl.setStyle('position', 'absolute');
            oldContentEl.setVisible(false);
        }
        if (this._activeTabIdx !== null) {
            oldContentEl.setVisible(true);

            newContentEl.fadeIn({
                duration: this.fxDuration
            });
            oldContentEl.fadeOut({
                duration: this.fxDuration,
                callback: function(el) {
                    this.oldEl.setStyle('position', 'static');
                    this.oldEl.removeClass('kwfTabsContentActive');

                    this.newEl.setStyle('position', 'static');
                    this.newEl.setVisible(true);
                    this.newEl.setOpacity(1);
                },
                scope: {
                    oldEl: oldContentEl,
                    newEl: newContentEl
{'fraction_non_alphanumeric': 0.1446124763705104, 'fraction_numerical': 0.0021266540642722116, 'mean_word_length': 2.3118153364632237, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3192791', 'n_tokens_mistral': 2695, 'n_tokens_neox': 2619, 'n_words': 397}