// ==UserScript==
// @name         Chess Plus+
// @namespace    https://github.com/longkidkoolstar
// @version      1.0.1
// @description  Add Essential/Quality of life tweaks to Chess.com
// @author       longkidkoolstar
// @license      CC BY-NC-ND 4.0
// @icon         https://cdn4.iconfinder.com/data/icons/chess-game-funny-colour/32/chess_game_funy_colour_ok_13-1024.png
// @require      https://greasyfork.org/scripts/471295-tweaking/code/Tweaking.js
// @match        https://www.chess.com/*
// @grant        GM_setValue
// @grant        GM_getValue
// @downloadURL none
// ==/UserScript==

(function () {
  'use strict';

  // Check if Auto Queue is on
  var autoQueue = GM_getValue('autoQueue', false);

  // Function to toggle Auto Queue on/off
  function toggleAutoQueue() {
    autoQueue = !autoQueue;
    GM_setValue('autoQueue', autoQueue);
    console.log('Auto Queue is now ' + (autoQueue ? 'on' : 'off'));
  }

  // Function to click the "New" button
  function clickButton() {
    var buttons = document.querySelectorAll('button');
    for (var i = 0; i < buttons.length; i++) {
      if (buttons[i].innerText.includes('New')) {
        buttons[i].click();
        break;
      }
    }
  }

  // If Auto Queue is on, click the button whenever it becomes available
  if (autoQueue) {
    // Click the button immediately if it's available
    clickButton();

    // Click the button whenever it becomes available
    var observer = new MutationObserver(function (mutations) {
      mutations.forEach(function (mutation) {
        if (mutation.addedNodes.length > 0) {
          clickButton();
        }
      });
    });
    observer.observe(document.body, { childList: true, subtree: true });
  }

  // Add a Tweaks dropdown menu
  var tweaksMenu = document.createElement('div');
  tweaksMenu.classList.add('chess-com-tweaks-menu');
  tweaksMenu.innerHTML = `
    <style>
      /* Chess.com theme styles */
      .chess-com-tweaks-menu {
        position: fixed;
        bottom: 20px;
        right: 20px;
        background-color: #5E9949;
        color: #EEEED2;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        font-family: Arial, sans-serif;
        z-index: 9999;
        max-width: 100%;
        min-width: 60px;
        overflow: hidden;
        opacity: 0.9;
        transition: all 0.3s;
        transform: translateX(100%);
      }

      .chess-com-tweaks-menu.expanded {
        transform: translateX(0);
      }

      .chess-com-tweaks-menu__button-wrapper {
        padding: 8px;
        text-align: center;
        background-color: #2B4730;
        border-radius: 4px 4px 0 0;
        cursor: pointer;
      }

      .chess-com-tweaks-menu__button {
        color: white;
        padding: 8px 16px;
        font-size: 14px;
        border: none;
        cursor: pointer;
        border-radius: 4px;
        transition: background-color 0.3s;
      }

      .chess-com-tweaks-menu.expanded .chess-com-tweaks-menu__button {
        border-radius: 4px 4px 0 0;
      }

      .chess-com-tweaks-menu__button:hover {
        background-color: #1C3523;
      }

      .chess-com-tweaks-menu__dropdown {
        padding: 8px;
        max-height: 250px;
        overflow-y: auto;
      }

      .chess-com-tweaks-menu.expanded .chess-com-tweaks-menu__dropdown {
        display: block;
      }

      .chess-com-tweaks-menu__item {
        display: flex;
        align-items: center;
        padding: 4px;
        font-size: 14px;
      }

      .chess-com-tweaks-menu__label {
        flex-grow: 1;
        margin: 0;
        padding-left: 8px;
        color: #EEEED2;
      }

      .chess-com-tweaks-menu__toggle-wrapper {
        margin-right: 8px;
      }

      .chess-com-tweaks-menu__toggle {
        display: none;
      }

      .chess-com-tweaks-menu__toggle-label {
        position: relative;
        display: inline-block;
        width: 40px;
        height: 20px;
        background-color: #ccc;
        border-radius: 10px;
        cursor: pointer;
      }

      .chess-com-tweaks-menu__toggle-label::after {
        content: "";
        position: absolute;
        top: 2px;
        left: 2px;
        width: 16px;
        height: 16px;
        background-color: #fff;
        border-radius: 50%;
        transition: transform 0.3s;
      }

      .chess-com-tweaks-menu__toggle:checked + .chess-com-tweaks-menu__toggle-label::after {
        transform: translateX(20px);
        background-color: #4CAF50;
      }
    </style>
    <div class="chess-com-tweaks-menu__button-wrapper" id="tweaksButton">Tweaks</div>
    <div class="chess-com-tweaks-menu__dropdown" id="tweaksDropdown">
      <div class="chess-com-tweaks-menu__item">
        <label class="chess-com-tweaks-menu__label">Auto Queue</label>
        <div class="chess-com-tweaks-menu__toggle-wrapper">
          <input class="chess-com-tweaks-menu__toggle" type="checkbox" id="autoQueueToggle" ${autoQueue ? 'checked' : ''}>
          <label class="chess-com-tweaks-menu__toggle-label" for="autoQueueToggle"></label>
        </div>
      </div>
      <!-- Add more tweaks here as needed -->
    </div>
  `;

  var expanded = false;
  var menuButton = tweaksMenu.querySelector('#tweaksButton');
  menuButton.addEventListener('click', function (event) {
    event.preventDefault();
    expanded = !expanded;
    tweaksMenu.classList.toggle('expanded', expanded);
  });

  tweaksMenu.querySelector('#autoQueueToggle').addEventListener('change', function (event) {
    toggleAutoQueue();
  });

  // Add a CSS class to the document body for the chess.com theme
  document.body.classList.add('chess-com-theme');

  document.body.appendChild(tweaksMenu);
})();