Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]
Groups > comp.lang.javascript > #38633 > unrolled thread
| Started by | Robert Baer <robertbaer@localnet.com> |
|---|---|
| First post | 2020-08-03 19:13 -0700 |
| Last post | 2020-08-06 12:40 -0700 |
| Articles | 2 on this page of 42 — 8 participants |
Back to article view | Back to comp.lang.javascript
How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-03 19:13 -0700
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-04 04:49 +0200
Re: How get windows FIND() to work? Julio Di Egidio <julio@diegidio.name> - 2020-08-04 02:11 -0700
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-04 12:02 +0200
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-04 20:06 -0700
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-05 07:55 +0200
Re: How get windows FIND() to work? "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2020-08-03 19:55 -0700
Re: How get windows FIND() to work? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2020-08-05 08:35 +0200
Re: How get windows FIND() to work? "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2020-08-05 11:19 -0700
Highlighting text (was: How get windows FIND() to work?) Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2020-08-06 02:15 +0200
Re: How get windows FIND() to work? Clifford Heath <no.spam@please.net> - 2020-08-04 15:22 +1000
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-04 10:06 -0700
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-04 19:42 +0200
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-04 20:13 -0700
Re: How get windows FIND() to work? Clifford Heath <no.spam@please.net> - 2020-08-05 19:56 +1000
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-05 13:54 +0200
Re: How get windows FIND() to work? Clifford Heath <no.spam@please.net> - 2020-08-05 21:55 +1000
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-05 15:40 +0200
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-06 12:27 -0700
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-07 14:09 +0200
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-06 12:24 -0700
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-06 12:23 -0700
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-06 12:16 -0700
Re: How get windows FIND() to work? "R.Wieser" <address@not.available> - 2020-08-04 09:10 +0200
Re: How get windows FIND() to work? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2020-08-04 23:46 +0200
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-04 20:21 -0700
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-05 07:56 +0200
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-06 11:40 -0700
Re: How get windows FIND() to work? Arno Welzel <usenet@arnowelzel.de> - 2020-08-07 14:26 +0200
Re: How get windows FIND() to work? "R.Wieser" <address@not.available> - 2020-08-05 08:59 +0200
Re: How get windows FIND() to work? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2020-08-06 01:11 +0200
Re: How get windows FIND() to work? Clifford Heath <no.spam@please.net> - 2020-08-06 11:36 +1000
Re: How get windows FIND() to work? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2020-08-06 12:24 +0200
Re: How get windows FIND() to work? Robert Baer <robertbaer@localnet.com> - 2020-08-06 12:40 -0700
Re: How get windows FIND() to work? "R.Wieser" <address@not.available> - 2020-08-07 10:27 +0200
Re: How get windows FIND() to work? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2020-08-08 04:39 +0200
Re: How get windows FIND() to work? Clifford Heath <no.spam@please.net> - 2020-08-07 18:46 +1000
Highlighting text (was: How get windows FIND() to work?) Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2020-08-05 08:32 +0200
Re: Highlighting text (was: How get windows FIND() to work?) "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2020-08-05 21:59 -0700
Re: Highlighting text (was: How get windows FIND() to work?) Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2020-08-08 04:22 +0200
Re: Highlighting text Robert Baer <robertbaer@localnet.com> - 2020-08-06 12:06 -0700
Re: How get windows FIND() to work? "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2020-08-06 12:40 -0700
Page 3 of 3 — ← Prev page 1 2 [3]
| From | Robert Baer <robertbaer@localnet.com> |
|---|---|
| Date | 2020-08-06 12:06 -0700 |
| Subject | Re: Highlighting text |
| Message-ID | <txYWG.249813$eN2.34007@fx47.iad> |
| In reply to | #38660 |
Thomas 'PointedEars' Lahn wrote:
> [Stop amok-crossposting. This has nothing to do with computers in general
> or electronics design. *facepalm*]
>
> Robert Baer wrote:
>
>> Environment: Win7.1 Firefox 78
>>
>> Sample line used:
>> <a href="downhole-measurements.html?find=able">Downhole Measurements</a>
>
> What is happening then depends on the user agent. It is NOT a general
> command to highlight something. HTML is NOT a programming language.
>
> The FIND command of CMD.exe has *nothing to do* with HTML/JavaScript.
> JavaScript is *case-sensitive*. And “window” is NOT “windows”.
>
>> At least execution transfers from the calling HTML to the desired
>> destination HTML.
>
> HTML is _NOT_ a programming language. HTML does NOT “execute” and does NOT
> “call”.
>
>> BUT. the keyword does NOT get underlined or highlighted in any way.
>
> Of course not. HTML – HyperText *Markup* Language – is _NOT_ a programming
> language. To highlight something *in general*, you need a *programming*
> language.
>
>> It would be particularly nice if all the keywords got highlighted
>> and the first keyword was presented on the screen (think loong document
>> and keyword was in middle).
>>
>> Help?
>
> -- downhole-measurements.html -----------------------------------
>
> <!DOCTYPE html>
> <html>
> <head>
> <!-- … -->
> <script src='highlight.js'></script>
> <!-- … -->
> </head>
>
> <body onload='highlight.highlightAndFocus()'>
> <!-- … -->
> </body>
> </html>
>
> -- highlight.js ----------------------------------------------------------
>
> /**
> * highlight.js – Highlights occurrences of text in HTML documents
> * @author (C) 2020 Thomas 'PointedEars' Lahn <js@PointedEars.de>
> *
> * This program is free software: you can redistribute it and/or modify
> * it under the terms of the GNU General Public License as published by
> * the Free Software Foundation, either version 3 of the License, or
> * (at your option) any later version.
> *
> * The program is distributed in the hope that it will be useful,
> * but WITHOUT ANY WARRANTY; without even the implied warranty of
> * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
> * GNU General Public License at <http://www.gnu.org/licenses/>
> * for more details.
> */
>
> var highlight = {
> getNeedle: function () {
> /* Get value of value of “find” parameter */
> var value = (window.location.search.match(/[?&]find=([^&#]+)/) || [,])
> [1];
> if (value) value = decodeURIComponent(value);
> return value;
> },
>
> focus: function (needle) {
> if (needle)
> {
> /* Focus first occurence */
> if (typeof window.find != 'undefined' && !window.find(needle))
> {
> if (typeof console != 'undefined'
> && typeof console.log != 'undefined')
> {
> console.log('Text not found: "' + needle + '"');
> }
> }
> }
> },
>
> highlight: function (needle) {
> if (needle)
> {
> /* Highlight all occurrences */
> document.body.innerHTML = document.body.innerHTML.replace(
> new RegExp(
> /* slurp textareas and tags */
> '(<textarea>(?:[^<]|<[^\/])+<\/textarea>|<[^>]+>)|'
> + needle.replace(/[\]\\^$*+?.(){}|[]/g, "\\$&"),
> 'gi'),
> function (match, tag, offset, all) {
> /* ignore elements/tags */
> if (tag) return tag;
>
> return ('<span style="background-color: yellow; color: black">'
> + match + '</span>');
> }
> );
> }
> },
>
> highlightAndFocus: function (needle) {
> if (!needle) needle = this.getNeedle();
> this.highlight(needle);
> this.focus(needle);
> }
> };
>
> --8<----------------------------------------------------------------------
>
> F’up2 comp.lang.javascript
>
Thanks.
It would be very nice if i understood this stuff.
Thanks again.
[toc] | [prev] | [next] | [standalone]
| From | "Michael Haufe (TNO)" <tno@thenewobjective.com> |
|---|---|
| Date | 2020-08-06 12:40 -0700 |
| Message-ID | <cda7572d-5660-44d8-9f6e-132fcbf7c88fo@googlegroups.com> |
| In reply to | #38633 |
On Monday, August 3, 2020 at 9:13:41 PM UTC-5, Robert Baer wrote:
> Environment: Win7.1 Firefox 78
>
> Sample line used:
> <a href="downhole-measurements.html?find=able">Downhole Measurements</a>
>
> At least execution transfers from the calling HTML to the desired
> destination HTML.
>
> BUT. the keyword does NOT get underlined or highlighted in any way.
> It would be particularly nice if all the keywords got highlighted
> and the first keyword was presented on the screen (think loong document
> and keyword was in middle).
>
> Help?
Here's an alternate solution:
https://codepen.io/mlhaufe/pen/abNzNGG?editors=1010
If you select "Debug mode" from the "Change View" menu you can play with the #hash as well
Inline code:
```
class Highlighter {
#highlightTemplate = document.createElement("span");
constructor() {
const t = this.#highlightTemplate;
t.style.backgroundColor = "red";
t.style.color = "black";
}
#findContainers(text) {
const matches = document.evaluate(
`//*[contains(text(),'${text}')]`,
document.body
);
const excludeTags = ["SCRIPT", "LINK", "STYLE"];
const results = [];
let match = matches.iterateNext();
while (match) {
if (!excludeTags.includes(match.tagName)) {
results.push(match);
}
match = matches.iterateNext();
}
return results;
}
#wrapMatches(container, text) {
const highlightWrapper = this.#highlightTemplate.cloneNode(true),
re = new RegExp(text, "gi"),
matches = [...container.textContent.matchAll(re)];
matches.forEach((match) => {
const range = document.createRange();
range.setStart(container.firstChild, match.index);
range.setEnd(container.firstChild, match.index + match[0].length);
range.surroundContents(highlightWrapper);
});
}
highlight(text) {
const escaped = text.replace(/'/g, "\\'"),
containers = this.#findContainers(text);
containers.forEach((container) => this.#wrapMatches(container, text));
}
}
const highlighter = new Highlighter(),
fragment = document.location.hash.substring(1) || "mattis";
highlighter.highlight(fragment);
```
[toc] | [prev] | [standalone]
Page 3 of 3 — ← Prev page 1 2 [3]
Back to top | Article view | comp.lang.javascript
csiph-web