balmet.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

mctabs.js (4160B)

      1 /**
      2  * mctabs.js
      3  *
      4  * Released under LGPL License.
      5  * Copyright (c) 1999-2017 Ephox Corp. All rights reserved
      6  *
      7  * License: http://www.tinymce.com/license
      8  * Contributing: http://www.tinymce.com/contributing
      9  */
     10 
     11 /*jshint globals: tinyMCEPopup */
     12 
     13 function MCTabs() {
     14   this.settings = [];
     15   this.onChange = tinyMCEPopup.editor.windowManager.createInstance('tinymce.util.Dispatcher');
     16 }
     17 
     18 MCTabs.prototype.init = function (settings) {
     19   this.settings = settings;
     20 };
     21 
     22 MCTabs.prototype.getParam = function (name, default_value) {
     23   var value = null;
     24 
     25   value = (typeof (this.settings[name]) == "undefined") ? default_value : this.settings[name];
     26 
     27   // Fix bool values
     28   if (value == "true" || value == "false") {
     29     return (value == "true");
     30   }
     31 
     32   return value;
     33 };
     34 
     35 MCTabs.prototype.showTab = function (tab) {
     36   tab.className = 'current';
     37   tab.setAttribute("aria-selected", true);
     38   tab.setAttribute("aria-expanded", true);
     39   tab.tabIndex = 0;
     40 };
     41 
     42 MCTabs.prototype.hideTab = function (tab) {
     43   var t = this;
     44 
     45   tab.className = '';
     46   tab.setAttribute("aria-selected", false);
     47   tab.setAttribute("aria-expanded", false);
     48   tab.tabIndex = -1;
     49 };
     50 
     51 MCTabs.prototype.showPanel = function (panel) {
     52   panel.className = 'current';
     53   panel.setAttribute("aria-hidden", false);
     54 };
     55 
     56 MCTabs.prototype.hidePanel = function (panel) {
     57   panel.className = 'panel';
     58   panel.setAttribute("aria-hidden", true);
     59 };
     60 
     61 MCTabs.prototype.getPanelForTab = function (tabElm) {
     62   return tinyMCEPopup.dom.getAttrib(tabElm, "aria-controls");
     63 };
     64 
     65 MCTabs.prototype.displayTab = function (tab_id, panel_id, avoid_focus) {
     66   var panelElm, panelContainerElm, tabElm, tabContainerElm, selectionClass, nodes, i, t = this;
     67 
     68   tabElm = document.getElementById(tab_id);
     69 
     70   if (panel_id === undefined) {
     71     panel_id = t.getPanelForTab(tabElm);
     72   }
     73 
     74   panelElm = document.getElementById(panel_id);
     75   panelContainerElm = panelElm ? panelElm.parentNode : null;
     76   tabContainerElm = tabElm ? tabElm.parentNode : null;
     77   selectionClass = t.getParam('selection_class', 'current');
     78 
     79   if (tabElm && tabContainerElm) {
     80     nodes = tabContainerElm.childNodes;
     81 
     82     // Hide all other tabs
     83     for (i = 0; i < nodes.length; i++) {
     84       if (nodes[i].nodeName == "LI") {
     85         t.hideTab(nodes[i]);
     86       }
     87     }
     88 
     89     // Show selected tab
     90     t.showTab(tabElm);
     91   }
     92 
     93   if (panelElm && panelContainerElm) {
     94     nodes = panelContainerElm.childNodes;
     95 
     96     // Hide all other panels
     97     for (i = 0; i < nodes.length; i++) {
     98       if (nodes[i].nodeName == "DIV") {
     99         t.hidePanel(nodes[i]);
    100       }
    101     }
    102 
    103     if (!avoid_focus) {
    104       tabElm.focus();
    105     }
    106 
    107     // Show selected panel
    108     t.showPanel(panelElm);
    109   }
    110 };
    111 
    112 MCTabs.prototype.getAnchor = function () {
    113   var pos, url = document.location.href;
    114 
    115   if ((pos = url.lastIndexOf('#')) != -1) {
    116     return url.substring(pos + 1);
    117   }
    118 
    119   return "";
    120 };
    121 
    122 
    123 //Global instance
    124 var mcTabs = new MCTabs();
    125 
    126 tinyMCEPopup.onInit.add(function () {
    127   var tinymce = tinyMCEPopup.getWin().tinymce, dom = tinyMCEPopup.dom, each = tinymce.each;
    128 
    129   each(dom.select('div.tabs'), function (tabContainerElm) {
    130     //var keyNav;
    131 
    132     dom.setAttrib(tabContainerElm, "role", "tablist");
    133 
    134     var items = tinyMCEPopup.dom.select('li', tabContainerElm);
    135     var action = function (id) {
    136       mcTabs.displayTab(id, mcTabs.getPanelForTab(id));
    137       mcTabs.onChange.dispatch(id);
    138     };
    139 
    140     each(items, function (item) {
    141       dom.setAttrib(item, 'role', 'tab');
    142       dom.bind(item, 'click', function (evt) {
    143         action(item.id);
    144       });
    145     });
    146 
    147     dom.bind(dom.getRoot(), 'keydown', function (evt) {
    148       if (evt.keyCode === 9 && evt.ctrlKey && !evt.altKey) { // Tab
    149         //keyNav.moveFocus(evt.shiftKey ? -1 : 1);
    150         tinymce.dom.Event.cancel(evt);
    151       }
    152     });
    153 
    154     each(dom.select('a', tabContainerElm), function (a) {
    155       dom.setAttrib(a, 'tabindex', '-1');
    156     });
    157 
    158     /*keyNav = tinyMCEPopup.editor.windowManager.createInstance('tinymce.ui.KeyboardNavigation', {
    159       root: tabContainerElm,
    160       items: items,
    161       onAction: action,
    162       actOnFocus: true,
    163       enableLeftRight: true,
    164       enableUpDown: true
    165     }, tinyMCEPopup.dom);*/
    166   }
    167 );
    168 });