Skip to content

Commit

Permalink
Update BetterInput.js
Browse files Browse the repository at this point in the history
Small Fixes
  • Loading branch information
SharkPool-SP authored Aug 21, 2023
1 parent 808958e commit 559851e
Showing 1 changed file with 73 additions and 61 deletions.
134 changes: 73 additions & 61 deletions extensions/SharkPool/BetterInput.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/*
* This extension was made by SharkPool
* Version 2.1 (Fixes, Booleans, More Customization, Rotation, More Effects, and Performance Updates)
* Version 2.1.1 (Fixes, Booleans, More Customization, Rotation, More Effects, and Performance Updates)
* Next Update: Image Setting Additions
* Do NOT delete these comments
*/
Expand Down Expand Up @@ -31,15 +31,15 @@
constructor() {
this.isWaitingForInput = false;
this.isDropdownOpen = false;
this.userInput = "";
this.userInput = " ";
this.fontSize = "14px";
this.questionColor = "#000000";
this.inputColor = "#000000";
this.textBoxColor = "#ffffff";
this.inputBackgroundColor = "#ffffff";
this.inputOutlineColor = "#000000";
this.textAlign = "left";
this.fontFamily = "Arial";
this.fontFamily = "Sans Serif";
this.showCancelButton = true;
this.showButton3 = false;
this.showButton4 = false;
Expand Down Expand Up @@ -83,7 +83,7 @@
this.exitSpeed = 10;
this.activeOverlays = [];
this.Blur = 0;
this.Brightness = 100;
this.Brightness = 0;
this.Opacity = 100;
this.Invert = 0;
this.Saturation = 100;
Expand All @@ -95,6 +95,7 @@
this.SkewY = 0;
this.Rotation = 90;
this.Timeout = 0;
this.imageSettings = ['100%', '100%'];
}

getInfo() {
Expand Down Expand Up @@ -539,13 +540,13 @@
fontMenu: {
acceptReporters: true,
items: [
"Scratch",
"Sans Serif",
"Serif",
"Handwriting",
"Marker",
"Curly",
"Pixel",
"Scratch",
"Pixel"
],
},
buttonActionMenu: {
Expand Down Expand Up @@ -623,7 +624,7 @@
isWaitingInput(args) {
return this.isWaitingForInput;
}

Check warning on line 627 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
isDropdown(args) {
return this.isDropdownOpen;
}
Expand All @@ -632,28 +633,28 @@
const effect = args.EFFECT;
return this[effect];
}

Check warning on line 636 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
setEffect(args) {
const effect = args.EFFECT;
this[effect] = args.AMT;

this.activeOverlays.forEach((overlay) => {
this.updateEffect(overlay);
this.updateOverlay(overlay);
});
}

Check warning on line 645 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
changeEffect(args) {
const effect = args.EFFECT;
this[effect] = this[effect] + args.AMT;

Check warning on line 649 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
this.activeOverlays.forEach((overlay) => {
this.updateEffect(overlay);
this.updateOverlay(overlay);
});
}

Check warning on line 654 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
resetEffect(args) {
this.Blur = 0;
this.Brightness = 100;
this.Brightness = 0;
this.Opacity = 100;
this.Invert = 0;
this.Saturation = 100;
Expand All @@ -663,32 +664,12 @@
this.Scale = 100;
this.SkewX = 0;
this.SkewY = 0;

Check warning on line 667 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
this.activeOverlays.forEach((overlay) => {
this.updateEffect(overlay);
this.updateOverlay(overlay);
});
}

updateEffect(overlay) {
const newOpacity = this.Opacity / 100;
const newScale = this.Scale / 100;
overlay.style.filter = `
blur(${this.Blur}px)
brightness(${this.Brightness}%)
invert(${this.Invert}%)
saturate(${this.Saturation}%)
hue-rotate(${this.Hue}deg)
sepia(${this.Sepia}%)
contrast(${this.Contrast}%)
`;
overlay.style.opacity = newOpacity;
overlay.style.scale = newScale;
overlay.style.transform = `
SkewX(${this.SkewX}deg)
SkewY(${this.SkewY}deg)
`;
}

setColorSettings(args) {
const colorType = args.COLOR_TYPE;
const colorValue = args.COLOR;
Expand Down Expand Up @@ -759,10 +740,10 @@
this.textBoxBorderRadius = value;
break;
case "Button 1":
this.cancelButtonBorderRadius = value;
this.submitButtonBorderRadius = value;
break;
case "Button 2":
this.submitButtonBorderRadius = value;
this.cancelButtonBorderRadius = value;
break;
case "Button 3":
this.button3BorderRadius = value;
Expand All @@ -787,23 +768,23 @@
this.Rotation = Scratch.Cast.toNumber(ROTATE);

this.activeOverlays.forEach((overlay) => {
this.updateOverlayPosition(overlay);
this.updateOverlay(overlay);
});
}

Check warning on line 774 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
changeDirection(args) {
const ROTATE = args.ROTATE;
this.Rotation = this.Rotation + Scratch.Cast.toNumber(ROTATE);

this.activeOverlays.forEach((overlay) => {
this.updateOverlayPosition(overlay);
this.updateOverlay(overlay);
});
}

Check warning on line 783 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
reportDirection(args) {
return this.Rotation;
}

Check warning on line 787 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
setPrePosition(args) {
this.textBoxX = Scratch.Cast.toNumber(args.X);
this.textBoxY = Scratch.Cast.toNumber(args.Y) * -1;
Expand All @@ -814,7 +795,7 @@
this.textBoxY = Scratch.Cast.toNumber(args.Y) * -1;

this.activeOverlays.forEach((overlay) => {
this.updateOverlayPosition(overlay);
this.updateOverlay(overlay);
});
}

Expand All @@ -823,21 +804,38 @@
this.textBoxY = this.textBoxY + Scratch.Cast.toNumber(args.Y) * -1;

this.activeOverlays.forEach((overlay) => {
this.updateOverlayPosition(overlay);
this.updateOverlay(overlay);
});
}

