diff options
Diffstat (limited to 'tpl')
-rw-r--r-- | tpl/default/css/shaarli.css | 4 | ||||
-rw-r--r-- | tpl/default/js/shaarli.js | 49 |
2 files changed, 53 insertions, 0 deletions
diff --git a/tpl/default/css/shaarli.css b/tpl/default/css/shaarli.css index 72ea4df5..4770b058 100644 --- a/tpl/default/css/shaarli.css +++ b/tpl/default/css/shaarli.css | |||
@@ -341,6 +341,10 @@ body { | |||
341 | border: solid 1px #d0fff0; | 341 | border: solid 1px #d0fff0; |
342 | } | 342 | } |
343 | 343 | ||
344 | .linklist-item-title .fold-button { | ||
345 | display: none; | ||
346 | } | ||
347 | |||
344 | .linklist-item-editbuttons { | 348 | .linklist-item-editbuttons { |
345 | float: right; | 349 | float: right; |
346 | padding: 5px; | 350 | padding: 5px; |
diff --git a/tpl/default/js/shaarli.js b/tpl/default/js/shaarli.js index cbce0617..d73bd29b 100644 --- a/tpl/default/js/shaarli.js +++ b/tpl/default/js/shaarli.js | |||
@@ -1,4 +1,16 @@ | |||
1 | /** | 1 | /** |
2 | * Retrieve an element up in the tree from its class name. | ||
3 | */ | ||
4 | function getParentByClass(el, className) { | ||
5 | var p = el.parentNode; | ||
6 | if (p == null || p.classList.contains(className)) { | ||
7 | return p; | ||
8 | } | ||
9 | return getParentByClass(p, className); | ||
10 | } | ||
11 | |||
12 | |||
13 | /** | ||
2 | * Handle responsive menu. | 14 | * Handle responsive menu. |
3 | * Source: http://purecss.io/layouts/tucked-menu-vertical/ | 15 | * Source: http://purecss.io/layouts/tucked-menu-vertical/ |
4 | */ | 16 | */ |
@@ -41,6 +53,10 @@ | |||
41 | window.addEventListener(WINDOW_CHANGE_EVENT, closeMenu); | 53 | window.addEventListener(WINDOW_CHANGE_EVENT, closeMenu); |
42 | })(this, this.document); | 54 | })(this, this.document); |
43 | 55 | ||
56 | |||
57 | /** | ||
58 | * Expend search fields on focus. | ||
59 | */ | ||
44 | var searchInputs = document.querySelectorAll('#search input[type="text"]'); | 60 | var searchInputs = document.querySelectorAll('#search input[type="text"]'); |
45 | [].forEach.call(searchInputs, function(searchInput) { | 61 | [].forEach.call(searchInputs, function(searchInput) { |
46 | searchInput.addEventListener('focus', function(event) { | 62 | searchInput.addEventListener('focus', function(event) { |
@@ -49,4 +65,37 @@ var searchInputs = document.querySelectorAll('#search input[type="text"]'); | |||
49 | searchInput.addEventListener('blur', function(event) { | 65 | searchInput.addEventListener('blur', function(event) { |
50 | event.target.style.width = '140px'; | 66 | event.target.style.width = '140px'; |
51 | }); | 67 | }); |
68 | }); | ||
69 | |||
70 | /** | ||
71 | * Fold/Expand shaares description. | ||
72 | */ | ||
73 | var foldButtons = document.querySelectorAll('.fold-button'); | ||
74 | [].forEach.call(foldButtons, function(foldButton) { | ||
75 | // Retrieve description | ||
76 | var description = null; | ||
77 | var linklistItem = getParentByClass(foldButton, 'linklist-item'); | ||
78 | if (linklistItem != null) { | ||
79 | description = linklistItem.querySelector('.linklist-item-description'); | ||
80 | if (description != null) { | ||
81 | foldButton.style.display = 'inline'; | ||
82 | } | ||
83 | } | ||
84 | |||
85 | foldButton.addEventListener('click', function(event) { | ||
86 | event.preventDefault(); | ||
87 | |||
88 | // Switch fold/expand - up = fold | ||
89 | if (event.target.classList.contains('fa-chevron-up')) { | ||
90 | |||
91 | event.target.title = 'Expand'; | ||
92 | description.style.display = 'none'; | ||
93 | } | ||
94 | else { | ||
95 | event.target.title = 'Fold'; | ||
96 | description.style.display = 'block'; | ||
97 | } | ||
98 | event.target.classList.toggle('fa-chevron-down'); | ||
99 | event.target.classList.toggle('fa-chevron-up'); | ||
100 | }); | ||
52 | }); \ No newline at end of file | 101 | }); \ No newline at end of file |