Skip to content

Commit dce1fe6

Browse files
rgantzosrgantzos
authored
Merge pull request #666 from rgantzos/main
2 parents 9413f02 + fd86d82 commit dce1fe6

12 files changed

Lines changed: 394 additions & 4 deletions

File tree

‎api/modal.css‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,10 @@
4242
border-top-right-radius: 0.5rem;
4343
}
4444

45+
.st-modal p {
46+
font-size: 1rem;
47+
}
48+
4549
.st-modal code {
4650
overflow-wrap: break-word;
4751
background-color: #e3e3e3;

‎api/vm.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -50,9 +50,9 @@ ScratchTools.Scratch.scratchGui = function () {
5050
};
5151

5252
ScratchTools.traps = {
53-
scratchGui: ScratchTools.Scratch.scratchGui,
54-
scratchPaint: ScratchTools.Scratch.scratchPaint,
55-
scratchSound: ScratchTools.Scratch.scratchSound,
53+
scratchGui: ScratchTools.Scratch.scratchGui || null,
54+
scratchPaint: ScratchTools.Scratch.scratchPaint || null,
55+
scratchSound: ScratchTools.Scratch.scratchSound || null,
5656
getVm: function () {
5757
return vm;
5858
},
@@ -179,7 +179,7 @@ ScratchTools.Scratch.scratchPaint = function () {
179179
if (app !== null) {
180180
return app[
181181
Object.keys(app).find((key) => key.startsWith("__reactInternalInstance"))
182-
].child.stateNode.store.getState().scratchPaint;
182+
].child.stateNode.store.getState()?.scratchPaint || null;
183183
} else {
184184
return null;
185185
}

‎extras/icons/info.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎extras/icons/warning.svg‎

Lines changed: 12 additions & 0 deletions
Loading

‎extras/modals.css‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,10 @@
4242
border-top-right-radius: 0.5rem;
4343
}
4444

45+
.st-modal p {
46+
font-size: 1rem;
47+
}
48+
4549
.st-modal code {
4650
overflow-wrap: break-word;
4751
background-color: var(--searchbar-bg);

‎extras/popup/popup.css‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -370,4 +370,52 @@ input:checked + .slider:before {
370370

371371
.ste-easter-egg {
372372
display: none !important;
373+
}
374+
375+
span.new-feature-tag.beta {
376+
background-color: #fc8c4f;
377+
cursor: pointer !important;
378+
}
379+
380+
.warning-component {
381+
background-color: #fc8c4f20;
382+
border: 1.5px solid #fc8c4f;
383+
border-radius: .5rem;
384+
padding: .5rem;
385+
font-size: .8rem;
386+
font-weight: 600;
387+
margin-top: .5rem;
388+
display: flex;
389+
align-items: center;
390+
border-bottom-width: 3px;
391+
line-height: 1.2rem;
392+
color: var(--primary-color);
393+
}
394+
395+
.warning-component img {
396+
height: 1rem;
397+
margin-right: 0.5rem;
398+
margin-inline-end: 10px;
399+
transform: scale(1.15);
400+
}
401+
402+
.info-component {
403+
background-color: #fcd44f20;
404+
border: 1.5px solid #fcd44f;
405+
border-radius: .5rem;
406+
padding: .5rem;
407+
font-size: .8rem;
408+
margin-top: .5rem;
409+
display: flex;
410+
align-items: center;
411+
border-bottom-width: 3px;
412+
line-height: 1.2rem;
413+
color: var(--primary-color);
414+
}
415+
416+
.info-component img {
417+
height: 1rem;
418+
margin-right: 0.5rem;
419+
margin-inline-end: 10px;
420+
transform: scale(1.15);
373421
}

‎extras/popup/popup.js‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -596,6 +596,19 @@ async function getFeatures() {
596596
span.className = "new-feature-tag updated";
597597
div.appendChild(span);
598598
}
599+
if (feature.tags?.includes("Beta")) {
600+
var span = document.createElement("span");
601+
span.textContent = "Beta";
602+
span.className = "new-feature-tag beta";
603+
div.appendChild(span);
604+
span.addEventListener("click", function () {
605+
ScratchTools.modals.create({
606+
title: "Beta feature",
607+
description:
608+
"This feature is currently in a beta stage, and may have small bugs that weren't noticed during testing. There may also be changes/improvements to come soon.",
609+
});
610+
});
611+
}
599612

600613
var label = document.createElement("label");
601614
label.className = "switch";
@@ -788,6 +801,8 @@ async function getFeatures() {
788801
});
789802
div.appendChild(span);
790803

804+
div.appendChild(generateComponents(feature.components || []));
805+
791806
if (
792807
feature.versionAdded?.replace("v", "") ===
793808
chrome.runtime.getManifest().version.toString()
@@ -1239,3 +1254,61 @@ localizationSelectors.forEach(function (item) {
12391254
);
12401255
}
12411256
});
1257+
1258+
function generateComponents(components) {
1259+
let div = document.createElement("div");
1260+
div.classList.add("feature-components");
1261+
1262+
components?.forEach(function (el) {
1263+
let element = document.createElement("div");
1264+
if (el.type === "warning") {
1265+
element.className = "warning-component";
1266+
1267+
let img = document.createElement("img");
1268+
img.src = "/extras/icons/warning.svg";
1269+
1270+
element.textContent = el.content;
1271+
1272+
element.prepend(img);
1273+
}
1274+
1275+
if (el.type === "info") {
1276+
element.className = "info-component";
1277+
1278+
let img = document.createElement("img");
1279+
img.src = "/extras/icons/info.svg";
1280+
1281+
element.textContent = el.content;
1282+
1283+
element.prepend(img);
1284+
}
1285+
1286+
if (el.if) {
1287+
let conditions = [];
1288+
1289+
el.if.conditions?.forEach(function (cond) {
1290+
let value = false;
1291+
if (cond.type === "os") {
1292+
if (navigator.userAgent.includes(cond.value)) {
1293+
value = true;
1294+
}
1295+
}
1296+
conditions.push(value);
1297+
});
1298+
1299+
if (el.if.type === "any") {
1300+
if (!!conditions.find((cond) => cond)) {
1301+
div.appendChild(element);
1302+
}
1303+
} else if (el.if.type === "all") {
1304+
if (conditions.find((cond) => !cond) === undefined) {
1305+
div.appendChild(element);
1306+
}
1307+
}
1308+
} else {
1309+
div.appendChild(element);
1310+
}
1311+
});
1312+
1313+
return div;
1314+
}

‎extras/style.css‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -715,4 +715,52 @@ body[data-filter="Egg"] .feature[data-type*="Egg"] {
715715

716716
.feature > h3 {
717717
display: inline-block;
718+
}
719+
720+
span.new-feature-tag.beta {
721+
background-color: #fc8c4f;
722+
cursor: pointer !important;
723+
}
724+
725+
.warning-component {
726+
background-color: #fc8c4f20;
727+
border: 1.5px solid #fc8c4f;
728+
border-radius: .5rem;
729+
padding: .5rem;
730+
font-size: .8rem;
731+
font-weight: 600;
732+
margin-top: .5rem;
733+
display: flex;
734+
align-items: center;
735+
border-bottom-width: 3px;
736+
line-height: 1.2rem;
737+
color: var(--primary-color);
738+
}
739+
740+
.warning-component img {
741+
height: 1rem;
742+
margin-right: 0.5rem;
743+
margin-inline-end: 10px;
744+
transform: scale(1.15);
745+
}
746+
747+
.info-component {
748+
background-color: #fcd44f20;
749+
border: 1.5px solid #fcd44f;
750+
border-radius: .5rem;
751+
padding: .5rem;
752+
font-size: .8rem;
753+
margin-top: .5rem;
754+
display: flex;
755+
align-items: center;
756+
border-bottom-width: 3px;
757+
line-height: 1.2rem;
758+
color: var(--primary-color);
759+
}
760+
761+
.info-component img {
762+
height: 1rem;
763+
margin-right: 0.5rem;
764+
margin-inline-end: 10px;
765+
transform: scale(1.15);
718766
}

‎features/features.json‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
11
[
2+
{
3+
"version": 2,
4+
"id": "opacity-slider",
5+
"versionAdded": "v3.2.0"
6+
},
27
{
38
"version": 2,
49
"id": "more-studios",

‎features/opacity-slider/data.json‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"title": "Opacity Slider",
3+
"description": "Change the opacity of objects in the paint editor.",
4+
"credits": [
5+
{
6+
"username": "IncognitoOrange",
7+
"url": "https://scratch.mit.edu/users/IncognitoOrange/"
8+
},
9+
{ "username": "rgantzos", "url": "https://scratch.mit.edu/users/rgantzos/" }
10+
],
11+
"type": ["Editor"],
12+
"tags": ["New", "Featured", "Beta"],
13+
"dynamic": true,
14+
"scripts": [{ "file": "script.js", "runOn": "/projects/*" }],
15+
"styles": [{ "file": "style.css", "runOn": "/projects/*" }],
16+
"components": [
17+
{
18+
"type": "warning",
19+
"content": "The slider, although located in the fill modal, controls the opacity of the entire shape, including the outline."
20+
}
21+
]
22+
}

0 commit comments

Comments
 (0)