BigQuery Platform Modifier

BigQuery Platform Modifier modifies BigQuery Platform to display panels side by side.
当前为 2020-10-02 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         BigQuery Platform Modifier
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  BigQuery Platform Modifier modifies BigQuery Platform to display panels side by side.
// @author       Hubertokf
// @match        *://console.cloud.google.com/bigquery*
// @grant        none
// @require      http://code.jquery.com/jquery-3.4.1.min.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js
// ==/UserScript==

(function() {
    'use strict';
    var $ = window.jQuery;

    function waitForElementToDisplay(selector, time) {
        if(document.querySelector(selector)!=null) {
            modifyBqPlatform();
            return;
        }
        else {
            setTimeout(function() {
                waitForElementToDisplay(selector, time);
            }, time);
        }
    }

    $(document).ready(function () {
        $("head").append ('<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet" type="text/css">');

        waitForElementToDisplay('.p6n-panel-container-inner.p6n-panel-offset-parent.p6n-panel-container-horizontal', 2000);

    });

    function modifyBqPlatform() {
        console.log("BigQuery Platform Modifier: modifying BQ...");



        var content = $('.p6n-panel-container-inner.p6n-panel-offset-parent.p6n-panel-container-horizontal');
        content.css("flex-direction", "row");

        content.prepend( '<div class="left-pannel"></div>' );
        var leftPanel = $('.left-pannel').css("display", "flex").css("flex-direction", "column").css("width", "860px").css('flex', '0 0 auto').css('border-right', '2px solid #999').css('padding-right', '2px');

        //content.append( '<div class="splitter"></div>' );
        //var splitter = $('.splitter').css("flex", "0 0 auto").css("width", "2px").css("cursor", "col-resize").css("background-color", "#999")

        content.append( '<div class="right-pannel"></div>' );
        var rightPanel = $('.right-pannel');

        $(rightPanel).css("flex-grow", "1").css("flex", "1 1 auto");

        var title = content.find('.p6n-bq-query-editor-title-container')[0];
        var editor = content.find('.p6n-vulcan-panel.bq-query-editor-panel.p6n-panel')[0];

        $(title).appendTo(leftPanel);
        $(editor).appendTo(leftPanel);
        $(editor).css("height", "100%");

        var results = content.find('.p6n-vulcan-panel-primary.bq-main-panel.p6n-panel.p6n-panel-center')[0];

        var toRemove = content.find('.p6n-panel-splitter.p6n-panel-splitter-horizontal.p6n-panel-splitter-resizable')[0];
        toRemove.remove();

        $(results).appendTo(rightPanel);
        $(results).css("height", "100%");

        $('.left-pannel').resizable({
            resizeHeight: false,
            minWidth: 100
        });

        console.log("BigQuery Platform Modifier: done modifying BQ...");
    }
})();