├── gif.gif
├── README.md
├── index.html
└── code.js
/gif.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/WorldLanguages/animatedThumbnailsBookmarklet/HEAD/gif.gif
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Animated Thumbnails Bookmarklet
2 |
3 | Bookmarklet to set custom/animated thumbnails on Scratch
4 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | animatedThumbnailsBookmarklet
7 |
8 |
9 |
10 |
11 |
12 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
Animated Thumbnail Bookmarklet
Drag and drop the link below to your bookmarks/favorites bar. If you don't see the bar, press Ctrl+Shift+B (Windows) or Cmd+Shift+B (Mac).
23 |
Then click it in any of your Scratch projects and follow the indicated steps.
not an image from another website.
Select an image
Close';
24 | document.getElementById("selectThumbnailFile").onclick = function(){document.getElementById("uploadthumbnail").click();};
25 | } else {
26 | document.getElementById("snackbar").innerHTML = 'Error - try a smaller image.
Select an image
Close';
27 | document.getElementById("selectThumbnailFile").onclick = function(){document.getElementById("uploadthumbnail").click();};
28 | }
29 | }
30 |
31 | getCookie = function getCookie(name) {
32 | var value = "; " + document.cookie;
33 | var parts = value.split("; " + name + "=");
34 | if (parts.length == 2) return parts.pop().split(";").shift();
35 | }
36 |
37 | upload = function upload(filelocation) {
38 |
39 | document.getElementById("snackbar").innerHTML = "Reading file...";
40 |
41 | var reader1 = new FileReader();
42 |
43 | reader1.onload = function (e) {
44 | uploadedImage = e.target.result;
45 | };
46 | try{reader1.readAsDataURL(filelocation);}catch(err){error(err);return;}
47 |
48 | var reader = new FileReader();
49 | reader.onload = function(e2){
50 | $.ajax({
51 | type: "POST",
52 | url: "/internalapi/project/thumbnail/" + projectID + "/set/",
53 | data: e2.target.result,
54 | headers: {
55 | "X-csrftoken": getCookie("scratchcsrftoken"),
56 | },
57 | contentType: "",
58 | processData: false,
59 | xhr: function() {
60 | var xhr = $.ajaxSettings.xhr();
61 | xhr.upload.onprogress = function(e) {
62 | if(!document.getElementById("snackbar").innerHTML.includes("Error")){
63 | var progress = Math.floor(e.loaded / e.total *100) + '%';
64 | document.getElementById("snackbar").innerHTML = "Uploading file " + progress;
65 | }
66 | };
67 | return xhr;
68 | },
69 | success: function(msg) {
70 | document.getElementById("snackbar").innerHTML = 'The thumbnail was successfully changed.
Select another image
Close';
71 | document.getElementById("selectThumbnailFile").onclick = function(){document.getElementById("uploadthumbnail").click();};
72 | },
73 | error: function() {
74 | error();}
75 | });
76 | };
77 | reader.readAsArrayBuffer(filelocation);
78 | }
79 |
80 | snackBarCSS();
81 |
82 | var snackbar = document.createElement("div");
83 | snackbar.id = "snackbar";
84 | document.body.appendChild(snackbar);
85 | document.getElementById("snackbar").innerHTML = 'Select an image or drag and drop anywhere on this page.
Close';
86 | document.getElementById("selectThumbnailFile").onclick = function(){document.getElementById("uploadthumbnail").click();};
87 | document.getElementById("snackbar").className = "show";
88 |
89 | if(!document.getElementById("uploadthumbnail")) {
90 | var file = document.createElement("input");
91 | file.id = "uploadthumbnail";
92 | file.setAttribute("type", "file");
93 | file.setAttribute("accept", "image/*");
94 | document.body.appendChild(file);
95 | document.getElementById("uploadthumbnail").onchange = function() {
96 | if(document.getElementById('uploadthumbnail').files[0])upload(document.getElementById('uploadthumbnail').files[0]);
97 | };
98 | } else {
99 | document.getElementById("uploadthumbnail").click();
100 | }
101 |
102 | if(!document.getElementById("uploadthumbnaildrag")){
103 | var dragloaded = document.createElement("span");
104 | dragloaded.id = "uploadthumbnaildrag";
105 | document.body.appendChild(dragloaded);
106 |
107 | var dropper = $(document);
108 | dropper.on("dragover", function(e) {
109 | e.stopPropagation();
110 | e.preventDefault();
111 | e.originalEvent.dataTransfer.dropEffect = "copy";
112 | });
113 | dropper.on("drop", function(e) {
114 | e.stopPropagation();
115 | e.preventDefault();
116 | upload(e.originalEvent.dataTransfer.items[0].getAsFile());
117 | });
118 | } // If drag and drop loader wasn't put before
119 | }
120 |
--------------------------------------------------------------------------------