diff options
Diffstat (limited to 'tpl/default')
-rw-r--r-- | tpl/default/css/shaarli.css | 2 | ||||
-rw-r--r-- | tpl/default/js/shaarli.js | 332 |
2 files changed, 168 insertions, 166 deletions
diff --git a/tpl/default/css/shaarli.css b/tpl/default/css/shaarli.css index ed9a86ca..f9dd3e76 100644 --- a/tpl/default/css/shaarli.css +++ b/tpl/default/css/shaarli.css | |||
@@ -814,7 +814,7 @@ pre { | |||
814 | 814 | ||
815 | .page-form-complete .form-label, .page-form-complete .form-input { | 815 | .page-form-complete .form-label, .page-form-complete .form-input { |
816 | position: relative; | 816 | position: relative; |
817 | min-height: 60px; | 817 | height: 60px; |
818 | } | 818 | } |
819 | 819 | ||
820 | .page-form-complete .form-label label, | 820 | .page-form-complete .form-label label, |
diff --git a/tpl/default/js/shaarli.js b/tpl/default/js/shaarli.js index a3d40b0d..2e533af6 100644 --- a/tpl/default/js/shaarli.js +++ b/tpl/default/js/shaarli.js | |||
@@ -1,62 +1,63 @@ | |||
1 | /** | 1 | window.onload = function () { |
2 | * Retrieve an element up in the tree from its class name. | 2 | |
3 | */ | 3 | /** |
4 | function getParentByClass(el, className) { | 4 | * Retrieve an element up in the tree from its class name. |
5 | var p = el.parentNode; | 5 | */ |
6 | if (p == null || p.classList.contains(className)) { | 6 | function getParentByClass(el, className) { |
7 | return p; | 7 | var p = el.parentNode; |
8 | if (p == null || p.classList.contains(className)) { | ||
9 | return p; | ||
10 | } | ||
11 | return getParentByClass(p, className); | ||
8 | } | 12 | } |
9 | return getParentByClass(p, className); | 13 | |
10 | } | 14 | |
11 | 15 | /** | |
12 | 16 | * Handle responsive menu. | |
13 | /** | 17 | * Source: http://purecss.io/layouts/tucked-menu-vertical/ |
14 | * Handle responsive menu. | 18 | */ |
15 | * Source: http://purecss.io/layouts/tucked-menu-vertical/ | 19 | (function (window, document) { |
16 | */ | 20 | var menu = document.getElementById('shaarli-menu'), |
17 | (function (window, document) { | 21 | WINDOW_CHANGE_EVENT = ('onorientationchange' in window) ? 'orientationchange':'resize'; |
18 | var menu = document.getElementById('shaarli-menu'), | 22 | |
19 | WINDOW_CHANGE_EVENT = ('onorientationchange' in window) ? 'orientationchange':'resize'; | 23 | function toggleHorizontal() { |
20 | 24 | [].forEach.call( | |
21 | function toggleHorizontal() { | 25 | document.getElementById('shaarli-menu').querySelectorAll('.menu-transform'), |
22 | [].forEach.call( | 26 | function(el){ |
23 | document.getElementById('shaarli-menu').querySelectorAll('.menu-transform'), | 27 | el.classList.toggle('pure-menu-horizontal'); |
24 | function(el){ | 28 | } |
25 | el.classList.toggle('pure-menu-horizontal'); | 29 | ); |
30 | }; | ||
31 | |||
32 | function toggleMenu() { | ||
33 | // set timeout so that the panel has a chance to roll up | ||
34 | // before the menu switches states | ||
35 | if (menu.classList.contains('open')) { | ||
36 | setTimeout(toggleHorizontal, 500); | ||
26 | } | 37 | } |
27 | ); | 38 | else { |
28 | }; | 39 | toggleHorizontal(); |
29 | 40 | } | |
30 | function toggleMenu() { | 41 | menu.classList.toggle('open'); |
31 | // set timeout so that the panel has a chance to roll up | 42 | document.getElementById('menu-toggle').classList.toggle('x'); |
32 | // before the menu switches states | 43 | }; |
33 | if (menu.classList.contains('open')) { | ||
34 | setTimeout(toggleHorizontal, 500); | ||
35 | } | ||
36 | else { | ||
37 | toggleHorizontal(); | ||
38 | } | ||
39 | menu.classList.toggle('open'); | ||
40 | document.getElementById('menu-toggle').classList.toggle('x'); | ||
41 | }; | ||
42 | 44 | ||
43 | function closeMenu() { | 45 | function closeMenu() { |
44 | if (menu.classList.contains('open')) { | 46 | if (menu.classList.contains('open')) { |
45 | toggleMenu(); | 47 | toggleMenu(); |
48 | } | ||
46 | } | 49 | } |
47 | } | ||
48 | 50 | ||
49 | document.getElementById('menu-toggle').addEventListener('click', function (e) { | 51 | document.getElementById('menu-toggle').addEventListener('click', function (e) { |
50 | toggleMenu(); | 52 | toggleMenu(); |
51 | }); | 53 | }); |
52 | 54 | ||
53 | window.addEventListener(WINDOW_CHANGE_EVENT, closeMenu); | 55 | window.addEventListener(WINDOW_CHANGE_EVENT, closeMenu); |
54 | })(this, this.document); | 56 | })(this, this.document); |
55 | 57 | ||
56 | /** | 58 | /** |
57 | * Fold/Expand shaares description and thumbnail. | 59 | * Fold/Expand shaares description and thumbnail. |
58 | */ | 60 | */ |
59 | (function (window, document) { | ||
60 | var foldAllButtons = document.getElementsByClassName('fold-all'); | 61 | var foldAllButtons = document.getElementsByClassName('fold-all'); |
61 | var foldButtons = document.getElementsByClassName('fold-button'); | 62 | var foldButtons = document.getElementsByClassName('fold-button'); |
62 | 63 | ||
@@ -103,122 +104,123 @@ function getParentByClass(el, className) { | |||
103 | }); | 104 | }); |
104 | }); | 105 | }); |
105 | } | 106 | } |
106 | })(this, this.document); | 107 | |
107 | 108 | function toggleFold(button, description, thumb) | |
108 | function toggleFold(button, description, thumb) | 109 | { |
109 | { | 110 | // Switch fold/expand - up = fold |
110 | // Switch fold/expand - up = fold | 111 | if (button.classList.contains('fa-chevron-up')) { |
111 | if (button.classList.contains('fa-chevron-up')) { | 112 | button.title = 'Expand'; |
112 | button.title = 'Expand'; | 113 | if (description != null) { |
113 | if (description != null) { | 114 | description.style.display = 'none'; |
114 | description.style.display = 'none'; | 115 | } |
115 | } | 116 | if (thumb != null) { |
116 | if (thumb != null) { | 117 | thumb.style.display = 'none'; |
117 | thumb.style.display = 'none'; | 118 | } |
118 | } | ||
119 | } | ||
120 | else { | ||
121 | button.title = 'Fold'; | ||
122 | if (description != null) { | ||
123 | description.style.display = 'block'; | ||
124 | } | 119 | } |
125 | if (thumb != null) { | 120 | else { |
126 | thumb.style.display = 'block'; | 121 | button.title = 'Fold'; |
122 | if (description != null) { | ||
123 | description.style.display = 'block'; | ||
124 | } | ||
125 | if (thumb != null) { | ||
126 | thumb.style.display = 'block'; | ||
127 | } | ||
127 | } | 128 | } |
129 | button.classList.toggle('fa-chevron-down'); | ||
130 | button.classList.toggle('fa-chevron-up'); | ||
128 | } | 131 | } |
129 | button.classList.toggle('fa-chevron-down'); | 132 | |
130 | button.classList.toggle('fa-chevron-up'); | 133 | /** |
131 | } | 134 | * Confirmation message before deletion. |
132 | 135 | */ | |
133 | /** | 136 | var deleteLinks = document.querySelectorAll('.confirm-delete'); |
134 | * Confirmation message before deletion. | 137 | [].forEach.call(deleteLinks, function(deleteLink) { |
135 | */ | 138 | deleteLink.addEventListener('click', function(event) { |
136 | var deleteLinks = document.querySelectorAll('.confirm-delete'); | 139 | if(! confirm('Are you sure you want to delete this link ?')) { |
137 | [].forEach.call(deleteLinks, function(deleteLink) { | 140 | event.preventDefault(); |
138 | deleteLink.addEventListener('click', function(event) { | 141 | } |
139 | if(! confirm('Are you sure you want to delete this link ?')) { | 142 | }); |
140 | event.preventDefault(); | ||
141 | } | ||
142 | }); | ||
143 | }); | ||
144 | |||
145 | /** | ||
146 | * Close alerts | ||
147 | */ | ||
148 | var closeLinks = document.querySelectorAll('.pure-alert-close'); | ||
149 | [].forEach.call(closeLinks, function(closeLink) { | ||
150 | closeLink.addEventListener('click', function(event) { | ||
151 | var alert = getParentByClass(event.target, 'pure-alert-closable'); | ||
152 | alert.style.display = 'none'; | ||
153 | }); | ||
154 | }); | ||
155 | |||
156 | /** | ||
157 | * New version dismiss. | ||
158 | * Hide the message for one week using localStorage. | ||
159 | */ | ||
160 | var newVersionDismiss = document.getElementById('new-version-dismiss'); | ||
161 | var newVersionMessage = document.querySelector('.new-version-message'); | ||
162 | if (newVersionMessage != null | ||
163 | && localStorage.getItem('newVersionDismiss') != null | ||
164 | && parseInt(localStorage.getItem('newVersionDismiss')) + 7*24*60*60*1000 > (new Date()).getTime() | ||
165 | ) { | ||
166 | newVersionMessage.style.display = 'none'; | ||
167 | } | ||
168 | if (newVersionDismiss != null) { | ||
169 | newVersionDismiss.addEventListener('click', function () { | ||
170 | localStorage.setItem('newVersionDismiss', (new Date()).getTime()); | ||
171 | }); | 143 | }); |
172 | } | ||
173 | |||
174 | var hiddenReturnurl = document.getElementsByName('returnurl'); | ||
175 | if (hiddenReturnurl != null) { | ||
176 | hiddenReturnurl.value = window.location.href; | ||
177 | } | ||
178 | |||
179 | /** | ||
180 | * Autofocus text fields | ||
181 | */ | ||
182 | var autofocusElements = document.querySelector('.autofocus'); | ||
183 | if (autofocusElements != null) { | ||
184 | autofocusElements.focus(); | ||
185 | } | ||
186 | |||
187 | /** | ||
188 | * Handle sub menus/forms | ||
189 | */ | ||
190 | var openers = document.getElementsByClassName('subheader-opener'); | ||
191 | if (openers != null) { | ||
192 | [].forEach.call(openers, function(opener) { | ||
193 | opener.addEventListener('click', function(event) { | ||
194 | event.preventDefault(); | ||
195 | |||
196 | var id = opener.getAttribute('data-open-id'); | ||
197 | var sub = document.getElementById(id); | ||
198 | |||
199 | if (sub != null) { | ||
200 | [].forEach.call(document.getElementsByClassName('subheader-form'), function (element) { | ||
201 | if (element != sub) { | ||
202 | removeClass(element, 'open') | ||
203 | } | ||
204 | }); | ||
205 | 144 | ||
206 | sub.classList.toggle('open'); | 145 | /** |
207 | } | 146 | * Close alerts |
208 | }); | 147 | */ |
148 | var closeLinks = document.querySelectorAll('.pure-alert-close'); | ||
149 | [].forEach.call(closeLinks, function(closeLink) { | ||
150 | closeLink.addEventListener('click', function(event) { | ||
151 | var alert = getParentByClass(event.target, 'pure-alert-closable'); | ||
152 | alert.style.display = 'none'; | ||
153 | }); | ||
209 | }); | 154 | }); |
210 | } | 155 | |
211 | 156 | /** | |
212 | function removeClass(element, classname) { | 157 | * New version dismiss. |
213 | element.className = element.className.replace(new RegExp('(?:^|\\s)'+ classname + '(?:\\s|$)'), ' '); | 158 | * Hide the message for one week using localStorage. |
214 | } | 159 | */ |
215 | 160 | var newVersionDismiss = document.getElementById('new-version-dismiss'); | |
216 | /** | 161 | var newVersionMessage = document.querySelector('.new-version-message'); |
217 | * Remove CSS target padding (for fixed bar) | 162 | if (newVersionMessage != null |
218 | */ | 163 | && localStorage.getItem('newVersionDismiss') != null |
219 | var anchor = document.querySelector('.anchor:target'); | 164 | && parseInt(localStorage.getItem('newVersionDismiss')) + 7*24*60*60*1000 > (new Date()).getTime() |
220 | if (anchor != null) { | 165 | ) { |
221 | var padsize = anchor.clientHeight; | 166 | newVersionMessage.style.display = 'none'; |
222 | this.window.scroll(0, this.window.scrollY - padsize); | 167 | } |
223 | anchor.style.paddingTop = 0; | 168 | if (newVersionDismiss != null) { |
224 | } | 169 | newVersionDismiss.addEventListener('click', function () { |
170 | localStorage.setItem('newVersionDismiss', (new Date()).getTime()); | ||
171 | }); | ||
172 | } | ||
173 | |||
174 | var hiddenReturnurl = document.getElementsByName('returnurl'); | ||
175 | if (hiddenReturnurl != null) { | ||
176 | hiddenReturnurl.value = window.location.href; | ||
177 | } | ||
178 | |||
179 | /** | ||
180 | * Autofocus text fields | ||
181 | */ | ||
182 | var autofocusElements = document.querySelector('.autofocus'); | ||
183 | if (autofocusElements != null) { | ||
184 | autofocusElements.focus(); | ||
185 | } | ||
186 | |||
187 | /** | ||
188 | * Handle sub menus/forms | ||
189 | */ | ||
190 | var openers = document.getElementsByClassName('subheader-opener'); | ||
191 | if (openers != null) { | ||
192 | [].forEach.call(openers, function(opener) { | ||
193 | opener.addEventListener('click', function(event) { | ||
194 | event.preventDefault(); | ||
195 | |||
196 | var id = opener.getAttribute('data-open-id'); | ||
197 | var sub = document.getElementById(id); | ||
198 | |||
199 | if (sub != null) { | ||
200 | [].forEach.call(document.getElementsByClassName('subheader-form'), function (element) { | ||
201 | if (element != sub) { | ||
202 | removeClass(element, 'open') | ||
203 | } | ||
204 | }); | ||
205 | |||
206 | sub.classList.toggle('open'); | ||
207 | } | ||
208 | }); | ||
209 | }); | ||
210 | } | ||
211 | |||
212 | function removeClass(element, classname) { | ||
213 | element.className = element.className.replace(new RegExp('(?:^|\\s)'+ classname + '(?:\\s|$)'), ' '); | ||
214 | } | ||
215 | |||
216 | /** | ||
217 | * Remove CSS target padding (for fixed bar) | ||
218 | */ | ||
219 | var anchor = document.querySelector(location.hash); | ||
220 | if (anchor != null) { | ||
221 | var padsize = anchor.clientHeight; | ||
222 | console.log(document.querySelector(location.hash).clientHeight); | ||
223 | this.window.scroll(0, this.window.scrollY - padsize); | ||
224 | anchor.style.paddingTop = 0; | ||
225 | } | ||
226 | }; | ||