Установка

История и новшества

Старая версия КлипБукета - от создателя. На данный момент заброшена, не развивается, репозиторий переведен в архив. Последняя версия 4, рассчитана на PHP 5.4-7.0, MySQL 5.5 в современных версиях ОС создает доп. сложности в установки, требования использования устаревшего ПО. А также в целом имеет массу багов, которые исправлять никто не будет. Также старая версия ориентирована на использование технологии Flash, вышедшей из употребления и неподдерживаемой броузерами. Сайт проекта, содержавший документацию, перестал существовать (доступен через WebArchive).

На основе старой версии выпущен форк - ClipBucket v5, который соответствует современным требованиям и активно разрабатывается. Заявляемые системные требования - PHP 7.0 - 8.3+, MySQL 8+/MariaDB 10.3+. Прочие новшества:

• В форке исключена потребность в php-imagick, gpac и flvtool2. Исключены устаревшие плееры - остался один. Заявлена поддержка субтитров, но не очевидно - речь про проигрывание либо про генерацию при заливке видео. Конфигураци БД перенесена из includes/dbconnect.php в includes/config.php. Переделана система локализации - теперь переводы элементов интерейса находятся не в XML-файлах, а в БД. Есть возможность редактирования через веб-интерфейс, но по факту она не работает.
• В движок встроен обработчик ошибок Whoops. Активен при переводе движка в дев.режим. Обработчик перехватывает события, вызывающие ошибки и падения движка, выдает дебуг-инфу. Очень удобно.
• Переделана система работы плагинов, плагины от старых версий могут не заработать.
• Реорганизована админка.

Баги и проблемы

• Успешно завести на заявленных версиях PHP и MySQL оказалось возможным лишь начиная с версии 5.5.0. Ранние имели проблемы интерпретации кода php-интерпретатором.
• Пока поломана возможность редактирования переводов элементов интерфейса через веб-интерфейс.
• Миграция на свежий ClipBucket-v5 (5.5.0) пошла не гладко - полноценно перенести БД старой версии в новый движок не получилось. Оказалось быстрее и проще перезалить видео. В отличи от версии 5.4.1 данная хорошо завелась на PHP-8.2 + MariaDB-10.5. В связи с присутствием в системе PHP7.4, немного движок немного ошибается при проверке модулей. Сначала надо в настройках сайта выставить правильные пути к свежим версиям утилит.
• У форка нет своей документации. Сайт с документацией старой версии перестал существовать, хотя и доступен через WebArchive, но информация там устаревшая и не во всем применима к новой версии.

Установка

Скачиваем и распаковываем:

https://github.com/MacWarrior/clipbucket-v5/archive/refs/tags/5.5.0.tar.gz
tar -zxf 5.5.0.tar.gz
mkdir /var/www/yurtube550
ln -s /var/www/yurtube550 /var/www/yurtube

В распакованном архиве содержимое каталога upload копируем в /var/www/yurtube

Настраиваем хост в nginx.. В хосте добавить параметр

    add_header X-Frame-Options "ALLOWALL";

иначе embed вставляться не будет на др.сайтах.

Создаем БД:

mysql -u root -p

и вводим следующие команды:

  SET GLOBAL sql_mode="";
  CREATE DATABASE yurtube;
  CREATE USER 'yurtube'@'localhost' IDENTIFIED BY '<SomePassword>';
  GRANT ALL PRIVILEGES ON yurtube.* TO 'yurtube'@'localhost';
  FLUSH PRIVILEGES;
  QUIT;

После чего запускаем инсталл клипбукета https://yurtube.sphynkx.org.ua/cb_install/ с учетом имени созданной БД и пароля.. В начальной проверке если не нашлись утилиты конвертации - не страшно (там код проверки с ошибками), потом в настройках можно настроить актуальные пути. После установки папку cb_install удалить/переименовать. Всем папкам дать владельца, из под которого работает nginx.

В Website Configuration во вкладке Uploading and Conversion Settings сверить и поправить пути к утилитам.

В настройках General Configurations -> Website Configurations -> Video Conversion выбрать профиль: H.264, AAC - Youtube like видеокодек: libx264 аудиокодек: aac -strict -2 (или просто aac)

