JSFiddle - React, Tailwind, and code Playground

by Vladimir Sobolev

HTML

<div id="contest_details"><div>
🙌 Мы рады приветствовать всех наших любимых гостей в нашей группе. Мы хотим всегда вас радовать вкусняшками и заряжать хорошим настроением! 
Поэтому решили провести конкурс для новых подписчиков и подарить счастливчику 1000 бонусных баллов в Приложении "Все дома". 

😋 Условия как всегда очень простые:
- убедитесь, что подписались на нашу группу
- напишите в комментарии под постом "участвую" (написать можно только 1 раз :)
- проявите активность на нашей странице (лайк или комментарий под любым другим постом), не обязательное условие, но нам будет очень приятно 🤗
⠀
Желаем удачи! 🌟
🤗 Итоги подведем завтра, 12.03 после 18:00 через [club42308677|@lizaonair]
Аккаунт должен быть открыт!

💪 Работаем ежедневно с 8:00 до 22:30ч

📲 Уточнить наличие, задать вопрос - 8 (812) 325-05-04

Если приложение ещё не скачано, то можно его скачать по этим ссылкам: 

https://play.google.com/store/apps/details?id=ru.vsedomafamily.mobile
 
https://apps.apple.com/ru/app/%D0%B1%D1%83%D0%BB%D0%BE%D1%87%D0%BD%D0%B0%D1%8F/id1500020054
</div>
</div>

CSS

#contest_details div {
	
	white-space: pre-line;
font-family: "Open Sans";
font-size: 16px;
word-break: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
}

JavaScript

function vk_parser(text) {
	
	var parameters = {
        urlClass: 'link',
        userClass: 'user',
        hashtagClass: 'hashtag',
        target: '_blank',
        parseUsers: true,
        parseHashtags: true,
        parseUrls: true
    };
	
	var searchlink = "https://vk.com/feed?section=search&q=%23", //search link for hashtags

    //regex
        regexUrl = /(?:\s)(f|ht)tps?:\/\/([^\s\t\r\n<]*[^\s\t\r\n<)*_,\.])/g, //regex for urls
        regexUser = /\B\[([a-zA-Z0-9_.-]+)\|(.+)\]/g, //regex for [users|links]
        regexHashtag = /\B(#[á-úÁ-Úä-üÄ-Üa-zA-Zа-яА-Я0-9_]+)/g; //regex for #hashtags

    //turn URLS in the instagram photo description into... working urls

        text = text.replace(regexUrl, function (url) {
		console.log('#'+url+'#');
            var link = generate_link(url.trim(), parameters.urlClass, url);
            return url.replace(url, link.outerHTML);
        });


    //turn @users in the instagram description into... working urls

        text = text.replace(regexUser, function (bbcode,vkid,label) {

            var url = 'https://vk.com/' + vkid,
                link = generate_link(url, parameters.userClass, label);

            return bbcode.replace(bbcode, link.outerHTML);
        });


    //turn #hashtags in the instagram photo description into... working urls

        text = text.replace(regexHashtag, function (hashtag) {
            var hashtagOnly = hashtag.slice(1),
                url = searchlink + hashtagOnly,
                link = generate_link(url, parameters.hashtagClass, hashtag);
            return hashtag.replace(hashtag, link.outerHTML);
        });

		return text;

};

function generate_link(url, className, text) {
    var link = document.createElement('a');
	link.target = '_blank';
    link.href = url;
    link.classList.add(className);
    link.textContent = text;

    return link;
};

$('#contest_details div').html(vk_parser($('#contest_details div').html()));