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.
@@ -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: $sp-4;
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
- .navigation-list-toggle {
106
- position: absolute;
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
- padding: $sp-2;
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
- background-color: $body-background-color;
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: $body-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
- @include fs-2;
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-3;
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-results-link {
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
- color: $body-heading-color;
112
- background-color: darken($body-background-color, 2%);
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: 232px !default;
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: 740px,
128
- lg: 800px,
129
- xl: 1316px
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-collapse: separate;
13
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.07), 0 4px 14px rgba(0, 0, 0, 0.05);
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
- @include mq(sm) {
16
- display: table;
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: lighten($body-background-color, 2%);
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
- &:first-of-type {
63
- border-bottom-left-radius: $border-radius;
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: 1px solid $border-color;
56
+ border-bottom: $border $border-color;
77
57
  }
78
58
  }
@@ -1,28 +1,41 @@
1
+ ---
2
+ ---
3
+ (function (jtd, undefined) {
4
+
1
5
  // Event handling
2
6
 
3
- function addEvent(el, type, handler) {
4
- if (el.attachEvent) el.attachEvent('on'+type, handler); else el.addEventListener(type, handler);
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 removeEvent(el, type, handler) {
7
- if (el.detachEvent) el.detachEvent('on'+type, handler); else el.removeEventListener(type, handler);
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 toggleNav(){
13
- const nav = document.querySelector('.js-main-nav');
14
- const auxNav = document.querySelector('.js-aux-nav');
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
- nav.classList.toggle('nav-open');
23
- auxNav.classList.toggle('nav-open');
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', jsonPath, true);
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
- var keys = Object.keys(data);
67
-
68
- for(var i in data) {
69
- index.add({
70
- id: data[i].id,
71
- title: data[i].title,
72
- content: data[i].content,
73
- url: data[i].url
74
- });
75
- }
76
- searchResults(data);
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(dataStore) {
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, 'keyup', function(e){
101
- var query = this.value;
102
-
103
- searchResults.innerHTML = '';
104
- searchResults.classList.remove('active');
105
-
106
- if (query === '') {
107
- hideResults();
108
- } else {
109
- var results = index.search(query);
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
- // When esc key is pressed, hide the results and clear the field
140
- if (e.keyCode == 27) {
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 ready(){
162
- toggleNav();
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 %}