aboutsummaryrefslogtreecommitdiffhomepage
path: root/tpl/default/js
diff options
context:
space:
mode:
Diffstat (limited to 'tpl/default/js')
-rw-r--r--tpl/default/js/shaarli.js228
1 files changed, 228 insertions, 0 deletions
diff --git a/tpl/default/js/shaarli.js b/tpl/default/js/shaarli.js
new file mode 100644
index 00000000..d8464aa4
--- /dev/null
+++ b/tpl/default/js/shaarli.js
@@ -0,0 +1,228 @@
1window.onload = function () {
2
3 /**
4 * Retrieve an element up in the tree from its class name.
5 */
6 function getParentByClass(el, className) {
7 var p = el.parentNode;
8 if (p == null || p.classList.contains(className)) {
9 return p;
10 }
11 return getParentByClass(p, className);
12 }
13
14
15 /**
16 * Handle responsive menu.
17 * Source: http://purecss.io/layouts/tucked-menu-vertical/
18 */
19 (function (window, document) {
20 var menu = document.getElementById('shaarli-menu'),
21 WINDOW_CHANGE_EVENT = ('onorientationchange' in window) ? 'orientationchange':'resize';
22
23 function toggleHorizontal() {
24 [].forEach.call(
25 document.getElementById('shaarli-menu').querySelectorAll('.menu-transform'),
26 function(el){
27 el.classList.toggle('pure-menu-horizontal');
28 }
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);
37 }
38 else {
39 toggleHorizontal();
40 }
41 menu.classList.toggle('open');
42 document.getElementById('menu-toggle').classList.toggle('x');
43 };
44
45 function closeMenu() {
46 if (menu.classList.contains('open')) {
47 toggleMenu();
48 }
49 }
50
51 document.getElementById('menu-toggle').addEventListener('click', function (e) {
52 toggleMenu();
53 });
54
55 window.addEventListener(WINDOW_CHANGE_EVENT, closeMenu);
56 })(this, this.document);
57
58 /**
59 * Fold/Expand shaares description and thumbnail.
60 */
61 var foldAllButtons = document.getElementsByClassName('fold-all');
62 var foldButtons = document.getElementsByClassName('fold-button');
63
64 [].forEach.call(foldButtons, function (foldButton) {
65 // Retrieve description
66 var description = null;
67 var thumbnail = null;
68 var linklistItem = getParentByClass(foldButton, 'linklist-item');
69 if (linklistItem != null) {
70 description = linklistItem.querySelector('.linklist-item-description');
71 thumbnail = linklistItem.querySelector('.linklist-item-thumbnail');
72 if (description != null || thumbnail != null) {
73 foldButton.style.display = 'inline';
74 }
75 }
76
77 foldButton.addEventListener('click', function (event) {
78 event.preventDefault();
79 toggleFold(event.target, description, thumbnail);
80 });
81 });
82
83 if (foldAllButtons != null) {
84 [].forEach.call(foldAllButtons, function (foldAllButton) {
85 foldAllButton.addEventListener('click', function (event) {
86 event.preventDefault();
87 [].forEach.call(foldButtons, function (foldButton) {
88 // Retrieve description
89 var description = null;
90 var thumbnail = null;
91 var linklistItem = getParentByClass(foldButton, 'linklist-item');
92 if (linklistItem != null) {
93 description = linklistItem.querySelector('.linklist-item-description');
94 thumbnail = linklistItem.querySelector('.linklist-item-thumbnail');
95 if (description != null || thumbnail != null) {
96 foldButton.style.display = 'inline';
97 }
98 }
99
100 toggleFold(foldButton.firstElementChild, description, thumbnail);
101 });
102 foldAllButton.firstElementChild.classList.toggle('fa-chevron-down');
103 foldAllButton.firstElementChild.classList.toggle('fa-chevron-up');
104 });
105 });
106 }
107
108 function toggleFold(button, description, thumb)
109 {
110 // Switch fold/expand - up = fold
111 if (button.classList.contains('fa-chevron-up')) {
112 button.title = 'Expand';
113 if (description != null) {
114 description.style.display = 'none';
115 }
116 if (thumb != null) {
117 thumb.style.display = 'none';
118 }
119 }
120 else {
121 button.title = 'Fold';
122 if (description != null) {
123 description.style.display = 'block';
124 }
125 if (thumb != null) {
126 thumb.style.display = 'block';
127 }
128 }
129 button.classList.toggle('fa-chevron-down');
130 button.classList.toggle('fa-chevron-up');
131 }
132
133 /**
134 * Confirmation message before deletion.
135 */
136 var deleteLinks = document.querySelectorAll('.confirm-delete');
137 [].forEach.call(deleteLinks, function(deleteLink) {
138 deleteLink.addEventListener('click', function(event) {
139 if(! confirm('Are you sure you want to delete this link ?')) {
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 });
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 if (location.hash != '') {
220 var anchor = document.querySelector(location.hash);
221 if (anchor != null) {
222 var padsize = anchor.clientHeight;
223 console.log(document.querySelector(location.hash).clientHeight);
224 this.window.scroll(0, this.window.scrollY - padsize);
225 anchor.style.paddingTop = 0;
226 }
227 }
228};