undo all of those reverted changes from new server

Author: JeremyGamer13

favicon.png

@@ -63,9 +63,9 @@
     "protobufjs": "^7.3.2",
     "query-string": "^5.1.1",
     "raw-loader": "^0.5.1",
-    "react": "^16.0.0",
+    "react": "^16.14.0",
     "react-contextmenu": "2.9.4",
-    "react-dom": "^16.0.0",
+    "react-dom": "^16.14.0",
     "react-draggable": "3.0.5",
     "react-ga": "2.5.3",
     "react-intl": "2.9.0",

package.json

@@ -78,13 +78,13 @@ export default async function ({ addon, msg }) {
     return keys;
   }
 
-  for (const opcode of ["sensing_keyoptions", "event_whenkeypressed"]) {
+  for (const opcode of ["sensing_keyoptions", "event_whenkeypressed", "event_whenkeyhit"]) {
     const block = ScratchBlocks.Blocks[opcode];
     const originalInit = block.init;
     block.init = function (...args) {
       const originalJsonInit = this.jsonInit;
       this.jsonInit = function (obj) {
-        appendKeys(obj.args0[0].options, opcode === "event_whenkeypressed");
+        appendKeys(obj.args0[0].options, opcode === "event_whenkeypressed" || opcode === "event_whenkeyhit");
         return originalJsonInit.call(this, obj);
       };
       return originalInit.call(this, ...args);
@@ -97,7 +97,7 @@ export default async function ({ addon, msg }) {
     if (workspace && flyout) {
       const allBlocks = [...workspace.getAllBlocks(), ...flyout.getWorkspace().getAllBlocks()];
       for (const block of allBlocks) {
-        if (block.type !== "event_whenkeypressed" && block.type !== "sensing_keyoptions") {
+        if (block.type !== "event_whenkeypressed" && block.type !== "event_whenkeyhit" && block.type !== "sensing_keyoptions") {
           continue;
         }
         const input = block.inputList[0];
@@ -110,7 +110,7 @@ export default async function ({ addon, msg }) {
         }
         field.menuGenerator_ = appendKeys(
           defaultKeys ? [...defaultKeys] : field.menuGenerator_,
-          block.type === "event_whenkeypressed"
+          block.type === "event_whenkeypressed" || block.type === "event_whenkeyhit"
         );
       }
     }

src/addons/addons/editor-extra-keys/userscript.js

@@ -35,7 +35,7 @@ export default async function ({ addon, console, msg }) {
     const result = new Set();
     for (const blocks of allBlocks) {
       for (const block of Object.values(blocks._blocks)) {
-        if (block.opcode === "event_whenkeypressed" || block.opcode === "sensing_keyoptions") {
+        if (block.opcode === "event_whenkeypressed" || block.opcode === "event_whenkeyhit" || block.opcode === "sensing_keyoptions") {
           // For blocks like "key (my variable) pressed?", the sensing_keyoptions still exists but has a null parent.
           if (block.opcode === "sensing_keyoptions" && !block.parent) {
             continue;

src/addons/addons/gamepad/userscript.js

@@ -4,7 +4,7 @@ import Modal from '../../containers/modal.jsx';
 import Box from '../box/box.jsx';
 import { defineMessages, injectIntl, intlShape, FormattedMessage } from 'react-intl';
 
-import plusIcon from './icon--plus.svg';
+import dropperIcon from './icon--dropper.svg';
 
 import booleanInputIcon from './icon--boolean-input.svg';
 import textInputIcon from './icon--text-input.svg';
@@ -153,7 +153,7 @@ const BlockColorSection = props => (
                     onChange={props.onBlockColorChange}
                 />
                 <img
-                    src={plusIcon}
+                    src={dropperIcon}
                     className={styles.customPlus}
                 />
             </div>
@@ -224,6 +224,32 @@ const CustomProcedures = props => (
                         />
                     </div>
                 </div>
+                <div
+                    className={styles.optionCard}
+                    role="button"
+                    tabIndex="0"
+                    onClick={props.onAddCommand}
+                    style={{display: "none"}} //shhh
+                >
+                    <img
+                        className={styles.optionIcon}
+                        src={stackBlockIcon}
+                    />
+                    <div className={styles.optionTitle}>
+                        <FormattedMessage
+                            defaultMessage="Add an input"
+                            description="Label for button to add a command input"
+                            id="gui.customProcedures.addAnInputCommand"
+                        />
+                    </div>
+                    <div className={styles.optionDescription}>
+                        <FormattedMessage
+                            defaultMessage="command"
+                            description="Description of the command input type"
+                            id="gui.customProcedures.commandType"
+                        />
+                    </div>
+                </div>
                 <div
                     className={styles.optionCard}
                     role="button"
@@ -396,6 +422,7 @@ CustomProcedures.propTypes = {
     componentRef: PropTypes.func.isRequired,
     intl: intlShape,
     onAddBoolean: PropTypes.func.isRequired,
+    onAddCommand: PropTypes.func.isRequired,
     onAddLabel: PropTypes.func.isRequired,
     onAddTextNumber: PropTypes.func.isRequired,
     onCancel: PropTypes.func.isRequired,

src/components/custom-procedures/custom-procedures.jsx

@@ -34,20 +34,28 @@
     padding: 0.25rem;
     padding-bottom: 0;
 }
-.library-item-new {
+.library-item-sound.library-item-new {
+    /*
+        we have to use hue-rotate,
+        since the waveforms have their color baked in by design
+        & the play button styling would be annoying
+    */
     filter: hue-rotate(60deg);
 }
 .library-item-new-badge {
     border-radius: 1024px;
     color: white;
     font-size: 10px;
     font-weight: bold;
-    background-color: $sound-primary;
+    background-color: #EB6566;
     padding: 1px 5px;
     position: absolute;
     left: -8px;
     top: -8px;
 }
+.library-item-sound .library-item-new-badge {
+    background-color: $sound-primary;
+}
 
 .library-item-extension {
     align-self: stretch;
@@ -60,6 +68,12 @@
 .library-item-sound:hover {
     border-color: $sound-primary;
 }
+.library-item-new:hover {
+    border-color: #EB6566;
+}
+.library-item-new.library-item-sound:hover {
+    border-color: $sound-primary;
+}
 
 .library-item-favorite {
     background: transparent;

src/components/custom-procedures/icon--dropper.svg

@@ -61,7 +61,7 @@ class ShareButton extends React.Component {
     }
     async handleMessageEvent(e) {
         if (!e.origin.startsWith(`https://penguinmod.com`)) {
-            //return; // BTODO: uncomment this line for prod (also change the link)
+            return;
         }
 
         if (!e.data.p4) {

src/components/custom-procedures/icon--plus.svg

@@ -181,17 +181,20 @@ const CustomExtensionModal = props => (
                             />
                         </p>
                     )}
-                    <p>
-                        <FormattedMessage
-                            // eslint-disable-next-line max-len
-                            defaultMessage="Your browser may not allow PenguinMod to access certain sites. If this is causing issues for you, try loading from a file or text instead."
-                            description="Message that appears in custom extension prompt"
-                            id="pm.customExtensionModal.corsProblem"
-                        />
-                    </p>
                 </React.Fragment>
             )}
 
+            {props.type === 'url' && (
+                <p>
+                    <FormattedMessage
+                        // eslint-disable-next-line max-len
+                        defaultMessage="Your browser may not allow PenguinMod to access certain sites. If this is causing issues for you, try loading from a file or text instead."
+                        description="Message that appears in custom extension prompt"
+                        id="pm.customExtensionModal.corsProblem"
+                    />
+                </p>
+            )}
+
             <label className={styles.checkboxContainer}>
                 <FancyCheckbox
                     className={styles.basicCheckbox}