diff options
Diffstat (limited to 'app/Resources/static/themes/material')
4 files changed, 125 insertions, 7 deletions
diff --git a/app/Resources/static/themes/material/css/main.css b/app/Resources/static/themes/material/css/main.css index 408fe14c..8e33cfbc 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"); |
@@ -317,11 +322,13 @@ nav input { | |||
317 | color: #444; | 322 | color: #444; |
318 | } | 323 | } |
319 | 324 | ||
320 | .input-field.nav-panel-add label { | 325 | .input-field.nav-panel-add label, |
326 | .input-field.nav-panel-search label { | ||
321 | left: 1rem; | 327 | left: 1rem; |
322 | } | 328 | } |
323 | 329 | ||
324 | .input-field.nav-panel-add .close { | 330 | .input-field.nav-panel-add .close, |
331 | .input-field.nav-panel-search .close { | ||
325 | position: absolute; | 332 | position: absolute; |
326 | top: 0; | 333 | top: 0; |
327 | right: 1rem; | 334 | right: 1rem; |
@@ -340,7 +347,9 @@ nav input { | |||
340 | } | 347 | } |
341 | 348 | ||
342 | .input-field.nav-panel-add, | 349 | .input-field.nav-panel-add, |
343 | .input-field.nav-panel-add form { | 350 | .input-field.nav-panel-add form, |
351 | .input-field.nav-panel-search, | ||
352 | .input-field.nav-panel-search form { | ||
344 | height: 100%; | 353 | height: 100%; |
345 | } | 354 | } |
346 | 355 | ||
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 */ | ||
2 | import $ from 'jquery'; | ||
3 | |||
4 | /* Annotations */ | ||
5 | import annotator from 'annotator'; | ||
6 | |||
7 | /* Tools */ | ||
1 | import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools'; | 8 | import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools'; |
2 | 9 | ||
3 | const $ = require('jquery'); | 10 | /* Import shortcuts */ |
11 | import './shortcuts/main'; | ||
12 | import './shortcuts/entry'; | ||
13 | import '../../_global/js/shortcuts/main'; | ||
14 | import '../../_global/js/shortcuts/entry'; | ||
4 | 15 | ||
5 | global.jQuery = $; | ||
6 | require('materialize'); // eslint-disable-line | 16 | require('materialize'); // eslint-disable-line |
7 | const annotator = require('annotator'); | 17 | |
18 | global.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..357c22fe --- /dev/null +++ b/app/Resources/static/themes/material/js/shortcuts/entry.js | |||
@@ -0,0 +1,22 @@ | |||
1 | import Mousetrap from 'mousetrap'; | ||
2 | import $ from 'jquery'; | ||
3 | |||
4 | /* open original article */ | ||
5 | Mousetrap.bind('o', () => { | ||
6 | $('ul.side-nav a.original i')[0].click(); | ||
7 | }); | ||
8 | |||
9 | /* mark as favorite */ | ||
10 | Mousetrap.bind('s', () => { | ||
11 | $('ul.side-nav a.favorite i')[0].click(); | ||
12 | }); | ||
13 | |||
14 | /* mark as read */ | ||
15 | Mousetrap.bind('a', () => { | ||
16 | $('ul.side-nav a.markasread i')[0].click(); | ||
17 | }); | ||
18 | |||
19 | /* delete */ | ||
20 | Mousetrap.bind('del', () => { | ||
21 | $('ul.side-nav a.delete i')[0].click(); | ||
22 | }); | ||
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..ad4ca80a --- /dev/null +++ b/app/Resources/static/themes/material/js/shortcuts/main.js | |||
@@ -0,0 +1,76 @@ | |||
1 | import Mousetrap from 'mousetrap'; | ||
2 | import $ from 'jquery'; | ||
3 | |||
4 | function toggleFocus(cardToToogleFocus) { | ||
5 | if (cardToToogleFocus) { | ||
6 | $(cardToToogleFocus).toggleClass('z-depth-4'); | ||
7 | } | ||
8 | } | ||
9 | |||
10 | $(document).ready(() => { | ||
11 | let cardIndex = 0; | ||
12 | const cardNumber = $('#content ul.data > li').length; | ||
13 | let card = $('#content ul.data > li')[cardIndex]; | ||
14 | const pagination = $('.pagination'); | ||
15 | |||
16 | /* Show nothing on quickstart */ | ||
17 | if ($('#content > div.quickstart').length > 0) { | ||
18 | return; | ||
19 | } | ||
20 | |||
21 | /* If we come from next page */ | ||
22 | if (window.location.hash === '#prev') { | ||
23 | cardIndex = cardNumber - 1; | ||
24 | card = $('ul.data > li')[cardIndex]; | ||
25 | } | ||
26 | |||
27 | /* Focus current card */ | ||
28 | toggleFocus(card); | ||
29 | |||
30 | /* Actions */ | ||
31 | Mousetrap.bind('g n', () => { | ||
32 | $('#nav-btn-add').trigger('click'); | ||
33 | return false; | ||
34 | }); | ||
35 | |||
36 | Mousetrap.bind('s', () => { | ||
37 | $('#nav-btn-search').trigger('click'); | ||
38 | return false; | ||
39 | }); | ||
40 | |||
41 | Mousetrap.bind('esc', () => { | ||
42 | $('.close').trigger('click'); | ||
43 | }); | ||
44 | |||
45 | /* Select right card. If there's a next page, go to next page */ | ||
46 | Mousetrap.bind('right', () => { | ||
47 | if (cardIndex >= 0 && cardIndex < cardNumber - 1) { | ||
48 | toggleFocus(card); | ||
49 | cardIndex += 1; | ||
50 | card = $('ul.data > li')[cardIndex]; | ||
51 | toggleFocus(card); | ||
52 | return; | ||
53 | } | ||
54 | if (pagination.length > 0 && pagination.find('li.next:not(.disabled)').length > 0 && cardIndex === cardNumber - 1) { | ||
55 | window.location.href = window.location.origin + $(pagination).find('li.next a').attr('href'); | ||
56 | } | ||
57 | }); | ||
58 | |||
59 | /* Select previous card. If there's a previous page, go to next page */ | ||
60 | Mousetrap.bind('left', () => { | ||
61 | if (cardIndex > 0 && cardIndex < cardNumber) { | ||
62 | toggleFocus(card); | ||
63 | cardIndex -= 1; | ||
64 | card = $('ul.data > li')[cardIndex]; | ||
65 | toggleFocus(card); | ||
66 | return; | ||
67 | } | ||
68 | if (pagination.length > 0 && $(pagination).find('li.prev:not(.disabled)').length > 0 && cardIndex === 0) { | ||
69 | window.location.href = `${window.location.origin + $(pagination).find('li.prev a').attr('href')}#prev`; | ||
70 | } | ||
71 | }); | ||
72 | |||
73 | Mousetrap.bind('enter', () => { | ||
74 | window.location.href = window.location.origin + $(card).find('span.card-title a').attr('href'); | ||
75 | }); | ||
76 | }); | ||