Chaturbate chat "pop-out" Chrome extension available for broadcasters...

[alyxxandmsstarzz]

Hello there! For anyone looking for a way to isolate a fully functional chaturbate broadcaster chat "pop-out" including PM, User, and Settings tabs, I developed a chrome extension for just that... and it works even beter when paired with "Zoom Per Tab"

This would make it possible to make chat more neatly and easliy readablevfrom any device; a tablet or possibly phone even, but can still be utilized by computer monitors and/or TV's. Just message me here if you're interested and if enough of you are, I will make it a point to share it with you all. Donations and/or followers on our CB page would be greatly appreciated! Alyxxandmsstarzz is our handle. Thanks!

 

[cbhours]

I think you'll find that people generally aren't that trusting and would prefer for you to publicly share the details in this thread, like screenshots, link to extension, etc so everyone can take a look at it and make sure it's safe.

 

[KingMarti]

I think you'll find that people generally aren't that trusting and would prefer for you to publicly share the details in this thread, like screenshots, link to extension, etc so everyone can take a look at it and make sure it's safe.

Also code (especially code) since last time I checked browser extensions have access to everything that is displayed in a browser on any page including text input.

 

[alyxxandmsstarzz]

All files can be looked at or unpacked nothing malicious im not trying to sell anything I just think somebody would like this feature as I tried looking everywhere myself for it, lol.

 

[alyxxandmsstarzz]

I think you'll find that people generally aren't that trusting and would prefer for you to publicly share the details in this thread, like screenshots, link to extension, etc so everyone can take a look at it and make sure it's safe.

I definetly will do that soon.

 

[cbhours]

All files can be looked at or unpacked nothing malicious im not trying to sell anything I just think somebody would like this feature as I tried looking everywhere myself for it, lol.

I have this https://www.cbhours.com/eyecontact.php but you can't use it to respond

 

[alyxxandmsstarzz]

I have this https://www.cbhours.com/eyecontact.php but you can't use it to res

ok yeah see I figured some of us would be interested in a fully functional chat display. I was able to keep messaging and the other tabs functional. PM, users, settings... I just want to intergrate zoom per tab function before I share. Essentially it just removes all the other elements from the broadcaster page leaving the chat tab and the other tabs and allows independant zoom so you can have the chat on its own but still have the default page up if needed and have independant zoom function. This way if you are using TVs or large monitors, you are able to zoom in and have the word wrap function. I am nearly done and will make a video on YT showing how it works

 

[alyxxandmsstarzz]

I have this https://www.cbhours.com/eyecontact.php but you can't use it to respond.

I definetly will do that soon.

Demostration Video and the unpacked files for the extension, for all:

 

[alyxxandmsstarzz]

I've attached all the files needed and included a demonstration video. Hope this works for everyone. This could make it possible to monitor chat on phones, tablets etc...

 

[alyxxandmsstarzz]

I've attached all the files needed and included a demonstration video. Hope this works for everyone. This could make it possible to monitor chat on phones, tablets etc...

Alternatively you can paste this in Chromes Dev Tools Console and it will do the chat only effect without the chrome extension. Go to your CB broadcast page Right-click on any area (chat box) and click inspect. Navigate to the console tab and allow pasting, then paste this:

document.querySelector(".BroadcastVideoPanel")?.remove();
document.getElementById("footer-holder")?.remove();
document.querySelector('[data-testid="room-tab-bar"]')?.remove();
document.querySelector(".appsTab")?.remove();

async function setElementStyles(el, styles) {
for (const [key, value] of Object.entries(styles)) {
el.style[key] = value;
}
}

const chatTabContainer = document.querySelector("#ChatTabContainer");
const body = document.body;
const html = document.documentElement;

setElementStyles(chatTabContainer, {
position: "fixed",
top: "0",
left: "0",
width: "100vw",
height: "100vh",
margin: "0",
overflow: "auto",
});

setElementStyles(body, {
position: "fixed",
top: "0",
left: "0",
width: "100vw",
height: "100vh",
margin: "0",
overflow: "hidden",
});

setElementStyles(html, {
overflow: "hidden",
});

 

[alyxxandmsstarzz]

Updated dev tools console code for "chat pop-out".
removed interfering element and added remove/restore function to the "user info" box.



//paste in console:

document.querySelector(".BroadcastVideoPanel")?.remove();
document.getElementById("footer-holder")?.remove();
document.querySelector('[data-testid="room-tab-bar"]')?.remove();
document.querySelector(".appsTab")?.remove();
document.querySelector('.scanNext')?.remove();

async function setElementStyles(el, styles) {
for (const [key, value] of Object.entries(styles)) {
el.style[key] = value;
}
}

const chatTabContainer = document.querySelector("#ChatTabContainer");
const body = document.body;
const html = document.documentElement;

setElementStyles(chatTabContainer, {
position: "fixed",
top: "0",
left: "0",
width: "100vw",
height: "100vh",
margin: "0",
overflow: "auto",
});

setElementStyles(body, {
position: "fixed",
top: "0",
left: "0",
width: "100vw",
height: "100vh",
margin: "0",
overflow: "hidden",
});

