Как ограничить количество отображаемых символов текста сместив начало и указав конец

[WebMachine]

Добрый день.

К примеру возьмём текст в 1000 символов, и представим что искомое слово в нём "закон" находится посередине. Как мне ограничить количество отображаемых символов текста так, чтобы начало было до 50 символов ранее от слова "закон" но в целом отобразилось не более 250 символов.

Т.е надо чтобы код мог не просто ограничивать количество отображаемых символов текста, но ещё и смещать на 50 символов ранее от введённого в input слова. Данная задача связанна с предыдущей темой: https://javascript.ru/forum/showthre...278#post553278.

В моем понимании это можно было решить методом: .substr(50, 250); // но я новичок и пока не выходит.

В целом надо получить скрипт который выделяет жирным найденный текст в результатах поиска (который берётся из input value в строке поиска) + чтобы отображаемый текст был ограничен в количестве отображаемых символов так чтобы этот самый найденный жирный текст был в нем виден.

код:
<input type="text" id="searchinput" value="explicabo"> // например мы искали explicabo
// и у нас есть результат поиска
<p class="fulldesc">Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime ea facilis suscipit accusantium earum quos odio, et dolore, fuga doloremque eos deserunt iusto in minima iure sequi iste doloribus hic perferendis voluptatem quod! Saepe id assumenda iste fugiat officiis commodi. Dolores quasi quae nesciunt quisquam tempore voluptatibus nostrum reprehenderit similique sed magnam, quis, ducimus quo totam laudantium ab alias id adipisci corporis dolorem blanditiis? Quae facere vero est quam voluptates blanditiis accusamus tempore sapiente esse, voluptas placeat adipisci, voluptate atque sequi unde odio id et obcaecati autem doloribus necessitatibus ipsam corrupti reiciendis? Quidem nisi fuga officia exercitationem tempore debitis cum voluptatem dicta et, eum qui distinctio commodi. Voluptate quae enim numquam quam totam, laudantium, facere doloribus amet dolorum officiis tempora dolorem ipsam dignissimos consectetur. Nemo veritatis perspiciatis magni similique possimus? Iste optio in praesentium laboriosam, obcaecati deleniti ut laborum doloribus explicabo, similique sapiente. Repudiandae enim quos veritatis consectetur quasi provident aliquam blanditiis tempore exercitationem minus omnis, nihil, quidem, fugit voluptates. Possimus aliquam corrupti assumenda sit. Deleniti molestiae totam velit repudiandae, voluptates, praesentium accusantium impedit quasi vel voluptatum mollitia molestias nemo quos optio non. Iure porro quidem laborum ipsa repellat sit iusto obcaecati eligendi dicta culpa corporis mollitia a facilis architecto quibusdam magnam non facere, enim adipisci necessitatibus blanditiis tempora, totam explicabo. Mollitia omnis, facere eaque dolor quod debitis excepturi expedita tempora quisquam? Modi at ipsum, iure qui voluptate unde rem dicta dolore id hic dolores quam illo aspernatur eveniet, quia laboriosam nostrum ex?</p>

И если я изначально искал слово "explicabo", должно быть что то на подобии:

Nemo veritatis perspiciatis magni similique possimus? Iste optio in praesentium laboriosam, obcaecati deleniti ut laborum doloribus explicabo, similique sapiente. Repudiandae enim quos veritatis consectetur quasi provident aliquam blanditiis tempore exercitationem minus omnis, nihil, quidem, fugit voluptates.

т.е надо чтобы он вывел 250 символов текста из результата в котором искомое слово будет плюс/минус посередине.

[Aetae]

function smartCut(haystack, needle, length = 250, before = 50) {
  const index = haystack.indexOf(needle);
  if (index === -1) return '';
  
  const start = index < before ? 0 : index - before;

  return haystack.slice(start, start + length)
}

smartCut(`К примеру возьмём текст в 1000 символов, и представим что искомое слово в нём "закон" находится посередине. Как мне ограничить количество отображаемых символов текста так, чтобы начало было до 50 символов ранее от слова "закон" но в целом отобразилось не более 250 символов.

Т.е надо чтобы код мог не просто ограничивать количество отображаемых символов текста, но ещё и смещать на 50 символов ранее от введённого в input слова. Данная задача связанна с предыдущей темой`, 'закон');

[WebMachine]

[quote=Aetae;553285]

function smartCut(haystack, needle, length = 250, before = 50) {
  const index = haystack.indexOf(needle);
  if (index === -1) return '';
  
  const start = index < before ? 0 : index - before;

  return haystack.slice(start, start + length)
}

а можете подсказать как это объединить с этим:

[JS]
document.addEventListener("DOMContentLoaded", () => {
    let searchinput = document.querySelector('#searchinput').value;
    let newValue = '<b>' +searchinput+ '</b>';
    const elements = document.querySelectorAll('.fulldesc');
    elements.forEach((element) => {
        element.innerHTML = element.textContent.replaceAll(searchinput, newValue);
    });
});

сейчас код находит искомое слово в результатах и делает его жирным. Но надо чтобы показывались именно те строки в которых есть это словосочетание

[voraa]

Но надо чтобы показывались именно те строки в которых есть это словосочетание

Где показывались?
Они уже показаны на странице.

[WebMachine]

Где показывались?
Они уже показаны на странице.

показаны, это да. Но тут дело в том что некоторые из результатов показаны без искомого слова. Потому что оно не умещается в 220 символов и находятся в продолжении описания которого не видно. Мне бы сделать так чтобы эти 220 символов были не с начала а на 50 символов ранее от искомого слова. тогда в результате поиска у каждой статьи или страницы будут видны и выделены искомые словосочетания

[voraa]

Я все равно не понимаю задачи.
У вас есть какие то элементы с классом fulldesc. (где то мелькало, что это элементы <p>) Они уже все показаны. В них вы ищите определенный текст и обрамляете его тегами <b>...</b>. Причем тут 220 символов? Сколько есть в этом элементе столько и показано, а если в нем нет слова, то вы его и не найдете.

[voraa]

а можете подсказать как это объединить с этим:

Что то типа такого

function smartCut(haystack, needle, length = 250, before = 50) {
	const index = haystack.toLowerCase().indexOf(needle.toLowerCase());
	if (index === -1) return '';
	const ltext = haystack.length;
	let start, end;
	if (index > ltext - length) {
		end = length;
		start = Math.max(0, ltext - length);
	} else {
		start = Math.max(0, index - before);
		end = Math.min(ltext, start + length);
	}
	let text = haystack.slice(start, end);
	const rsearch = new RegExp(`(${needle})`, 'ig');
	text = text.replaceAll(rsearch, '<b>$1</b>');
	return text;
}

document.addEventListener("DOMContentLoaded", () => {
    let searchinput = document.querySelector('#searchinput').value;
    let newValue = '<b>' +searchinput+ '</b>';
    const elements = document.querySelectorAll('.fulldesc');
    elements.forEach((element) => {
        element.innerHTML = smartCut(element.textContent, searchinput);
    });
});