MVGP++

Add fine tuned garden rotation, custom garden sizes, and show/hide buttons for toolbox/type box!

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         MVGP++
// @namespace    none
// @version      2020.01.03.1618
// @description  Add fine tuned garden rotation, custom garden sizes, and show/hide buttons for toolbox/type box!
// @author       technical13
// @supportURL   https://discord.me/TheShoeStore
// @match        http://gardenpainter.ide.sk/paint.php
// @grant        none
// ==/UserScript==
// jshint esversion: 6

var isDebug = false;
var intVerbosity = 0;
const ver = '2020.01.03.1618';
const scriptName = 'MVGP++ v' + ver;

const intAlertWidth = 760;

function toBoolean( val ) {
    const arrTrue = [ undefined, null, '', true, 'true', 1, '1', 'on', 'yes' ];
    val = ( typeof( val ) === 'string' ? val.toLowerCase() : val );

    log( 4, 'log', 'toBoolean() is returning: %o', ( arrTrue.indexOf( val ) !== -1 ? true : false ) );
    return ( arrTrue.indexOf( val ) !== -1 ? true : false );
}

function log( intV, strConsole, strLog, ...arrArgs ) {
  if ( strConsole === undefined ) { strConsole = 'log'; }
  if ( strLog === undefined ) { strLog = '%o'; }
  if ( intVerbosity >= intV && ( strConsole === 'groupEnd' ) ) { console[ strConsole ](); }
  if ( intV === 0 || ( isDebug && intVerbosity >= intV ) ) { console[ strConsole ]( '[%i]: %s: ' + strLog, intV, scriptName, ...arrArgs ); }
}

const intParamsStart = ( document.URL.indexOf( '?' ) + 1 );
const strParams = document.URL.substr( intParamsStart );
const arrParamSets = strParams.split( '&' );
var objParams = {};
arrParamSets.forEach( function( strParam ) {
    let arrParam = strParam.split( '=' );
    let strParamName = ( arrParam[ 0 ].toLowerCase() || '' );
    if ( strParamName === 'verbosity' ) {
        isDebug = true;
        intVerbosity = ( arrParam[ 1 ] ? ( parseInt( arrParam[ 1 ] ) < 0 ? 0 : ( parseInt( arrParam[ 1 ] ) > 9 ? 9 : parseInt( arrParam[ 1 ] ) ) ) : 9 );
    } else if ( strParamName === 'debug' ) {
        isDebug = toBoolean( arrParam[ 1 ] );
        intVerbosity = 1;
    }
} );

log( 1, 'warn', 'Debug mode is on with verbosity level: %o', intVerbosity );
log( 1, 'groupCollapsed', 'Verbosity options: (click to expand)' );
log( 1, 'log', '1) Summary\n2) Parameters retrieved from URL\n3) Variables set to objParams\n4) Function returns\n9) ALL debugging info and this notice.' );
log( 1, 'groupEnd' );

