Adds a button to open an Extension Maker interface in the Scratch editor.
- // ==UserScript==
- // @name Scratch Editor Extension Maker
- // @namespace https://scratch.mit.edu/projects/editor/
- // @version 1.0.0
- // @description Adds a button to open an Extension Maker interface in the Scratch editor.
- // @author YourName
- // @match https://scratch.mit.edu/projects/editor/*
- // @grant none
- // @license this is my maker for scratch
- // ==/UserScript==
- (function() {
- 'use strict';
- // Function to create and show the Extension Maker modal
- function showExtensionMaker() {
- // Check if the modal already exists to prevent duplicates
- if (document.querySelector('#extensionMakerModal')) return;
- // Create the modal overlay
- const modalOverlay = document.createElement('div');
- modalOverlay.id = 'extensionMakerModal';
- modalOverlay.style.position = 'fixed';
- modalOverlay.style.top = '0';
- modalOverlay.style.left = '0';
- modalOverlay.style.width = '100%';
- modalOverlay.style.height = '100%';
- modalOverlay.style.backgroundColor = 'rgba(0,0,0,0.5)';
- modalOverlay.style.display = 'flex';
- modalOverlay.style.justifyContent = 'center';
- modalOverlay.style.alignItems = 'center';
- modalOverlay.style.zIndex = '1000';
- // Create the modal content container
- const modalContent = document.createElement('div');
- modalContent.style.backgroundColor = '#fff';
- modalContent.style.padding = '20px';
- modalContent.style.borderRadius = '10px';
- modalContent.style.width = '50%';
- modalContent.style.boxShadow = '0 0 10px rgba(0,0,0,0.2)';
- // Modal header
- const modalHeader = document.createElement('h2');
- modalHeader.innerText = 'Extension Maker';
- modalHeader.style.marginTop = '0';
- modalContent.appendChild(modalHeader);
- // Close button
- const closeButton = document.createElement('button');
- closeButton.innerText = 'Close';
- closeButton.style.marginBottom = '10px';
- closeButton.style.cursor = 'pointer';
- closeButton.addEventListener('click', () => {
- modalOverlay.remove();
- });
- modalContent.appendChild(closeButton);
- // Example input form
- const form = document.createElement('form');
- // Extension name input
- const nameLabel = document.createElement('label');
- nameLabel.innerText = 'Extension Name: ';
- const nameInput = document.createElement('input');
- nameInput.type = 'text';
- nameInput.style.marginBottom = '10px';
- form.appendChild(nameLabel);
- form.appendChild(nameInput);
- form.appendChild(document.createElement('br'));
- // Extension description input
- const descLabel = document.createElement('label');
- descLabel.innerText = 'Description: ';
- const descInput = document.createElement('textarea');
- descInput.style.width = '100%';
- descInput.style.height = '50px';
- form.appendChild(descLabel);
- form.appendChild(descInput);
- form.appendChild(document.createElement('br'));
- // Submit button
- const submitButton = document.createElement('button');
- submitButton.innerText = 'Create Extension';
- submitButton.style.cursor = 'pointer';
- submitButton.addEventListener('click', (event) => {
- event.preventDefault();
- alert(`Extension Created:\nName: ${nameInput.value}\nDescription: ${descInput.value}`);
- modalOverlay.remove();
- });
- form.appendChild(submitButton);
- // Append form to modal content
- modalContent.appendChild(form);
- // Append modal content to modal overlay
- modalOverlay.appendChild(modalContent);
- // Append modal overlay to document body
- document.body.appendChild(modalOverlay);
- }
- // Function to add the custom button
- function addCustomButton() {
- // Check if the button already exists to prevent duplicates
- if (document.querySelector('#extensionMakerButton')) return;
- const button = document.createElement('button');
- button.id = 'extensionMakerButton';
- button.innerText = 'Open Extension Maker';
- button.style.position = 'absolute';
- button.style.top = '10px';
- button.style.right = '10px';
- button.style.zIndex = '1000';
- button.style.backgroundColor = '#007bff';
- button.style.color = '#ffffff';
- button.style.border = 'none';
- button.style.padding = '10px';
- button.style.cursor = 'pointer';
- button.addEventListener('click', showExtensionMaker);
- // Append the button to the document body
- document.body.appendChild(button);
- }
- // Wait for the Scratch editor to load fully
- window.addEventListener('load', () => {
- // Ensure the Scratch editor has fully loaded
- const checkEditorLoaded = setInterval(() => {
- if (document.querySelector('.stage-header_stage-header-button_')) {
- clearInterval(checkEditorLoaded);
- addCustomButton();
- }
- }, 1000);
- });
- })();