YouTube Live Subscriptions

UX for YouTube Livestreams in https://www.youtube.com/feed/subscriptions

目前为 2023-09-12 提交的版本。查看 最新版本

// ==UserScript==
// @name        YouTube Live Subscriptions
// @namespace   UserScripts
// @match       https://www.youtube.com/*
// @grant       none
// @version     1.1.7
// @author      CY Fung
// @license     MIT
// @description UX for YouTube Livestreams in https://www.youtube.com/feed/subscriptions
// @unwrap
// @inject-into page
// @run-at      document-start
// ==/UserScript==

(() => {

  /** @type {globalThis.PromiseConstructor} */
  const Promise = (async () => { })().constructor; // YouTube hacks Promise in WaterFox Classic and "Promise.resolve(0)" nevers resolve.

  let proxy = new Proxy({

  }, {
    set(target, prop, value) {
      /*
      if(prop ==='isFeedSubscriptions' && target[prop] !== value){

        target[prop] = value;


        if(!value){


        for(const s of document.querySelectorAll('ytd-rich-grid-row #contents.ytd-rich-grid-row[class], ytd-rich-item-renderer.ytd-rich-grid-row[class]')){

          s.classList.remove('feed-subscriptions');


        }


        }else{

        for(const s of document.querySelectorAll('ytd-rich-grid-row #contents.ytd-rich-grid-row[class], ytd-rich-item-renderer.ytd-rich-grid-row[class]')){


          s.classList.add('feed-subscriptions');


        }
        }

      }
      */

      target[prop] = value;

    }
  })




  const wm = new WeakMap();

  const dm = new WeakMap();

  let foregroundPromise = null;
  const foregroundPromiseFn = () => (foregroundPromise = (foregroundPromise || new Promise(resolve => {
    requestAnimationFrame(() => {
      foregroundPromise = null;
      resolve();
    });
  })));


  let m67t = 0;

  let pendingChannels = new Set();

  const closestYtComponentFn = (e) => {
    while (e instanceof HTMLElement) {
      if (typeof e.is === 'string') return e;
      e = e.parentNode;
    }
    return null;
  };


  const proceedChannels = () => {
    // if(location.pathname!=='/feed/subscriptions') return;
    let channels = [...pendingChannels];
    pendingChannels.clear();
    for (const channel of channels) {

      let videoIds = new Set([...document.querySelectorAll(`[media-owner-id="${channel}"][media-base-video-id]`)].map(e => e.getAttribute('media-base-video-id')))

      let medias = [...videoIds].map(videoId => document.querySelector(`[media-owner-id="${channel}"][media-base-video-id="${videoId}"]`)).filter(e => (e instanceof HTMLElement));
      let csContainer = null;
      // console.log(3343,channel, [...medias])

      for (let mi = 0; mi < medias.length; mi++) {

        const media = medias[mi];
        if (mi > 0) {
          let ytParentComponent = (media.inst || media).parentComponent || 0;

          ytParentComponent = ytParentComponent.inst || ytParentComponent;

          if (ytParentComponent) {

            const ytParentComponentElement = ytParentComponent.hostElement;

            if (ytParentComponentElement && ytParentComponentElement.getElementsByTagName(media.tagName).length === 1) {
              ytParentComponentElement.setAttribute('hidden', '')
            }


          }

        } else {
          csContainer = media.parentNode.querySelector('ytd-channel-subscriptions');
          csContainer.setAttribute('channel-subscriptions-active', '');
          csContainer.textContent = '';



        }

        let videoMedia = ((media.inst || media).hostElement || 0);

        let videoMediaData = videoMedia ? dm.get(videoMedia) : null;


        if (csContainer && videoMediaData) {
          const box = document.createElement('ytd-channel-subscription');

          const tnUrl = videoMediaData.thumbnail.thumbnails[0].url;
          box.style.setProperty('background-image', `url(${tnUrl})`);


          box.setAttribute('data-channel-id', media.getAttribute('media-owner-id'));
          box.setAttribute('data-video-id', media.getAttribute('media-base-video-id'));

          dm.set(box, videoMediaData);

          const data = videoMediaData || 0;
          let type = '';
          if (data.upcomingEventData) {
            type = 'upcoming';
          } else if (data.badges) {
            for (const badge of data.badges) {
              if (badge && badge.metadataBadgeRenderer) {
                const br = badge.metadataBadgeRenderer;
                if (br.style === "BADGE_STYLE_TYPE_LIVE_NOW" || (br.icon || 0).iconType === 'LIVE') {
                  type = 'live-now';
                }
              }
            }
          }

          if (!type && data.publishedTimeText) {
            type = 'published'
          }

          box.setAttribute('video-type', type)

          csContainer.appendChild(box);




        }
        //if(mi>0) let closestYtComponentFn(media)
      }

      if (csContainer) {

        let media = HTMLElement.prototype.querySelector.call(csContainer.parentNode, 'ytd-rich-grid-media');

        if (media) {

          // console.log(media);

          (media.inst || media).setTargetData();
        }
      }




    }
  }

  let m68t = 0;
  let promiseT = Promise.resolve();
  const mo1 = new MutationObserver(() => {

    // if(!isFeedSubscriptions && location.pathname==='/feed/subscriptions') isFeedSubscriptions = true;
    if (!proxy.isFeedSubscriptions) return;
    let p = document.querySelector('a[href="/feed/subscriptions"]');
    if (p) p.setAttribute('href', '/feed/subscriptions?flow=1');




  });




  mo1.observe(document, { subtree: true, childList: true });


  const mo2 = new MutationObserver((entries) => {

    // if(!isFeedSubscriptions && location.pathname==='/feed/subscriptions') isFeedSubscriptions = true;
    if (!proxy.isFeedSubscriptions) return;


    let mx = false;

    for (const entry of entries) {

      const target = entry.target;

      if (target instanceof HTMLElement && target.isConnected === true) {

        foregroundPromiseFn().then(() => {




          let c = target.querySelector('ytd-channel-subscriptions');


          let media = target.querySelector('ytd-rich-grid-media');
          let mediaCnt = media.inst || media;

          let _c72_ = mediaCnt.data._c72_;
          let w = null;
          if (_c72_) {
            w = wm.get(_c72_);

          }


          return;



        })


      }
    }

  });

  document.addEventListener('click', function (evt) {

    if (!proxy.isFeedSubscriptions) return;

    // console.log(3, evt)
    if (evt && evt.isTrusted && evt.target.nodeName === 'YTD-CHANNEL-SUBSCRIPTION') {
      let media = HTMLElement.prototype.querySelector.call(evt.target.parentNode.parentNode, 'ytd-rich-grid-media');
      const videoId = evt.target.getAttribute('data-video-id');
      // console.log(4, media,videoId)
      if (media) {
        (media.inst || media).setTargetData(videoId)
      }
    }

  }, true)

  let runStarted = 0;

  let styleElement = null;

  const runStart = () => {

    if (styleElement) return;

    styleElement = document.createElement('style');

    document.head.appendChild(styleElement).textContent = `




    
    html {
        --min-preview-size: 128px;
    }

    @media all and (min-width: 792px) {

        html {

            --min-preview-size: 192px;
        }
    }
    .feed-subscriptions ytd-rich-grid-row #contents.ytd-rich-grid-row[class]{
        display:flex;
        flex-direction:column;
    }

    .feed-subscriptions ytd-rich-item-renderer.ytd-rich-grid-row[class]{
        width:100%;
        margin: 4px;

        display: flex;
        justify-content: center;
    }


    ytd-rich-grid-media[media-base-video-id] {
        max-width: initial;
        flex: 0;
        flex-basis: 200px;
        max-width: initial;
    }


    ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible {
        justify-content: center;
        display: flex;
        flex-direction: row;

        column-gap: 8px;
        flex-wrap: wrap;


        flex-direction: column;

        flex-wrap: nowrap;

        
        min-width: min-content;
        
        justify-content: flex-start;

    }


    ytd-rich-grid-media[media-base-video-id] #avatar-link.ytd-rich-grid-media {
        margin: 0;
        padding: 0;
    }

    ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible > #thumbnail {

        width: 32vw;
        margin: 2px;
        height: min-content;
        flex-shrink: 1;
    }

    ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible > #details {
        padding: 0;
        display: flex;
        flex-direction: column;



    }

    ytd-rich-grid-media[media-base-video-id] #details.ytd-rich-grid-media.no-pointer {
        cursor: initial;
    }


    ytd-rich-grid-media[media-base-video-id] #interaction.ytd-rich-grid-media {
        display: none;
    }

    ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#details {
        width: auto;
        max-width: 390px;
    }


    ytd-rich-grid-media[media-base-video-id] #video-title.ytd-rich-grid-media[class] {
        -webkit-line-clamp: 3;
        max-height: initial;
        white-space: break;
    }

    ytd-rich-grid-media[media-base-video-id] #video-title.ytd-rich-grid-media[class],
    ytd-rich-grid-media[media-base-video-id] #video-title.ytd-rich-grid-media[class] yt-formatted-string {


        white-space: pre-wrap;
        word-break: keep-all;

        font-family: "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック体, YuGothic, sans-serif;
        font-size: 14px;
        line-height: 1.5em;
    }

    ytd-rich-grid-media[media-base-video-id] ytd-menu-renderer.ytd-rich-grid-media {
        margin-top: 48px;
        right: 6px;
    }



    ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#attached-survey {
        display: none;
    }

    ytd-rich-grid-media[media-base-video-id] + ytd-channel-subscriptions {
        display: flex;
    }

    ytd-rich-grid-media[media-base-video-id]:last-child {
        display: none;
    }



    ytd-rich-grid-media[media-base-video-id] #avatar-link {

        position: absolute;
        top: 14px;
        left: -45px;
    }

    ytd-rich-grid-media[media-base-video-id] ytd-video-meta-block {

        display: inline-block;
    }
    ytd-rich-grid-media[media-base-video-id] #meta.ytd-rich-grid-media {


        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        column-gap: 16px;

        padding: 0;
        margin: 0;
        margin-bottom: 30px;
        
        min-width: 290px;

    }


    ytd-rich-grid-media[media-base-video-id] ytd-video-meta-block.grid #metadata.ytd-video-meta-block {

        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 16px;
        row-gap: 4px;
    }


    ytd-rich-grid-media[media-base-video-id] {
        margin-left: 52px;
    }

    ytd-rich-grid-media[media-base-video-id] .title-badge.ytd-rich-grid-media,
    ytd-rich-grid-media[media-base-video-id] .video-badge.ytd-rich-grid-media {
        margin: 0
    }

    ytd-rich-grid-media[media-base-video-id] ytd-video-meta-block.grid {

        flex-basis: 66%;
    }



    ytd-channel-subscriptions {

        min-width: calc( var(--min-preview-size) + 38px);

        flex-direction: row;
        flex-wrap: wrap;
        flex: 0;
        min-height: 100%;
        height: 0;
        overflow: auto;
        overscroll-behavior: none;
        gap: 4px;

        scroll-snap-type: y proximity;
        scroll-snap-stop: always;

        display: none;

        align-content: flex-start;
        box-sizing: content-box;

        flex-basis: 260px;
    }


    ytd-channel-subscriptions::-webkit-scrollbar {
        width: 16px;
    }
    ytd-channel-subscriptions::-webkit-scrollbar-thumb {
        height: 56px;
        border-radius: 8px;
        border: 4px solid transparent;
        background-clip: content-box;
        background-color: var(--yt-spec-text-secondary);
    }
    ytd-channel-subscriptions::-webkit-scrollbar-thumb {
        height: 56px;
        border-radius: 8px;
        border: 4px solid transparent;
        background-clip: content-box;
        background-color: hsl(0, 0%, 67%);
    }



    ytd-channel-subscription {

        display: block;

        width: var(--min-preview-size);
        height: calc( var(--min-preview-size) / 16 * 9);


        background-repeat: no-repeat;
        background-size: contain;


        scroll-snap-align: center;

        cursor: pointer;

        margin-left: 16px;

        min-width: var(--min-preview-size);
    }

    ytd-channel-subscription:only-child {
        visibility: hidden;
    }

    ytd-channel-subscription[video-type="upcoming"] {
        filter: brightness(0.8);
        background-color: #bdbdbd80;
        background-blend-mode: overlay;
        box-shadow: 0px 0px 2px 3px #ffffffee inset;
        order: 1;
    }


    ytd-channel-subscription[video-type="published"] {
        filter: brightness(0.5);
        background-blend-mode: overlay;
        background-color: #53535380;
        order: 3;
    }

    ytd-channel-subscription[video-type="live-now"] {

        filter: brightness(0.9);
        box-shadow: 0px 0px 2px 3px #ff0000ee inset;
        order: 2;
    }



    ytd-channel-subscription:hover {
        filter: brightness(0.99);
    }



    ytd-channel-subscription.selected::before {
        content: '';
        display: block;
        position: absolute;
        background: transparent;
        top: 50%;
        left: -16px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 5px 0 5px 10px;
        border-color: transparent transparent transparent var(--yt-spec-text-primary);
    }


        ytd-channel-subscriptions {
            flex-basis: 16px;

            }


        ytd-rich-grid-media[media-base-video-id] {

        max-width:max-content;

        }

    @media all and (min-width: 1010px) {


        ytd-rich-grid-media[media-base-video-id] {


            margin-left: 0;
            max-width: max-content;
            flex-basis: 70%;
            flex-grow: 3;

            flex-basis: 200px;
        }

        ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible{
            
            
            align-items: center;
        }

        ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#details {
            width: auto;
            min-width: 390px;
            max-width: 468px;
            align-self: stretch;


        }



        ytd-rich-grid-media[media-base-video-id] #meta.ytd-rich-grid-media {




            margin-bottom: 0px;


        }

        ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible > #details {
            padding: 26px 8px;
        }



        ytd-rich-grid-media[media-base-video-id] ytd-video-meta-block {

            display: flex;
        }



        ytd-rich-grid-media[media-base-video-id] #avatar-link {

            position: static;
            left: auto;
        }


        ytd-channel-subscriptions { 
            max-width: 460px;
        }
        
        
    ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible > #thumbnail {

        width: 360px;
        flex-shrink: 0;
    }

        
        
        .feed-subscriptions #content.ytd-rich-item-renderer{

            flex:1;
            width:100%;
            max-width: 1340px;
        }

        
        ytd-rich-grid-media[media-base-video-id] {



        max-width: initial;
        }



    ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible > #details {



        min-width: 200px;
        max-width: 480px;


    }

      ytd-rich-grid-media[media-base-video-id] .ytd-rich-grid-media#dismissible {

        flex-direction: row;
          flex-wrap: nowrap;
      }


        ytd-channel-subscriptions {
            flex-grow: 1;
            min-height: 220px;

        }

    }


    @media all and (min-width: 1313px) {

        ytd-channel-subscriptions {
                flex-basis: 260px;
        }



    }




    `
  }

  (async () => {

    await Promise.all([
      customElements.whenDefined('ytd-rich-grid-renderer'),
      customElements.whenDefined('ytd-rich-grid-media'),
      customElements.whenDefined('ytd-rich-item-renderer'),
    ]);

    let dummy = document.createElement('ytd-rich-grid-media');

    let cProto = (dummy.inst || dummy).constructor.prototype;

    cProto.onDetailsClick49 = cProto.onDetailsClick;
    cProto.onDetailsClick = function () {

      if (!proxy.isFeedSubscriptions) return this.onDetailsClick49.apply(this, arguments);

    }

    cProto.setTargetData = function (newVideoId) {
      const hostElement = this.hostElement;
      const baseVideoId = hostElement.getAttribute('media-base-video-id');
      const ownerId = hostElement.getAttribute('media-owner-id');

      if (!baseVideoId || !ownerId) return;
      const currentVideoId = hostElement.getAttribute('data-selected-video-id');
      if (!currentVideoId) {


        let q = document.querySelector(`ytd-channel-subscription[data-video-id="${baseVideoId}"]`);
        for (const p of q.parentNode.querySelectorAll('.selected')) p.classList.remove('selected');
        q.classList.add('selected');

        /*
              let q = document.querySelector(`ytd-channel-subscription[data-video-id="${newVideoId}"]`);
              q.parentNode.scrollTop= q.offsetTop - q.offsetHeight/2;
              */

        newVideoId = baseVideoId;

      } else {

        let q = document.querySelector(`ytd-channel-subscription[data-video-id="${currentVideoId}"]`);

        if (q && !q.classList.contains('selected')) {


          for (const p of q.parentNode.querySelectorAll('.selected')) p.classList.remove('selected');

          q.classList.add('selected');
          hostElement.removeAttribute('data-selected-video-id')
          newVideoId = newVideoId || currentVideoId;
        }


      }



      if (!newVideoId) return;
      newVideoId = `${newVideoId}`;

      Promise.resolve().then(() => {
        const hostElement = this.hostElement;

        if (hostElement.getAttribute('data-selected-video-id') !== newVideoId) {


          hostElement.setAttribute('data-selected-video-id', newVideoId);

          const videoMedia = document.querySelector(`ytd-rich-grid-media[media-base-video-id="${newVideoId}"]`)


          let videoMediaData = videoMedia ? dm.get(videoMedia) : null;

          if (videoMediaData && videoMediaData.videoId === newVideoId && this.data._c72_ && videoMediaData._c72_ && videoMediaData.videoId !== this.data._c72_.vid) {
            this.data = Object.assign({}, videoMediaData);
          }




          let q = document.querySelector(`ytd-channel-subscription[data-video-id="${newVideoId}"]`);
          for (const p of q.parentNode.querySelectorAll('.selected')) p.classList.remove('selected');
          q.classList.add('selected');


          q.parentNode.scrollTop = q.offsetTop - q.offsetHeight / 2;

        }







      })
      // q.scrollIntoView();
    }

    cProto.onDetailsClick._c49_ = 1;

    cProto.__fixPanel__ = function () {

      const _c72_ = ((this || 0).data || 0)._c72_ || 0;
      if (!_c72_) return;
      const media = this.hostElement;
      let ytParentComponent = (media.inst || media).parentComponent;
      if (ytParentComponent) {
        ytParentComponent = ytParentComponent.inst || ytParentComponent;
        ytParentComponent.hostElement.removeAttribute('hidden');
      }
      let elem = wm.get(_c72_);
      if (elem) {

        media.parentNode.insertBefore(elem, media.nextSibling);


      } else {



        let div = document.createElement('ytd-channel-subscriptions');

        media.parentNode.insertBefore(div, media.nextSibling);

        wm.set(_c72_, div);






      }



      pendingChannels.add(_c72_.cid);




      let tid = ++m67t;
      foregroundPromiseFn().then(() => {
        if (tid !== m67t) return;
        proceedChannels();
      });




    }

    cProto.attached49 = cProto.attached;

    cProto.attached = function () {



      if (!proxy.isFeedSubscriptions && location.pathname === '/feed/subscriptions') proxy.isFeedSubscriptions = true;

      if (!proxy.isFeedSubscriptions) return this.attached49.apply(this, arguments);


      if (!this.hostElement) return this.attached49();
      if (this.hostElement && typeof this.hostElement.onDataChanged === 'function' && !this.hostElement.onDataChanged._c49_) {
        this.hostElement.onDataChanged = this.onDataChanged.bind(this);
        this.hostElement.onDataChanged._c49_ = 1;
      }


      if (this.hostElement && typeof this.hostElement.onDetailsClick === 'function' && !this.hostElement.onDetailsClick._c49_) {
        this.hostElement.onDetailsClick = this.onDetailsClick.bind(this);
        this.hostElement.onDetailsClick._c49_ = 1;
      }


      if (!runStarted) {

        runStarted = 1;
        runStart();
      }

      if (!this.hostElement._m51_) {
        this.hostElement._m51_ = true;
        let details = HTMLElement.prototype.querySelector.call(this.hostElement, '#details');
        if (details) {

          details.classList.add('no-pointer');


        }

        mo2.observe(this.hostElement.parentNode, { subtree: false, childList: true });



      }




      this.attached49();

    }

    /*
    cProto.detached49 =cProto.detached
    cProto.detached = function(){
      const data = this.data || 0;
      if(data){
  
        let browseId = null;
        try{
  
          browseId = data.ownerText.runs[0].navigationEndpoint.browseEndpoint.browseId
        }catch(e){}
  
        if(browseId){
  
          pendingChannels.add(browseId)
          foregroundPromiseFn().then(proceedChannels)
  
  
        }
  
      }
    }
    */

    cProto.dc01 = function () {

      const data = this.data || 0;
      if (data) {


        if (data.thumbnail && data.thumbnail.thumbnails) {
          let thumbnails = data.thumbnail.thumbnails;
          if (thumbnails.length > 1) {
            let u = -1;
            for (const tn of thumbnails) {
              let z = Math.round(tn.width * tn.height);
              if (z > u) u = z;
            }
            thumbnails = thumbnails.filter(e => Math.round(e.width * e.height) === u);
            if (thumbnails.length > 1) thumbnails.length = 1;
            data.thumbnail.thumbnails = thumbnails;
          }
        }
      }

    }


    let fetchedType = false;

    document.addEventListener('yt-page-data-fetched', (evt) => {


      if (evt && evt.detail) {

        const detail = evt.detail;

        if (detail.pageData && detail.pageData.page && detail.pageData.url) {
          if (detail.pageData.page === 'browse' && detail.pageData.url === '/feed/subscriptions') {
            proxy.isFeedSubscriptions = true;
          } else {
            proxy.isFeedSubscriptions = false;
          }
          fetchedType = true;
          console.log(proxy.isFeedSubscriptions)
        }

      }
    });



    document.addEventListener('yt-navigate-finish', () => {

      proxy.isFeedSubscriptions = location.pathname === '/feed/subscriptions';

      console.log(proxy.isFeedSubscriptions)

      /*
  
      if(!proxy.isFeedSubscriptions){
  
  
      for(const s of document.querySelectorAll('ytd-rich-grid-row #contents.ytd-rich-grid-row[class], ytd-rich-item-renderer.ytd-rich-grid-row[class]')){
  
        s.classList.remove('feed-subscriptions');
  
  
      }
  
        return;
      }
  
      for(const s of document.querySelectorAll('ytd-rich-grid-row #contents.ytd-rich-grid-row[class], ytd-rich-item-renderer.ytd-rich-grid-row[class]')){
  
  
        s.classList.add('feed-subscriptions');
  
  
      }
      */

      for (const media of document.querySelectorAll('ytd-rich-grid-media:not([media-base-video-id])')) {

        let selectedBox = media.parentNode.querySelector('ytd-channel-subscription.selected');


        let baseData = media.data;

        if (selectedBox) {



          let baseData = media.data;
          let selectedData = dm.get(selectedBox);
          if (baseData && selectedData && baseData._c72_ && selectedData._c72_ && baseData._c72_ === selectedData._c72_) {
            let w = baseData._c72_;
            media.setAttribute('media-base-video-id', w.vid)
            media.setAttribute('media-owner-id', w.cid)


            media.setAttribute('data-selected-video-id', w.vid)


            dm.set(media, baseData)

          } else if (baseData && selectedData && baseData._c72_ && selectedData._c72_ && baseData._c72_ !== selectedData._c72_) {
            let w = baseData._c72_;
            media.setAttribute('media-base-video-id', w.vid)
            media.setAttribute('media-owner-id', w.cid);



            media.setAttribute('data-selected-video-id', selectedData._c72_.vid)
            media.data = Object.assign({}, selectedData)

            dm.set(media, baseData)

          }

          /*
          if(baseData){
  
  
            pendingChannels.add(baseData.cid);
            let tid = ++m67t;
            foregroundPromiseFn().then(()=>{
              if(tid!==m67t) return;
              proceedChannels();
            });
          }
          */

        }

      }



      for (const media of document.querySelectorAll('ytd-rich-grid-media:not([media-base-video-id])')) {

        let baseData = media.data;




        if (baseData) {

          let w = baseData._c72_;

          if (w) {
            media.setAttribute('media-base-video-id', w.vid)
            media.setAttribute('media-owner-id', w.cid)

            dm.set(media, baseData)
          }

        }



      }


    })


    cProto.dc02 = function () {


      const data = this.data || 0;


      const media = this.hostElement;





      let browseId = null;
      try {
        browseId = data.owner.navigationEndpoint.browseEndpoint.browseId
      } catch (e) { }

      let videoId = null;


      try {
        videoId = data.videoId;
      } catch (e) { }



      if (data && browseId && videoId && !data._c72_) {



        data._c72_ = {};
        dm.set(media, data);


        data._c72_.vid = videoId || ''
        data._c72_.cid = browseId || ''

        pendingChannels.add(browseId);
        let tid = ++m67t;
        foregroundPromiseFn().then(() => {
          if (tid !== m67t) return;
          proceedChannels();
        });

        media.setAttribute('media-base-video-id', videoId || '');


        media.setAttribute('media-owner-id', browseId || '');

      }


      if (!videoId || !browseId) {

        media.removeAttribute('media-base-video-id');


        media.removeAttribute('media-owner-id');

      } else if (!media.getAttribute('media-base-video-id') || !media.getAttribute('media-owner-id')) {


        /*
        let box = document.querySelector(`[data-channel-id="${browseId}"][data-video-id="${videoId}"]`);
  
        console.log(123100, box)
        if(box){
          let boxC72 = ((dm.get(box)||0)||0)._c72_||0;
          let thisC72 = (this.data||0)._c72_;
          console.log(123200, boxC72, thisC72,  boxC72 === thisC72)
          if(boxC72 && thisC72 && boxC72 === thisC72){
  
                media.setAttribute('media-base-video-id',videoId );
               media.setAttribute('media-owner-id',  browseId );
          }else if(boxC72 && thisC72 && boxC72 !== thisC72){
  
            let baseVideo = box.parentNode.querySelector('.selected');
            let baseVideoId = baseVideo ? baseVideo.getAttribute('data-video-id') : '';
  
            if(baseVideoId){
  
                media.setAttribute('media-base-video-id',baseVideoId );
  
                media.setAttribute('data-selected-video-id',videoId );
               media.setAttribute('media-owner-id',  browseId );
            }
  
  
  
          }
        }
        */




      }


      if (data && data._c72_ && !this.hostElement.parentNode.querySelector('ytd-channel-subscriptions')) {


        this.__fixPanel__();

      }

    }

    cProto.onDataChanged49 = cProto.onDataChanged;

    cProto.onDataChanged = function () {


      if (!proxy.isFeedSubscriptions && location.pathname === '/feed/subscriptions') proxy.isFeedSubscriptions = true;

      // if(location.pathname!=='/feed/subscriptions') return this.onDataChanged49.apply(this, arguments);
      this.dc01();



      let r = this.onDataChanged49.apply(this, arguments);

      this.dc02();




      return r;

    }

    cProto.onDataChanged._c49_ = 1;






    dummy = document.createElement('ytd-rich-grid-renderer');

    cProto = (dummy.inst || dummy).constructor.prototype;


    cProto._triggerFeedSubscriptions = function () {



      if (!fetchedType && !proxy.isFeedSubscriptions && location.pathname === '/feed/subscriptions') proxy.isFeedSubscriptions = true;

      if (this.hostElement) {
        this.hostElement.classList.toggle('feed-subscriptions', proxy.isFeedSubscriptions)
        if (styleElement && proxy.isFeedSubscriptions && !styleElement.parentNode) document.head.appendChild(styleElement);
        else if (styleElement && !proxy.isFeedSubscriptions && styleElement.parentNode) (styleElement).remove();


      }
    }

    cProto.attached59 = cProto.attached;
    cProto.attached = function () {

      this._triggerFeedSubscriptions();
      return this.attached59();
    }


    cProto.refreshGridLayout49 = cProto.refreshGridLayout;
    cProto.refreshGridLayout = function () {

      this._triggerFeedSubscriptions();
      // console.log(552, proxy.isFeedSubscriptions)
      if (!proxy.isFeedSubscriptions) return this.refreshGridLayout49.apply(this, arguments);

    }

    cProto.calcElementsPerRow49 = cProto.calcElementsPerRow;

    cProto.calcElementsPerRow = function () {

      this._triggerFeedSubscriptions();
      if (!proxy.isFeedSubscriptions) return this.calcElementsPerRow49.apply(this, arguments);

    }



  })();

})();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址