just-the-docs 0.2.5 → 0.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +5 -5
- data/README.md +1 -1
- data/_includes/head.html +17 -11
- data/_includes/head_custom.html +0 -0
- data/_includes/js/custom.js +0 -0
- data/_includes/nav.html +30 -34
- data/_includes/title.html +1 -0
- data/_includes/vendor/anchor_headings.html +100 -0
- data/_layouts/default.html +57 -39
- data/_layouts/table_wrappers.html +7 -0
- data/_layouts/vendor/compress.html +10 -0
- data/_sass/buttons.scss +1 -1
- data/_sass/code.scss +4 -3
- data/_sass/color_schemes/dark.scss +3 -0
- data/_sass/content.scss +35 -0
- data/_sass/custom/custom.scss +129 -120
- data/_sass/layout.scss +71 -27
- data/_sass/navigation.scss +4 -32
- data/_sass/search.scss +98 -45
- data/_sass/support/_variables.scss +15 -16
- data/_sass/tables.scss +13 -33
- data/assets/js/just-the-docs.js +222 -104
- data/assets/js/search-data.json +1 -2
- data/assets/js/vendor/lunr.min.js +3 -3
- metadata +9 -4
data/_sass/navigation.scss
CHANGED
@@ -1,33 +1,11 @@
|
|
1
1
|
//
|
2
2
|
// Main nav, breadcrumb, etc...
|
3
3
|
//
|
4
|
-
|
5
|
-
.site-title {
|
6
|
-
display: block;
|
7
|
-
flex: 1 1 auto;
|
8
|
-
color: $body-heading-color;
|
9
|
-
background-color: $sidebar-color;
|
10
|
-
|
11
|
-
@include mq(md) {
|
12
|
-
position: absolute;
|
13
|
-
top: 0;
|
14
|
-
right: 0;
|
15
|
-
z-index: 101;
|
16
|
-
height: 60px;
|
17
|
-
padding-top: $sp-4;
|
18
|
-
border-bottom: $border $border-color;
|
19
|
-
}
|
20
|
-
}
|
21
|
-
|
22
4
|
.navigation-list {
|
23
5
|
padding: 0;
|
24
|
-
margin-top:
|
6
|
+
margin-top: 0;
|
25
7
|
margin-bottom: 0;
|
26
8
|
list-style: none;
|
27
|
-
|
28
|
-
@include mq(md) {
|
29
|
-
margin-top: 0;
|
30
|
-
}
|
31
9
|
}
|
32
10
|
|
33
11
|
.navigation-list-child-list {
|
@@ -90,8 +68,7 @@
|
|
90
68
|
|
91
69
|
// Small screen nav
|
92
70
|
|
93
|
-
.main-nav
|
94
|
-
.aux-nav {
|
71
|
+
.main-nav {
|
95
72
|
display: none;
|
96
73
|
|
97
74
|
&.nav-open {
|
@@ -102,13 +79,8 @@
|
|
102
79
|
}
|
103
80
|
}
|
104
81
|
|
105
|
-
.
|
106
|
-
|
107
|
-
right: $sp-4;
|
108
|
-
|
109
|
-
@include mq(md) {
|
110
|
-
display: none !important;
|
111
|
-
}
|
82
|
+
.aux-nav {
|
83
|
+
align-self: center;
|
112
84
|
}
|
113
85
|
|
114
86
|
// Breadcrumb nav
|
data/_sass/search.scss
CHANGED
@@ -5,60 +5,46 @@
|
|
5
5
|
.search {
|
6
6
|
position: relative;
|
7
7
|
z-index: 99;
|
8
|
-
display: none;
|
9
8
|
flex-grow: 1;
|
10
|
-
|
9
|
+
height: 100%;
|
11
10
|
margin-bottom: $sp-3;
|
12
|
-
background-color: $white;
|
13
|
-
border-radius: 3px;
|
14
|
-
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07), 0 3px 10px rgba(0, 0, 0, 0.05);
|
15
11
|
|
16
12
|
@include mq(md) {
|
17
|
-
display: block;
|
18
|
-
padding-top: $sp-1;
|
19
|
-
padding-right: 0;
|
20
|
-
padding-bottom: 0;
|
21
|
-
padding-left: 0;
|
22
13
|
margin-bottom: 0;
|
23
|
-
background-color: transparent;
|
24
|
-
box-shadow: none;
|
25
|
-
}
|
26
|
-
|
27
|
-
&.nav-open {
|
28
|
-
display: block;
|
29
|
-
}
|
30
|
-
}
|
31
|
-
|
32
|
-
.search-results-wrap {
|
33
|
-
display: none;
|
34
|
-
|
35
|
-
&.active {
|
36
|
-
position: absolute;
|
37
|
-
top: $sp-1;
|
38
|
-
z-index: 100;
|
39
|
-
display: block;
|
40
|
-
width: 300px;
|
41
|
-
margin-top: $gutter-spacing;
|
42
|
-
background: lighten($body-background-color, 1%);
|
43
|
-
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.07), 0 4px 14px rgba(0, 0, 0, 0.05);
|
44
14
|
}
|
45
15
|
}
|
46
16
|
|
47
17
|
.search-input-wrap {
|
48
18
|
display: flex;
|
49
|
-
|
19
|
+
height: 100%;
|
20
|
+
padding: $sp-2;
|
21
|
+
background-color: $search-background-color;
|
22
|
+
border-radius: $border-radius;
|
23
|
+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
|
24
|
+
|
25
|
+
@include mq(md) {
|
26
|
+
padding-top: 0;
|
27
|
+
padding-right: 0;
|
28
|
+
padding-bottom: 0;
|
29
|
+
padding-left: 0;
|
30
|
+
background-color: $body-background-color;
|
31
|
+
border-radius: 0;
|
32
|
+
box-shadow: none;
|
33
|
+
}
|
50
34
|
}
|
51
35
|
|
52
36
|
.search-input {
|
37
|
+
align-self: center;
|
53
38
|
width: 100%;
|
54
39
|
padding-top: $sp-1;
|
55
40
|
padding-bottom: $sp-1;
|
56
|
-
background-color: $
|
41
|
+
background-color: $search-background-color;
|
57
42
|
border-top: 0;
|
58
43
|
border-right: 0;
|
59
44
|
border-bottom: 0;
|
60
45
|
border-left: 0;
|
61
46
|
order: 2;
|
47
|
+
@include fs-4;
|
62
48
|
|
63
49
|
&:focus {
|
64
50
|
outline: 0;
|
@@ -69,14 +55,9 @@
|
|
69
55
|
}
|
70
56
|
}
|
71
57
|
|
72
|
-
@include fs-5;
|
73
|
-
|
74
|
-
@include mq(sm) {
|
75
|
-
@include fs-3;
|
76
|
-
}
|
77
|
-
|
78
58
|
@include mq(md) {
|
79
|
-
|
59
|
+
background-color: $body-background-color;
|
60
|
+
@include fs-3;
|
80
61
|
}
|
81
62
|
}
|
82
63
|
|
@@ -87,12 +68,34 @@
|
|
87
68
|
order: 1;
|
88
69
|
}
|
89
70
|
|
71
|
+
.search-results-wrap {
|
72
|
+
position: absolute;
|
73
|
+
z-index: 100;
|
74
|
+
display: none;
|
75
|
+
width: 100%;
|
76
|
+
background: $search-background-color;
|
77
|
+
border-radius: $border-radius;
|
78
|
+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
|
79
|
+
|
80
|
+
&.active {
|
81
|
+
display: block;
|
82
|
+
}
|
83
|
+
|
84
|
+
@include mq(md) {
|
85
|
+
width: $search-results-width;
|
86
|
+
}
|
87
|
+
}
|
88
|
+
|
90
89
|
.search-results-list {
|
91
90
|
padding-left: 0;
|
92
91
|
margin-top: $sp-1;
|
93
92
|
margin-bottom: $sp-1;
|
94
93
|
list-style: none;
|
95
|
-
@include fs-
|
94
|
+
@include fs-4;
|
95
|
+
|
96
|
+
@include mq(md) {
|
97
|
+
@include fs-3;
|
98
|
+
}
|
96
99
|
}
|
97
100
|
|
98
101
|
.search-results-list-item {
|
@@ -100,15 +103,65 @@
|
|
100
103
|
margin: 0;
|
101
104
|
}
|
102
105
|
|
103
|
-
.search-
|
106
|
+
.search-result {
|
104
107
|
display: block;
|
105
108
|
padding-top: $sp-1;
|
106
109
|
padding-right: $sp-3;
|
107
110
|
padding-bottom: $sp-1;
|
108
111
|
padding-left: $sp-3;
|
109
112
|
|
110
|
-
&:hover
|
111
|
-
|
112
|
-
background-color:
|
113
|
+
&:hover,
|
114
|
+
&.active {
|
115
|
+
background-color: $sidebar-color;
|
116
|
+
}
|
117
|
+
|
118
|
+
@include mq(md) {
|
119
|
+
padding-right: $sp-4;
|
120
|
+
padding-left: $sp-4;
|
113
121
|
}
|
114
122
|
}
|
123
|
+
|
124
|
+
.search-result-title {
|
125
|
+
display: block;
|
126
|
+
padding-top: $sp-2;
|
127
|
+
padding-right: $sp-4;
|
128
|
+
padding-bottom: $sp-2;
|
129
|
+
|
130
|
+
@include mq(sm) {
|
131
|
+
display: inline-block;
|
132
|
+
width: 40%;
|
133
|
+
word-wrap: break-word;
|
134
|
+
vertical-align: top;
|
135
|
+
}
|
136
|
+
}
|
137
|
+
|
138
|
+
.search-result-rel-url {
|
139
|
+
display: block;
|
140
|
+
overflow: hidden;
|
141
|
+
color: $search-result-preview-color;
|
142
|
+
text-overflow: ellipsis;
|
143
|
+
white-space: nowrap;
|
144
|
+
@include fs-1;
|
145
|
+
}
|
146
|
+
|
147
|
+
.search-result-preview {
|
148
|
+
display: block;
|
149
|
+
padding-top: $sp-2;
|
150
|
+
padding-bottom: $sp-2;
|
151
|
+
padding-left: $sp-4;
|
152
|
+
color: $search-result-preview-color;
|
153
|
+
border-left: $border;
|
154
|
+
border-left-color: $border-color;
|
155
|
+
@include fs-2;
|
156
|
+
|
157
|
+
@include mq(sm) {
|
158
|
+
display: inline-block;
|
159
|
+
width: 60%;
|
160
|
+
vertical-align: top;
|
161
|
+
}
|
162
|
+
}
|
163
|
+
|
164
|
+
.search-result-highlight {
|
165
|
+
font-weight: bold;
|
166
|
+
color: $link-color;
|
167
|
+
}
|
@@ -6,6 +6,7 @@ $body-font-family: -apple-system, BlinkMacSystemFont, "helvetica neue", helvetic
|
|
6
6
|
$mono-font-family: "SFMono-Regular", Menlo, Consolas, Monospace !default;
|
7
7
|
$root-font-size: 16px !default; // Base font-size for rems
|
8
8
|
$body-line-height: 1.4 !default;
|
9
|
+
$content-line-height: 1.5 !default;
|
9
10
|
$body-heading-line-height: 1.15 !default !default;
|
10
11
|
|
11
12
|
//
|
@@ -52,27 +53,18 @@ $red-300: #dd2e2e !default;
|
|
52
53
|
|
53
54
|
$body-background-color: $white !default;
|
54
55
|
$sidebar-color: $grey-lt-000 !default;
|
56
|
+
$search-background-color: $white !default;
|
57
|
+
$table-background-color: $white !default;
|
55
58
|
$code-background-color: $grey-lt-000 !default;
|
56
59
|
|
57
60
|
$body-text-color: $grey-dk-100 !default;
|
58
61
|
$body-heading-color: $grey-dk-300 !default;
|
62
|
+
$search-result-preview-color: $grey-dk-000 !default;
|
59
63
|
$nav-child-link-color: $grey-dk-100 !default;
|
60
64
|
$link-color: $purple-000 !default;
|
61
65
|
$btn-primary-color: $purple-100 !default;
|
62
66
|
$base-button-color: #f7f7f7 !default;
|
63
67
|
|
64
|
-
//
|
65
|
-
// Media queries in pixels
|
66
|
-
//
|
67
|
-
|
68
|
-
$media-queries: (
|
69
|
-
xs: 320px,
|
70
|
-
sm: 500px,
|
71
|
-
md: 740px,
|
72
|
-
lg: 1120px,
|
73
|
-
xl: 1400px
|
74
|
-
) !default;
|
75
|
-
|
76
68
|
//
|
77
69
|
// Spacing
|
78
70
|
//
|
@@ -118,13 +110,20 @@ $border-color: $grey-lt-100 !default;
|
|
118
110
|
|
119
111
|
$gutter-spacing: $sp-6 !default;
|
120
112
|
$gutter-spacing-sm: $sp-4 !default;
|
121
|
-
$nav-width:
|
113
|
+
$nav-width: 264px !default;
|
114
|
+
$nav-width-md: 248px !default;
|
122
115
|
$content-width: 800px !default;
|
116
|
+
$header-height: 60px !default;
|
117
|
+
$search-results-width: 500px !default;
|
118
|
+
|
119
|
+
//
|
120
|
+
// Media queries in pixels
|
121
|
+
//
|
123
122
|
|
124
123
|
$media-queries: (
|
125
124
|
xs: 320px,
|
126
125
|
sm: 500px,
|
127
|
-
md:
|
128
|
-
lg:
|
129
|
-
xl:
|
126
|
+
md: $content-width,
|
127
|
+
lg: $content-width + $nav-width,
|
128
|
+
xl: 1400px
|
130
129
|
) !default;
|
data/_sass/tables.scss
CHANGED
@@ -3,18 +3,20 @@
|
|
3
3
|
//
|
4
4
|
// stylelint-disable max-nesting-depth, selector-no-type, selector-max-type
|
5
5
|
|
6
|
-
table {
|
6
|
+
.table-wrapper {
|
7
7
|
display: block;
|
8
8
|
width: 100%;
|
9
9
|
max-width: 100%;
|
10
10
|
margin-bottom: $sp-5;
|
11
11
|
overflow-x: auto;
|
12
|
-
border-
|
13
|
-
box-shadow: 0 1px
|
12
|
+
border-radius: $border-radius;
|
13
|
+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
|
14
|
+
}
|
14
15
|
|
15
|
-
|
16
|
-
|
17
|
-
|
16
|
+
table {
|
17
|
+
display: table;
|
18
|
+
min-width: 100%;
|
19
|
+
border-collapse: separate;
|
18
20
|
}
|
19
21
|
|
20
22
|
th,
|
@@ -25,7 +27,7 @@ td {
|
|
25
27
|
padding-right: $sp-3;
|
26
28
|
padding-bottom: $sp-2;
|
27
29
|
padding-left: $sp-3;
|
28
|
-
background-color:
|
30
|
+
background-color: $table-background-color;
|
29
31
|
border-bottom: $border rgba($border-color, 0.5);
|
30
32
|
border-left: $border $border-color;
|
31
33
|
|
@@ -34,38 +36,16 @@ td {
|
|
34
36
|
}
|
35
37
|
}
|
36
38
|
|
37
|
-
thead,
|
38
|
-
tbody:first-child {
|
39
|
-
tr {
|
40
|
-
&:first-of-type {
|
41
|
-
th,
|
42
|
-
td {
|
43
|
-
&:first-of-type {
|
44
|
-
border-top-left-radius: $border-radius;
|
45
|
-
}
|
46
|
-
|
47
|
-
&:last-of-type {
|
48
|
-
border-top-right-radius: $border-radius;
|
49
|
-
}
|
50
|
-
}
|
51
|
-
}
|
52
|
-
}
|
53
|
-
}
|
54
|
-
|
55
39
|
tbody {
|
56
40
|
tr {
|
57
41
|
&:last-of-type {
|
58
42
|
th,
|
59
43
|
td {
|
60
44
|
border-bottom: 0;
|
45
|
+
}
|
61
46
|
|
62
|
-
|
63
|
-
|
64
|
-
}
|
65
|
-
|
66
|
-
&:last-of-type {
|
67
|
-
border-bottom-right-radius: $border-radius;
|
68
|
-
}
|
47
|
+
td {
|
48
|
+
padding-bottom: $sp-3;
|
69
49
|
}
|
70
50
|
}
|
71
51
|
}
|
@@ -73,6 +53,6 @@ tbody {
|
|
73
53
|
|
74
54
|
thead {
|
75
55
|
th {
|
76
|
-
border-bottom:
|
56
|
+
border-bottom: $border $border-color;
|
77
57
|
}
|
78
58
|
}
|
data/assets/js/just-the-docs.js
CHANGED
@@ -1,28 +1,41 @@
|
|
1
|
+
---
|
2
|
+
---
|
3
|
+
(function (jtd, undefined) {
|
4
|
+
|
1
5
|
// Event handling
|
2
6
|
|
3
|
-
function
|
4
|
-
|
7
|
+
jtd.addEvent = function(el, type, handler) {
|
8
|
+
if (el.attachEvent) el.attachEvent('on'+type, handler); else el.addEventListener(type, handler);
|
9
|
+
}
|
10
|
+
jtd.removeEvent = function(el, type, handler) {
|
11
|
+
if (el.detachEvent) el.detachEvent('on'+type, handler); else el.removeEventListener(type, handler);
|
5
12
|
}
|
6
|
-
function
|
7
|
-
|
13
|
+
jtd.onReady = function(ready) {
|
14
|
+
// in case the document is already rendered
|
15
|
+
if (document.readyState!='loading') ready();
|
16
|
+
// modern browsers
|
17
|
+
else if (document.addEventListener) document.addEventListener('DOMContentLoaded', ready);
|
18
|
+
// IE <= 8
|
19
|
+
else document.attachEvent('onreadystatechange', function(){
|
20
|
+
if (document.readyState=='complete') ready();
|
21
|
+
});
|
8
22
|
}
|
9
23
|
|
10
24
|
// Show/hide mobile menu
|
11
25
|
|
12
|
-
function
|
13
|
-
const
|
14
|
-
const
|
26
|
+
function initNav() {
|
27
|
+
const mainNav = document.querySelector('.js-main-nav');
|
28
|
+
const pageHeader = document.querySelector('.js-page-header');
|
15
29
|
const navTrigger = document.querySelector('.js-main-nav-trigger');
|
16
|
-
const search = document.querySelector('.js-search');
|
17
30
|
|
18
|
-
addEvent(navTrigger, 'click', function(){
|
31
|
+
jtd.addEvent(navTrigger, 'click', function(e){
|
32
|
+
e.preventDefault();
|
19
33
|
var text = navTrigger.innerText;
|
20
34
|
var textToggle = navTrigger.getAttribute('data-text-toggle');
|
21
35
|
|
22
|
-
|
23
|
-
|
36
|
+
mainNav.classList.toggle('nav-open');
|
37
|
+
pageHeader.classList.toggle('nav-open');
|
24
38
|
navTrigger.classList.toggle('nav-open');
|
25
|
-
search.classList.toggle('nav-open');
|
26
39
|
navTrigger.innerText = textToggle;
|
27
40
|
navTrigger.setAttribute('data-text-toggle', text);
|
28
41
|
textToggle = text;
|
@@ -32,119 +45,230 @@ function toggleNav(){
|
|
32
45
|
// Site search
|
33
46
|
|
34
47
|
function initSearch() {
|
35
|
-
var index = lunr(function () {
|
36
|
-
this.ref('id');
|
37
|
-
this.field('title', { boost: 20 });
|
38
|
-
this.field('content', { boost: 10 });
|
39
|
-
this.field('url');
|
40
|
-
});
|
41
|
-
|
42
|
-
// Get the generated search_data.json file so lunr.js can search it locally.
|
43
|
-
|
44
|
-
sc = document.getElementsByTagName("script");
|
45
|
-
source = '';
|
46
|
-
|
47
|
-
for(idx = 0; idx < sc.length; idx++)
|
48
|
-
{
|
49
|
-
s = sc.item(idx);
|
50
|
-
|
51
|
-
if(s.src && s.src.match(/just-the-docs\.js$/))
|
52
|
-
{ source = s.src; }
|
53
|
-
}
|
54
|
-
|
55
|
-
jsPath = source.replace('just-the-docs.js', '');
|
56
|
-
|
57
|
-
jsonPath = jsPath + 'search-data.json';
|
58
|
-
|
59
48
|
var request = new XMLHttpRequest();
|
60
|
-
request.open('GET',
|
49
|
+
request.open('GET', '{{ "assets/js/search-data.json" | absolute_url }}', true);
|
61
50
|
|
62
|
-
request.onload = function()
|
51
|
+
request.onload = function(){
|
63
52
|
if (request.status >= 200 && request.status < 400) {
|
64
53
|
// Success!
|
65
54
|
var data = JSON.parse(request.responseText);
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
55
|
+
|
56
|
+
lunr.tokenizer.separator = /[\s\-/]+/
|
57
|
+
var index = lunr(function () {
|
58
|
+
this.ref('id');
|
59
|
+
this.field('title', { boost: 200 });
|
60
|
+
this.field('content', { boost: 2 });
|
61
|
+
this.field('url');
|
62
|
+
this.metadataWhitelist = ['position']
|
63
|
+
|
64
|
+
for (var i in data) {
|
65
|
+
this.add({
|
66
|
+
id: i,
|
67
|
+
title: data[i].title,
|
68
|
+
content: data[i].content,
|
69
|
+
url: data[i].url
|
70
|
+
});
|
71
|
+
}
|
72
|
+
});
|
73
|
+
|
74
|
+
searchResults(index, data);
|
77
75
|
} else {
|
78
76
|
// We reached our target server, but it returned an error
|
79
77
|
console.log('Error loading ajax request. Request status:' + request.status);
|
80
78
|
}
|
81
79
|
};
|
82
80
|
|
83
|
-
request.onerror = function()
|
81
|
+
request.onerror = function(){
|
84
82
|
// There was a connection error of some sort
|
85
83
|
console.log('There was a connection error');
|
86
84
|
};
|
87
85
|
|
88
86
|
request.send();
|
89
87
|
|
90
|
-
function searchResults(
|
88
|
+
function searchResults(index, data) {
|
89
|
+
var index = index;
|
90
|
+
var docs = data;
|
91
91
|
var searchInput = document.querySelector('.js-search-input');
|
92
92
|
var searchResults = document.querySelector('.js-search-results');
|
93
|
-
var store = dataStore;
|
94
93
|
|
95
94
|
function hideResults() {
|
96
95
|
searchResults.innerHTML = '';
|
97
96
|
searchResults.classList.remove('active');
|
98
97
|
}
|
99
98
|
|
100
|
-
addEvent(searchInput, '
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
if (results.length > 0) {
|
112
|
-
searchResults.classList.add('active');
|
113
|
-
var resultsList = document.createElement('ul');
|
114
|
-
searchResults.appendChild(resultsList);
|
115
|
-
|
116
|
-
for (var i in results) {
|
117
|
-
var resultsListItem = document.createElement('li');
|
118
|
-
var resultsLink = document.createElement('a');
|
119
|
-
var resultsUrlDesc = document.createElement('span');
|
120
|
-
var resultsUrl = store[results[i].ref].url;
|
121
|
-
var resultsRelUrl = store[results[i].ref].relUrl;
|
122
|
-
var resultsTitle = store[results[i].ref].title;
|
123
|
-
|
124
|
-
resultsLink.setAttribute('href', resultsUrl);
|
125
|
-
resultsLink.innerText = resultsTitle;
|
126
|
-
resultsUrlDesc.innerText = resultsRelUrl;
|
127
|
-
|
128
|
-
resultsList.classList.add('search-results-list');
|
129
|
-
resultsListItem.classList.add('search-results-list-item');
|
130
|
-
resultsLink.classList.add('search-results-link');
|
131
|
-
resultsUrlDesc.classList.add('fs-2','text-grey-dk-000','d-block');
|
132
|
-
|
133
|
-
resultsList.appendChild(resultsListItem);
|
134
|
-
resultsListItem.appendChild(resultsLink);
|
135
|
-
resultsLink.appendChild(resultsUrlDesc);
|
99
|
+
jtd.addEvent(searchInput, 'keydown', function(e){
|
100
|
+
switch (e.keyCode) {
|
101
|
+
case 38: // arrow up
|
102
|
+
e.preventDefault();
|
103
|
+
var active = document.querySelector('.search-result.active');
|
104
|
+
if (active) {
|
105
|
+
active.classList.remove('active');
|
106
|
+
if (active.parentElement.previousSibling) {
|
107
|
+
var previous = active.parentElement.previousSibling.querySelector('.search-result');
|
108
|
+
previous.classList.add('active');
|
109
|
+
}
|
136
110
|
}
|
137
|
-
|
111
|
+
return;
|
112
|
+
case 40: // arrow down
|
113
|
+
e.preventDefault();
|
114
|
+
var active = document.querySelector('.search-result.active');
|
115
|
+
if (active) {
|
116
|
+
if (active.parentElement.nextSibling) {
|
117
|
+
var next = active.parentElement.nextSibling.querySelector('.search-result');
|
118
|
+
active.classList.remove('active');
|
119
|
+
next.classList.add('active');
|
120
|
+
}
|
121
|
+
} else {
|
122
|
+
var next = document.querySelector('.search-result');
|
123
|
+
if (next) {
|
124
|
+
next.classList.add('active');
|
125
|
+
}
|
126
|
+
}
|
127
|
+
return;
|
128
|
+
case 13: // enter
|
129
|
+
e.preventDefault();
|
130
|
+
var active = document.querySelector('.search-result.active');
|
131
|
+
if (active) {
|
132
|
+
active.click();
|
133
|
+
} else {
|
134
|
+
var first = document.querySelector('.search-result');
|
135
|
+
if (first) {
|
136
|
+
first.click();
|
137
|
+
}
|
138
|
+
}
|
139
|
+
return;
|
140
|
+
}
|
141
|
+
});
|
138
142
|
|
139
|
-
|
140
|
-
|
143
|
+
jtd.addEvent(searchInput, 'keyup', function(e){
|
144
|
+
switch (e.keyCode) {
|
145
|
+
case 27: // When esc key is pressed, hide the results and clear the field
|
141
146
|
hideResults();
|
142
147
|
searchInput.value = '';
|
148
|
+
return;
|
149
|
+
case 38: // arrow up
|
150
|
+
case 40: // arrow down
|
151
|
+
case 13: // enter
|
152
|
+
e.preventDefault();
|
153
|
+
return;
|
154
|
+
}
|
155
|
+
|
156
|
+
hideResults();
|
157
|
+
|
158
|
+
var input = this.value;
|
159
|
+
if (input === '') {
|
160
|
+
return;
|
161
|
+
}
|
162
|
+
|
163
|
+
var results = index.query(function (query) {
|
164
|
+
var tokens = lunr.tokenizer(input)
|
165
|
+
query.term(tokens, {
|
166
|
+
boost: 10
|
167
|
+
});
|
168
|
+
query.term(tokens, {
|
169
|
+
wildcard: lunr.Query.wildcard.TRAILING
|
170
|
+
});
|
171
|
+
});
|
172
|
+
|
173
|
+
if (results.length > 0) {
|
174
|
+
searchResults.classList.add('active');
|
175
|
+
var resultsList = document.createElement('ul');
|
176
|
+
resultsList.classList.add('search-results-list');
|
177
|
+
searchResults.appendChild(resultsList);
|
178
|
+
|
179
|
+
for (var i in results) {
|
180
|
+
var result = results[i];
|
181
|
+
var doc = docs[result.ref];
|
182
|
+
|
183
|
+
var resultsListItem = document.createElement('li');
|
184
|
+
resultsListItem.classList.add('search-results-list-item');
|
185
|
+
resultsList.appendChild(resultsListItem);
|
186
|
+
|
187
|
+
var resultLink = document.createElement('a');
|
188
|
+
resultLink.classList.add('search-result');
|
189
|
+
resultLink.setAttribute('href', doc.url);
|
190
|
+
resultsListItem.appendChild(resultLink);
|
191
|
+
|
192
|
+
var resultTitle = document.createElement('div');
|
193
|
+
resultTitle.classList.add('search-result-title');
|
194
|
+
resultTitle.innerText = doc.title;
|
195
|
+
resultLink.appendChild(resultTitle);
|
196
|
+
|
197
|
+
var resultRelUrl = document.createElement('span');
|
198
|
+
resultRelUrl.classList.add('search-result-rel-url');
|
199
|
+
resultRelUrl.innerText = doc.relUrl;
|
200
|
+
resultTitle.appendChild(resultRelUrl);
|
201
|
+
|
202
|
+
var metadata = result.matchData.metadata;
|
203
|
+
var contentFound = false;
|
204
|
+
for (var j in metadata) {
|
205
|
+
if (metadata[j].title) {
|
206
|
+
var position = metadata[j].title.position[0];
|
207
|
+
var start = position[0];
|
208
|
+
var end = position[0] + position[1];
|
209
|
+
resultTitle.innerHTML = doc.title.substring(0, start) + '<span class="search-result-highlight">' + doc.title.substring(start, end) + '</span>' + doc.title.substring(end, doc.title.length)+'<span class="search-result-rel-url">'+doc.relUrl+'</span>';
|
210
|
+
|
211
|
+
} else if (metadata[j].content && !contentFound) {
|
212
|
+
contentFound = true;
|
213
|
+
|
214
|
+
var position = metadata[j].content.position[0];
|
215
|
+
var start = position[0];
|
216
|
+
var end = position[0] + position[1];
|
217
|
+
var previewStart = start;
|
218
|
+
var previewEnd = end;
|
219
|
+
var ellipsesBefore = true;
|
220
|
+
var ellipsesAfter = true;
|
221
|
+
for (var k = 0; k < 3; k++) {
|
222
|
+
var nextSpace = doc.content.lastIndexOf(' ', previewStart - 2);
|
223
|
+
var nextDot = doc.content.lastIndexOf('.', previewStart - 2);
|
224
|
+
if ((nextDot > 0) && (nextDot > nextSpace)) {
|
225
|
+
previewStart = nextDot + 1;
|
226
|
+
ellipsesBefore = false;
|
227
|
+
break;
|
228
|
+
}
|
229
|
+
if (nextSpace < 0) {
|
230
|
+
previewStart = 0;
|
231
|
+
ellipsesBefore = false;
|
232
|
+
break;
|
233
|
+
}
|
234
|
+
previewStart = nextSpace + 1;
|
235
|
+
}
|
236
|
+
for (var k = 0; k < 10; k++) {
|
237
|
+
var nextSpace = doc.content.indexOf(' ', previewEnd + 1);
|
238
|
+
var nextDot = doc.content.indexOf('.', previewEnd + 1);
|
239
|
+
if ((nextDot > 0) && (nextDot < nextSpace)) {
|
240
|
+
previewEnd = nextDot;
|
241
|
+
ellipsesAfter = false;
|
242
|
+
break;
|
243
|
+
}
|
244
|
+
if (nextSpace < 0) {
|
245
|
+
previewEnd = doc.content.length;
|
246
|
+
ellipsesAfter = false;
|
247
|
+
break;
|
248
|
+
}
|
249
|
+
previewEnd = nextSpace;
|
250
|
+
}
|
251
|
+
var preview = doc.content.substring(previewStart, start);
|
252
|
+
if (ellipsesBefore) {
|
253
|
+
preview = '... ' + preview;
|
254
|
+
}
|
255
|
+
preview += '<span class="search-result-highlight">' + doc.content.substring(start, end) + '</span>';
|
256
|
+
preview += doc.content.substring(end, previewEnd);
|
257
|
+
if (ellipsesAfter) {
|
258
|
+
preview += ' ...';
|
259
|
+
}
|
260
|
+
|
261
|
+
var resultPreview = document.createElement('div');
|
262
|
+
resultPreview.classList.add('search-result-preview');
|
263
|
+
resultPreview.innerHTML = preview;
|
264
|
+
resultLink.appendChild(resultPreview);
|
265
|
+
}
|
266
|
+
}
|
143
267
|
}
|
144
268
|
}
|
145
269
|
});
|
146
270
|
|
147
|
-
addEvent(searchInput, 'blur', function(){
|
271
|
+
jtd.addEvent(searchInput, 'blur', function(){
|
148
272
|
setTimeout(function(){ hideResults() }, 300);
|
149
273
|
});
|
150
274
|
}
|
@@ -155,22 +279,16 @@ function pageFocus() {
|
|
155
279
|
mainContent.focus();
|
156
280
|
}
|
157
281
|
|
158
|
-
|
159
282
|
// Document ready
|
160
283
|
|
161
|
-
function
|
162
|
-
|
284
|
+
jtd.onReady(function(){
|
285
|
+
initNav();
|
163
286
|
pageFocus();
|
164
287
|
if (typeof lunr !== 'undefined') {
|
165
288
|
initSearch();
|
166
289
|
}
|
167
|
-
}
|
168
|
-
|
169
|
-
// in case the document is already rendered
|
170
|
-
if (document.readyState!='loading') ready();
|
171
|
-
// modern browsers
|
172
|
-
else if (document.addEventListener) document.addEventListener('DOMContentLoaded', ready);
|
173
|
-
// IE <= 8
|
174
|
-
else document.attachEvent('onreadystatechange', function(){
|
175
|
-
if (document.readyState=='complete') ready();
|
176
290
|
});
|
291
|
+
|
292
|
+
})(window.jtd = window.jtd || {});
|
293
|
+
|
294
|
+
{% include js/custom.js %}
|