Кроме того рекомендуется также поставить PHPMyAdmin для более комфортной работы с БД.

Nginx configuration

Предполагается, что сервис развернут на отдельной ВМке (192.168.7.3), основной хостинг на общем сервере (192.168.7.1).

На ВМке конфигурим новый субдомен (тут уже конфиг с учетом модификации Ютюб-подобного УРЛа):

server {
    server_name yurtube.sphynkx.org.ua;
    listen 93;

    root /var/www/yurtube;
    index index.php index.html index.htm;
    autoindex off;

    access_log /var/log/nginx/yurtube-access.log;
    error_log /var/log/nginx/yurtube-error.log debug;

    client_max_body_size 500m;
    client_body_timeout 6000;

    proxy_buffering off;
    proxy_buffers 8 640k;
    proxy_busy_buffers_size 640k;

    add_header X-Frame-Options "ALLOWALL";

    location ~ \.ht {
    deny all;
    }

    location / {
 if (!-e $request_filename){
    rewrite ^(.*)$ /$1_video.php;
        }
    try_files $uri $uri/ @rewrite;
    }

    location @rewrite {
    rewrite ^/(.*)$ /index.php;
##  rewrite ^/watch_video.php?v=(.*?)$ /watch?v=$1;
    }

location /embed {
  rewrite ^/embed?(.*) /player/embed_player.php?$1$query_string;
}

 location /favicon.ico {
        types {} default_type "image/png";
    }


    location ~ \.php$ {
    include /etc/nginx/fastcgi_params;
## https://ruhighload.com/%D0%9E%D1%88%D0%B8%D0%B1%D0%BA%D0%B0+nginx+upstream+sent+too+big+header
## was 502 error during saving of big wikipage
    fastcgi_buffer_size 4096k;
    fastcgi_buffers 8 4096k;
##  fastcgi_pass  127.0.0.1:9000;
    fastcgi_pass unix:/run/php-fpm/www.sock;
##  fastcgi_pass unix:/var/opt/remi/php74/run/php-fpm/www.sock;
##  fastcgi_pass unix:/run/php-fpm-7.0.sock;
    fastcgi_index index.php;
    fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
    try_files $uri @rewrite;
    fastcgi_read_timeout 10000;
    }

    location ~/pma/ {
    allow all;
    index index.php index.html index.htm;
    }

}

На стороне общего сервера настраиваем субдомен с проксированием:

    server {
        listen       93;
        server_name  yurtube.sphynkx.org.ua;
        access_log   /var/log/nginx/yurtube-access.log  main;
        error_log   /var/log/nginx/yurtube-error.log;
        location / {
        proxy_http_version 1.1;
##      proxy_set_header Host $host;
##      proxy_pass      http://192.168.7.3:80;
        proxy_pass      http://192.168.7.3:93;
  proxy_set_header        Host               $http_host;
  proxy_set_header        X-Real-IP          $remote_addr;
  proxy_set_header        X-Forwarded-For    $proxy_add_x_forwarded_for;
  proxy_set_header        X-Forwarded-Host   $host:443;
  proxy_set_header        X-Forwarded-Server $host;
  proxy_set_header        X-Forwarded-Port   443;
  proxy_set_header        X-Forwarded-Proto  https;
  proxy_set_header      HTTPS            On;
  proxy_ssl_verify off;
  proxy_ssl_server_name on;
        }
}

Далее на общем сервере запускаем letsencrypt - настраиваем https. В списке найденных субдоменов выбираем нужный, затем опцию №2. Утилита модифицирует конфиг. Рестартим nginx. После этого в браузере открываем https://yurtube.sphynkx.org.ua/cb_install/ и начинаем инсталлить/конфигурить.

Дальнейший тюнинг и фиксы

При загрузке видео может возникнуть ошибка Please enter 'Title' value between '4' and '80' (видео однако поступит в обработку, но с именем файла в качестве заголовка и описания). Это ограничения на размер строки в заголовке: в таблице cb_config параметры min_video_title и max_video_title (изначально 4 и 80 соотв.). Второй заменен на 250. Также можно там же подкорректировать min_video_desc (изначально 5) max_video_desc (изначально 300).

