diff options
author | Thomas Citharel <tcit@tcit.fr> | 2016-09-28 10:30:18 +0200 |
---|---|---|
committer | Thomas Citharel <tcit@tcit.fr> | 2016-09-28 10:30:18 +0200 |
commit | c146f6940a176142084b4fc3c610d13aca60d90e (patch) | |
tree | 7bc4683febcf15a4fd6053bddd49e36c202adeda | |
parent | 55345331c47ca6f389e38a842584c3062476601d (diff) | |
download | wallabag-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
23 files changed, 445 insertions, 417 deletions
diff --git a/.eslintrc.json b/.eslintrc.json index 976a9eb5..d6279c64 100644 --- a/.eslintrc.json +++ b/.eslintrc.json | |||
@@ -1,4 +1,4 @@ | |||
1 | { | 1 | { |
2 | "extends": "airbnb", | 2 | "extends": "airbnb", |
3 | "installedESLint": true, | 3 | "parser": "babel-eslint" |
4 | } | 4 | } |
@@ -49,3 +49,7 @@ app/Resources/static/lib/* | |||
49 | /bin | 49 | /bin |
50 | !/src/Wallabag/CoreBundle/Resources/public | 50 | !/src/Wallabag/CoreBundle/Resources/public |
51 | /src/Wallabag/CoreBundle/Resources/public/* | 51 | /src/Wallabag/CoreBundle/Resources/public/* |
52 | |||
53 | # PHPStorm | ||
54 | .idea/ | ||
55 | |||
diff --git a/.stylelintrc b/.stylelintrc new file mode 100644 index 00000000..40db42c6 --- /dev/null +++ b/.stylelintrc | |||
@@ -0,0 +1,3 @@ | |||
1 | { | ||
2 | "extends": "stylelint-config-standard" | ||
3 | } | ||
diff --git a/Gruntfile.js b/Gruntfile.js index 8dc5b83b..92774081 100644 --- a/Gruntfile.js +++ b/Gruntfile.js | |||
@@ -41,27 +41,6 @@ module.exports = function (grunt) { | |||
41 | options: { | 41 | options: { |
42 | separator: ';', | 42 | separator: ';', |
43 | }, | 43 | }, |
44 | jsMaterial: { | ||
45 | src: [ | ||
46 | '<%= appDir %>/themes/material/js/init.js', | ||
47 | '<%= appDir %>/themes/_global/js/restoreScroll.js', | ||
48 | 'node_modules/jquery.tinydot/src/jquery.tinydot.js', | ||
49 | ], | ||
50 | dest: '<%= buildDir %>/material.js', | ||
51 | }, | ||
52 | jsBaggy: { | ||
53 | src: [ | ||
54 | '<%= appDir %>/themes/baggy/js/init.js', | ||
55 | '<%= appDir %>/themes/_global/js/restoreScroll.js', | ||
56 | '<%= appDir %>/themes/baggy/js/autoClose.js', | ||
57 | '<%= appDir %>/themes/baggy/js/autoCompleteTags.js', | ||
58 | '<%= appDir %>/themes/baggy/js/closeMessage.js', | ||
59 | '<%= appDir %>/themes/baggy/js/popupForm.js', | ||
60 | // Save link is no more used for now | ||
61 | // '<%= appDir %>/themes/baggy/js/saveLink.js', | ||
62 | ], | ||
63 | dest: '<%= buildDir %>/baggy.js', | ||
64 | }, | ||
65 | cssMaterial: { | 44 | cssMaterial: { |
66 | src: [ | 45 | src: [ |
67 | 'node_modules/materialize-css/bin/materialize.css', | 46 | 'node_modules/materialize-css/bin/materialize.css', |
@@ -77,8 +56,27 @@ module.exports = function (grunt) { | |||
77 | }, | 56 | }, |
78 | }, | 57 | }, |
79 | browserify: { | 58 | browserify: { |
80 | '<%= buildDir %>/material.browser.js': ['<%= buildDir %>/material.js'], | 59 | dist: { |
81 | '<%= buildDir %>/baggy.browser.js': ['<%= buildDir %>/baggy.js'], | 60 | files: { |
61 | '<%= buildDir %>/material.browser.js': ['<%= appDir %>/themes/material/js/init.js'], | ||
62 | '<%= buildDir %>/baggy.browser.js': ['<%= appDir %>/themes/baggy/js/init.js'] | ||
63 | } | ||
64 | }, | ||
65 | options: { | ||
66 | sourceType: "module", | ||
67 | transform: [ | ||
68 | ["babelify", { | ||
69 | presets: ["es2015"] | ||
70 | }], "browserify-shim" | ||
71 | ], | ||
72 | browserifyOptions: { | ||
73 | browser: { | ||
74 | "jQuery": "./node_modules/jquery/dist/jquery.js", | ||
75 | "jquery.tinydot": "./nodes_modules/jquery.tinydot/src/jquery.tinydot.js" | ||
76 | } | ||
77 | } | ||
78 | } | ||
79 | |||
82 | }, | 80 | }, |
83 | uglify: { | 81 | uglify: { |
84 | material: { | 82 | material: { |
@@ -199,7 +197,7 @@ module.exports = function (grunt) { | |||
199 | grunt.registerTask( | 197 | grunt.registerTask( |
200 | 'js', | 198 | 'js', |
201 | 'Build and install js files', | 199 | 'Build and install js files', |
202 | ['clean:js', 'copy:pickerjs', 'concat:jsMaterial', 'concat:jsBaggy', 'browserify', 'uglify'] | 200 | ['clean:js', 'copy:pickerjs', 'browserify', 'uglify'] |
203 | ); | 201 | ); |
204 | 202 | ||
205 | grunt.registerTask( | 203 | grunt.registerTask( |
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 | ||
2 | top["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>" | 2 | top['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 @@ | |||
1 | function supportsLocalStorage() { | ||
2 | try { | ||
3 | return 'localStorage' in window && window.localStorage !== null; | ||
4 | } catch (e) { | ||
5 | return false; | ||
6 | } | ||
7 | } | ||
8 | |||
9 | function savePercent(id, percent) { | ||
10 | if (!supportsLocalStorage()) { return false; } | ||
11 | localStorage['wallabag.article.' + id + '.percent'] = percent; | ||
12 | return true; | ||
13 | } | ||
14 | |||
15 | function 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 @@ | |||
1 | const $ = require('jquery'); | ||
2 | |||
3 | function supportsLocalStorage() { | ||
4 | try { | ||
5 | return 'localStorage' in window && window.localStorage !== null; | ||
6 | } catch (e) { | ||
7 | return false; | ||
8 | } | ||
9 | } | ||
10 | |||
11 | function savePercent(id, percent) { | ||
12 | if (!supportsLocalStorage()) { return false; } | ||
13 | localStorage[`wallabag.article.${id}.percent`] = percent; | ||
14 | return true; | ||
15 | } | ||
16 | |||
17 | function 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 | |||
29 | function 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 | |||
42 | function 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 | |||
50 | export { 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 | ||
66 | table, img, figure { | 66 | table, |
67 | img, | ||
68 | figure { | ||
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 @@ | |||
1 | var $ = 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 @@ | |||
1 | var $ = global.jquery = require('jquery'); | 1 | function split(val) { |
2 | return val.split(/,\s*/); | ||
3 | } | ||
4 | function extractLast(term) { | ||
5 | return split(term).pop(); | ||
6 | } | ||
2 | 7 | ||
3 | jQuery(function ($) { | 8 | export { 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 @@ | |||
1 | var $ = 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 @@ | |||
1 | var $ = global.jquery = require('jquery'); | 1 | const $ = global.jquery = require('jquery'); |
2 | require('jquery.cookie'); | 2 | require('jquery.cookie'); |
3 | require('jquery-ui'); | 3 | require('jquery-ui'); |
4 | var annotator = require('annotator'); | 4 | const annotator = require('annotator'); |
5 | import { savePercent, retrievePercent } from '../../_global/js/tools.js'; | ||
6 | import { split, extractLast } from './autoCompleteTags.js'; | ||
7 | import { 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 @@ | |||
1 | var $ = 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 @@ | |||
1 | var $ = 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 @@ | |||
1 | const $ = require('jquery'); | ||
2 | |||
3 | function 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 | |||
35 | export { 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 | ||
175 | footer.page-footer { | 175 | footer.page-footer { |
176 | margin-top: 10px; | 176 | margin-top: 10px; |
177 | padding-top: 0px; | 177 | padding-top: 0; |
178 | } | 178 | } |
179 | 179 | ||
180 | footer .row { | 180 | footer .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 | ||
652 | footer [class^="icon-"], | 671 | footer [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 @@ | |||
1 | var $ = require('jquery'); | 1 | const $ = require('jquery'); |
2 | require('materialize'); | 2 | global.jQuery = $; |
3 | var annotator = require('annotator'); | 3 | require('materialize'); // eslint-disable-line |
4 | const annotator = require('annotator'); | ||
5 | import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools.js'; | ||
4 | 6 | ||
5 | function 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 | |||
18 | function 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 | } |
diff --git a/package.json b/package.json index 39a10e9c..78970f8f 100644 --- a/package.json +++ b/package.json | |||
@@ -10,6 +10,8 @@ | |||
10 | "dependencies": { | 10 | "dependencies": { |
11 | "annotator": "git://github.com/wallabag/annotator.git#0f076c7d371ed25eb0793346f46982d90f2c4c85", | 11 | "annotator": "git://github.com/wallabag/annotator.git#0f076c7d371ed25eb0793346f46982d90f2c4c85", |
12 | "autoprefixer": "^6.3.6", | 12 | "autoprefixer": "^6.3.6", |
13 | "babel-preset-es2015": "^6.14.0", | ||
14 | "babelify": "^7.3.0", | ||
13 | "bower": "^1.7.7", | 15 | "bower": "^1.7.7", |
14 | "browserify": "^13.0.0", | 16 | "browserify": "^13.0.0", |
15 | "browserify-shim": "^3.8.12", | 17 | "browserify-shim": "^3.8.12", |
@@ -83,7 +85,10 @@ | |||
83 | "url": "https://github.com/wallabag/wallabag/issues" | 85 | "url": "https://github.com/wallabag/wallabag/issues" |
84 | }, | 86 | }, |
85 | "devDependencies": { | 87 | "devDependencies": { |
86 | "eslint": "^2.11.1", | 88 | "babel-eslint": "^6.1.2", |
87 | "eslint-config-airbnb": "^9.0.1" | 89 | "eslint": "^2.13.1", |
90 | "eslint-config-airbnb": "^9.0.1", | ||
91 | "stylelint": "^7.3.1", | ||
92 | "stylelint-config-standard": "^13.0.2" | ||
88 | } | 93 | } |
89 | } | 94 | } |
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig index 1554cce4..8d841b4c 100644 --- a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig +++ b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig | |||
@@ -67,7 +67,7 @@ | |||
67 | 67 | ||
68 | <!-- Filter --> | 68 | <!-- Filter --> |
69 | {% if form is not null %} | 69 | {% if form is not null %} |
70 | <aside id="filter-form" class=""> | 70 | <div id="filters" class=""> |
71 | <form method="get" action="{{ path('all') }}"> | 71 | <form method="get" action="{{ path('all') }}"> |
72 | <h2>{{ 'entry.filters.title'|trans }}</h2> | 72 | <h2>{{ 'entry.filters.title'|trans }}</h2> |
73 | <a href="javascript: void(null);" id="filter-form-close" class="close-button--popup close-button">×</a> | 73 | <a href="javascript: void(null);" id="filter-form-close" class="close-button--popup close-button">×</a> |
@@ -147,6 +147,6 @@ | |||
147 | <button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">{{ 'entry.filters.action.filter'|trans }}</button> | 147 | <button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">{{ 'entry.filters.action.filter'|trans }}</button> |
148 | </div> | 148 | </div> |
149 | </form> | 149 | </form> |
150 | </aside> | 150 | </div> |
151 | {% endif %} | 151 | {% endif %} |
152 | {% endblock %} | 152 | {% endblock %} |
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig index bec4b70f..be1e3647 100644 --- a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig +++ b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig | |||
@@ -82,22 +82,4 @@ | |||
82 | "entryId": "{{ entry.id }}" | 82 | "entryId": "{{ entry.id }}" |
83 | } | 83 | } |
84 | </script> | 84 | </script> |
85 | <script src="{{ asset('bundles/wallabagcore/themes/_global/js/restoreScroll.js')}}"></script> | ||
86 | <script type="text/javascript"> | ||
87 | $(document).ready(function() { | ||
88 | $(window).scroll(function(e){ | ||
89 | var scrollTop = $(window).scrollTop(); | ||
90 | var docHeight = $(document).height(); | ||
91 | var scrollPercent = (scrollTop) / (docHeight); | ||
92 | var scrollPercentRounded = Math.round(scrollPercent*100)/100; | ||
93 | savePercent({{ entry.id }}, scrollPercentRounded); | ||
94 | }); | ||
95 | |||
96 | retrievePercent({{ entry.id }}); | ||
97 | |||
98 | $(window).resize(function(){ | ||
99 | retrievePercent({{ entry.id }}); | ||
100 | }); | ||
101 | }); | ||
102 | </script> | ||
103 | {% endblock %} | 85 | {% endblock %} |
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig index 806a4eef..1c5057dd 100644 --- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig +++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig | |||
@@ -66,7 +66,7 @@ | |||
66 | 66 | ||
67 | <p>{{ entry.content|striptags|slice(0, 300)|raw }}…</p> | 67 | <p>{{ entry.content|striptags|slice(0, 300)|raw }}…</p> |
68 | 68 | ||
69 | <ul class="card-entry-tags"> | 69 | <ul class="card-entry-labels-hidden"> |
70 | {% for tag in entry.tags %} | 70 | {% for tag in entry.tags %} |
71 | <li>{{ tag.label }}</li> | 71 | <li>{{ tag.label }}</li> |
72 | {% endfor %} | 72 | {% endfor %} |