☰

Google Apps Script Editor Styler

Style the Google Apps Script Editor

当前为 2017-02-26 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name          Google Apps Script Editor Styler
  3. // @description   Style the Google Apps Script Editor
  4. // @namespace     https://github.io/oshliaer
  5. // @domain        script.google.com
  6. // @include       https://script.google.com/d/*
  7. // @include       https://script.google.com/macros/d/*
  8. // @include       https://script.google.com/a/*/d/*
  9. // @include       https://script.google.com/macros/a/*/d/*
  10. // @author        +AlexanderIvanov
  11. // @developer     +AlexanderIvanov
  12. // @version       2017.2.26.02
  13. // @grant         GM_addStyle
  14. // @grant         GM_getValue
  15. // @grant         GM_setValue
  16. // @icon          https://ssl.gstatic.com/images/icons/product/script_chrome_only-256.png
  17. // @screenshot    https://gist.githubusercontent.com/oshliaer/518246959a67699ff8fb414ad6c7aa3d/raw/googleappsscripteditorstyler.screenshot.png
  18. // @license       WTFPL; http://www.wtfpl.net/txt/copying
  19. // ==/UserScript==
  20.  
  21. //var GOGLEFONTSCOLLECTION = ['Roboto', 'Droid Sans Mono', 'Ubuntu Mono'];
  22.  
  23. var userFontSettings = GM_getValue('userFontSettings', {
  24.     fontFamily: 'default'
  25. });
  26.  
  27. //console.log('userFontSettings', userFontSettings);
  28.  
  29. if(userFontSettings.fontFamily !== 'default'){
  30.     var link = document.createElement('link');
  31.     link.rel = 'stylesheet';
  32.     link.href = 'https://fonts.googleapis.com/css?family=' + userFontSettings.fontFamily;
  33.     document.head.appendChild(link);
  34. }
  35.  
  36. var style = '' +
  37.  
  38.     //Autocomplete padding items
  39.     '*,html{font-family: ' + userFontSettings.fontFamily + ' !important;}' +
  40.  
  41.     //Autocomplete padding items
  42.     '.gwt-Label.item{padding-top:2px !important; padding-bottom:2px !important;}' +
  43.  
  44.     //Autocomplete padding invert active
  45.     '.gwt-Label.item.selected{background-color:black !important;color:white !important;}' +
  46.  
  47.     //Settings panel
  48.     'div.tm_settings{position:absolute;bottom:0;right:0;opacity:0.3;z-index:9999;background:#000;color:#fff}';
  49.  
  50. GM_addStyle(style);
  51.  
  52. window.addEventListener("load", function load(event){
  53.     var newElement = document.createElement('div');
  54.     var docsTitleInner = document.getElementById('docs-titlebar');
  55.     var typeOfLocation = getTypeOfLocation(window.location.href);
  56.     newElement.innerHTML = typeOfLocation.name;
  57.     newElement.setAttribute('style', 'text-align: center');
  58.     docsTitleInner.appendChild(newElement);
  59.  
  60.     var settingsDiv = document.createElement('div');
  61.     settingsDiv.className = 'tm_settings';
  62.  
  63.     var formSettingsDiv = document.createElement('div');
  64.     formSettingsDiv.className = 'tm_form_settings';
  65.     formSettingsDiv.style.display = 'none';
  66.  
  67.     var toggleButton = document.createElement('button');
  68.     toggleButton.innerHTML = '_';
  69.     toggleButton.addEventListener('click', function(){
  70.         if(formSettingsDiv.style.display === 'none'){
  71.             formSettingsDiv.style.display = 'block';
  72.             toggleButton.innerHTML = 'X';
  73.         }else{
  74.             formSettingsDiv.style.display = 'none';
  75.             toggleButton.innerHTML = '_';
  76.         }
  77.     });
  78.  
  79.     var fontInput = document.createElement('input');
  80.     fontInput.value = userFontSettings.fontFamily;
  81.  
  82.     var reloadButton = document.createElement('button');
  83.     reloadButton.innerHTML = 'ok';
  84.     reloadButton.addEventListener('click', function(){
  85.         GM_setValue('userFontSettings', {
  86.             fontFamily: fontInput.value
  87.         });
  88.         location.reload();
  89.     });
  90.  
  91.     formSettingsDiv.appendChild(fontInput);
  92.     formSettingsDiv.appendChild(reloadButton);
  93.     settingsDiv.appendChild(toggleButton);
  94.     settingsDiv.appendChild(formSettingsDiv);
  95.     document.body.appendChild(settingsDiv);
  96.  
  97. },false);
  98.  
  99. function getTypeOfLocation(href){
  100.     var types = [
  101.         {mask: '^https:\/\/script\.google\.com\/a\/.*?\/macros\/d\/.*$', name: 'BOUND SCRIPT / GSUITE', color: ''},
  102.         {mask: '^https:\/\/script\.google\.com\/a\/.*?\/d\/.*$', name: 'STANDALONE SCRIPT / GSUITE', color: ''},
  103.         {mask: '^https:\/\/script\.google\.com\/macros\/d\/.*$', name: 'BOUND SCRIPT', color: ''},
  104.         {mask: '^https:\/\/script\.google\.com\/d\/.*$', name: 'STANDALONE SCRIPT', color: ''},
  105.     ];
  106.     for(var i = 0; i < types.length; i++){
  107.         var patt = new RegExp(types[i].mask);
  108.         if(patt.test(href, 'i'))
  109.             return types[i];
  110.     }
  111.     return {
  112.         mask: '',
  113.         name:'',
  114.         color: ''
  115.     };
  116. }