🏠 Home 

Scratch Swaggification Homepage Fixer

Fixes blurry images on the Scratch homepage that normally show up when using the Scratch Swaggification userstyle.


Install this script?
  1. // ==UserScript==
  2. // @name Scratch Swaggification Homepage Fixer
  3. // @author MegaApuTurkUltra
  4. // @namespace MegaApuTurkUltra_scripts
  5. // @website https://userstyles.org/styles/110430/scratch-2-0-swaggification
  6. // @version 0.1.0
  7. // @description Fixes blurry images on the Scratch homepage that normally show up when using the Scratch Swaggification userstyle.
  8. // @include http://scratch.mit.edu/*
  9. // @include https://scratch.mit.edu/*
  10. // @grant unsafeWindow
  11. // @require http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
  12. // @copyright CC0 Public Domain
  13. // ==/UserScript==
  14. this.$ = this.jQuery = jQuery.noConflict(true);
  15. if (unsafeWindow.location.pathname == '/') {
  16. try {
  17. $('.image.lazy').each(function () {
  18. var url = $(this).attr('data-original');
  19. url = url.replace('144x108', '480x360');
  20. $(this).attr('data-original', url).attr('src', url);
  21. scheduleLoadComplete($(this), $(this).parent().parent());
  22. });
  23. console.log('Project images fixed');
  24. $('.image .lazy').each(function () {
  25. var url = $(this).attr('data-original');
  26. url = url.replace('170x100', '394x232');
  27. $(this).attr('data-original', url).attr('src', url);
  28. scheduleLoadComplete($(this), $(this).parent().parent().parent());
  29. });
  30. console.log('Swaggification hi-res images activated');
  31. } catch (e) {
  32. console.log(e);
  33. }
  34. }
  35. function scheduleLoadComplete(img, li) {
  36. var loader = $('<div style="border-radius:5px;position: absolute;top:0px;left:0px;width:100%;height:87%;pointer-events:none;background:rgba(255, 255, 255, 0.7);border: 0;"'
  37. + '><img src="http://i.cubeupload.com/rPcKiu.gif" style="width: 48px;height:'
  38. + '48px;position:absolute;top: calc(50% - 48px);border:0;left: calc(50% - 24px);" /><p style="color:black;text-align:center;margin-top:2px;">Loading thumbnail...</p></div>');
  39. li.css('position', 'relative').append(loader);
  40. img.css('filter', 'blur(10px)');
  41. var i = new Image();
  42. i.src = img.attr('data-original');
  43. i.onload = function () {
  44. loader.fadeOut();
  45. };
  46. }
  47. $(document).scroll(function(){
  48. $(document.body).attr("style", "background-position:0px -"+(100*$(document).scrollTop()/$(document).height())+"px;");
  49. });
  50. if(location.pathname.startsWith("/discuss/youtube/")){
  51. var h4 = $(".col-10 .box-head h4");
  52. h4.html(h4.text());
  53. }