]>
git.immae.eu Git - github/shaarli/Shaarli.git/blob - tpl/default/js/shaarli.js
2 * Handle responsive menu.
3 * Source: http://purecss.io/layouts/tucked-menu-vertical/
5 (function (window
, document
) {
6 var menu
= document
.getElementById('shaarli-menu'),
7 WINDOW_CHANGE_EVENT
= ('onorientationchange' in window
) ? 'orientationchange':'resize';
9 function toggleHorizontal() {
11 document
.getElementById('shaarli-menu').querySelectorAll('.menu-transform'),
13 el
.classList
.toggle('pure-menu-horizontal');
18 function toggleMenu() {
19 // set timeout so that the panel has a chance to roll up
20 // before the menu switches states
21 if (menu
.classList
.contains('open')) {
22 setTimeout(toggleHorizontal
, 500);
27 menu
.classList
.toggle('open');
28 document
.getElementById('menu-toggle').classList
.toggle('x');
31 function closeMenu() {
32 if (menu
.classList
.contains('open')) {
37 document
.getElementById('menu-toggle').addEventListener('click', function (e
) {
41 window
.addEventListener(WINDOW_CHANGE_EVENT
, closeMenu
);
42 })(this, this.document
);
44 var searchInputs
= document
.querySelectorAll('#search input[type="text"]');
45 [].forEach
.call(searchInputs
, function(searchInput
) {
46 searchInput
.addEventListener('focus', function(event
) {
47 event
.target
.style
.width
= '250px';
49 searchInput
.addEventListener('blur', function(event
) {
50 event
.target
.style
.width
= '140px';