🏠 Home 

Live Advanced Style Settings on userstyles.org

Update "Show CSS Code" box when there are Advanced Style Settings (2017-11-11)

  1. // ==UserScript==
  2. // @name Live Advanced Style Settings on userstyles.org
  3. // @author Jefferson "jscher2000" Scher
  4. // @namespace JeffersonScher
  5. // @description Update "Show CSS Code" box when there are Advanced Style Settings (2017-11-11)
  6. // @include https://userstyles.org/styles/*
  7. // @version 0.6
  8. // @copyright Copyright 2017 Jefferson Scher
  9. // @license BSD 3-clause
  10. // @grant none
  11. // ==/UserScript==
  12. function updatestuff(e){
  13. if (e) console.log('Event target='+e.target.nodeName);
  14. var ctrls = document.querySelectorAll('#style-settings input[type="text"], #style-settings select');
  15. var namevalue = new Array();
  16. for(var i=0; i<ctrls.length; i++){
  17. switch (ctrls[i].nodeName) {
  18. case "INPUT":
  19. // Does not work for color choosers, maybe because the value of the text input is changed by a script
  20. if (ctrls[i].type == "text") {
  21. namevalue.push(ctrls[i].name + "=" + encodeURIComponent(ctrls[i].value));
  22. }
  23. break;
  24. case "SELECT":
  25. namevalue.push(ctrls[i].name + "=" + encodeURIComponent(ctrls[i].value));
  26. break;
  27. }
  28. }
  29. var request = new XMLHttpRequest();
  30. if (request){
  31. var sPage = document.querySelector("meta[property='og:url']").getAttribute("content");
  32. if (!sPage || sPage.length === 0) sPage = 'https://userstyles.org' + location.pathname;
  33. var styloc = sPage.substr(0, sPage.lastIndexOf("/")) + ".css?" + namevalue.join("&");
  34. request.open("GET", styloc, true);
  35. request.onreadystatechange = function() {
  36. if (request.readyState==4) {
  37. var tgtEl = document.getElementById("stylish-code");
  38. tgtEl.className = "cssVisible";
  39. if (request.status==200) {
  40. tgtEl.value = request.responseText;
  41. } else {
  42. tgtEl.value += "Unexpected Response Status: " + request.status + " " + request.statusText;
  43. }
  44. request = null;
  45. }
  46. }
  47. request.send(null);
  48. } else {
  49. console.log("Can't create XMLHttpRequest!");
  50. }
  51. }
  52. function prepIt(){
  53. if (document.getElementById('style-settings')){
  54. document.getElementById('advancedsettings_area').className = 'advancedsettings_shown';
  55. updatestuff();
  56. document.getElementById('advancedsettings_area').addEventListener('change', updatestuff, false);
  57. }
  58. }
  59. window.setTimeout(prepIt, 1000);
  60. window.setTimeout(prepIt, 2000); // in case there is a very slow load...