setElementStyles(html, {
overflow: "hidden",
});

// Create a new X button
var closeButton = document.createElement('button');
closeButton.innerHTML = 'X';
closeButton.style.position = 'absolute';
closeButton.style.top = '2.499px';
closeButton.style.left = '167px'; // Move a little to the left
closeButton.style.backgroundColor = 'red';
closeButton.style.color = 'white';
closeButton.style.border = 'none';
closeButton.style.fontSize = '7.2px'; // 10% smaller than 8px
closeButton.style.padding = '4.5px 9px'; // Adjust padding accordingly
closeButton.style.cursor = 'pointer';
closeButton.style.zIndex = '1001';

// Append the X button to the user information element
var userInfo = document.getElementById('user_information');
if (userInfo) {
userInfo.style.position = 'relative'; // Ensures the button is positioned relative to the user information container
userInfo.appendChild(closeButton);

// Add an event listener to remove the element when the X button is clicked
closeButton.addEventListener('click', function() {
userInfo.style.display = 'none'; // Hide the element instead of removing it

// Create a restore button
var restoreButton = document.createElement('button');
restoreButton.innerHTML = 'Restore';
restoreButton.style.position = 'fixed';
restoreButton.style.top = '0px'; // Align to the very top of the page
restoreButton.style.right = '10px'; // Place at the top right
restoreButton.style.backgroundColor = 'green';
restoreButton.style.color = 'white';
restoreButton.style.border = 'none';
restoreButton.style.fontSize = '10px'; // Increase by 25% from 8px
restoreButton.style.padding = '8px 15px'; // Adjust padding to match the larger size
restoreButton.style.cursor = 'pointer';
restoreButton.style.zIndex = '1001';

// Append the restore button to the body
document.body.appendChild(restoreButton);

// Add an event listener to restore the user information element
restoreButton.addEventListener('click', function() {
userInfo.style.display = 'block'; // Show the user information element
restoreButton.remove(); // Remove the restore button
});
});
} else {
console.log('User information element not found');
}

 

[alyxxandmsstarzz]

Updated: removed more interfering elements when using rotated monitor:


document.querySelector(".BroadcastVideoPanel")?.remove();
document.getElementById("footer-holder")?.remove();
document.querySelector('[data-testid="room-tab-bar"]')?.remove();
document.querySelector(".appsTab")?.remove();
document.querySelector('.scanNext')?.remove();
document.getElementById("shareTab")?.remove();
document.querySelector('[data-testid="room-bio-tab-contents"]')?.remove();

async function setElementStyles(el, styles) {
for (const [key, value] of Object.entries(styles)) {
el.style[key] = value;
}
}

const chatTabContainer = document.querySelector("#ChatTabContainer");
const body = document.body;
const html = document.documentElement;

setElementStyles(chatTabContainer, {
position: "fixed",
top: "0",
left: "0",
width: "100vw",
height: "100vh",
margin: "0",
overflow: "auto",
});

setElementStyles(body, {
position: "fixed",
top: "0",
left: "0",
width: "100vw",
height: "100vh",
margin: "0",
overflow: "hidden",
});

setElementStyles(html, {
overflow: "hidden",
});

// Create a new X button
var closeButton = document.createElement('button');
closeButton.innerHTML = 'X';
closeButton.style.position = 'absolute';
closeButton.style.top = '2.49px';
closeButton.style.left = '167px'; // Move a little to the left
closeButton.style.backgroundColor = 'red';
closeButton.style.color = 'white';
closeButton.style.border = 'none';
closeButton.style.fontSize = '7.2px'; // 10% smaller than 8px
closeButton.style.padding = '4.5px 9px'; // Adjust padding accordingly
closeButton.style.cursor = 'pointer';
closeButton.style.zIndex = '1001';

// Append the X button to the user information element
var userInfo = document.getElementById('user_information');
if (userInfo) {
userInfo.style.position = 'relative'; // Ensures the button is positioned relative to the user information container
userInfo.appendChild(closeButton);

// Add an event listener to remove the element when the X button is clicked
closeButton.addEventListener('click', function() {
userInfo.style.display = 'none'; // Hide the element instead of removing it

// Create a restore button
var restoreButton = document.createElement('button');
restoreButton.innerHTML = 'Restore';
restoreButton.style.position = 'fixed';
restoreButton.style.top = '0px'; // Align to the very top of the page
restoreButton.style.right = '10px'; // Place at the top right
restoreButton.style.backgroundColor = 'green';
restoreButton.style.color = 'white';
restoreButton.style.border = 'none';
restoreButton.style.fontSize = '10px'; // Increase by 25% from 8px
restoreButton.style.padding = '8px 15px'; // Adjust padding to match the larger size
restoreButton.style.cursor = 'pointer';
restoreButton.style.zIndex = '1001';

// Append the restore button to the body
document.body.appendChild(restoreButton);

// Add an event listener to restore the user information element
restoreButton.addEventListener('click', function() {
userInfo.style.display = 'block'; // Show the user information element
restoreButton.remove(); // Remove the restore button
});
});
} else {
console.log('User information element not found');
}