mirror of
https://github.com/nuttylmao/nutty.gg.git
synced 2026-09-19 04:00:59 -04:00
Lots of stuff, can't remember lol
This commit is contained in:
@@ -4,17 +4,26 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" href="../../.resources/logo.png" type="image/png">
|
||||
<title>Settings</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<script type="text/javascript" src="https://unpkg.com/@streamerbot/client/dist/streamerbot-client.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="pinned-header">
|
||||
<div style="display: flex; align-items: center; padding-bottom: 20px;">
|
||||
<img src="../../.resources/logo.png" style="height: 40px;"/>
|
||||
<button style="display: flex; width: auto; margin-left: auto; background: var(--accent-color);" onclick="OpenMembershipPage()">Check out my premium widgets</button>
|
||||
</div>
|
||||
<h2>Widget URL</h2>
|
||||
<input id="widget-url" type="text" readonly>
|
||||
<button id="save-settings">Click to copy URL</button>
|
||||
<button onclick="OpenMembershipPage()">💎 Member Exclusive Widgets</button>
|
||||
<div style="display: flex; gap: 10px;">
|
||||
<button id="save-settings">Click to copy URL</button>
|
||||
<button onclick="OpenLoadSettingsPopup()">Load Settings</button>
|
||||
</div>
|
||||
<!-- <button onclick="OpenMembershipPage()">💎 Member Exclusive Widgets</button> -->
|
||||
</div>
|
||||
|
||||
<div id="settings-container">
|
||||
@@ -24,7 +33,8 @@
|
||||
|
||||
<div id="mommy-milkers">
|
||||
<div id="load-settings-container">
|
||||
<h2>Load Settings From Widget URL</h2>
|
||||
<h2>Load Settings</h2>
|
||||
<label style="font-size: 0.8em;">Paste in your existing widget URL</label>
|
||||
<input id="load-url" type="text">
|
||||
<div style="display: flex;">
|
||||
<button id="cancel-settings" onclick="CloseSettings()">Cancel</button>
|
||||
|
||||
@@ -1,14 +1,52 @@
|
||||
// Search paramaters
|
||||
const queryString = window.location.search;
|
||||
const urlParams = new URLSearchParams(queryString);
|
||||
|
||||
const settingsJson = urlParams.get("settingsJson") || "";
|
||||
|
||||
// Connect to Streamer.bot and get list of actions
|
||||
const sbServerAddress = '127.0.0.1';
|
||||
const sbServerPort = '8080';
|
||||
const client = new StreamerbotClient({
|
||||
host: sbServerAddress,
|
||||
port: sbServerPort,
|
||||
|
||||
onConnect: (data) => {
|
||||
console.log(`Streamer.bot successfully connected to ${sbServerAddress}:${sbServerPort}`)
|
||||
console.debug(data);
|
||||
|
||||
// Get list of actions
|
||||
GetSBActions();
|
||||
},
|
||||
|
||||
onDisconnect: () => {
|
||||
console.error(`Streamer.bot disconnected from ${sbServerAddress}:${sbServerPort}`)
|
||||
}
|
||||
});
|
||||
|
||||
async function GetSBActions() {
|
||||
const response = await client.getActions();
|
||||
|
||||
console.debug(response);
|
||||
|
||||
const datalistElement = document.createElement('datalist');
|
||||
datalistElement.id = 'streamer-bot-actions';
|
||||
|
||||
for (const action of response.actions)
|
||||
{
|
||||
const option = document.createElement('option');
|
||||
option.value = action.name;
|
||||
datalistElement.appendChild(option);
|
||||
}
|
||||
|
||||
document.body.appendChild(datalistElement);
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
const settingsContent = document.getElementById('settings-content');
|
||||
const saveButton = document.getElementById('save-settings');
|
||||
|
||||
fetch(settingsJson)
|
||||
//fetch('../../multichat-overlay/settings/settings.json')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
const groupedSettings = {};
|
||||
@@ -33,12 +71,15 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
groupedSettings[groupName].forEach(setting => {
|
||||
const settingItem = document.createElement('div');
|
||||
settingItem.classList.add('setting-item');
|
||||
settingItem.id = `item-${setting.id}`;
|
||||
|
||||
const labelDescriptionDiv = document.createElement('div');
|
||||
|
||||
const label = document.createElement('label');
|
||||
label.textContent = setting.label;
|
||||
labelDescriptionDiv.appendChild(label);
|
||||
if (setting.label) {
|
||||
const label = document.createElement('label');
|
||||
label.textContent = setting.label;
|
||||
labelDescriptionDiv.appendChild(label);
|
||||
}
|
||||
|
||||
if (setting.description) {
|
||||
const description = document.createElement('p');
|
||||
@@ -74,6 +115,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
// Add event listener to the switchDiv
|
||||
labelDiv.addEventListener('click', () => {
|
||||
checkBoxElement.checked = !checkBoxElement.checked;
|
||||
UpdateSettingItemVisibility();
|
||||
});
|
||||
inputElement = labelDiv;
|
||||
break;
|
||||
@@ -106,6 +148,37 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
inputElement.max = setting.max;
|
||||
inputElement.step = setting.step;
|
||||
break;
|
||||
case 'sb-actions':
|
||||
inputElement = document.createElement('input');
|
||||
inputElement.type = 'text';
|
||||
inputElement.placeholder = 'Type to search...';
|
||||
inputElement.id = setting.id; //Added setting ID
|
||||
inputElement.value = setting.defaultValue;
|
||||
inputElement.setAttribute('list', 'streamer-bot-actions');
|
||||
inputElement.autocomplete = 'off';
|
||||
break;
|
||||
case 'button':
|
||||
inputElement = document.createElement('button');
|
||||
inputElement.id = setting.id; //Added setting ID
|
||||
inputElement.textContent = setting.label;
|
||||
|
||||
inputElement.addEventListener('click', () => {
|
||||
window.parent.callFunction(setting.callFunction);
|
||||
|
||||
const defaultBackgroundColor = "#2e2e2e";
|
||||
const defaultTextColor = "white";
|
||||
|
||||
inputElement.style.transitionDuration = '0s'
|
||||
inputElement.style.backgroundColor = "#2196f3"
|
||||
inputElement.style.color = "#ffffff";
|
||||
|
||||
setTimeout(() => {
|
||||
inputElement.style.transitionDuration = '0.2s'
|
||||
inputElement.style.backgroundColor = defaultBackgroundColor;
|
||||
inputElement.style.color = defaultTextColor;
|
||||
}, 100);
|
||||
});
|
||||
break;
|
||||
default:
|
||||
inputElement = document.createElement('input');
|
||||
inputElement.type = 'text';
|
||||
@@ -114,30 +187,53 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}
|
||||
|
||||
inputElement.addEventListener('input', function (event) {
|
||||
SendDateToParent(data);
|
||||
SendDataToParent(data);
|
||||
});
|
||||
|
||||
settingItemContent.appendChild(inputElement);
|
||||
|
||||
settingItem.appendChild(labelDescriptionDiv);
|
||||
settingItem.appendChild(settingItemContent);
|
||||
if (setting.type == 'button')
|
||||
{
|
||||
settingItem.style.display = 'block'
|
||||
settingItem.appendChild(settingItemContent);
|
||||
}
|
||||
else
|
||||
{
|
||||
settingItem.appendChild(labelDescriptionDiv);
|
||||
settingItem.appendChild(settingItemContent);
|
||||
}
|
||||
|
||||
groupDiv.appendChild(settingItem);
|
||||
});
|
||||
|
||||
settingsContent.appendChild(groupDiv);
|
||||
}
|
||||
|
||||
function UpdateSettingItemVisibility() {
|
||||
data.settings.forEach(setting => {
|
||||
if (setting.hideIf)
|
||||
{
|
||||
if (!document.getElementById(setting.hideIf).checked)
|
||||
document.getElementById(`item-${setting.id}`).style.display = 'none'
|
||||
else
|
||||
document.getElementById(`item-${setting.id}`).style.display = 'flex'
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
UpdateSettingItemVisibility();
|
||||
|
||||
// saveButton.addEventListener('click', () => {
|
||||
// SendDateToParent(data);
|
||||
// SendDataToParent(data);
|
||||
// });
|
||||
SendDateToParent(data);
|
||||
SendDataToParent(data);
|
||||
})
|
||||
.catch(error => console.error('Error loading settings:', error));
|
||||
});
|
||||
|
||||
|
||||
// In the iframe's JavaScript:
|
||||
function SendDateToParent(data) {
|
||||
function SendDataToParent(data) {
|
||||
const settings = {};
|
||||
data.settings.forEach(setting => {
|
||||
let inputElement = document.getElementById(setting.id);
|
||||
@@ -183,12 +279,6 @@ saveButton.addEventListener('click', () => {
|
||||
}, 3000);
|
||||
});
|
||||
|
||||
widgetURLBox.addEventListener('click', () => {
|
||||
let loadSettingsBox = document.getElementById('mommy-milkers');
|
||||
loadSettingsBox.style.visibility = 'visible';
|
||||
loadSettingsBox.style.opacity = 1;
|
||||
});
|
||||
|
||||
function CloseSettings() {
|
||||
let loadSettingsBox = document.getElementById('mommy-milkers');
|
||||
loadSettingsBox.style.visibility = 'hidden';
|
||||
@@ -198,12 +288,11 @@ function CloseSettings() {
|
||||
function LoadSettings() {
|
||||
let loadURLBox = document.getElementById('load-url');
|
||||
const url = new URL(loadURLBox.value);
|
||||
|
||||
|
||||
url.searchParams.forEach((value, key) => {
|
||||
|
||||
const inputElement = document.getElementById(key);
|
||||
if (inputElement != null)
|
||||
{
|
||||
if (inputElement != null) {
|
||||
if (inputElement.type == 'checkbox')
|
||||
inputElement.checked = value.toLocaleLowerCase() == 'true';
|
||||
else
|
||||
@@ -230,8 +319,15 @@ function GetWidgetURL() {
|
||||
}
|
||||
|
||||
return result;
|
||||
//return 'D:/Projects/GitHub Projects/nutty.gg/multistream-alerts/index.html'
|
||||
}
|
||||
|
||||
function OpenMembershipPage() {
|
||||
window.open("https://nutty.gg/supporters/sign_in", '_blank').focus();
|
||||
window.open("https://nutty.gg/supporters/sign_in", '_blank').focus();
|
||||
}
|
||||
|
||||
function OpenLoadSettingsPopup() {
|
||||
let loadSettingsBox = document.getElementById('mommy-milkers');
|
||||
loadSettingsBox.style.visibility = 'visible';
|
||||
loadSettingsBox.style.opacity = 1;
|
||||
}
|
||||
@@ -2,10 +2,12 @@
|
||||
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
--accent-color: #2196f3;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #181818;
|
||||
margin: 0px 20px;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar {
|
||||
@@ -63,7 +65,7 @@ body::-webkit-scrollbar-thumb:hover {
|
||||
.setting-group {
|
||||
margin-bottom: 20px;
|
||||
/* border: 1px solid #ddd; */
|
||||
padding: 15px;
|
||||
padding-bottom: 15px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
@@ -97,7 +99,7 @@ h2 {
|
||||
font-weight: 300;
|
||||
/* color: #666; */
|
||||
opacity: 0.6;
|
||||
margin-bottom: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
@@ -126,6 +128,7 @@ input[type="number"] {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#widget-url:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -195,11 +198,11 @@ input:focus {
|
||||
}
|
||||
|
||||
input:checked+.slider {
|
||||
background-color: #2196F3;
|
||||
background-color: var(--accent-color);
|
||||
}
|
||||
|
||||
input:focus+.slider {
|
||||
box-shadow: 0 0 1px #2196F3;
|
||||
box-shadow: 0 0 1px var(--accent-color);
|
||||
}
|
||||
|
||||
input:checked+.slider:before {
|
||||
@@ -227,7 +230,7 @@ button {
|
||||
border-radius: 0.5em;
|
||||
padding: 10px 20px;
|
||||
width: 100%;
|
||||
transition: all 0.2s ease;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
@@ -270,5 +273,5 @@ button:hover {
|
||||
}
|
||||
|
||||
#load-settings {
|
||||
background-color: #2196F3;
|
||||
background-color: var(--accent-color);
|
||||
}
|
||||
Reference in New Issue
Block a user