Vignette Animée Chaturbate

Anime le vignette d'une salle Chaturbate au survol de la souris

Version au 22/09/2021. Voir la dernière version.

Vous devrez installer une extension telle que Tampermonkey, Greasemonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Violentmonkey pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey ou Userscripts pour installer ce script.

Vous devrez installer une extension telle que Tampermonkey pour installer ce script.

Vous devrez installer une extension de gestionnaire de script utilisateur pour installer ce script.

(J'ai déjà un gestionnaire de scripts utilisateur, laissez-moi l'installer !)

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension telle que Stylus pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

Vous devrez installer une extension du gestionnaire de style pour utilisateur pour installer ce style.

(J'ai déjà un gestionnaire de style utilisateur, laissez-moi l'installer!)

// ==UserScript==
// @name            Chaturbate Animate Thumbnail
// @name:de         Chaturbate Miniaturansicht Animieren
// @name:fr         Vignette Animée Chaturbate
// @name:it         Miniatura Animata Chaturbate
// @author          iXXX94
// @namespace       https://sleazyfork.org/users/809625-ixxx94
// @icon            https://www.google.com/s2/favicons?sz=64&domain=chaturbate.org
// @description     Animated the thumbnail of a Chaturbate room on mouse hover
// @description:de  Animieren die miniaturansicht eines Chaturbate-raums beim maus über
// @description:fr  Anime le vignette d'une salle Chaturbate au survol de la souris
// @description:it  Animata la miniatura di una stanza Chaturbate al passaggio del mouse
// @copyright       2021, iXXX94 (https://sleazyfork.org/users/809625-ixxx94)
// @license         MIT
// @version         1.4.0
// @homepageURL     https://sleazyfork.org/scripts/431581-chaturbate-animate-thumbnail
// @homepage        https://sleazyfork.org/scripts/431581-chaturbate-animate-thumbnail
// @supportURL      https://sleazyfork.org/scripts/431581-chaturbate-animate-thumbnail/feedback
// @require         https://cdn.jsdelivr.net/npm/[email protected]
// @require         https://cdn.jsdelivr.net/npm/@violentmonkey/[email protected]
// @match           *://*.chaturbate.com/*
// @exclude-match   *://status.chaturbate.com/*
// @exclude-match   *://support.chaturbate.com/*
// @run-at          document-idle
// @inject-into     page
// ==/UserScript==

/* global $, VM */

(() => {
  VM.observe(document.body, () => {
    const rooms = $('#discover_root .room_list_room, #room_list .room_list_room, #broadcasters .room_list_room, .followedContainer .roomElement')

    if (rooms.length > 0) { // if rooms exists
      $('#room_list') // to be able to scale, on room list
        .css('display', 'inline-flex')
        .css('overflow', 'visible')
        .css('white-space', 'nowrap')
        .css('align-content', 'flex-start')
        .css('justify-content', 'flex-start')
        .css('align-items', 'flex-start')
        .css('position', 'relative')
        .css('left', '0')
        .css('flex-wrap', 'wrap')
      $('#room_list .room_list_room')
        .css('transition', 'transform .1s ease-in-out')
      $('.isIpad #room_list .room_list_room *, #broadcasters .room_list_room *')
        .css('user-select', 'none')
        .css('-webkit-touch-callout', 'none')

      $(rooms).each((index, element) => { // for each room
        let timer
        const name = $(element).find('> a').data('room') ? $(element).find('> a').data('room') : $(element).find('> .user-info > .username > a').text().replace(/^\s/g, '')
        const thumbnail = $(element).find('> a img')

        $(element)
          .bind('pointerdown', (event) => {
            element.releasePointerCapture(event.pointerId)
          })
          .bind('pointerenter', (event) => { // start
            if ($(element).parent('#room_list').length > 0) { // scale only on room list
              $(element)
                .css('transform-origin', 'center center')
                .css('transform', 'translateX(0px) scale(1.2)')
                .css('z-index', '999')
            }

            timer = setInterval(() => { // animate thumbnail
              $(thumbnail)
                .attr('src', `https://cbjpeg.stream.highwebmedia.com/minifwap/${name}.jpg?f=${Date.now()}`)
            }, event.pointerType === 'touch' ? 166 : 83)
          })
          .bind('pointerup pointerleave', (event) => { // stop
            if ($(element).parent('#room_list').length > 0) { // scale only on room list
              $(element)
                .css('transform-origin', 'center center')
                .css('transform', 'translateX(0px) scale(1)')
                .css('z-index', '0')
            }

            clearInterval(timer) // stop animate thumbnail
            timer = undefined
          })
      })

      return false
    }
  })
})()