DEV Mode и шапка сайта

При включении DevMode верхняя шапка сайта увеличивает высоту с 40 до 400пх, растягивая при этом и логотип. Что не есть красиво. Переключение происходит в стилях, в styles/cb_28/theme/css/all.css в районе строки 5088 есть блок

.logo {
  width: 200px;
  height: 400px;
  margin: 0;
  font-size: 0;
  line-height: 0;
}

В нем меняем height 400px на 40px.

Логотип и фавикон

В отличии от старого клипбукета, тут работает страничка настройки логотипа и иконки сайта. Однако, на страницах размеры логотипа жестко заданы и лого с др. соот.сторон растягивается. Заменен на новый, с подходящим соотн. сторон.

Youtube-подобный URL

Стандартый вид URLа клипов http://domain.tld/watch_video.php?v=XXXXXXX Сделаем его по подобию YouTube: http://domain.tld/watch?v=XXXXXXX В конфиге сайта в nginx в блоке "location /" допишем нужный реврайт:

    location / {
 if (!-e $request_filename){
    rewrite ^(.*)$ /$1_video.php;
<------>    }
<------>try_files $uri $uri/ @rewrite;
    }

    location @rewrite {
<------>rewrite ^/(.*)$ /index.php;
##<---->rewrite ^/watch_video.php?v=(.*?)$ /watch?v=$1;
    }

location /embed {
  rewrite ^/embed?(.*) /player/embed_player.php?$1$query_string;
}

 location /favicon.ico {
        types {} default_type "image/png";
    }

Затем поправляем УРЛ в includes/functions_video.php (в районе 415й строки). Строку:

        $link = BASEURL.'/watch_video.php?v='.$vdetails['videokey'].$plist;

приводим к виду:

        $link = BASEURL.'/watch?v='.$vdetails['videokey'].$plist;

Для embed-кода, чтоб привести его к виду http://domain.tld/embed?vid=XXXXXXX в nginx добавляем:

  location /embed {
    rewrite ^/embed?(.*) /player/embed_player.php?$1$query_string;
  }

и в includes/classes/video.class.php в районе 1805 строки подправляем УРЛ (/player/embed_player.php?vid= -> /player/embed?vid=):

        $embed_code = '<iframe width="' . config('embed_player_width') . '" height="' . config('embed_player_height') . '" ';
        $embed_code .= 'src="' . BASEURL . '/player/embed?vid=' . $vdetails['videokey'];

        if (config('autoplay_embed') == 'yes') {
            $embed_code .= '&autoplay=yes';
        }

Видео эмбедится в страницы, но расположено вверху, внутри серого прямоугольника. Возможно, причина уже на стороне модуля видеогалереи. Можно изменить стилями в теге <iframe>.. <body>. Через WebDeveloper вставка в body стиль background: #000000; дает черный фон, а вставка в сформированный css кода (изначально там только сточка height: 100%;)

#cb_player {
    height: 100%;
    background: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
}

дает нужную центровку. Но доопределение стиля через MediaWiki:Common.css или MediaWiki:Modern.css эффекта не дала (возм. эффект кеширования). Пришлось править стили YurTube в styles/cb_28/theme/css/all.min.css и добавить эти параметры там.

Дата загрузки видео перед описанием

Опять таки, типа как в Ютюбе - чтоб присутствовала рядом с описанием и дата загрузки. В styles/cb_28/layout/watch_video.html в районе 26 строки ищем строчку:

                                        <h1>{display_clean($video.title)}</h1>

После нее добавляем вывод даты в разметке заголовка:

<h4>{date('d.m.Y', strtotime($video.datecreated))}</h4>

Логотип на центральную кнопку плеера

Ложим свой логотип в player/CB_video_js/bigplay.png (в старой версии player/CB_html5_player/skin/bigplay.png). Затем в player/CB_video_js/css/video-js.min.css ищем вхождение content:"f101" и добавляем перед ним background:url(../bigplay.png) no-repeat 50% 50% !important;

Логотип внизу плеера

Логотип в файле /images/icons/player-logo.png и его можно заменить на свой. К примеру, взять из старого движка /images/icons/country/hp-cb.png.