/** * Create Ajax Tabs apply to 'tabspanel' div. Content is displayed in 'tabcontent' * * @param $tabdiv_id ID of the div containing the tabs (default 'tabspanel') * @param $tabdivcontent_id ID of the div containing the content loaded by tabs * (default 'tabcontent') * @param $tabs array of tabs to create : * tabs is array('key' => array('title'=> 'x', * url => 'url_toload', * params => 'url_params')... * @param $type itemtype for active tab * @param $ID ID of element for active tab (default 0) * @param $orientation orientation of tabs (default vertical may also be horizontal) * * @return nothing **/ static function createTabs($tabdiv_id = 'tabspanel', $tabdivcontent_id = 'tabcontent', $tabs = array(), $type, $ID = 0, $orientation = 'vertical') { global $CFG_GLPI; /// TODO need to clean params !! $active_tabs = Session::getActiveTab($type); $rand = mt_rand(); if (count($tabs) > 0) { echo "<div id='tabs{$rand}' class='center {$orientation}'>"; if (in_array($_SESSION['glpilayout'], array('classic', 'vsplit'))) { $orientation = 'horizontal'; } echo "<ul>"; $current = 0; $selected_tab = 0; foreach ($tabs as $key => $val) { if ($key == $active_tabs) { $selected_tab = $current; } echo "<li><a title=\"" . str_replace(array("<sup class='tab_nb'>", '</sup>'), '', $val['title']) . "\" "; echo " href='" . $val['url'] . (isset($val['params']) ? '?' . $val['params'] : '') . "'>"; // extract sup information // $title = ''; // $limit = 16; // No title strip for horizontal menu // if ($orientation == 'vertical') { // if (preg_match('/(.*)(<sup>.*<\/sup>)/',$val['title'], $regs)) { // $title = Html::resume_text(trim($regs[1]),$limit-2).$regs[2]; // } else { // $title = Html::resume_text(trim($val['title']),$limit); // } // } else { $title = $val['title']; // } echo $title . "</a></li>"; $current++; } echo "</ul>"; echo "</div>"; echo "<div id='loadingtabs{$rand}' class='invisible'>" . "<div class='loadingindicator'>" . __s('Loading...') . "</div></div>"; $js = "\$('#tabs{$rand}').tabs({ active: {$selected_tab},\n // Loading indicator\n beforeLoad: function (event, ui) {\n ui.panel.html(\$('#loadingtabs{$rand}').html());\n },\n ajaxOptions: {type: 'POST'},\n\n activate : function( event, ui ){\n // Get future value\n var newIndex = ui.newTab.parent().children().index(ui.newTab);\n \$.get('" . $CFG_GLPI['root_doc'] . "/ajax/updatecurrenttab.php',\n { itemtype: '{$type}', id: '{$ID}', tab: newIndex });\n }});"; if ($orientation == 'vertical') { $js .= "\$('#tabs{$rand}').tabs().addClass( 'ui-tabs-vertical ui-helper-clearfix' );"; } if (in_array($_SESSION['glpilayout'], array('classic', 'vsplit'))) { $js .= "\$('#tabs{$rand}').scrollabletabs();"; } else { $js .= "\$('#tabs{$rand}').removeClass( 'ui-corner-top' ).addClass( 'ui-corner-left' );"; } $js .= "// force reload\n function reloadTab(add) {\n\n var current_index = \$('#tabs{$rand}').tabs('option','active');\n // Save tab\n currenthref = \$('#tabs{$rand} ul>li a').eq(current_index).attr('href');\n \$('#tabs{$rand} ul>li a').eq(current_index).attr('href',currenthref+'&'+add);\n \$('#tabs{$rand}').tabs( 'load' , current_index);\n // Restore tab\n \$('#tabs{$rand} ul>li a').eq(current_index).attr('href',currenthref);\n };"; echo Html::scriptBlock($js); } }
/** * Create Ajax Tabs apply to 'tabspanel' div. Content is displayed in 'tabcontent' * * @param $tabdiv_id ID of the div containing the tabs (default 'tabspanel') * @param $tabdivcontent_id ID of the div containing the content loaded by tabs * (default 'tabcontent') * @param $tabs array of tabs to create : * tabs is array('key' => array('title'=> 'x', * url => 'url_toload', * params => 'url_params')... * @param $type for active tab * @param $size width of tabs panel (default 950) * * @return nothing **/ static function createTabs($tabdiv_id = 'tabspanel', $tabdivcontent_id = 'tabcontent', $tabs = array(), $type, $size = 950) { global $CFG_GLPI; $active_tabs = Session::getActiveTab($type); if (count($tabs) > 0) { echo "<script type='text/javascript'>\n\n var tabpanel = new Ext.TabPanel({\n applyTo: '{$tabdiv_id}',\n width:{$size},\n enableTabScroll: true,\n resizeTabs: false,\n collapsed: true,\n plain: true,\n plugins: [{\n ptype: 'tabscrollermenu',\n maxText : 50,\n pageSize : 30\n }],\n items: ["; $first = true; $default_tab = $active_tabs; if (!isset($tabs[$active_tabs])) { $default_tab = key($tabs); } foreach ($tabs as $key => $val) { if ($first) { $first = false; } else { echo ","; } echo "{\n title: \"" . addslashes($val['title']) . "\",\n id: '{$key}',"; if (!empty($key) && $key != 'empty') { echo "autoLoad: {url: '" . $val['url'] . "',\n scripts: true,\n nocache: true"; if (isset($val['params'])) { echo ", params: '" . $val['params'] . "'"; } echo "},"; } echo " listeners:{ // Force glpi_tab storage\n beforeshow : function(panel) {\n /* clean content because append data instead of replace it : no more problem */\n /* Problem with IE6... But clean data for tabpanel before show. Do it on load default tab ?*/\n /*tabpanel.body.update('');*/\n /* update active tab*/\n Ext.Ajax.request({\n url : '" . $CFG_GLPI['root_doc'] . "/ajax/updatecurrenttab.php?itemtype={$type}&glpi_tab=" . urlencode($key) . "',\n success: function(objServerResponse) {\n //alert(objServerResponse.responseText);\n }\n });\n }\n }"; echo "}"; } // Foreach tabs echo "]});"; echo "/// Define view point"; echo "tabpanel.expand();"; echo "// force first load\n function loadDefaultTab() {\n tabpanel.body=Ext.get('{$tabdivcontent_id}');\n // See before\n tabpanel.body.update('');\n tabpanel.setActiveTab('{$default_tab}');"; echo "}"; echo "// force reload\n function reloadTab(add) {\n var tab = tabpanel.getActiveTab();\n var opt = tab.autoLoad;\n if (add) {\n if (opt.params)\n opt.params = opt.params + '&' + add;\n else\n opt.params = add;\n }\n tab.getUpdater().update(opt);"; echo "}"; echo "</script>"; } }