Raw Source Toggle Dropdown

• Minified Source

fahmiChaar / Joget extras features

// ==UserScript==
// @name         Joget extras features
// @namespace    wevioo.joget
// @version      0.1
// @description  Add Extras Features to joget Dashboard (Export All, Clear console logs...)
// @author       Mohamed Fahmi Chaar
// @license      MIT
// @match        *://*/jw/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=cdnjs.com
// @grant        none
// ==/UserScript==

(function () {
    'use strict';
    $(function () {

        $(document).bind("keydown", function (e) {
            if ($("#builder-steps").length) {
                if (e.which == 83 && event.ctrlKey) {
                    console.log($("#builder-steps .last-inactive a"))
                    $("#builder-steps .last-inactive a").click();
                    return false;
                }
            }
            return true;
        });

        new MutationObserver(function (mutations) {
            mutations.some(function (mutation) {
                if (mutation.type === 'attributes' && mutation.attributeName === 'src' && mutation.target.id === 'jqueryDialogFrame') {
                    // console.log(mutation);
                    // console.log('New src: ', mutation.target.src);
                    if (mutation.target.src && mutation.target.src.includes('exportconfig')) {
                        addSelectAllButton(mutation.target)
                    }
                    return true;
                }

                return false;
            });
        }).observe(document.body, {
            attributes: true,
            attributeFilter: ['src'],
            attributeOldValue: true,
            characterData: false,
            characterDataOldValue: false,
            childList: false,
            subtree: true
        });

        $(document).on('change', '#selectAll', function () {
            $('#exportform input:checkbox').not(this).prop('checked', this.checked)
            $('label[for=selectAll] .btn').text(this.checked ? 'Unselect All' : 'Select All')
        })

        $("body").on('copy', function () {
            const action = "copy"
            clickOnOption(action)
        })
        
        $("body").on('paste', function () {
            $(".form-palette-options").each(function() {
                const style = $(this).attr('style')
                if (style && style.includes("visibility: visible")) {
                    $(this).find('.element-paste').click()
                }
            })
        })
    })

    function clickOnOption(action) {
        $(".element-clear").each(function() {
            const style = $(this).attr('style')
            if (style && style.includes("visibility: visible")) {
                const $options = $(this).prev('.form-palette-options')
                $options.find(`.element-${action}`).click()
            }
        })
    }

    function addSelectAllButton(iframe) {
        if (!iframe) { return false; }
        $(iframe).on('load', function () {
            if (!$(iframe).contents().find('#selectAll').length) {
                $(iframe).contents().find("#exportform fieldset .alert").after(`
                    <div class="form-row select-all-row">
                        <label for="selectAll">
                            <div class='btn'>Select All</div>
                        </label>
                        <div class="form-input">
                            <input id="selectAll" type="checkbox">
                        </div>
                    </div>
                `)
            }
        })
    }

    // Logs Options
    if (window.location.href.includes('/logs') || window.location.href.includes('/slogs')) {
        const containerStyle = `
            position: fixed;
            z-index: 2;
            bottom: 75px;
            right: 63px;
            display: flex;
            align-items: center;
            gap: 10px;
        `
        const btnStyle = `
            --primary: white;
            color: black;
            border: 1px solid;
        `
        $('#main-body-content').append(`
            <div style="${containerStyle}">
                <div class="clear-logs btn" style="${btnStyle}"><i class="fas fa-trash"></i> Clear</div>
                <div class="scroll-up btn" style=""><i class="fas fa-arrow-alt-circle-up"></i></div>
                <div class="scroll-down btn" style=""><i class="fas fa-arrow-alt-circle-down"></i></div>
            </div>
        `);
        $(document).on('click', '.clear-logs', function() {
            $('#logs').html("")
        })
        $(document).on('click', '.scroll-up', function() {
            $("html, body").animate({ scrollTop: 0 }, 300);
        })
        $(document).on('click', '.scroll-down', function() {
            $("html, body").animate({ scrollTop: $(document).height() }, 300);
        })
    }

})();