Добавить фоновое видео на профили определенных пользователей?

Разработка
6

Хорошо, в целом этот подход работает отлично, а объяснение просто замечательное. Большое спасибо за то, что пошли на дополнительные усилия.

Работа на основе каждого пользователя проста — мы просто проверяем заданное имя пользователя, например так:

      const isUser1 = args.model.username == "User1"
      component.setProperties({isUser1})

Однако у нас возникает проблема с CSS — мы хотим внести некоторые изменения в отображение страницы пользователя только для этих пользователей.

В данный момент мы делаем это с помощью того же кода, что и раньше:

<script type="text/discourse-plugin" version="0.8">
    api.onPageChange(() =>{
        window.onload = determineUser();
    });
    
    async function determineUser() {
        await sleep(50);
        var pageURL = document.querySelector("meta[property='og:url']").getAttribute("content");
        var isUserPage = pageURL.includes("https://www.siteurl.com/u/");
        var isUser1 = pageURL.includes("u/User1/");
        document.body.className = document.body.className.replace(" user-page-animated","");

        
        if(isUserPage)
        {
            if(isUser1)
            {
                document.body.className += ' user-page-animated';
            }
        }
    }
    
    function sleep(ms)
    {
        return new Promise(resolve => setTimeout(resolve, ms));
    }
</script>

Это позволяет нам просто копировать и вставлять код для “User1” для каждого нового пользователя, но полагается на задержку в 50 мс после каждой загрузки страницы перед выполнением, что заметно для конечного пользователя (и если её убрать, по какой-то причине ничего не работает).

Есть ли способ также подключить добавление класса к body к коду, который вы предоставили, чтобы мы могли использовать его для стилизации страниц с видео иначе, чем без них?