aboutsummaryrefslogtreecommitdiffhomepage
path: root/app
diff options
context:
space:
mode:
authorThomas Citharel <tcit@tcit.fr>2016-09-28 10:30:18 +0200
committerThomas Citharel <tcit@tcit.fr>2016-09-28 10:30:18 +0200
commitc146f6940a176142084b4fc3c610d13aca60d90e (patch)
tree7bc4683febcf15a4fd6053bddd49e36c202adeda /app
parent55345331c47ca6f389e38a842584c3062476601d (diff)
downloadwallabag-c146f6940a176142084b4fc3c610d13aca60d90e.tar.gz
wallabag-c146f6940a176142084b4fc3c610d13aca60d90e.tar.zst
wallabag-c146f6940a176142084b4fc3c610d13aca60d90e.zip
Assets work
* ES6 all the things ! * ESLint checks everything * CSS fixes (use stylelint) * Fix #2231
Diffstat (limited to 'app')
-rw-r--r--app/Resources/static/themes/_global/js/bookmarklet.js6
-rw-r--r--app/Resources/static/themes/_global/js/restoreScroll.js25
-rw-r--r--app/Resources/static/themes/_global/js/tools.js50
-rwxr-xr-xapp/Resources/static/themes/baggy/css/main.css13
-rw-r--r--app/Resources/static/themes/baggy/css/ratatouille.css4
-rw-r--r--app/Resources/static/themes/baggy/js/autoClose.js8
-rwxr-xr-xapp/Resources/static/themes/baggy/js/autoCompleteTags.js52
-rw-r--r--app/Resources/static/themes/baggy/js/closeMessage.js19
-rwxr-xr-xapp/Resources/static/themes/baggy/js/init.js277
-rw-r--r--app/Resources/static/themes/baggy/js/popupForm.js101
-rwxr-xr-xapp/Resources/static/themes/baggy/js/saveLink.js75
-rw-r--r--app/Resources/static/themes/baggy/js/uiTools.js35
-rwxr-xr-xapp/Resources/static/themes/material/css/main.css33
-rwxr-xr-xapp/Resources/static/themes/material/css/print.css6
-rwxr-xr-xapp/Resources/static/themes/material/js/init.js70
15 files changed, 405 insertions, 369 deletions
diff --git a/app/Resources/static/themes/_global/js/bookmarklet.js b/app/Resources/static/themes/_global/js/bookmarklet.js
index 2afdfc3c..5174ff47 100644
--- a/app/Resources/static/themes/_global/js/bookmarklet.js
+++ b/app/Resources/static/themes/_global/js/bookmarklet.js
@@ -1,2 +1,6 @@
1 1
2top["bookmarklet-url@wallabag.org"]=""+"<!DOCTYPE html>"+"<html>"+"<head>"+"<title>bag it!</title>"+'<link rel="icon" href="tpl/img/favicon.ico" />'+"</head>"+"<body>"+"<script>"+"window.onload=function(){"+"window.setTimeout(function(){"+"history.back();"+"},250);"+"};"+"</scr"+"ipt>"+"</body>"+"</html>" 2top['bookmarklet-url@wallabag.org'] =
3 '<!DOCTYPE html><html><head><title>bag it!</title>' +
4 '<link rel="icon" href="tpl/img/favicon.ico" />' +
5 '</head><body><script>window.onload=function(){window.setTimeout' +
6 '(function(){history.back();},250);};</script></body></html>';
diff --git a/app/Resources/static/themes/_global/js/restoreScroll.js b/app/Resources/static/themes/_global/js/restoreScroll.js
deleted file mode 100644
index 9c4d7e20..00000000
--- a/app/Resources/static/themes/_global/js/restoreScroll.js
+++ /dev/null
@@ -1,25 +0,0 @@
1function supportsLocalStorage() {
2 try {
3 return 'localStorage' in window && window.localStorage !== null;
4 } catch (e) {
5 return false;
6 }
7}
8
9function savePercent(id, percent) {
10 if (!supportsLocalStorage()) { return false; }
11 localStorage['wallabag.article.' + id + '.percent'] = percent;
12 return true;
13}
14
15function retrievePercent(id) {
16 if (!supportsLocalStorage()) { return false; }
17
18 var bheight = $(document).height();
19 var percent = localStorage['wallabag.article.' + id + '.percent'];
20 var scroll = bheight * percent;
21
22 $('html,body').animate({ scrollTop: scroll }, 'fast');
23
24 return true;
25}
diff --git a/app/Resources/static/themes/_global/js/tools.js b/app/Resources/static/themes/_global/js/tools.js
new file mode 100644
index 00000000..ab30deb1
--- /dev/null
+++ b/app/Resources/static/themes/_global/js/tools.js
@@ -0,0 +1,50 @@
1const $ = require('jquery');
2
3function supportsLocalStorage() {
4 try {
5 return 'localStorage' in window && window.localStorage !== null;
6 } catch (e) {
7 return false;
8 }
9}
10
11function savePercent(id, percent) {
12 if (!supportsLocalStorage()) { return false; }
13 localStorage[`wallabag.article.${id}.percent`] = percent;
14 return true;
15}
16
17function retrievePercent(id) {
18 if (!supportsLocalStorage()) { return false; }
19
20 const bheight = $(document).height();
21 const percent = localStorage[`wallabag.article.${id}.percent`];
22 const scroll = bheight * percent;
23
24 $('html,body').animate({ scrollTop: scroll }, 'fast');
25
26 return true;
27}
28
29function initFilters() {
30 // no display if filters not available
31 if ($('div').is('#filters')) {
32 $('#button_filters').show();
33 $('.button-collapse-right').sideNav({ edge: 'right' });
34 $('#clear_form_filters').on('click', () => {
35 $('#filters input').val('');
36 $('#filters :checked').removeAttr('checked');
37 return false;
38 });
39 }
40}
41
42function initExport() {
43 // no display if export not available
44 if ($('div').is('#export')) {
45 $('#button_export').show();
46 $('.button-collapse-right').sideNav({ edge: 'right' });
47 }
48}
49
50export { savePercent, retrievePercent, initFilters, initExport };
diff --git a/app/Resources/static/themes/baggy/css/main.css b/app/Resources/static/themes/baggy/css/main.css
index 7ffaa12c..58f0eb82 100755
--- a/app/Resources/static/themes/baggy/css/main.css
+++ b/app/Resources/static/themes/baggy/css/main.css
@@ -481,9 +481,6 @@ footer a {
481 text-transform: none; 481 text-transform: none;
482 margin-bottom: 0; 482 margin-bottom: 0;
483 line-height: 1.2; 483 line-height: 1.2;
484 text-align: justify;
485 -moz-text-align-last: center;
486 text-align-last: center;
487} 484}
488 485
489.entry h2::after { 486.entry h2::after {
@@ -1071,7 +1068,7 @@ pre code {
1071 font-family: "Courier New", Courier, monospace; 1068 font-family: "Courier New", Courier, monospace;
1072} 1069}
1073 1070
1074#filter-form { 1071#filters {
1075 position: fixed; 1072 position: fixed;
1076 width: 20%; 1073 width: 20%;
1077 height: 100%; 1074 height: 100%;
@@ -1086,7 +1083,7 @@ pre code {
1086 min-width: 300px; 1083 min-width: 300px;
1087} 1084}
1088 1085
1089#filter-form form .filter-group { 1086#filters form .filter-group {
1090 margin: 5px; 1087 margin: 5px;
1091} 1088}
1092 1089
@@ -1125,9 +1122,11 @@ pre code {
1125 .entry { 1122 .entry {
1126 width: 49%; 1123 width: 49%;
1127 } 1124 }
1125
1128 .entry:nth-child(3n+1) { 1126 .entry:nth-child(3n+1) {
1129 margin-left: 1.5%; 1127 margin-left: 1.5%;
1130 } 1128 }
1129
1131 .entry:nth-child(2n+1) { 1130 .entry:nth-child(2n+1) {
1132 margin-left: 0; 1131 margin-left: 0;
1133 } 1132 }
@@ -1137,6 +1136,7 @@ pre code {
1137 #article { 1136 #article {
1138 width: 80%; 1137 width: 80%;
1139 } 1138 }
1139
1140 .topPosF { 1140 .topPosF {
1141 right: 2.5em; 1141 right: 2.5em;
1142 } 1142 }
@@ -1147,6 +1147,7 @@ pre code {
1147 width: 100%; 1147 width: 100%;
1148 margin-left: 0; 1148 margin-left: 0;
1149 } 1149 }
1150
1150 #display-mode { 1151 #display-mode {
1151 display: none; 1152 display: none;
1152 } 1153 }
@@ -1197,7 +1198,6 @@ pre code {
1197 height: auto; 1198 height: auto;
1198 top: 0.5em; 1199 top: 0.5em;
1199 width: 75px; 1200 width: 75px;
1200 height: 75px;
1201 margin-left: -37.5px; 1201 margin-left: -37.5px;
1202 } 1202 }
1203 1203
@@ -1214,6 +1214,7 @@ pre code {
1214 background-color: #999; 1214 background-color: #999;
1215 font-size: 1.2em; 1215 font-size: 1.2em;
1216 } 1216 }
1217
1217 .desktopHide:hover, 1218 .desktopHide:hover,
1218 .desktopHide:focus { 1219 .desktopHide:focus {
1219 background-color: #fff; 1220 background-color: #fff;
diff --git a/app/Resources/static/themes/baggy/css/ratatouille.css b/app/Resources/static/themes/baggy/css/ratatouille.css
index b5aeb54e..a6167f34 100644
--- a/app/Resources/static/themes/baggy/css/ratatouille.css
+++ b/app/Resources/static/themes/baggy/css/ratatouille.css
@@ -63,7 +63,9 @@ pre {
63 max-width: 61.25em; /* 980px */ 63 max-width: 61.25em; /* 980px */
64} 64}
65 65
66table, img, figure { 66table,
67img,
68figure {
67 max-width: 100%; 69 max-width: 100%;
68 height: auto; 70 height: auto;
69} 71}
diff --git a/app/Resources/static/themes/baggy/js/autoClose.js b/app/Resources/static/themes/baggy/js/autoClose.js
deleted file mode 100644
index b0dafab2..00000000
--- a/app/Resources/static/themes/baggy/js/autoClose.js
+++ /dev/null
@@ -1,8 +0,0 @@
1var $ = global.jquery = require('jquery');
2
3$(document).ready(function () {
4 var currentUrl = window.location.href;
5 if (currentUrl.match('&closewin=true')) {
6 window.close();
7 }
8});
diff --git a/app/Resources/static/themes/baggy/js/autoCompleteTags.js b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
index edd0a421..f287ebfa 100755
--- a/app/Resources/static/themes/baggy/js/autoCompleteTags.js
+++ b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
@@ -1,46 +1,8 @@
1var $ = global.jquery = require('jquery'); 1function split(val) {
2 return val.split(/,\s*/);
3}
4function extractLast(term) {
5 return split(term).pop();
6}
2 7
3jQuery(function ($) { 8export { split, extractLast };
4 function split(val) {
5 return val.split(/,\s*/);
6 }
7 function extractLast(term) {
8 return split(term).pop();
9 }
10
11
12 $('#value').bind('keydown', function (event) {
13 if (event.keyCode === $.ui.keyCode.TAB && $(this).data('ui-autocomplete').menu.active) {
14 event.preventDefault();
15 }
16 }).autocomplete({
17 source: function (request, response) {
18 $.getJSON('./?view=tags', {
19 term: extractLast(request.term),
20 //id: $(':hidden#entry_id').val()
21 }, response);
22 },
23 search: function () {
24 // custom minLength
25 var term = extractLast(this.value);
26 if (term.length < 1) {
27 return false;
28 }
29 },
30 focus: function () {
31 // prevent value inserted on focus
32 return false;
33 },
34 select: function (event, ui) {
35 var terms = split(this.value);
36 // remove the current input
37 terms.pop();
38 // add the selected item
39 terms.push(ui.item.value);
40 // add placeholder to get the comma-and-space at the end
41 terms.push('');
42 this.value = terms.join(', ');
43 return false;
44 },
45 });
46});
diff --git a/app/Resources/static/themes/baggy/js/closeMessage.js b/app/Resources/static/themes/baggy/js/closeMessage.js
deleted file mode 100644
index ae4b1791..00000000
--- a/app/Resources/static/themes/baggy/js/closeMessage.js
+++ /dev/null
@@ -1,19 +0,0 @@
1var $ = global.jquery = require('jquery');
2
3$(function () {
4 //---------------------------------------------------------------------------
5 // Show the close icon when the user hover over a message
6 //---------------------------------------------------------------------------
7 // $('.messages').on('mouseenter', function(){
8 // $(this).find('a.closeMessage').stop(true, true).show();
9 // }).on('mouseleave', function(){
10 // $(this).find('a.closeMessage').stop(true, true).hide();
11 // });
12 //---------------------------------------------------------------------------
13 // Close the message box when the user clicks the close icon
14 //---------------------------------------------------------------------------
15 $('a.closeMessage').on('click', function () {
16 $(this).parents('div.messages').slideUp(300, function () { $(this).remove(); });
17 return false;
18 });
19});
diff --git a/app/Resources/static/themes/baggy/js/init.js b/app/Resources/static/themes/baggy/js/init.js
index d7d4b166..c6a54f6f 100755
--- a/app/Resources/static/themes/baggy/js/init.js
+++ b/app/Resources/static/themes/baggy/js/init.js
@@ -1,21 +1,25 @@
1var $ = global.jquery = require('jquery'); 1const $ = global.jquery = require('jquery');
2require('jquery.cookie'); 2require('jquery.cookie');
3require('jquery-ui'); 3require('jquery-ui');
4var annotator = require('annotator'); 4const annotator = require('annotator');
5import { savePercent, retrievePercent } from '../../_global/js/tools.js';
6import { split, extractLast } from './autoCompleteTags.js';
7import { toggleSaveLinkForm } from './uiTools.js';
5 8
6 9
7$.fn.ready(function () { 10$.fn.ready(() => {
8 var $listmode = $('#listmode'); 11 const $listmode = $('#listmode');
9 var $listentries = $('#list-entries'); 12 const $listentries = $('#list-entries');
10 13
11 /* ========================================================================== 14 /* ==========================================================================
12 Menu 15 Menu
13 ========================================================================== */ 16 ========================================================================== */
14 17
15 $('#menu').click(function () { 18 $('#menu').click(() => {
16 $('#links').toggleClass('menu--open'); 19 $('#links').toggleClass('menu--open');
17 if ($('#content').hasClass('opacity03')) { 20 const content = $('#content');
18 $('#content').removeClass('opacity03'); 21 if (content.hasClass('opacity03')) {
22 content.removeClass('opacity03');
19 } 23 }
20 }); 24 });
21 25
@@ -23,8 +27,8 @@ $.fn.ready(function () {
23 List mode or Table Mode 27 List mode or Table Mode
24 ========================================================================== */ 28 ========================================================================== */
25 29
26 $listmode.click(function () { 30 $listmode.click(() => {
27 if (jquery.cookie('listmode') === 1) { 31 if ($.cookie('listmode') === 1) {
28 // Cookie 32 // Cookie
29 $.removeCookie('listmode'); 33 $.removeCookie('listmode');
30 34
@@ -33,7 +37,7 @@ $.fn.ready(function () {
33 $listmode.addClass('listmode'); 37 $listmode.addClass('listmode');
34 } else { 38 } else {
35 // Cookie 39 // Cookie
36 jquery.cookie('listmode', 1, { expires: 365 }); 40 $.cookie('listmode', 1, { expires: 365 });
37 41
38 $listentries.addClass('listmode'); 42 $listentries.addClass('listmode');
39 $listmode.removeClass('listmode'); 43 $listmode.removeClass('listmode');
@@ -45,7 +49,7 @@ $.fn.ready(function () {
45 Cookie listmode 49 Cookie listmode
46 ========================================================================== */ 50 ========================================================================== */
47 51
48 if (jquery.cookie('listmode') === 1) { 52 if ($.cookie('listmode') === 1) {
49 $listentries.addClass('listmode'); 53 $listentries.addClass('listmode');
50 $listmode.removeClass('listmode'); 54 $listmode.removeClass('listmode');
51 $listmode.addClass('tablemode'); 55 $listmode.addClass('tablemode');
@@ -56,43 +60,250 @@ $.fn.ready(function () {
56 ========================================================================== */ 60 ========================================================================== */
57 61
58 62
59 $('#nav-btn-add-tag').on('click', function () { 63 $('#nav-btn-add-tag').on('click', () => {
60 $('.nav-panel-add-tag').toggle(100); 64 $('.nav-panel-add-tag').toggle(100);
61 $('.nav-panel-menu').addClass('hidden'); 65 $('.nav-panel-menu').addClass('hidden');
62 $('#tag_label').focus(); 66 $('#tag_label').focus();
63 return false; 67 return false;
64 }); 68 });
65 69
70 /**
71 * Filters & Export
72 */
73 // no display if filters not available
74 if ($('div').is('#filters')) {
75 $('#button_filters').show();
76 $('#clear_form_filters').on('click', () => {
77 $('#filters input').val('');
78 $('#filters :checked').removeAttr('checked');
79 return false;
80 });
81 }
82
66 /* ========================================================================== 83 /* ==========================================================================
67 Annotations & Remember position 84 Annotations & Remember position
68 ========================================================================== */ 85 ========================================================================== */
69 86
70 if ($('article').length) { 87 if ($('article').length) {
71 var app = new annotator.App(); 88 const app = new annotator.App();
89
90 app.include(annotator.ui.main, {
91 element: document.querySelector('article'),
92 });
72 93
73 app.include(annotator.ui.main, { 94 const x = JSON.parse($('#annotationroutes').html());
74 element: document.querySelector('article'), 95 app.include(annotator.storage.http, x);
75 });
76 96
77 var x = JSON.parse($('#annotationroutes').html()); 97 app.start().then(() => {
78 app.include(annotator.storage.http, x); 98 app.annotations.load({ entry: x.entryId });
99 });
79 100
80 app.start().then(function () { 101 $(window).scroll(() => {
81 app.annotations.load({ entry: x.entryId }); 102 const scrollTop = $(window).scrollTop();
82 }); 103 const docHeight = $(document).height();
104 const scrollPercent = (scrollTop) / (docHeight);
105 const scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
106 savePercent(x.entryId, scrollPercentRounded);
107 });
83 108
84 $(window).scroll(function (e) { 109 retrievePercent(x.entryId);
85 var scrollTop = $(window).scrollTop();
86 var docHeight = $(document).height();
87 var scrollPercent = (scrollTop) / (docHeight);
88 var scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
89 savePercent(x.entryId, scrollPercentRounded);
90 });
91 110
111 $(window).resize(() => {
92 retrievePercent(x.entryId); 112 retrievePercent(x.entryId);
113 });
114 }
115
116 /**
117 * Close window after adding entry if popup
118 */
119 const currentUrl = window.location.href;
120 if (currentUrl.match('&closewin=true')) {
121 window.close();
122 }
123
124 /**
125 * Tags autocomplete
126 */
127 $('#value').bind('keydown', (event) => {
128 if (event.keyCode === $.ui.keyCode.TAB && $(this).data('ui-autocomplete').menu.active) {
129 event.preventDefault();
130 }
131 }).autocomplete({
132 source: function source(request, response) {
133 $.getJSON('./?view=tags', {
134 term: extractLast(request.term),
135 //id: $(':hidden#entry_id').val()
136 }, response);
137 },
138 search: function search() {
139 // custom minLength
140 const term = extractLast(this.value);
141 return term.length >= 1;
142 },
143 focus: function focus() {
144 // prevent value inserted on focus
145 return false;
146 },
147 select: function select(event, ui) {
148 const terms = split(this.value);
149 // remove the current input
150 terms.pop();
151 // add the selected item
152 terms.push(ui.item.value);
153 // add placeholder to get the comma-and-space at the end
154 terms.push('');
155 this.value = terms.join(', ');
156 return false;
157 },
158 });
159
160 //---------------------------------------------------------------------------
161 // Close the message box when the user clicks the close icon
162 //---------------------------------------------------------------------------
163 $('a.closeMessage').on('click', () => {
164 $(this).parents('div.messages').slideUp(300, () => { $(this).remove(); });
165 return false;
166 });
167
168 $('#search-form').hide();
169 $('#bagit-form').hide();
170 $('#filters').hide();
171 $('#download-form').hide();
93 172
94 $(window).resize(function () { 173 //---------------------------------------------------------------------------
95 retrievePercent(x.entryId); 174 // Toggle the 'Search' popup in the sidebar
96 }); 175 //---------------------------------------------------------------------------
176 function toggleSearch() {
177 $('#search-form').toggle();
178 $('#search').toggleClass('current');
179 $('#search').toggleClass('active-current');
180 $('#search-arrow').toggleClass('arrow-down');
181 if ($('#search').hasClass('current')) {
182 $('#content').addClass('opacity03');
183 } else {
184 $('#content').removeClass('opacity03');
185 }
186 }
187
188 //---------------------------------------------------------------------------
189 // Toggle the 'Filter' popup on entries list
190 //---------------------------------------------------------------------------
191 function toggleFilter() {
192 $('#filters').toggle();
193 }
194
195 //---------------------------------------------------------------------------
196 // Toggle the 'Download' popup on entries list
197 //---------------------------------------------------------------------------
198 function toggleDownload() {
199 $('#download-form').toggle();
200 }
201
202 //---------------------------------------------------------------------------
203 // Toggle the 'Save a Link' popup in the sidebar
204 //---------------------------------------------------------------------------
205 function toggleBagit() {
206 $('#bagit-form').toggle();
207 $('#bagit').toggleClass('current');
208 $('#bagit').toggleClass('active-current');
209 $('#bagit-arrow').toggleClass('arrow-down');
210 if ($('#bagit').hasClass('current')) {
211 $('#content').addClass('opacity03');
212 } else {
213 $('#content').removeClass('opacity03');
97 } 214 }
215 }
216
217 //---------------------------------------------------------------------------
218 // Close all #links popups in the sidebar
219 //---------------------------------------------------------------------------
220 function closePopups() {
221 $('#links .messages').hide();
222 $('#links > li > a').removeClass('active-current');
223 $('#links > li > a').removeClass('current');
224 $('[id$=-arrow]').removeClass('arrow-down');
225 $('#content').removeClass('opacity03');
226 }
227
228 $('#search').click(() => {
229 closePopups();
230 toggleSearch();
231 $('#searchfield').focus();
232 });
233
234 $('.filter-btn').click(() => {
235 closePopups();
236 toggleFilter();
237 });
238
239 $('.download-btn').click(() => {
240 closePopups();
241 toggleDownload();
242 });
243
244 $('#bagit').click(() => {
245 closePopups();
246 toggleBagit();
247 $('#plainurl').focus();
248 });
249
250 $('#search-form-close').click(() => {
251 toggleSearch();
252 });
253
254 $('#filter-form-close').click(() => {
255 toggleFilter();
256 });
257
258 $('#download-form-close').click(() => {
259 toggleDownload();
260 });
261
262 $('#bagit-form-close').click(() => {
263 toggleBagit();
264 });
265
266 const $bagitFormForm = $('#bagit-form-form');
267
268 /* ==========================================================================
269 bag it link and close button
270 ========================================================================== */
271
272 // send 'bag it link' form request via ajax
273 $bagitFormForm.submit((event) => {
274 $('body').css('cursor', 'wait');
275 $('#add-link-result').empty();
276
277 $.ajax({
278 type: $bagitFormForm.attr('method'),
279 url: $bagitFormForm.attr('action'),
280 data: $bagitFormForm.serialize(),
281 success: function success() {
282 $('#add-link-result').html('Done!');
283 $('#plainurl').val('');
284 $('#plainurl').blur('');
285 $('body').css('cursor', 'auto');
286 },
287 error: function error() {
288 $('#add-link-result').html('Failed!');
289 $('body').css('cursor', 'auto');
290 },
291 });
292
293 event.preventDefault();
294 });
295
296 /* ==========================================================================
297 Process all links inside an article
298 ========================================================================== */
299
300 $('article a[href^="http"]').after(
301 () => `<a href="${$(this).attr('href')}" class="add-to-wallabag-link-after" ` +
302 'alt="add to wallabag" title="add to wallabag"></a>'
303 );
304
305 $('.add-to-wallabag-link-after').click((event) => {
306 toggleSaveLinkForm($(this).attr('href'), event);
307 event.preventDefault();
308 });
98}); 309});
diff --git a/app/Resources/static/themes/baggy/js/popupForm.js b/app/Resources/static/themes/baggy/js/popupForm.js
deleted file mode 100644
index 95ba60ee..00000000
--- a/app/Resources/static/themes/baggy/js/popupForm.js
+++ /dev/null
@@ -1,101 +0,0 @@
1var $ = global.jquery = require('jquery');
2
3$(document).ready(function () {
4 $('#search-form').hide();
5 $('#bagit-form').hide();
6 $('#filter-form').hide();
7 $('#download-form').hide();
8
9 //---------------------------------------------------------------------------
10 // Toggle the 'Search' popup in the sidebar
11 //---------------------------------------------------------------------------
12 function toggleSearch() {
13 $('#search-form').toggle();
14 $('#search').toggleClass('current');
15 $('#search').toggleClass('active-current');
16 $('#search-arrow').toggleClass('arrow-down');
17 if ($('#search').hasClass('current')) {
18 $('#content').addClass('opacity03');
19 } else {
20 $('#content').removeClass('opacity03');
21 }
22 }
23
24 //---------------------------------------------------------------------------
25 // Toggle the 'Filter' popup on entries list
26 //---------------------------------------------------------------------------
27 function toggleFilter() {
28 $('#filter-form').toggle();
29 }
30
31 //---------------------------------------------------------------------------
32 // Toggle the 'Download' popup on entries list
33 //---------------------------------------------------------------------------
34 function toggleDownload() {
35 $('#download-form').toggle();
36 }
37
38 //---------------------------------------------------------------------------
39 // Toggle the 'Save a Link' popup in the sidebar
40 //---------------------------------------------------------------------------
41 function toggleBagit() {
42 $('#bagit-form').toggle();
43 $('#bagit').toggleClass('current');
44 $('#bagit').toggleClass('active-current');
45 $('#bagit-arrow').toggleClass('arrow-down');
46 if ($('#bagit').hasClass('current')) {
47 $('#content').addClass('opacity03');
48 } else {
49 $('#content').removeClass('opacity03');
50 }
51 }
52
53 //---------------------------------------------------------------------------
54 // Close all #links popups in the sidebar
55 //---------------------------------------------------------------------------
56 function closePopups() {
57 $('#links .messages').hide();
58 $('#links > li > a').removeClass('active-current');
59 $('#links > li > a').removeClass('current');
60 $('[id$=-arrow]').removeClass('arrow-down');
61 $('#content').removeClass('opacity03');
62 }
63
64 $('#search').click(function () {
65 closePopups();
66 toggleSearch();
67 $('#searchfield').focus();
68 });
69
70 $('.filter-btn').click(function () {
71 closePopups();
72 toggleFilter();
73 });
74
75 $('.download-btn').click(function () {
76 closePopups();
77 toggleDownload();
78 });
79
80 $('#bagit').click(function () {
81 closePopups();
82 toggleBagit();
83 $('#plainurl').focus();
84 });
85
86 $('#search-form-close').click(function () {
87 toggleSearch();
88 });
89
90 $('#filter-form-close').click(function () {
91 toggleFilter();
92 });
93
94 $('#download-form-close').click(function () {
95 toggleDownload();
96 });
97
98 $('#bagit-form-close').click(function () {
99 toggleBagit();
100 });
101});
diff --git a/app/Resources/static/themes/baggy/js/saveLink.js b/app/Resources/static/themes/baggy/js/saveLink.js
deleted file mode 100755
index 5c720886..00000000
--- a/app/Resources/static/themes/baggy/js/saveLink.js
+++ /dev/null
@@ -1,75 +0,0 @@
1var $ = global.jquery = require('jquery');
2
3$.fn.ready(function () {
4 var $bagit = $('#bagit');
5 var $bagitForm = $('#bagit-form');
6 var $bagitFormForm = $('#bagit-form-form');
7
8 /* ==========================================================================
9 bag it link and close button
10 ========================================================================== */
11
12 function toggleSaveLinkForm(url, event) {
13 $('#add-link-result').empty();
14
15 $bagit.toggleClass('active-current');
16
17 // only if bag-it link is not presented on page
18 if ($bagit.length === 0) {
19 if (event !== 'undefined' && event) {
20 $bagitForm.css({ position: 'absolute', top: event.pageY, left: event.pageX - 200 });
21 } else {
22 $bagitForm.css({ position: 'relative', top: 'auto', left: 'auto' });
23 }
24 }
25
26 if ($('#search-form').length !== 0) {
27 $('#search').removeClass('current');
28 $('#search-arrow').removeClass('arrow-down');
29 $('#search-form').hide();
30 }
31 $bagitForm.toggle();
32 $('#content').toggleClass('opacity03');
33 if (url !== 'undefined' && url) {
34 $('#plainurl').val(url);
35 }
36 $('#plainurl').focus();
37 }
38
39 // send 'bag it link' form request via ajax
40 $bagitFormForm.submit(function (event) {
41 $('body').css('cursor', 'wait');
42 $('#add-link-result').empty();
43
44 $.ajax({
45 type: $bagitFormForm.attr('method'),
46 url: $bagitFormForm.attr('action'),
47 data: $bagitFormForm.serialize(),
48 success: function (data) {
49 $('#add-link-result').html('Done!');
50 $('#plainurl').val('');
51 $('#plainurl').blur('');
52 $('body').css('cursor', 'auto');
53 },
54 error: function (data) {
55 $('#add-link-result').html('Failed!');
56 $('body').css('cursor', 'auto');
57 },
58 });
59
60 event.preventDefault();
61 });
62
63 /* ==========================================================================
64 Process all links inside an article
65 ========================================================================== */
66
67 $('article a[href^="http"]').after(function () {
68 return ' <a href="' + $(this).attr('href') + '" class="add-to-wallabag-link-after" alt="add to wallabag" title="add to wallabag"></a> ';
69 });
70
71 $('.add-to-wallabag-link-after').click(function (event) {
72 toggleSaveLinkForm($(this).attr('href'), event);
73 event.preventDefault();
74 });
75});
diff --git a/app/Resources/static/themes/baggy/js/uiTools.js b/app/Resources/static/themes/baggy/js/uiTools.js
new file mode 100644
index 00000000..900b2707
--- /dev/null
+++ b/app/Resources/static/themes/baggy/js/uiTools.js
@@ -0,0 +1,35 @@
1const $ = require('jquery');
2
3function toggleSaveLinkForm(url, event) {
4 $('#add-link-result').empty();
5
6 const $bagit = $('#bagit');
7 const $bagitForm = $('#bagit-form');
8
9 $bagit.toggleClass('active-current');
10
11 // only if bag-it link is not presented on page
12 if ($bagit.length === 0) {
13 if (event !== 'undefined' && event) {
14 $bagitForm.css({ position: 'absolute', top: event.pageY, left: event.pageX - 200 });
15 } else {
16 $bagitForm.css({ position: 'relative', top: 'auto', left: 'auto' });
17 }
18 }
19
20 const searchForm = $('#search-form');
21 const plainUrl = $('#plainurl');
22 if (searchForm.length !== 0) {
23 $('#search').removeClass('current');
24 $('#search-arrow').removeClass('arrow-down');
25 searchForm.hide();
26 }
27 $bagitForm.toggle();
28 $('#content').toggleClass('opacity03');
29 if (url !== 'undefined' && url) {
30 plainUrl.val(url);
31 }
32 plainUrl.focus();
33}
34
35export { toggleSaveLinkForm };
diff --git a/app/Resources/static/themes/material/css/main.css b/app/Resources/static/themes/material/css/main.css
index 65b708c7..1d14448f 100755
--- a/app/Resources/static/themes/material/css/main.css
+++ b/app/Resources/static/themes/material/css/main.css
@@ -174,7 +174,7 @@ div.pagination ul .next.disabled {
174 174
175footer.page-footer { 175footer.page-footer {
176 margin-top: 10px; 176 margin-top: 10px;
177 padding-top: 0px; 177 padding-top: 0;
178} 178}
179 179
180footer .row { 180footer .row {
@@ -257,8 +257,9 @@ nav input {
257 display: none; 257 display: none;
258} 258}
259 259
260.input-field.nav-panel-add, .input-field.nav-panel-add form { 260.input-field.nav-panel-add,
261 height: 100%; 261.input-field.nav-panel-add form {
262 height: 100%;
262} 263}
263 264
264/* ========================================================================== 265/* ==========================================================================
@@ -355,8 +356,9 @@ main ul.row {
355 display: block; 356 display: block;
356} 357}
357 358
358.card .card-content i.right, .card .card-reveal i.right { 359.card .card-content i.right,
359 margin-left: 0; 360.card .card-reveal i.right {
361 margin-left: 0;
360} 362}
361 363
362.card .card-entry-labels { 364.card .card-entry-labels {
@@ -528,30 +530,38 @@ main ul.row {
528 footer { 530 footer {
529 padding-left: 0; 531 padding-left: 0;
530 } 532 }
533
531 nav, 534 nav,
532 main, 535 main,
533 footer { 536 footer {
534 padding-left: 0; 537 padding-left: 0;
535 } 538 }
539
536 .pagination { 540 .pagination {
537 width: auto; 541 width: auto;
538 } 542 }
543
539 .reader-mode { 544 .reader-mode {
540 width: 240px !important; 545 width: 240px !important;
541 } 546 }
547
542 .reader-mode span { 548 .reader-mode span {
543 opacity: 1; 549 opacity: 1;
544 } 550 }
551
545 .tabs { 552 .tabs {
546 display: inline-block; 553 display: inline-block;
547 height: auto; 554 height: auto;
548 } 555 }
556
549 .tab { 557 .tab {
550 min-width: 100%; 558 min-width: 100%;
551 } 559 }
560
552 .indicator { 561 .indicator {
553 display: none; 562 display: none;
554 } 563 }
564
555 .pagination li.prev, 565 .pagination li.prev,
556 .pagination li.next { 566 .pagination li.next {
557 width: auto; 567 width: auto;
@@ -569,38 +579,47 @@ main ul.row {
569 width: 25%; 579 width: 25%;
570 margin-left: 0; 580 margin-left: 0;
571 } 581 }
582
572 .row .col.l2 { 583 .row .col.l2 {
573 width: 33.33333%; 584 width: 33.33333%;
574 margin-left: 0; 585 margin-left: 0;
575 } 586 }
587
576 .row .col.l3 { 588 .row .col.l3 {
577 width: 41.66667%; 589 width: 41.66667%;
578 margin-left: 0; 590 margin-left: 0;
579 } 591 }
592
580 .row .col.l4 { 593 .row .col.l4 {
581 width: 50%; 594 width: 50%;
582 margin-left: 0; 595 margin-left: 0;
583 } 596 }
597
584 .row .col.l5 { 598 .row .col.l5 {
585 width: 58.33333%; 599 width: 58.33333%;
586 margin-left: 0; 600 margin-left: 0;
587 } 601 }
602
588 .row .col.l6 { 603 .row .col.l6 {
589 width: 66.66667%; 604 width: 66.66667%;
590 margin-left: 0; 605 margin-left: 0;
591 } 606 }
607
592 .row .col.l7 { 608 .row .col.l7 {
593 width: 75%; 609 width: 75%;
594 margin-left: 0; 610 margin-left: 0;
595 } 611 }
612
596 .row .col.l8 { 613 .row .col.l8 {
597 width: 83.33333%; 614 width: 83.33333%;
598 margin-left: 0; 615 margin-left: 0;
599 } 616 }
617
600 .row .col.l9 { 618 .row .col.l9 {
601 width: 91.66667%; 619 width: 91.66667%;
602 margin-left: 0; 620 margin-left: 0;
603 } 621 }
622
604 .row .col.l10 { 623 .row .col.l10 {
605 width: 100%; 624 width: 100%;
606 margin-left: 0; 625 margin-left: 0;
@@ -646,7 +665,7 @@ main ul.row {
646} 665}
647 666
648.icon-link::before { 667.icon-link::before {
649 content: "\e9cb"; 668 content: "\e9cb";
650} 669}
651 670
652footer [class^="icon-"], 671footer [class^="icon-"],
@@ -677,5 +696,5 @@ div.settings div.file-field div {
677} 696}
678 697
679.input-field label.active { 698.input-field label.active {
680 font-size: 1rem; 699 font-size: 1rem;
681} 700}
diff --git a/app/Resources/static/themes/material/css/print.css b/app/Resources/static/themes/material/css/print.css
index 1eb96735..98505aae 100755
--- a/app/Resources/static/themes/material/css/print.css
+++ b/app/Resources/static/themes/material/css/print.css
@@ -28,10 +28,10 @@
28 .messages, 28 .messages,
29 .entry + .results, 29 .entry + .results,
30 #slide-out, 30 #slide-out,
31 .progress, .hide-on-large-only, 31 .progress,
32 .hide-on-large-only,
32 #article > aside, 33 #article > aside,
33 #article .mbm a 34 #article .mbm a {
34 {
35 display: none !important; 35 display: none !important;
36 } 36 }
37 37
diff --git a/app/Resources/static/themes/material/js/init.js b/app/Resources/static/themes/material/js/init.js
index d6a87941..18f7b40a 100755
--- a/app/Resources/static/themes/material/js/init.js
+++ b/app/Resources/static/themes/material/js/init.js
@@ -1,29 +1,10 @@
1var $ = require('jquery'); 1const $ = require('jquery');
2require('materialize'); 2global.jQuery = $;
3var annotator = require('annotator'); 3require('materialize'); // eslint-disable-line
4const annotator = require('annotator');
5import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools.js';
4 6
5function initFilters() { 7$(document).ready(() => {
6 // no display if filters not aviable
7 if ($('div').is('#filters')) {
8 $('#button_filters').show();
9 $('.button-collapse-right').sideNav({ edge: 'right' });
10 $('#clear_form_filters').on('click', function () {
11 $('#filters input').val('');
12 $('#filters :checked').removeAttr('checked');
13 return false;
14 });
15 }
16}
17
18function initExport() {
19 // no display if export not aviable
20 if ($('div').is('#export')) {
21 $('#button_export').show();
22 $('.button-collapse-right').sideNav({ edge: 'right' });
23 }
24}
25
26$(document).ready(function () {
27 // sideNav 8 // sideNav
28 $('.button-collapse').sideNav(); 9 $('.button-collapse').sideNav();
29 $('select').material_select(); 10 $('select').material_select();
@@ -40,13 +21,13 @@ $(document).ready(function () {
40 initFilters(); 21 initFilters();
41 initExport(); 22 initExport();
42 23
43 $('#nav-btn-add-tag').on('click', function () { 24 $('#nav-btn-add-tag').on('click', () => {
44 $('.nav-panel-add-tag').toggle(100); 25 $('.nav-panel-add-tag').toggle(100);
45 $('.nav-panel-menu').addClass('hidden'); 26 $('.nav-panel-menu').addClass('hidden');
46 $('#tag_label').focus(); 27 $('#tag_label').focus();
47 return false; 28 return false;
48 }); 29 });
49 $('#nav-btn-add').on('click', function () { 30 $('#nav-btn-add').on('click', () => {
50 $('.nav-panel-buttom').hide(100); 31 $('.nav-panel-buttom').hide(100);
51 $('.nav-panel-add').show(100); 32 $('.nav-panel-add').show(100);
52 $('.nav-panels .action').hide(100); 33 $('.nav-panels .action').hide(100);
@@ -55,7 +36,7 @@ $(document).ready(function () {
55 $('#entry_url').focus(); 36 $('#entry_url').focus();
56 return false; 37 return false;
57 }); 38 });
58 $('#nav-btn-search').on('click', function () { 39 $('#nav-btn-search').on('click', () => {
59 $('.nav-panel-buttom').hide(100); 40 $('.nav-panel-buttom').hide(100);
60 $('.nav-panel-search').show(100); 41 $('.nav-panel-search').show(100);
61 $('.nav-panels .action').hide(100); 42 $('.nav-panels .action').hide(100);
@@ -64,7 +45,7 @@ $(document).ready(function () {
64 $('#searchfield').focus(); 45 $('#searchfield').focus();
65 return false; 46 return false;
66 }); 47 });
67 $('.close').on('click', function () { 48 $('.close').on('click', () => {
68 $('.nav-panel-add').hide(100); 49 $('.nav-panel-add').hide(100);
69 $('.nav-panel-search').hide(100); 50 $('.nav-panel-search').hide(100);
70 $('.nav-panel-buttom').show(100); 51 $('.nav-panel-buttom').show(100);
@@ -73,12 +54,12 @@ $(document).ready(function () {
73 $('.nav-panels').css('background', 'transparent'); 54 $('.nav-panels').css('background', 'transparent');
74 return false; 55 return false;
75 }); 56 });
76 $(window).scroll(function () { 57 $(window).scroll(() => {
77 var s = $(window).scrollTop(); 58 const s = $(window).scrollTop();
78 var d = $(document).height(); 59 const d = $(document).height();
79 var c = $(window).height(); 60 const c = $(window).height();
80 var scrollPercent = (s / (d - c)) * 100; 61 const scrollPercent = (s / (d - c)) * 100;
81 $('.progress .determinate').css('width', scrollPercent + '%'); 62 $('.progress .determinate').css('width', `${scrollPercent}%`);
82 }); 63 });
83 64
84/* ========================================================================== 65/* ==========================================================================
@@ -86,9 +67,8 @@ $(document).ready(function () {
86 ========================================================================== */ 67 ========================================================================== */
87 68
88 if ($('article').length) { 69 if ($('article').length) {
89 var app = new annotator.App(); 70 const app = new annotator.App();
90 var x = JSON.parse($('#annotationroutes').html()); 71 const x = JSON.parse($('#annotationroutes').html());
91
92 72
93 app.include(annotator.ui.main, { 73 app.include(annotator.ui.main, {
94 element: document.querySelector('article'), 74 element: document.querySelector('article'),
@@ -96,21 +76,21 @@ $(document).ready(function () {
96 76
97 app.include(annotator.storage.http, x); 77 app.include(annotator.storage.http, x);
98 78
99 app.start().then(function () { 79 app.start().then(() => {
100 app.annotations.load({ entry: x.entryId }); 80 app.annotations.load({ entry: x.entryId });
101 }); 81 });
102 82
103 $(window).scroll(function (e) { 83 $(window).scroll(() => {
104 var scrollTop = $(window).scrollTop(); 84 const scrollTop = $(window).scrollTop();
105 var docHeight = $(document).height(); 85 const docHeight = $(document).height();
106 var scrollPercent = (scrollTop) / (docHeight); 86 const scrollPercent = (scrollTop) / (docHeight);
107 var scrollPercentRounded = Math.round(scrollPercent * 100) / 100; 87 const scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
108 savePercent(x.entryId, scrollPercentRounded); 88 savePercent(x.entryId, scrollPercentRounded);
109 }); 89 });
110 90
111 retrievePercent(x.entryId); 91 retrievePercent(x.entryId);
112 92
113 $(window).resize(function () { 93 $(window).resize(() => {
114 retrievePercent(x.entryId); 94 retrievePercent(x.entryId);
115 }); 95 });
116 } 96 }
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-29 12:42:37 +0000