// ==UserScript==
// @name         打开选中的pixiv id
// @namespace    https://greasyfork.org/zh-CN/scripts/469561-%E6%89%93%E5%BC%80%E9%80%89%E4%B8%AD%E7%9A%84pixiv-id
// @version      0.5
// @description  help you to open pixiv works by id
// @match        *://*/*
// @grant        GM_openInTab
// @grant        GM_addStyle
// @downloadURL none
// ==/UserScript==

(function() {
    'use strict';

    var lastTime = 0; // the last time the confirm dialog was shown
    var interval = 3000; // the minimum interval between two confirm dialogs (in milliseconds)

    // get the selected text
    function getSelectionText() {
        var text = "";
        if (window.getSelection) {
            text = window.getSelection().toString();
        } else if (document.selection && document.selection.type != "Control") {
            text = document.selection.createRange().text;
        }
        return text;
    }

    // check if the text is a valid pixiv id
    function isValidPixivId(text) {
        text = text.replace(/\s/g, ''); // remove all whitespace characters
        var regex = /^\d{5,12}$/; // a number between 5 and 12 digits
        return regex.test(text);
    }

    // generate the pixiv url by id
    function getPixivUrl(id) {
        var baseUrl = "https://www.pixiv.net/member_illust.php?illust_id=";
        return baseUrl + id + "&mode=medium";
    }

    // open the pixiv url in a new tab
    function openPixivUrl(url, active) {
        GM_openInTab(url, {active: active, insert: true});
    }

    // create a custom confirm dialog with three buttons
    function createCustomConfirm(url) {
        var dialog = document.createElement("div"); // create a div element for the dialog
        dialog.id = "custom-confirm"; // set the id of the dialog
        dialog.className = "custom-confirm"; // set the class name of the dialog

        var message = document.createElement("p"); // create a p element for the message
        message.className = "custom-confirm-message"; // set the class name of the message
        message.textContent = "你想要打开这个pixiv作品吗：" + url + "?"; // set the text content of the message

        var buttons = document.createElement("div"); // create a div element for the buttons
                buttons.className = "custom-confirm-buttons"; // set the class name of the buttons

        var button1 = document.createElement("button"); // create a button element for the first button
        button1.className = "custom-confirm-button"; // set the class name of the first button
        button1.textContent = "打开并留在当前标签页"; // set the text content of the first button

        var button2 = document.createElement("button"); // create a button element for the second button
        button2.className = "custom-confirm-button"; // set the class name of the second button
        button2.textContent = "打开并跳转到新标签页"; // set the text content of the second button

        var button3 = document.createElement("button"); // create a button element for the third button
        button3.className = "custom-confirm-button"; // set the class name of the third button
        button3.textContent = "取消"; // set the text content of the third button

        buttons.appendChild(button1); // append the first button to the buttons div
        buttons.appendChild(button2); // append the second button to the buttons div
        buttons.appendChild(button3); // append the third button to the buttons div

        dialog.appendChild(message); // append the message to the dialog div
        dialog.appendChild(buttons); // append the buttons to the dialog div

        document.body.appendChild(dialog); // append the dialog to the body

        return {dialog: dialog, button1: button1, button2: button2, button3: button3}; // return an object with references to the dialog and buttons elements
    }

    // add some styles for the custom confirm dialog
    function addCustomConfirmStyles() {
        var css = `
.custom-confirm {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 400px;
  max-width: 90%;
  background-color: white;
  border: 1px solid black;
  padding: 10px;
  z-index: 9999;
}

.custom-confirm-message {
  margin: 10px;
  font-size: 16px;
}

.custom-confirm-buttons {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
}

.custom-confirm-button {
  width: 100px;
  height: 40px;
  font-size: 16px;
  cursor: pointer;
}
`;
        GM_addStyle(css); // add the css to the document
    }

    // handle the mouseup event
    function handleMouseUp(event) {
        var currentTime = new Date().getTime(); // get the current time
        if (currentTime - lastTime < interval) { // if the interval is too short
            return; // do nothing
        }
        lastTime = currentTime; // update the last time

        var text = getSelectionText(); // get the selected text
        if (isValidPixivId(text)) { // check if it is a valid pixiv id
            var url = getPixivUrl(text); // generate the pixiv url
            var customConfirm = createCustomConfirm(url); // create a custom confirm dialog
            addCustomConfirmStyles(); // add some styles for the dialog

            customConfirm.button1.addEventListener("click", function() { // add a click event listener to the first button
                openPixivUrl(url, false); // open the url in a new tab but stay in the current tab
                document.body.removeChild(customConfirm.dialog); // remove the dialog from the body (added this line)
            }, false);

            customConfirm.button2.addEventListener("click", function() { // add a click event listener to the second button
                openPixivUrl(url, true); // open the url in a new tab and switch to it
                document.body.removeChild(customConfirm.dialog); // remove the dialog from the body (added this line)
            }, false);

            customConfirm.button3.addEventListener("click", function() { // add a click event listener to the third button
                document.body.removeChild(customConfirm.dialog); // remove the dialog from the body
            }, false);
        }
    }

    // add the event listener to the document
    document.addEventListener("mouseup", handleMouseUp, false);
})();