( function() {
    'use strict';
    log( 0, 'info', 'Script loaded.' );

    document.getElementById( 'permalinktext' ).align = 'right';

    var toggleToolbox = document.createElement( 'input' );
    toggleToolbox.id = 'toggleToolbox';
    toggleToolbox.type = 'button';
    toggleToolbox.setAttribute( 'class', 'btnToggle' );
    toggleToolbox.title = 'Toggle display of types box.';
    toggleToolbox.value = 'Hide Toolbox';
    toggleToolbox.style = 'float: left;';

    var toggleTypes = document.createElement( 'input' );
    toggleTypes.id = 'toggleTypes';
    toggleTypes.type = 'button';
    toggleTypes.setAttribute( 'class', 'btnToggle' );
    toggleTypes.title = 'Toggle display of types box.';
    toggleTypes.value = 'Hide Types';
    toggleTypes.style = 'float: right;';

    var toggleButtons = document.createElement( 'div' );
    toggleButtons.id = 'toggleButtons';
    toggleButtons.append( toggleToolbox );
    toggleButtons.append( toggleTypes );

    document.getElementById( 'maptiles' ).append( toggleButtons );

    var arrToggleBtns = document.getElementsByClassName( 'btnToggle' );
    for ( var i = 0; i < arrToggleBtns.length; i++ ) {
        arrToggleBtns[ i ].addEventListener( 'click', function ( event ) {
            var isHideShow = event.target.value.split( ' ' )[ 0 ];
            var forBtn = event.target.value.split( ' ' )[ 1 ];
            try {
                var doHideShow = ( isHideShow === 'Hide' ? 'Show' : 'Hide' );
                event.target.value = doHideShow + ' ' + forBtn;
                if ( forBtn === 'Toolbox' ) {
                    document.getElementById( 'toolbox' ).style.display = ( isHideShow === 'Hide' ? 'none' : 'inline-block' );
                } else if ( forBtn === 'Types' ) {
                    document.getElementById( 'munzee-types' ).style.display = ( isHideShow === 'Hide' ? 'none' : 'inherit' );
                }
            } catch ( errToggle ) {
                log( 0, 'error', 'Failed while attempting to %s %o\n\t: %o', isHideShow, forBtn, errToggle );
            }
        } );
    }

    var customGrid = document.createElement( 'img' );
    customGrid.id = 'customGrid';
    customGrid.setAttribute( 'class', 'btn' );
    customGrid.width = '50'; customGrid.height = '50';
    customGrid.title = 'Grid size ? × ?';
    customGrid.src = 'https://cdn.discordapp.com/attachments/662752932151820308/662772347174125568/MVGP_Custom_Size.png';
    document.querySelectorAll( 'div#toolbox img.btn' )[ 8 ].after( customGrid );

    document.getElementById( 'customGrid' ).addEventListener( 'click', function ( event ) {
        var askSize = prompt( 'Grids must have matching widths and heights.\nGrids larger than 120×120 may not load well.\n\n\tWhat size would you like your grid?', 120 );
        n = parseInt( askSize );
        if ( isNaN( n ) ) {
            alert( '"' + askSize + '" is not a number. Please try again and enter a single number.' );
        } else if ( n > 120 ) {
            var amSure = confirm( '"' + n + '×' + n + '" is greater than 120×120.\nGrids larger than 120×120 are more likely to crash your browser.\n\n\tARE YOU SURE YOU WANT TO TRY?' );
            if ( amSure ) {
                setupCrosses();
                setupPins();
                setGridSize( n );
            }
        } else {
            setupCrosses();
            setupPins();
            setGridSize( n );
        }
    } );//*/

    var rotateRightOne = document.createElement( 'img' );
    rotateRightOne.id = 'rotateRightOne';
    rotateRightOne.setAttribute( 'class', 'btn' );
    rotateRightOne.title = 'Rotate the grid right by 1 degree.';
    rotateRightOne.src = 'https://cdn.discordapp.com/attachments/662752932151820308/662753267276841035/grid_rotate4.png';
    rotateRightOne.setAttribute( 'onclick', 'rotateGridRight(1)' );
    document.querySelectorAll( 'div#toolbox img.btn' )[ 5 ].after( rotateRightOne );

    var rotateLeftOne = document.createElement( 'img' );
    rotateLeftOne.id = 'rotateLeftOne';
    rotateLeftOne.setAttribute( 'class', 'btn' );
    rotateLeftOne.title = 'Rotate the grid left by 1 degree.';
    rotateLeftOne.src = 'https://cdn.discordapp.com/attachments/662752932151820308/662753258221076490/grid_rotate3.png';
    rotateLeftOne.setAttribute( 'onclick', 'rotateGridLeft(1)' );
    document.querySelectorAll( 'div#toolbox img.btn' )[ 4 ].before( rotateLeftOne );
} )();