Skip to content

Commit 497f256

Browse files
committed
Added table pagination & minor fixes
1 parent 60b59b4 commit 497f256

File tree

8 files changed

+617
-49
lines changed

8 files changed

+617
-49
lines changed

popup.css

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -83,11 +83,12 @@ body
8383
height: 100vh;
8484
margin: 0;
8585

86-
background-color: #2c2b2c;
86+
background-color: #f6f5f4;
8787
}
8888

8989
input,
90-
textarea
90+
textarea,
91+
button
9192
{
9293
font-family: 'Open Sans', sans-serif;
9394
}

popup.js

Lines changed: 253 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,250 @@
11

2-
var Menu = {
3-
header: {
4-
type: 'header'
5-
}
6-
};
2+
/*-----------------------------------------------------------------------------
3+
>>> «HEADER» TEMPLATE
4+
-----------------------------------------------------------------------------*/
5+
6+
var header_search = false,
7+
search_type = 'bookmarks',
8+
Menu = {
9+
header: {
10+
type: 'header',
11+
12+
section_start: {
13+
type: 'section',
14+
class: 'satus-section--align-start',
15+
style: {
16+
position: 'relative'
17+
},
18+
19+
text_field: {
20+
type: 'text-field',
21+
rows: 1,
22+
class: 'satus-header__text-field',
23+
placeholder: 'Search',
24+
on: {
25+
keyup: function(event) {
26+
if (event.keyCode === 13) {
27+
var type = search_type;
28+
29+
if (header_search !== false) {
30+
header_search.clear();
31+
header_search = false;
32+
}
33+
34+
if (type === 'bookmarks') {
35+
Satus.chromium_bookmarks.get(function(items) {
36+
header_search = Satus.search(event.target.value, items, function(results) {
37+
var rows = [];
38+
39+
for (var i = 0, l = results.length; i < l; i++) {
40+
rows.push([{
41+
select: {
42+
type: 'text'
43+
}
44+
}, {
45+
visit_count: {
46+
type: 'text',
47+
label: 0
48+
}
49+
}, {
50+
domain: {
51+
type: 'text',
52+
label: results[i]
53+
}
54+
}]);
55+
}
56+
57+
document.querySelector('#table-search').update(rows);
58+
});
59+
});
60+
} else if (type === 'history') {
61+
Satus.chromium_history.get('', function(items) {
62+
header_search = Satus.search(event.target.value, items, function(results) {
63+
var rows = [];
64+
65+
for (var i = 0, l = results.length; i < l; i++) {
66+
rows.push([{
67+
select: {
68+
type: 'checkbox'
69+
}
70+
}, {
71+
visit_count: {
72+
type: 'text',
73+
label: 0
74+
}
75+
}, {
76+
domain: {
77+
type: 'text',
78+
label: results[i]
79+
}
80+
}]);
81+
}
82+
83+
document.querySelector('#table-search').update(rows);
84+
});
85+
});
86+
} else if (type === 'duckduckgo') {
87+
window.open('https://duckduckgo.com/?q=' + this.value, '_self');
88+
} else if (type === 'google') {
89+
window.open('https://www.google.com/search?q=' + this.value, '_self');
90+
}
91+
}
92+
}
93+
}
94+
},
95+
96+
menu: {
97+
type: 'button',
98+
icon: '<svg viewBox="0 0 24 24"><path d="M7 10l5 5 5-5z"></svg>',
99+
onClickRender: {
100+
type: 'dialog',
101+
102+
bookmarks: {
103+
type: 'button',
104+
label: 'Bookmarks',
105+
106+
on: {
107+
click: function() {
108+
search_type = 'bookmarks';
109+
document.querySelector('.satus-dialog__scrim').click();
110+
}
111+
}
112+
},
113+
history: {
114+
type: 'button',
115+
label: 'History',
116+
117+
on: {
118+
click: function() {
119+
search_type = 'history';
120+
document.querySelector('.satus-dialog__scrim').click();
121+
}
122+
}
123+
},
124+
duckduckgo: {
125+
type: 'button',
126+
label: 'DuckDuckGo',
127+
128+
on: {
129+
click: function() {
130+
search_type = 'duckduckgo';
131+
document.querySelector('.satus-dialog__scrim').click();
132+
}
133+
}
134+
},
135+
google: {
136+
type: 'button',
137+
label: 'Google',
138+
139+
on: {
140+
click: function() {
141+
search_type = 'google';
142+
document.querySelector('.satus-dialog__scrim').click();
143+
}
144+
}
145+
}
146+
}
147+
}
148+
},
149+
section_end: {
150+
type: 'section',
151+
class: 'satus-section--align-end',
152+
153+
button_vert: {
154+
type: 'button',
155+
icon: '<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><circle cx="12" cy="5.25" r="0.45"/><circle cx="12" cy="12" r="0.45"/><circle cx="12" cy="18.75" r="0.45"/></svg>',
156+
onClickRender: {
157+
type: 'dialog',
158+
class: 'satus-dialog--vertical-menu',
159+
160+
export: {
161+
type: 'button',
162+
label: 'Export',
163+
onclick: function() {
164+
chrome.runtime.sendMessage({
165+
name: 'download',
166+
filename: 'regex-replace.json',
167+
value: Satus.storage.get('data')
168+
});
169+
}
170+
},
171+
import: {
172+
type: 'button',
173+
label: 'Import',
174+
onclick: function() {
175+
try {
176+
var input = document.createElement('input');
177+
178+
input.type = 'file';
179+
180+
input.addEventListener('change', function() {
181+
var file_reader = new FileReader();
182+
183+
file_reader.onload = function() {
184+
var data = JSON.parse(this.result);
185+
186+
for (var i in data) {
187+
Satus.storage.set(i, data[i]);
188+
}
189+
190+
Satus.render({
191+
type: 'dialog',
192+
193+
message: {
194+
type: 'text',
195+
label: 'successfullyImportedSettings',
196+
style: {
197+
'width': '100%',
198+
'opacity': '.8'
199+
}
200+
},
201+
section: {
202+
type: 'section',
203+
class: 'controls',
204+
style: {
205+
'justify-content': 'flex-end',
206+
'display': 'flex'
207+
},
208+
209+
cancel: {
210+
type: 'button',
211+
label: 'cancel',
212+
onclick: function() {
213+
var scrim = document.querySelectorAll('.satus-dialog__scrim');
214+
215+
scrim[scrim.length - 1].click();
216+
}
217+
},
218+
ok: {
219+
type: 'button',
220+
label: 'OK',
221+
onclick: function() {
222+
var scrim = document.querySelectorAll('.satus-dialog__scrim');
223+
224+
scrim[scrim.length - 1].click();
225+
}
226+
}
227+
}
228+
});
229+
};
230+
231+
file_reader.readAsText(this.files[0]);
232+
});
233+
234+
input.click();
235+
} catch (err) {
236+
chrome.runtime.sendMessage({
237+
name: 'dialog-error',
238+
value: err
239+
});
240+
}
241+
}
242+
}
243+
}
244+
}
245+
}
246+
}
247+
};
7248
var History = {};
8249

