Skip to content

Commit 9bf8f43

Browse files
gonfunkosebjacobs
authored andcommitted
fix: temporarily disable functionality in scratch-gui for compatibility with patched scratch-blocks (#1)
1 parent 7a72429 commit 9bf8f43

File tree

3 files changed

+68
-47
lines changed

3 files changed

+68
-47
lines changed

src/containers/blocks.jsx

Lines changed: 33 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -95,14 +95,24 @@ class Blocks extends React.Component {
9595
this.ScratchBlocks.statusButtonCallback = this.handleConnectionModalStart;
9696
this.ScratchBlocks.recordSoundCallback = this.handleOpenSoundRecorder;
9797

98-
this.ScratchBlocks.FieldColourSlider.activateEyedropper_ = this.props.onActivateColorPicker;
98+
// this.ScratchBlocks.FieldColourSlider.activateEyedropper_ = this.props.onActivateColorPicker;
9999
this.ScratchBlocks.Procedures.externalProcedureDefCallback = this.props.onActivateCustomProcedures;
100100
this.ScratchBlocks.ScratchMsgs.setLocale(this.props.locale);
101101

102+
const theme = this.ScratchBlocks.Theme.defineTheme('Scratch', {
103+
'base': this.ScratchBlocks.Themes.Zelos,
104+
'startHats': true
105+
});
102106
const workspaceConfig = defaultsDeep({},
103107
Blocks.defaultOptions,
104108
this.props.options,
105-
{rtl: this.props.isRtl, toolbox: this.props.toolboxXML, colours: getColorsForTheme(this.props.theme)}
109+
{
110+
rtl: this.props.isRtl,
111+
toolbox: this.props.toolboxXML,
112+
colours: getColorsForTheme(this.props.theme),
113+
renderer: 'zelos',
114+
theme: theme,
115+
}
106116
);
107117
this.workspace = this.ScratchBlocks.inject(this.blocks, workspaceConfig);
108118

@@ -129,10 +139,11 @@ class Blocks extends React.Component {
129139
// we actually never want the workspace to enable "refresh toolbox" - this basically re-renders the
130140
// entire toolbox every time we reset the workspace. We call updateToolbox as a part of
131141
// componentDidUpdate so the toolbox will still correctly be updated
132-
this.setToolboxRefreshEnabled = this.workspace.setToolboxRefreshEnabled.bind(this.workspace);
133-
this.workspace.setToolboxRefreshEnabled = () => {
134-
this.setToolboxRefreshEnabled(false);
135-
};
142+
this.setToolboxRefreshEnabled = () => {};
143+
// this.workspace.setToolboxRefreshEnabled.bind(this.workspace);
144+
// this.workspace.setToolboxRefreshEnabled = () => {
145+
// this.setToolboxRefreshEnabled(false);
146+
// };
136147

137148
// @todo change this when blockly supports UI events
138149
addFunctionListener(this.workspace, 'translate', this.onWorkspaceMetricsChange);
@@ -213,20 +224,20 @@ class Blocks extends React.Component {
213224
this.ScratchBlocks.ScratchMsgs.setLocale(this.props.locale);
214225
this.props.vm.setLocale(this.props.locale, this.props.messages)
215226
.then(() => {
216-
this.workspace.getFlyout().setRecyclingEnabled(false);
227+
// this.workspace.getFlyout().setRecyclingEnabled(false);
217228
this.props.vm.refreshWorkspace();
218229
this.requestToolboxUpdate();
219230
this.withToolboxUpdates(() => {
220-
this.workspace.getFlyout().setRecyclingEnabled(true);
231+
// this.workspace.getFlyout().setRecyclingEnabled(true);
221232
});
222233
});
223234
}
224235

225236
updateToolbox () {
226237
this.toolboxUpdateTimeout = false;
227238

228-
const categoryId = this.workspace.toolbox_.getSelectedCategoryId();
229-
const offset = this.workspace.toolbox_.getCategoryScrollOffset();
239+
// const categoryId = this.workspace.toolbox_.getSelectedItem().getId();
240+
// const offset = this.workspace.toolbox_.getCategoryScrollOffset();
230241
this.workspace.updateToolbox(this.props.toolboxXML);
231242
this._renderedToolboxXML = this.props.toolboxXML;
232243

@@ -235,13 +246,13 @@ class Blocks extends React.Component {
235246
// Using the setter function will rerender the entire toolbox which we just rendered.
236247
this.workspace.toolboxRefreshEnabled_ = true;
237248

238-
const currentCategoryPos = this.workspace.toolbox_.getCategoryPositionById(categoryId);
239-
const currentCategoryLen = this.workspace.toolbox_.getCategoryLengthById(categoryId);
240-
if (offset < currentCategoryLen) {
241-
this.workspace.toolbox_.setFlyoutScrollPos(currentCategoryPos + offset);
242-
} else {
243-
this.workspace.toolbox_.setFlyoutScrollPos(currentCategoryPos);
244-
}
249+
// const currentCategoryPos = this.workspace.toolbox_.getCategoryPositionById(categoryId);
250+
// const currentCategoryLen = this.workspace.toolbox_.getCategoryLengthById(categoryId);
251+
// if (offset < currentCategoryLen) {
252+
// this.workspace.toolbox_.setFlyoutScrollPos(currentCategoryPos + offset);
253+
// } else {
254+
// this.workspace.toolbox_.setFlyoutScrollPos(currentCategoryPos);
255+
// }
245256

246257
const queue = this.toolboxUpdateQueue;
247258
this.toolboxUpdateQueue = [];
@@ -329,16 +340,16 @@ class Blocks extends React.Component {
329340
}
330341
}
331342
onScriptGlowOn (data) {
332-
this.workspace.glowStack(data.id, true);
343+
// this.workspace.glowStack(data.id, true);
333344
}
334345
onScriptGlowOff (data) {
335-
this.workspace.glowStack(data.id, false);
346+
// this.workspace.glowStack(data.id, false);
336347
}
337348
onBlockGlowOn (data) {
338-
this.workspace.glowBlock(data.id, true);
349+
// this.workspace.glowBlock(data.id, true);
339350
}
340351
onBlockGlowOff (data) {
341-
this.workspace.glowBlock(data.id, false);
352+
// this.workspace.glowBlock(data.id, false);
342353
}
343354
onVisualReport (data) {
344355
this.workspace.reportValue(data.id, data.value);
@@ -382,7 +393,7 @@ class Blocks extends React.Component {
382393

383394
// Remove and reattach the workspace listener (but allow flyout events)
384395
this.workspace.removeChangeListener(this.props.vm.blockListener);
385-
const dom = this.ScratchBlocks.Xml.textToDom(data.xml);
396+
const dom = this.ScratchBlocks.utils.xml.textToDom(data.xml);
386397
try {
387398
this.ScratchBlocks.Xml.clearWorkspaceAndLoadFromXml(dom, this.workspace);
388399
} catch (error) {

src/lib/blocks.js

Lines changed: 25 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
* @return {ScratchBlocks} ScratchBlocks connected with the vm
66
*/
77
export default function (vm, useCatBlocks) {
8-
const ScratchBlocks = useCatBlocks ? require('cat-blocks') : require('scratch-blocks');
8+
const {ScratchBlocks} = useCatBlocks ? require('cat-blocks') : require('scratch-blocks');
99
const jsonForMenuBlock = function (name, menuOptionsFn, colors, start) {
1010
return {
1111
message0: '%1',
@@ -82,7 +82,7 @@ export default function (vm, useCatBlocks) {
8282
}
8383
menu.push([
8484
ScratchBlocks.ScratchMsgs.translate('SOUND_RECORD', 'record...'),
85-
ScratchBlocks.recordSoundCallback
85+
'SOUND_RECORD'
8686
]);
8787
return menu;
8888
};
@@ -158,6 +158,16 @@ export default function (vm, useCatBlocks) {
158158
ScratchBlocks.Blocks.sound_sounds_menu.init = function () {
159159
const json = jsonForMenuBlock('SOUND_MENU', soundsMenu, soundColors, []);
160160
this.jsonInit(json);
161+
this.inputList[0].removeField('SOUND_MENU');
162+
this.inputList[0].appendField(new ScratchBlocks.FieldDropdown(() => {
163+
return soundsMenu();
164+
}, (newValue) => {
165+
if (newValue === 'SOUND_RECORD') {
166+
ScratchBlocks.recordSoundCallback();
167+
return null;
168+
}
169+
return newValue;
170+
}), 'SOUND_MENU');
161171
};
162172

163173
ScratchBlocks.Blocks.looks_costume.init = function () {
@@ -323,16 +333,16 @@ export default function (vm, useCatBlocks) {
323333
return monitoredBlock ? monitoredBlock.isMonitored : false;
324334
};
325335

326-
ScratchBlocks.FlyoutExtensionCategoryHeader.getExtensionState = function (extensionId) {
327-
if (vm.getPeripheralIsConnected(extensionId)) {
328-
return ScratchBlocks.StatusButtonState.READY;
329-
}
330-
return ScratchBlocks.StatusButtonState.NOT_READY;
331-
};
332-
333-
ScratchBlocks.FieldNote.playNote_ = function (noteNum, extensionId) {
334-
vm.runtime.emit('PLAY_NOTE', noteNum, extensionId);
335-
};
336+
// ScratchBlocks.FlyoutExtensionCategoryHeader.getExtensionState = function (extensionId) {
337+
// if (vm.getPeripheralIsConnected(extensionId)) {
338+
// return ScratchBlocks.StatusButtonState.READY;
339+
// }
340+
// return ScratchBlocks.StatusButtonState.NOT_READY;
341+
// };
342+
//
343+
// ScratchBlocks.FieldNote.playNote_ = function (noteNum, extensionId) {
344+
// vm.runtime.emit('PLAY_NOTE', noteNum, extensionId);
345+
// };
336346

337347
// Use a collator's compare instead of localeCompare which internally
338348
// creates a collator. Using this is a lot faster in browsers that create a
@@ -341,9 +351,9 @@ export default function (vm, useCatBlocks) {
341351
sensitivity: 'base',
342352
numeric: true
343353
});
344-
ScratchBlocks.scratchBlocksUtils.compareStrings = function (str1, str2) {
345-
return collator.compare(str1, str2);
346-
};
354+
// ScratchBlocks.scratchBlocksUtils.compareStrings = function (str1, str2) {
355+
// return collator.compare(str1, str2);
356+
// };
347357

348358
// Blocks wants to know if 3D CSS transforms are supported. The cross
349359
// section of browsers Scratch supports and browsers that support 3D CSS

src/lib/make-toolbox-xml.js

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import ScratchBlocks from 'scratch-blocks';
1+
import {ScratchBlocks} from 'scratch-blocks';
22
import {defaultColors} from './themes';
33

44
const categorySeparator = '<sep gap="36"/>';
@@ -13,7 +13,7 @@ const motion = function (isInitialSetup, isStage, targetId, colors) {
1313
);
1414
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
1515
return `
16-
<category name="%{BKY_CATEGORY_MOTION}" id="motion" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
16+
<category name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_MOTION', 'Motion')}" id="motion" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
1717
${isStage ? `
1818
<label text="${stageSelected}"></label>
1919
` : `
@@ -158,7 +158,7 @@ const looks = function (isInitialSetup, isStage, targetId, costumeName, backdrop
158158
const hmm = ScratchBlocks.ScratchMsgs.translate('LOOKS_HMM', 'Hmm...');
159159
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
160160
return `
161-
<category name="%{BKY_CATEGORY_LOOKS}" id="looks" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
161+
<category name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_LOOKS', 'Looks')}" id="looks" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
162162
${isStage ? '' : `
163163
<block type="looks_sayforsecs">
164164
<value name="MESSAGE">
@@ -294,7 +294,7 @@ const looks = function (isInitialSetup, isStage, targetId, costumeName, backdrop
294294
const sound = function (isInitialSetup, isStage, targetId, soundName, colors) {
295295
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
296296
return `
297-
<category name="%{BKY_CATEGORY_SOUND}" id="sound" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
297+
<category name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_SOUND', 'Sound')}" id="sound" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
298298
<block id="${targetId}_sound_playuntildone" type="sound_playuntildone">
299299
<value name="SOUND_MENU">
300300
<shadow type="sound_sounds_menu">
@@ -350,7 +350,7 @@ const sound = function (isInitialSetup, isStage, targetId, soundName, colors) {
350350
const events = function (isInitialSetup, isStage, targetId, colors) {
351351
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
352352
return `
353-
<category name="%{BKY_CATEGORY_EVENTS}" id="events" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
353+
<category name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_EVENTS', 'Events')}" id="events" colour="${colors.primary}" secondaryColour="${colors.tertiary}">
354354
<block type="event_whenflagclicked"/>
355355
<block type="event_whenkeypressed">
356356
</block>
@@ -391,7 +391,7 @@ const control = function (isInitialSetup, isStage, targetId, colors) {
391391
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
392392
return `
393393
<category
394-
name="%{BKY_CATEGORY_CONTROL}"
394+
name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_CONTROL', 'Control')}"
395395
id="control"
396396
colour="${colors.primary}"
397397
secondaryColour="${colors.tertiary}">
@@ -444,7 +444,7 @@ const sensing = function (isInitialSetup, isStage, targetId, colors) {
444444
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
445445
return `
446446
<category
447-
name="%{BKY_CATEGORY_SENSING}"
447+
name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_SENSING', 'Sensing')}"
448448
id="sensing"
449449
colour="${colors.primary}"
450450
secondaryColour="${colors.tertiary}">
@@ -526,7 +526,7 @@ const operators = function (isInitialSetup, isStage, targetId, colors) {
526526
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
527527
return `
528528
<category
529-
name="%{BKY_CATEGORY_OPERATORS}"
529+
name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_OPERATORS', 'Operators')}"
530530
id="operators"
531531
colour="${colors.primary}"
532532
secondaryColour="${colors.tertiary}">
@@ -715,7 +715,7 @@ const variables = function (isInitialSetup, isStage, targetId, colors) {
715715
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
716716
return `
717717
<category
718-
name="%{BKY_CATEGORY_VARIABLES}"
718+
name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_VARIABLES', 'Variables')}"
719719
id="variables"
720720
colour="${colors.primary}"
721721
secondaryColour="${colors.tertiary}"
@@ -728,7 +728,7 @@ const myBlocks = function (isInitialSetup, isStage, targetId, colors) {
728728
// Note: the category's secondaryColour matches up with the blocks' tertiary color, both used for border color.
729729
return `
730730
<category
731-
name="%{BKY_CATEGORY_MYBLOCKS}"
731+
name="${ScratchBlocks.ScratchMsgs.translate('CATEGORY_MYBLOCKS', 'My Blocks')}"
732732
id="myBlocks"
733733
colour="${colors.primary}"
734734
secondaryColour="${colors.tertiary}"

0 commit comments

Comments
 (0)