aboutsummaryrefslogtreecommitdiffhomepage
path: root/app/Resources/static
diff options
context:
space:
mode:
authorJeremy Benoist <j0k3r@users.noreply.github.com>2017-01-27 09:34:32 +0100
committerGitHub <noreply@github.com>2017-01-27 09:34:32 +0100
commit6fb06904ecde15b1b07d0a2af945338b416cf0e2 (patch)
treee76f3e8142399316ec5660fab8c646b2c34b8336 /app/Resources/static
parent05fa529bcfde01be5d320cb532900d72cf4b0830 (diff)
parent78295b99dd1721c613f1ce52e2debbe6f6db7753 (diff)
downloadwallabag-6fb06904ecde15b1b07d0a2af945338b416cf0e2.tar.gz
wallabag-6fb06904ecde15b1b07d0a2af945338b416cf0e2.tar.zst
wallabag-6fb06904ecde15b1b07d0a2af945338b416cf0e2.zip
Merge pull request #2416 from wallabag/2.2
wallabag 2.2.0
Diffstat (limited to 'app/Resources/static')
-rw-r--r--app/Resources/static/themes/_global/img/icons/unmark-icon--black.pngbin0 -> 926 bytes
-rwxr-xr-xapp/Resources/static/themes/_global/img/list.pngbin0 -> 201 bytes
-rwxr-xr-xapp/Resources/static/themes/_global/img/table.pngbin0 -> 229 bytes
-rw-r--r--app/Resources/static/themes/_global/js/bookmarklet.js1
-rw-r--r--app/Resources/static/themes/_global/js/shortcuts/entry.js0
-rw-r--r--app/Resources/static/themes/_global/js/shortcuts/main.js15
-rw-r--r--app/Resources/static/themes/_global/js/tools.js11
-rwxr-xr-xapp/Resources/static/themes/baggy/css/main.css24
-rwxr-xr-xapp/Resources/static/themes/baggy/js/autoCompleteTags.js2
-rwxr-xr-xapp/Resources/static/themes/baggy/js/init.js27
-rw-r--r--app/Resources/static/themes/baggy/js/shortcuts/entry.js26
-rw-r--r--app/Resources/static/themes/baggy/js/shortcuts/main.js7
-rw-r--r--app/Resources/static/themes/baggy/js/uiTools.js4
-rwxr-xr-xapp/Resources/static/themes/material/css/main.css165
-rwxr-xr-xapp/Resources/static/themes/material/js/init.js19
-rw-r--r--app/Resources/static/themes/material/js/shortcuts/entry.js26
-rw-r--r--app/Resources/static/themes/material/js/shortcuts/main.js75
17 files changed, 362 insertions, 40 deletions
diff --git a/app/Resources/static/themes/_global/img/icons/unmark-icon--black.png b/app/Resources/static/themes/_global/img/icons/unmark-icon--black.png
new file mode 100644
index 00000000..45f679ee
--- /dev/null
+++ b/app/Resources/static/themes/_global/img/icons/unmark-icon--black.png
Binary files differ
diff --git a/app/Resources/static/themes/_global/img/list.png b/app/Resources/static/themes/_global/img/list.png
new file mode 100755
index 00000000..bd5aff5a
--- /dev/null
+++ b/app/Resources/static/themes/_global/img/list.png
Binary files differ
diff --git a/app/Resources/static/themes/_global/img/table.png b/app/Resources/static/themes/_global/img/table.png
new file mode 100755
index 00000000..859c4cd8
--- /dev/null
+++ b/app/Resources/static/themes/_global/img/table.png
Binary files differ
diff --git a/app/Resources/static/themes/_global/js/bookmarklet.js b/app/Resources/static/themes/_global/js/bookmarklet.js
index 5174ff47..a497628b 100644
--- a/app/Resources/static/themes/_global/js/bookmarklet.js
+++ b/app/Resources/static/themes/_global/js/bookmarklet.js
@@ -1,4 +1,3 @@
1
2top['bookmarklet-url@wallabag.org'] = 1top['bookmarklet-url@wallabag.org'] =
3 '<!DOCTYPE html><html><head><title>bag it!</title>' + 2 '<!DOCTYPE html><html><head><title>bag it!</title>' +
4 '<link rel="icon" href="tpl/img/favicon.ico" />' + 3 '<link rel="icon" href="tpl/img/favicon.ico" />' +
diff --git a/app/Resources/static/themes/_global/js/shortcuts/entry.js b/app/Resources/static/themes/_global/js/shortcuts/entry.js
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/app/Resources/static/themes/_global/js/shortcuts/entry.js
diff --git a/app/Resources/static/themes/_global/js/shortcuts/main.js b/app/Resources/static/themes/_global/js/shortcuts/main.js
new file mode 100644
index 00000000..c81bf869
--- /dev/null
+++ b/app/Resources/static/themes/_global/js/shortcuts/main.js
@@ -0,0 +1,15 @@
1import Mousetrap from 'mousetrap';
2
3/** Shortcuts **/
4
5/* Go to */
6Mousetrap.bind('g u', () => { window.location.href = Routing.generate('homepage'); });
7Mousetrap.bind('g s', () => { window.location.href = Routing.generate('starred'); });
8Mousetrap.bind('g r', () => { window.location.href = Routing.generate('archive'); });
9Mousetrap.bind('g a', () => { window.location.href = Routing.generate('all'); });
10Mousetrap.bind('g t', () => { window.location.href = Routing.generate('tag'); });
11Mousetrap.bind('g c', () => { window.location.href = Routing.generate('config'); });
12Mousetrap.bind('g i', () => { window.location.href = Routing.generate('import'); });
13Mousetrap.bind('g d', () => { window.location.href = Routing.generate('developer'); });
14Mousetrap.bind('?', () => { window.location.href = Routing.generate('howto'); });
15Mousetrap.bind('g l', () => { window.location.href = Routing.generate('fos_user_security_logout'); });
diff --git a/app/Resources/static/themes/_global/js/tools.js b/app/Resources/static/themes/_global/js/tools.js
index ab30deb1..cee84fa8 100644
--- a/app/Resources/static/themes/_global/js/tools.js
+++ b/app/Resources/static/themes/_global/js/tools.js
@@ -1,4 +1,9 @@
1const $ = require('jquery'); 1import $ from 'jquery';
2import './shortcuts/main';
3import './shortcuts/entry';
4
5/* Allows inline call qr-code call */
6import jrQrcode from 'jr-qrcode'; // eslint-disable-line
2 7
3function supportsLocalStorage() { 8function supportsLocalStorage() {
4 try { 9 try {
@@ -30,7 +35,7 @@ function initFilters() {
30 // no display if filters not available 35 // no display if filters not available
31 if ($('div').is('#filters')) { 36 if ($('div').is('#filters')) {
32 $('#button_filters').show(); 37 $('#button_filters').show();
33 $('.button-collapse-right').sideNav({ edge: 'right' }); 38 $('.js-filters-action').sideNav({ edge: 'right' });
34 $('#clear_form_filters').on('click', () => { 39 $('#clear_form_filters').on('click', () => {
35 $('#filters input').val(''); 40 $('#filters input').val('');
36 $('#filters :checked').removeAttr('checked'); 41 $('#filters :checked').removeAttr('checked');
@@ -43,7 +48,7 @@ function initExport() {
43 // no display if export not available 48 // no display if export not available
44 if ($('div').is('#export')) { 49 if ($('div').is('#export')) {
45 $('#button_export').show(); 50 $('#button_export').show();
46 $('.button-collapse-right').sideNav({ edge: 'right' }); 51 $('.js-export-action').sideNav({ edge: 'right' });
47 } 52 }
48} 53}
49 54
diff --git a/app/Resources/static/themes/baggy/css/main.css b/app/Resources/static/themes/baggy/css/main.css
index 4dfa8790..e16846ea 100755
--- a/app/Resources/static/themes/baggy/css/main.css
+++ b/app/Resources/static/themes/baggy/css/main.css
@@ -297,18 +297,14 @@ h2::after {
297 text-decoration: none; 297 text-decoration: none;
298} 298}
299 299
300#listmode a:hover {
301 opacity: 1;
302}
303
304#listmode.tablemode { 300#listmode.tablemode {
305 background-image: url("../img/baggy/table.png"); 301 background-image: url("../../_global/img/table.png");
306 background-repeat: no-repeat; 302 background-repeat: no-repeat;
307 background-position: bottom; 303 background-position: bottom;
308} 304}
309 305
310#listmode.listmode { 306#listmode.listmode {
311 background-image: url("../img/baggy/list.png"); 307 background-image: url("../../_global/img/list.png");
312 background-repeat: no-repeat; 308 background-repeat: no-repeat;
313 background-position: bottom; 309 background-position: bottom;
314} 310}
@@ -352,9 +348,9 @@ footer a {
352 letter-spacing: -5px; 348 letter-spacing: -5px;
353} 349}
354 350
355.listmode .entry { 351.listmode.entry {
356 width: 100% !important; 352 width: 100%;
357 margin-left: 0 !important; 353 height: inherit;
358} 354}
359 355
360.card-entry-labels { 356.card-entry-labels {
@@ -588,6 +584,7 @@ div.pagination ul {
588 text-align: left; 584 text-align: left;
589 font-style: italic; 585 font-style: italic;
590 color: #999; 586 color: #999;
587 display: inline-flex;
591} 588}
592 589
593div.pagination ul > * { 590div.pagination ul > * {
@@ -620,6 +617,10 @@ div.pagination ul .current {
620 background-color: #ccc; 617 background-color: #ccc;
621} 618}
622 619
620.hide {
621 display: none;
622}
623
623/* ========================================================================== 624/* ==========================================================================
624 2.1 = "save a link" related styles 625 2.1 = "save a link" related styles
625 ========================================================================== */ 626 ========================================================================== */
@@ -936,6 +937,11 @@ a.add-to-wallabag-link-after::after {
936 background-image: url("../../_global/img/icons/diaspora-icon--black.png"); 937 background-image: url("../../_global/img/icons/diaspora-icon--black.png");
937} 938}
938 939
940/* Unmark.it */
941.icon-image--unmark {
942 background-image: url("../../_global/img/icons/unmark-icon--black.png");
943}
944
939/* shaarli */ 945/* shaarli */
940.icon-image--shaarli { 946.icon-image--shaarli {
941 background-image: url("../../_global/img/icons/shaarli.png"); 947 background-image: url("../../_global/img/icons/shaarli.png");
diff --git a/app/Resources/static/themes/baggy/js/autoCompleteTags.js b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
index f287ebfa..64fdaa92 100755
--- a/app/Resources/static/themes/baggy/js/autoCompleteTags.js
+++ b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
@@ -5,4 +5,4 @@ function extractLast(term) {
5 return split(term).pop(); 5 return split(term).pop();
6} 6}
7 7
8export { split, extractLast }; 8export default { split, extractLast };
diff --git a/app/Resources/static/themes/baggy/js/init.js b/app/Resources/static/themes/baggy/js/init.js
index dc11043a..05360a28 100755
--- a/app/Resources/static/themes/baggy/js/init.js
+++ b/app/Resources/static/themes/baggy/js/init.js
@@ -1,11 +1,26 @@
1import { savePercent, retrievePercent } from '../../_global/js/tools'; 1/* jQuery */
2import { toggleSaveLinkForm } from './uiTools'; 2import $ from 'jquery';
3
4/* eslint-disable no-unused-vars */
5/* jquery has default scope */
6import cookie from 'jquery.cookie';
7import ui from 'jquery-ui-browserify';
8/* eslint-enable no-unused-vars */
9
10/* Annotations */
11import annotator from 'annotator';
3 12
4const $ = global.jquery = require('jquery'); 13/* Shortcuts */
5require('jquery.cookie'); 14import './shortcuts/main';
6require('jquery-ui-browserify'); 15import './shortcuts/entry';
7const annotator = require('annotator'); 16import '../../_global/js/shortcuts/main';
17import '../../_global/js/shortcuts/entry';
18
19/* Tools */
20import { savePercent, retrievePercent } from '../../_global/js/tools';
21import toggleSaveLinkForm from './uiTools';
8 22
23global.jquery = $;
9 24
10$.fn.ready(() => { 25$.fn.ready(() => {
11 const $listmode = $('#listmode'); 26 const $listmode = $('#listmode');
diff --git a/app/Resources/static/themes/baggy/js/shortcuts/entry.js b/app/Resources/static/themes/baggy/js/shortcuts/entry.js
new file mode 100644
index 00000000..c87408b9
--- /dev/null
+++ b/app/Resources/static/themes/baggy/js/shortcuts/entry.js
@@ -0,0 +1,26 @@
1import Mousetrap from 'mousetrap';
2import $ from 'jquery';
3
4$(document).ready(() => {
5 if ($('#article').length > 0) {
6 /* Article view */
7 Mousetrap.bind('o', () => {
8 $('div#article_toolbar ul.links a.original')[0].click();
9 });
10
11 /* mark as favorite */
12 Mousetrap.bind('f', () => {
13 $('div#article_toolbar ul.links a.favorite')[0].click();
14 });
15
16 /* mark as read */
17 Mousetrap.bind('a', () => {
18 $('div#article_toolbar ul.links a.markasread')[0].click();
19 });
20
21 /* delete */
22 Mousetrap.bind('del', () => {
23 $('div#article_toolbar ul.links a.delete')[0].click();
24 });
25 }
26});
diff --git a/app/Resources/static/themes/baggy/js/shortcuts/main.js b/app/Resources/static/themes/baggy/js/shortcuts/main.js
new file mode 100644
index 00000000..aed09aee
--- /dev/null
+++ b/app/Resources/static/themes/baggy/js/shortcuts/main.js
@@ -0,0 +1,7 @@
1$(document).ready(() => {
2 Mousetrap.bind('s', () => {
3 $('#search').trigger('click');
4 $('#search_entry_term').focus();
5 return false;
6 });
7});
diff --git a/app/Resources/static/themes/baggy/js/uiTools.js b/app/Resources/static/themes/baggy/js/uiTools.js
index 900b2707..713c53f7 100644
--- a/app/Resources/static/themes/baggy/js/uiTools.js
+++ b/app/Resources/static/themes/baggy/js/uiTools.js
@@ -1,4 +1,4 @@
1const $ = require('jquery'); 1import $ from 'jquery';
2 2
3function toggleSaveLinkForm(url, event) { 3function toggleSaveLinkForm(url, event) {
4 $('#add-link-result').empty(); 4 $('#add-link-result').empty();
@@ -32,4 +32,4 @@ function toggleSaveLinkForm(url, event) {
32 plainUrl.focus(); 32 plainUrl.focus();
33} 33}
34 34
35export { toggleSaveLinkForm }; 35export default toggleSaveLinkForm;
diff --git a/app/Resources/static/themes/material/css/main.css b/app/Resources/static/themes/material/css/main.css
index 408fe14c..f43e6042 100755
--- a/app/Resources/static/themes/material/css/main.css
+++ b/app/Resources/static/themes/material/css/main.css
@@ -150,6 +150,11 @@
150 background-image: url("../../_global/img/icons/diaspora-icon--black.png"); 150 background-image: url("../../_global/img/icons/diaspora-icon--black.png");
151} 151}
152 152
153/* Unmark.it */
154.icon-image--unmark {
155 background-image: url("../../_global/img/icons/unmark-icon--black.png");
156}
157
153/* Shaarli */ 158/* Shaarli */
154.icon-image--shaarli { 159.icon-image--shaarli {
155 background-image: url("../../_global/img/icons/shaarli.png"); 160 background-image: url("../../_global/img/icons/shaarli.png");
@@ -159,7 +164,7 @@ body {
159 display: flex; 164 display: flex;
160 min-height: 100vh; 165 min-height: 100vh;
161 flex-direction: column; 166 flex-direction: column;
162 background: #f0f0f0; 167 background: #fafafa;
163} 168}
164 169
165body.login main { 170body.login main {
@@ -189,7 +194,6 @@ main,
189 194
190.results { 195.results {
191 height: 1em; 196 height: 1em;
192 line-height: 30px;
193} 197}
194 198
195.results .nb-results, 199.results .nb-results,
@@ -198,6 +202,14 @@ main,
198 margin-bottom: 0; 202 margin-bottom: 0;
199} 203}
200 204
205.results .nb-results {
206 display: inline-flex;
207}
208
209.results a {
210 color: #444;
211}
212
201.pagination { 213.pagination {
202 float: right; 214 float: right;
203} 215}
@@ -271,6 +283,16 @@ nav input {
271 color: #aaa; 283 color: #aaa;
272} 284}
273 285
286nav {
287 height: auto;
288}
289
290.nav-wrapper {
291 display: flex;
292 flex-wrap: wrap;
293 justify-content: space-between;
294}
295
274.nav-wrapper .button-collapse { 296.nav-wrapper .button-collapse {
275 padding: 0 15px; 297 padding: 0 15px;
276} 298}
@@ -279,8 +301,10 @@ nav input {
279 display: none; 301 display: none;
280} 302}
281 303
282.nav-panels { 304.nav-panel-buttom {
283 overflow: hidden; 305 display: flex;
306 flex-grow: 1;
307 justify-content: flex-end;
284} 308}
285 309
286.nav-panel-buttom li { 310.nav-panel-buttom li {
@@ -317,11 +341,13 @@ nav input {
317 color: #444; 341 color: #444;
318} 342}
319 343
320.input-field.nav-panel-add label { 344.input-field.nav-panel-add label,
345.input-field.nav-panel-search label {
321 left: 1rem; 346 left: 1rem;
322} 347}
323 348
324.input-field.nav-panel-add .close { 349.input-field.nav-panel-add .close,
350.input-field.nav-panel-search .close {
325 position: absolute; 351 position: absolute;
326 top: 0; 352 top: 0;
327 right: 1rem; 353 right: 1rem;
@@ -340,8 +366,10 @@ nav input {
340} 366}
341 367
342.input-field.nav-panel-add, 368.input-field.nav-panel-add,
343.input-field.nav-panel-add form { 369.input-field.nav-panel-add form,
344 height: 100%; 370.input-field.nav-panel-search,
371.input-field.nav-panel-search form {
372 flex-grow: 1;
345} 373}
346 374
347/* ========================================================================== 375/* ==========================================================================
@@ -411,7 +439,6 @@ nav ul a:hover {
411.side-nav.fixed.right-aligned { 439.side-nav.fixed.right-aligned {
412 right: -250px; 440 right: -250px;
413 left: auto !important; 441 left: auto !important;
414 overflow-y: visible;
415} 442}
416 443
417#filters div.with-checkbox { 444#filters div.with-checkbox {
@@ -535,6 +562,18 @@ a.original {
535 line-height: 24px; 562 line-height: 24px;
536} 563}
537 564
565.card .card-action ul.tools li a.tool {
566 margin-right: 5px !important;
567}
568
569.card-stacked:hover ul.tools-list {
570 display: block;
571}
572
573.card-stacked ul.tools-list {
574 display: none;
575}
576
538.card .card-action a { 577.card .card-action a {
539 color: #fff; 578 color: #fff;
540 margin: 0; 579 margin: 0;
@@ -587,7 +626,55 @@ a.original {
587#article { 626#article {
588 font-size: 20px; 627 font-size: 20px;
589 margin: 0 auto; 628 margin: 0 auto;
590 max-width: 40em; 629 max-width: 45em;
630}
631
632#article article {
633 color: #424242;
634 font-size: 18px;
635 line-height: 1.7em;
636}
637
638#article article h1,
639#article article h2,
640#article article h3,
641#article article h4,
642#article article h5,
643#article article h6 {
644 color: #212121;
645}
646
647#article article h1 strong,
648#article article h2 strong,
649#article article h3 strong,
650#article article h4 strong,
651#article article h5 strong,
652#article article h6 strong {
653 font-weight: 500;
654}
655
656#article article h6 {
657 font-size: 1.2rem;
658}
659
660#article article h5 {
661 font-size: 1.6rem;
662}
663
664#article article h4 {
665 font-size: 1.9rem;
666}
667
668#article article h3 {
669 font-size: 2.2rem;
670}
671
672#article article h2 {
673 font-size: 2.5rem;
674}
675
676#article article h1 {
677 font-size: 2.7rem;
591} 678}
592 679
593#article img, 680#article img,
@@ -596,6 +683,46 @@ a.original {
596 height: auto; 683 height: auto;
597} 684}
598 685
686#article article a {
687 border-bottom: 1px dotted #03a9f4;
688 text-decoration: none;
689}
690
691#article article a:hover {
692 border-bottom-style: solid;
693}
694
695#article article ul {
696 padding-left: 30px;
697}
698
699#article article ul,
700#article article ul li {
701 list-style-type: disc;
702}
703
704#article article blockquote {
705 font-style: italic;
706}
707
708#article article strong {
709 font-weight: bold;
710}
711
712#article article pre {
713 box-sizing: border-box;
714 margin: 0 0 1.75em;
715 border: #e3f2fd 1px solid;
716 width: 100%;
717 padding: 10px;
718 font-family: monospace;
719 font-size: 0.8em;
720 white-space: pre;
721 overflow: auto;
722 background: #f5f5f5;
723 border-radius: 3px;
724}
725
599#article > header > h1 { 726#article > header > h1 {
600 font-size: 2em; 727 font-size: 2em;
601 margin: 2.1rem 0 0.68rem; 728 margin: 2.1rem 0 0.68rem;
@@ -691,6 +818,14 @@ article aside .tools li {
691 width: auto; 818 width: auto;
692 } 819 }
693 820
821 .nav-panels .action {
822 padding-right: 0.75rem;
823 }
824
825 .nav-panel-buttom {
826 justify-content: space-around;
827 }
828
694 #article { 829 #article {
695 max-width: 35em; 830 max-width: 35em;
696 margin-left: auto; 831 margin-left: auto;
@@ -727,11 +862,13 @@ article aside .tools li {
727 .pagination li.next { 862 .pagination li.next {
728 width: auto; 863 width: auto;
729 } 864 }
730}
731 865
732@media only screen and (min-width: 400px) { 866 .drag-target + .drag-target {
733 .nav-panel-buttom { 867 height: 50%;
734 float: right; 868 }
869
870 .drag-target + .drag-target + .drag-target {
871 top: 50%;
735 } 872 }
736} 873}
737 874
diff --git a/app/Resources/static/themes/material/js/init.js b/app/Resources/static/themes/material/js/init.js
index a68269e0..0b2832c0 100755
--- a/app/Resources/static/themes/material/js/init.js
+++ b/app/Resources/static/themes/material/js/init.js
@@ -1,10 +1,21 @@
1/* jQuery */
2import $ from 'jquery';
3
4/* Annotations */
5import annotator from 'annotator';
6
7/* Tools */
1import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools'; 8import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools';
2 9
3const $ = require('jquery'); 10/* Import shortcuts */
11import './shortcuts/main';
12import './shortcuts/entry';
13import '../../_global/js/shortcuts/main';
14import '../../_global/js/shortcuts/entry';
4 15
5global.jQuery = $;
6require('materialize'); // eslint-disable-line 16require('materialize'); // eslint-disable-line
7const annotator = require('annotator'); 17
18global.jQuery = $;
8 19
9$(document).ready(() => { 20$(document).ready(() => {
10 // sideNav 21 // sideNav
@@ -44,7 +55,7 @@ $(document).ready(() => {
44 $('.nav-panels .action').hide(100); 55 $('.nav-panels .action').hide(100);
45 $('.nav-panel-menu').addClass('hidden'); 56 $('.nav-panel-menu').addClass('hidden');
46 $('.nav-panels').css('background', 'white'); 57 $('.nav-panels').css('background', 'white');
47 $('#searchfield').focus(); 58 $('#search_entry_term').focus();
48 return false; 59 return false;
49 }); 60 });
50 $('.close').on('click', () => { 61 $('.close').on('click', () => {
diff --git a/app/Resources/static/themes/material/js/shortcuts/entry.js b/app/Resources/static/themes/material/js/shortcuts/entry.js
new file mode 100644
index 00000000..e19800bd
--- /dev/null
+++ b/app/Resources/static/themes/material/js/shortcuts/entry.js
@@ -0,0 +1,26 @@
1import Mousetrap from 'mousetrap';
2import $ from 'jquery';
3
4$(document).ready(() => {
5 if ($('#article').length > 0) {
6 /* open original article */
7 Mousetrap.bind('o', () => {
8 $('ul.side-nav a.original i')[0].click();
9 });
10
11 /* mark as favorite */
12 Mousetrap.bind('f', () => {
13 $('ul.side-nav a.favorite i')[0].click();
14 });
15
16 /* mark as read */
17 Mousetrap.bind('a', () => {
18 $('ul.side-nav a.markasread i')[0].click();
19 });
20
21 /* delete */
22 Mousetrap.bind('del', () => {
23 $('ul.side-nav a.delete i')[0].click();
24 });
25 }
26});
diff --git a/app/Resources/static/themes/material/js/shortcuts/main.js b/app/Resources/static/themes/material/js/shortcuts/main.js
new file mode 100644
index 00000000..0a2d2a69
--- /dev/null
+++ b/app/Resources/static/themes/material/js/shortcuts/main.js
@@ -0,0 +1,75 @@
1import Mousetrap from 'mousetrap';
2import $ from 'jquery';
3
4function toggleFocus(cardToToogleFocus) {
5 if (cardToToogleFocus) {
6 $(cardToToogleFocus).toggleClass('z-depth-4');
7 }
8}
9
10$(document).ready(() => {
11 const cards = $('#content').find('.card');
12 const cardNumber = cards.length;
13 let cardIndex = 0;
14 /* If we come from next page */
15 if (window.location.hash === '#prev') {
16 cardIndex = cardNumber - 1;
17 }
18 let card = cards[cardIndex];
19 const pagination = $('.pagination');
20
21 /* Show nothing on quickstart */
22 if ($('#content > div.quickstart').length > 0) {
23 return;
24 }
25
26 /* Focus current card */
27 toggleFocus(card);
28
29 /* Actions */
30 Mousetrap.bind('g n', () => {
31 $('#nav-btn-add').trigger('click');
32 return false;
33 });
34
35 Mousetrap.bind('s', () => {
36 $('#nav-btn-search').trigger('click');
37 return false;
38 });
39
40 Mousetrap.bind('esc', () => {
41 $('.close').trigger('click');
42 });
43
44 /* Select right card. If there's a next page, go to next page */
45 Mousetrap.bind('right', () => {
46 if (cardIndex >= 0 && cardIndex < cardNumber - 1) {
47 toggleFocus(card);
48 cardIndex += 1;
49 card = cards[cardIndex];
50 toggleFocus(card);
51 return;
52 }
53 if (pagination.length > 0 && pagination.find('li.next:not(.disabled)').length > 0 && cardIndex === cardNumber - 1) {
54 window.location.href = window.location.origin + $(pagination).find('li.next a').attr('href');
55 }
56 });
57
58 /* Select previous card. If there's a previous page, go to next page */
59 Mousetrap.bind('left', () => {
60 if (cardIndex > 0 && cardIndex < cardNumber) {
61 toggleFocus(card);
62 cardIndex -= 1;
63 card = cards[cardIndex];
64 toggleFocus(card);
65 return;
66 }
67 if (pagination.length > 0 && $(pagination).find('li.prev:not(.disabled)').length > 0 && cardIndex === 0) {
68 window.location.href = `${window.location.origin + $(pagination).find('li.prev a').attr('href')}#prev`;
69 }
70 });
71
72 Mousetrap.bind('enter', () => {
73 window.location.href = window.location.origin + $(card).find('span.card-title a').attr('href');
74 });
75});