9250
Menu.main = {
@@ -27,6 +268,7 @@ Menu.main = {
27268
]);
28269
}
29270

271+
document.querySelector('.satus-main__container > .satus-table:nth-child(2)').pagingIndex = 0;
30272
document.querySelector('.satus-main__container > .satus-table:nth-child(2)').update(data, 0, 'desc');
31273

32274
i = l;
@@ -37,6 +279,7 @@ Menu.main = {
37279

38280
table_01: {
39281
type: 'table',
282+
paging: 100,
40283
columns: [{
41284
title: ''
42285
}, {
@@ -51,6 +294,7 @@ Menu.main = {
51294

52295
table_02: {
53296
type: 'table',
297+
paging: 100,
54298
columns: [{
55299
title: 'Visit count'
56300
}, {
@@ -64,6 +308,7 @@ Menu.main = {
64308

65309
table_03: {
66310
type: 'table',
311+
paging: 100,
67312
columns: [{
68313
title: 'Visit count'
69314
}, {
@@ -79,7 +324,7 @@ Satus.storage.import(function() {
79324
text: '',
80325
startTime: start_time,
81326
endTime: end_time,
82-
maxResults: 99999
327+
maxResults: 999999
83328
}, function(items) {
84329
History = Satus.storage.get('history') || {};
85330

@@ -116,5 +361,7 @@ Satus.storage.import(function() {
116361
Menu.main.table_01.data = data;
117362

118363
Satus.render(Menu);
364+
365+
document.querySelector('.satus-main__container td:nth-child(4)').click();
119366
});
120367
});

satus.css

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1338,6 +1338,26 @@
13381338

13391339
max-width: 100px;
13401340
}
1341+
1342+
1343+
1344+
.satus-table__paging > button
1345+
{
1346+
min-width: 32px;
1347+
height: 32px;
1348+
padding: 0 8px;
1349+
1350+
cursor: pointer;
1351+
1352+
color: var(--satus-theme-on-surface, #555);
1353+
border: none;
1354+
background: transparent;
1355+
}
1356+
1357+
.satus-table__paging > button.active
1358+
{
1359+
color: #2979ff;
1360+
}
13411361

13421362
/*--------------------------------------------------------------
13431363
>>> TEXT

0 commit comments

Comments
 (0)