updateOverlayPosition(overlay) {
updateOverlay(overlay) {
if (this.Rotation > 359) {
this.Rotation = 0;
} else if (this.Rotation < 1) {
this.Rotation = 360;
}

const newOpacity = this.Opacity / 100;
const newScale = this.Scale / 100;
const newBrightness = this.Brightness + 100;

overlay.style.transform = `
SkewX(${this.SkewX}deg)
SkewY(${this.SkewY}deg)
rotate(${this.Rotation - 90}deg)
`;
overlay.style.filter = `
blur(${this.Blur}px)
brightness(${newBrightness}%)
invert(${this.Invert}%)
saturate(${this.Saturation}%)
hue-rotate(${this.Hue}deg)
sepia(${this.Sepia}%)
contrast(${this.Contrast}%)
`;
overlay.style.opacity = newOpacity;
overlay.style.scale = newScale;

if (this.textBoxX !== null && this.textBoxY !== null) {
overlay.style.left = `${41 + this.textBoxX}%`;
overlay.style.top = `${44 + this.textBoxY}%`;
Expand All @@ -862,12 +860,12 @@
setFontFamily(args) {
this.fontFamily = args.FONT;
}

Check warning on line 863 in extensions/SharkPool/BetterInput.js

View workflow job for this annotation

GitHub Actions / build

Trailing spaces not allowed
setTimeout(args) {
this.Timeout = args.TIME;
this.Condition = args.CONDITION;
}

reportTimeout(args) {
return this.Timeout;
}
Expand Down Expand Up @@ -975,17 +973,16 @@
overlay.style.fontSize = this.fontSize;
overlay.style.textAlign = this.textAlign;
overlay.style.fontFamily = this.fontFamily;
this.updateEffect(overlay);

const overlayImageContainer = document.createElement("div");
overlayImageContainer.style.background = `url("${encodeURI(this.overlayImage)}")`;

//maybe in a future update we can make these customizable too...
overlayImageContainer.style.width = "100%";
overlayImageContainer.style.height = "100%";
overlayImageContainer.style.width = '100%';
overlayImageContainer.style.height = '100%';
overlayImageContainer.style.position = "absolute";
overlayImageContainer.style.top = "0";
overlayImageContainer.style.left = "0";
overlayImageContainer.style.top = 0;
overlayImageContainer.style.left = 0;
overlayImageContainer.style.borderRadius = this.textBoxBorderRadius + "px";
overlayImageContainer.style.zIndex = "-1";

if (this.forceInput !== "Disabled") {
Expand All @@ -1006,7 +1003,13 @@
event.key === "Enter") ||
event.key === overlayInput
) {
this.userInput = inputField.value;
if (this.isInputEnabled === "Multi-Select Dropdown") {
inputField.value = inputField.value.substring(1);
inputField.value = inputField.value.replace(this.splitKey, '", "');
this.userInput = '["' + inputField.value + '"]';
} else {
this.userInput = inputField.value;
}
this.closeOverlay(overlay);
resolve();
}
Expand Down Expand Up @@ -1062,7 +1065,13 @@

submitButton.addEventListener("click", () => {
if (this.isInputEnabled !== "Disabled") {
this.userInput = inputField.value;
if (this.isInputEnabled === "Multi-Select Dropdown") {
inputField.value = inputField.value.substring(1);
inputField.value = inputField.value.replace(this.splitKey, '", "');
this.userInput = '["' + inputField.value + '"]';
} else {
this.userInput = inputField.value;
}
} else {
this.userInput = this.submitButtonText;
}
Expand All @@ -1081,9 +1090,7 @@
this.cancelButtonBorderRadius + "px";
cancelButton.style.cursor = "pointer";
cancelButton.textContent = this.cancelButtonText;
cancelButton.style.display = this.showCancelButton
? "inline-block"
: "none";
cancelButton.style.display = this.showCancelButton ? "inline-block" : "none";

cancelButton.addEventListener("click", () => {
if (this.isInputEnabled === "Disabled") {
Expand Down Expand Up @@ -1177,7 +1184,7 @@
if (this.isInputEnabled === "Multi-Select Dropdown") {
const selectedOptions = inputField.value.split(this.splitKey);
const isSelected = selectedOptions.includes(options[i - 1]);

if (isSelected) {
inputField.value = selectedOptions.filter(option => option !== options[i - 1]).join(this.splitKey);
} else {
Expand Down Expand Up @@ -1287,6 +1294,11 @@
document.addEventListener("mozfullscreenchange", resizeHandler);
document.addEventListener("MSFullscreenChange", resizeHandler);

this.activeOverlays.forEach((overlay) => {
this.updateOverlay(overlay);
overlay.style.transform = `rotate(${this.Rotation - 90}deg)`;
});

const observer = new MutationObserver((mutationsList) => {
for (const mutation of mutationsList) {
if (
Expand Down Expand Up @@ -1372,7 +1384,7 @@
}
document.body.removeChild(overlay);
}

closeOverlay(overlay) {
this.isWaitingForInput = false;
this.isDropdownOpen = false;
Expand Down

0 comments on commit 559851e

Please sign in to comment.