haji.umuh / Vidio.com Theatre Mode and Night Mode

// ==UserScript==
// @name     Vidio.com Theatre Mode and Night Mode
// @description VIDIO.COM SIARAN LIGA 1 BURIQ; NIGHT MODE BIAR ADEM
// @version  1.1
// @grant    none
// @require  https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
// @include  https://www.vidio.com/*
// @description Night/dark mode is now available natively in vidio.com. But you can use this for other 'taste' of dark theme.
// @license MIT
// ==/UserScript==
// ==OpenUserJS==
// @author  haji.umuh
// ==/OpenUserJS==

$(document).ready(function () {
  setInterval(function () {
    let nightmode_bgcolor = "#202442";
    let nightmode_bgcolor2 = "#2d325a";
    let nightmode_txtcolor = "#ffffff";
    let nightmode_buttoncolor = "#fd1b44";
    let nightmode_buttoncolor2 = "#c71585";
    let nightmode_buttoncolor3 = "#26292e";
    let nightmode_bordercolor	= "#9498a1";
    
    $("body").css("background-color", nightmode_bgcolor);
    $("body").css("color", nightmode_txtcolor);
    $("body").attr("data-theme","dark");//force dark mode (default dark mode is now available)
    $("[class*=onboarding]").css("color", nightmode_txtcolor);
    $("[class*=dashboard]").css("color", nightmode_txtcolor);
    
    $(".my-list-background, .my-list").css("background", nightmode_bgcolor2);
    $(".my-list-background").css("color", "darkolivegreen");
    $(".phone-verification-status").css("color", nightmode_txtcolor);
    $(".phone--with-prefix").css("color", "darkolivegreen");
    
    
    $(".home-content__title").css("color", nightmode_txtcolor);
    $(".home-content__subtitle").css("color", nightmode_txtcolor);
    $("button.btn:not(.notification-preview-container.js-component button)").css("background", nightmode_buttoncolor);

    $(".livestreaming__tvstreams-container").css("background-color", nightmode_bgcolor);
    $("#navbar").css("background-color", nightmode_bgcolor);

    $(".header-category a").css("color", nightmode_txtcolor);
    $(".header-category a").css("opacity", 1);
    $(".livestreaming-events__item-title").css("color", nightmode_txtcolor);
    $(".livestreaming-events__item-title").css("opacity", "0.75");
    $(".b-livestreaming-detail__title.section__title").css("color", nightmode_txtcolor);
    $(".b-livestreaming-user__name").css("color", nightmode_txtcolor);
    $(".livestreaming-events__title").css("color", nightmode_txtcolor);
    $(".circle__title").css("color", nightmode_txtcolor);
    $(".header-category a").css("color", nightmode_txtcolor);
    //$(".notification-preview-container.js-component").css("background", "darkkhaki");
    //$(".notification-preview-container.js-component button").css("background-image", "https://static-web.prod.vidiocdn.com/assets/bundles/media/notification-black-edd1cdd7.digested.svg");
    $(".content-profile-feedback__description").css("color", nightmode_txtcolor);
    $("#video_main_fluid").css("background-color", nightmode_bgcolor);
    $("#video_main_fluid").css("color", nightmode_txtcolor);
    $("#video_main_fluid h1, #video_main_fluid h3").css("color", nightmode_txtcolor);
    $("[data-testid='engagement-bar'] li").css("background", nightmode_buttoncolor2);
    
    $("[data-glide-dir='|>'],[data-glide-dir='|<']").css("background", nightmode_buttoncolor2);
   // $("[data-glide-dir='|>'],[data-glide-dir='|<']").css("color", "#2d2d2d");
    $("[class*=comment-card-module_comment]").css("color", nightmode_txtcolor);
    $("[class*=comment-card-module_user] a").css("color", nightmode_txtcolor);
    $("[class*=description-module_description]").css("color", nightmode_txtcolor);
    $("[class*=header-module_title]").css("color", nightmode_txtcolor);
    $(".morenav-hover__menu").css("background", nightmode_bgcolor2);
    $(".morenav-hover__menu a").css("color", "#eee");
    $(".morenav-hover__menu a:hover").css("color", "#000");
    $(".header-login__menu").css("background", nightmode_bgcolor);
    $(".header-login__menu").css("color", "darkkhaki");
    $(".option-user h4").css("color", nightmode_txtcolor);
    //$(".option-user__button").css("background", "darkkhaki");
    
    $("[class*=title-module_title]").css("color", nightmode_txtcolor);
    $("[class*=item-title-module]").css("color", nightmode_txtcolor);
    
    //$("[class*=livestreaming-discussion]").css("background", nightmode_bgcolor2);
    //$("[class*=livestreaming-discussion]").css("color", nightmode_txtcolor);
    
    $(".livestreaming-discussion-item__menu-option-icon").css("background", nightmode_buttoncolor2);
    
    $("[class*=voucher]").css("color", nightmode_txtcolor);
    $(".voucher-card__item").css("background", nightmode_bgcolor2);
    
    $("[data-testid='comment-card']").css("border-color", nightmode_bordercolor);
    
    //$(".wrap").css("background", "darkkhaki");
    
    
    
        

  }, "500");

  let button_theathermode = `<button gm-vidio-mode-now='normal' class='gm_vidio_btn_thmode' >Theatre Mode</button>`;
  $(".b-livestreaming-detail__ctas").prepend(button_theathermode);

  $(".gm_vidio_btn_thmode").click(function () {
    let modenow = $(this).attr("gm-vidio-mode-now");
    if (modenow == "normal") {
      let maxwidth = $(".livestreaming__tvstreams-container.js-component.slick-initialized.slick-slider").width();
      $(".livestreaming__player-container.js-component").css("width", maxwidth);
      $(".side-container").hide();
      $(this).attr("gm-vidio-mode-now", 'theatre');
      $(this).html("Normal Mode");
    }
    else {
      let normalwidth = $(".livestreaming__container").width();
      $(".livestreaming__player-container.js-component").css("width", normalwidth);
      $(".side-container").show();
      $(this).attr("gm-vidio-mode-now", 'normal');
      $(this).html("Theatre Mode");
    }
  });
});