Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-13 13:54:23 +00:00
Code Issues Actions Projects Releases Wiki Activity

hop

Browse Source
This commit is contained in:
Tchama 2019-12-13 13:03:15 +01:00
parent 600c48b193
commit fb9c3cdff3
2 changed files with 31 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
Resources/public/modules/tabs/tabs.js
View File

@ -29,8 +29,11 @@ let countNewActive = function(links, link)
/* /*
* Set class active on both new elements: link and content * Set class active on both new elements: link and content
*/ */
let setNewActive = function(link, contents, rank) let setNewActive = function(links, contents, rank)
{ {
if (! links[rank-1]) { rank = 1; }
link = links[rank-1];
link.classList.add('active'); link.classList.add('active');
count = 0; count = 0;
@ -42,6 +45,19 @@ let setNewActive = function(link, contents, rank)
}); });
} }
/*
* Set height of content pane
*/
let setPaneHeight = function(contents)
{
contents.forEach(function(pane) {
// let computedStyle = getComputedStyle(pane);
// console.log(computedStyle.height);
// comment prendre la hauteur d'une div masquée avec display:none
});
}
/* /*
* Main function * Main function
*/ */
@ -61,15 +77,21 @@ window.addEventListener('load', function()
tabPanel.classList.add('pills'); tabPanel.classList.add('pills');
} }
if (! unit.startPanel) {
unit.startPanel = 1;
}
setPaneHeight(contents);
// initial position // initial position
setNewActive(links[unit.startPanel-1], contents, unit.startPanel); setNewActive(links, contents, unit.startPanel);
// listen // listen
links.forEach(function(link) { links.forEach(function(link) {
link.addEventListener('click', function() link.addEventListener('click', function()
{ {
resetActive(links, contents); resetActive(links, contents);
setNewActive(link, contents, countNewActive(links, link)); setNewActive(links, contents, countNewActive(links, link));
}); });
}); });

11
Resources/views/Test/index.html.twig
View File

@ -12,17 +12,18 @@
let tabParams = [{ let tabParams = [{
id : 'test1', id : 'test1',
type: 'tab', type: 'tab',
startPanel: 5, startPanel: 2,
disposition: 'horizontal', disposition: 'horizontal',
fade: true fade: true
}, },
{ {
id : 'test2', id : 'test2',
type: 'pill', type: 'pill',
startPanel: 3, startPanel: 5,
disposition: 'vertical', disposition: 'vertical',
fade: false fade: false
}]; }
];
</script> </script>
<script type="text/javascript" src="{{ asset('build/tabs.js') }}"></script> <script type="text/javascript" src="{{ asset('build/tabs.js') }}"></script>
@ -46,7 +47,7 @@
<a class="nav-link" href="#">Link 4</a> <a class="nav-link" href="#">Link 4</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Link 5</a> <a class="nav-link" href="#">Link 5</a>
</li> </li>
</ul> </ul>
</nav> </nav>
@ -87,7 +88,7 @@
<a class="nav-link" href="#">Link 4</a> <a class="nav-link" href="#">Link 4</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Link 5</a> <a class="nav-link" href="#">Link 5</a>
</li> </li>
</ul> </ul>
</nav> </nav>