[BUGFIX] Set active tab when DOM is ready
[Packages/TYPO3.CMS.git] / typo3 / sysext / backend / Resources / Private / TypeScript / Tabs.ts
1 /*
2  * This file is part of the TYPO3 CMS project.
3  *
4  * It is free software; you can redistribute it and/or modify it under
5  * the terms of the GNU General Public License, either version 2
6  * of the License, or any later version.
7  *
8  * For the full copyright and license information, please read the
9  * LICENSE.txt file that was distributed with this source code.
10  *
11  * The TYPO3 project - inspiring people to share!
12  */
13
14 import 'bootstrap';
15 import * as $ from 'jquery';
16 import Client = require('./Storage/Client');
17
18 /**
19  * Module: TYPO3/CMS/Backend/Tabs
20  * @exports TYPO3/CMS/Backend/Tabs
21  */
22 class Tabs {
23
24   public storage: any;
25   protected cacheTimeInSeconds: number = 1800;
26   protected storeLastActiveTab: boolean = true;
27
28   /**
29    * Resolve timestamp
30    */
31   public static getTimestamp(): number {
32     return Math.round((new Date()).getTime() / 1000);
33   }
34
35   constructor() {
36     this.storage = Client;
37
38     const that = this;
39     $((): void => {
40       $('.t3js-tabs').each(function(this: Element): void {
41         const $tabContainer: JQuery = $(this);
42         that.storeLastActiveTab = $tabContainer.data('storeLastTab') === 1;
43         const currentActiveTab = that.receiveActiveTab($tabContainer.attr('id'));
44         if (currentActiveTab) {
45           $tabContainer.find('a[href="' + currentActiveTab + '"]').tab('show');
46         }
47         $tabContainer.on('show.bs.tab', (e: any) => {
48           if (that.storeLastActiveTab) {
49             const id = e.currentTarget.id;
50             const target = e.target.hash;
51             that.storeActiveTab(id, target);
52           }
53         });
54       });
55     });
56   }
57
58   /**
59    * Receive active tab from storage
60    *
61    * @param {string} id
62    * @returns {string}
63    */
64   public receiveActiveTab(id: string): string {
65     const target = this.storage.get(id) || '';
66     const expire = this.storage.get(id + '.expire') || 0;
67     if (expire > Tabs.getTimestamp()) {
68       return target;
69     }
70     return '';
71   }
72
73   /**
74    * Set active tab to storage
75    *
76    * @param {string} id
77    * @param {string} target
78    */
79   public storeActiveTab(id: string, target: string): void {
80     this.storage.set(id, target);
81     this.storage.set(id + '.expire', Tabs.getTimestamp() + this.cacheTimeInSeconds);
82   }
83 }
84
85 const tabs = new Tabs();
86 export = tabs;