Troubleshooting updates v1.4.25 (#1012)

* sim_fix

ES version update

* fieldeditors-es-upgrade-to-es2017

Update es to fix issue with fieldeditors.

* editor-es-upgrade-to-es2017

Update es that fixes an issue with the editor.

* editor-download-dialog-fix

Solving a download error that arose due to problems with the buttons in the dialog box.

* return_field_motors

We return the fieldmotors field, because it is necessary about the choice of types of motors: medium, large, one or two.

* update-fields-for-motor-blocks

Set the blocks to the fieldmotors field. Change the name of the blocks for the motors.

* enable-debugger

Instead of the slowmo mode, which was before, a debugger was added, in which slowmo is present.

* fix-field-music

It turned out to update the fieldmusic menu. The menu is now displayed in the correct position.

* Update field_music.ts

* fix-field-brickbutton

Fixed issue with button select menu position from ev3 brick.

* Update dialogs.tsx

* Update field_motors.ts

Repartition of Label for fieldmotos, now it's more readable, it's better.

* motors-new-icon

Created new icons for motors for dropdown image.

* remove-ai-files-for-motors-icon

Remove ai image files for motors
This commit is contained in:
Dmitriy Antipov
2023-04-25 22:06:54 +03:00
committed by GitHub
parent 512a441bca
commit cabcb048e3
23 changed files with 252 additions and 81 deletions

View File

@ -2,6 +2,7 @@
/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
import { FieldPorts } from "./field_ports";
import { FieldMotors } from "./field_motors";
import { FieldBrickButtons } from "./field_brickbuttons";
import { FieldColorEnum } from "./field_color";
import { FieldMusic } from "./field_music";
@ -13,6 +14,9 @@ pxt.editor.initFieldExtensionsAsync = function (opts: pxt.editor.FieldExtensionO
fieldEditors: [{
selector: "ports",
editor: FieldPorts
}, {
selector: "motors",
editor: FieldMotors
}, {
selector: "brickbuttons",
editor: FieldBrickButtons

View File

@ -120,20 +120,17 @@ export class FieldBrickButtons extends Blockly.FieldDropdown implements Blockly.
Blockly.DropDownDiv.setColour('#ffffff', '#dddddd');
// Calculate positioning based on the field position.
let scale = (<Blockly.WorkspaceSvg>this.sourceBlock_.workspace).scale;
let bBox = { width: this.size_.width, height: this.size_.height };
bBox.width *= scale;
bBox.height *= scale;
let position = this.fieldGroup_.getBoundingClientRect();
let primaryX = position.left + bBox.width / 2;
let primaryY = position.top + bBox.height;
let secondaryX = primaryX;
let secondaryY = position.top;
// Set bounds to workspace; show the drop-down.
(Blockly.DropDownDiv as any).setBoundsElement((<Blockly.WorkspaceSvg>this.sourceBlock_.workspace).getParentSvg().parentNode);
(Blockly.DropDownDiv as any).show(this, primaryX, primaryY, secondaryX, secondaryY,
this.onHide_.bind(this));
// Position based on the field position.
Blockly.DropDownDiv.showPositionedByField(this, this.onHide_.bind(this));
// Update colour to look selected.
let source = this.sourceBlock_ as Blockly.BlockSvg;
this.savedPrimary_ = source?.getColour();
if (source?.isShadow()) {
source.setColour(source.getColourTertiary());
} else if (this.borderRect_) {
this.borderRect_.setAttribute('fill', (this.sourceBlock_ as Blockly.BlockSvg).getColourTertiary());
}
}
/**
@ -157,5 +154,12 @@ export class FieldBrickButtons extends Blockly.FieldDropdown implements Blockly.
content.removeAttribute('aria-haspopup');
content.removeAttribute('aria-activedescendant');
(content as HTMLElement).style.width = '';
// Update color (deselect) on dropdown hide
let source = this.sourceBlock_ as Blockly.BlockSvg;
if (source?.isShadow()) {
source.setColour(this.savedPrimary_);
} else if (this.borderRect_) {
this.borderRect_.setAttribute('fill', this.savedPrimary_);
}
};
}

View File

@ -0,0 +1,133 @@
/// <reference path="../node_modules/pxt-core/localtypings/blockly.d.ts"/>
/// <reference path="../node_modules/pxt-core/built/pxtblocks.d.ts"/>
/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
export interface FieldMotorsOptions extends pxtblockly.FieldImagesOptions {
columns?: string;
width?: string;
//sort?: boolean;
}
export class FieldMotors extends pxtblockly.FieldImages implements Blockly.FieldCustom {
public isFieldCustom_ = true;
//public shouldSort_: boolean;
constructor(text: string, options: FieldMotorsOptions, validator?: Function) {
super(text, options, validator);
this.columns_ = parseInt(options.columns) || 4;
this.width_ = parseInt(options.width) || 400;
//this.shouldSort_ = options.sort;
this.addLabel_ = true;
this.renderSelectedImage_ = Blockly.FieldDropdown.prototype.renderSelectedText_;
this.updateSize_ = (Blockly.Field as any).prototype.updateSize_;
}
/**
* Create a dropdown menu under the text.
* @private
*/
public showEditor_() {
// If there is an existing drop-down we own, this is a request to hide the drop-down.
if (Blockly.DropDownDiv.hideIfOwner(this)) {
return;
}
let sourceBlock = this.sourceBlock_ as Blockly.BlockSvg;
// If there is an existing drop-down someone else owns, hide it immediately and clear it.
Blockly.DropDownDiv.hideWithoutAnimation();
Blockly.DropDownDiv.clearContent();
// Populate the drop-down with the icons for this field.
let dropdownDiv = Blockly.DropDownDiv.getContentDiv();
let contentDiv = document.createElement('div');
// Accessibility properties
contentDiv.setAttribute('role', 'menu');
contentDiv.setAttribute('aria-haspopup', 'true');
const options = this.getOptions();
//if (this.shouldSort_) options.sort();
for (let i = 0; i < options.length; i++) {
const content = (options[i] as any)[0]; // Human-readable text or image.
const value = (options[i] as any)[1]; // Language-neutral value.
// Icons with the type property placeholder take up space but don't have any functionality
// Use for special-case layouts
if (content.type == 'placeholder') {
let placeholder = document.createElement('span');
placeholder.setAttribute('class', 'blocklyDropDownPlaceholder');
placeholder.style.width = content.width + 'px';
placeholder.style.height = content.height + 'px';
contentDiv.appendChild(placeholder);
continue;
}
let button = document.createElement('button');
button.setAttribute('id', ':' + i); // For aria-activedescendant
button.setAttribute('role', 'menuitem');
button.setAttribute('class', 'blocklyDropDownButton');
button.title = content.alt;
if ((this as any).columns_) {
button.style.width = (((this as any).width_ / (this as any).columns_) - 8) + 'px';
//button.style.height = ((this.width_ / this.columns_) - 8) + 'px';
} else {
button.style.width = content.width + 'px';
button.style.height = content.height + 'px';
}
let backgroundColor = sourceBlock.getColour();
if (value == this.getValue()) {
// This icon is selected, show it in a different colour
backgroundColor = sourceBlock.getColourTertiary();
button.setAttribute('aria-selected', 'true');
}
button.style.backgroundColor = backgroundColor;
button.style.borderColor = sourceBlock.getColourTertiary();
Blockly.bindEvent_(button, 'click', this, this.buttonClick_);
Blockly.bindEvent_(button, 'mouseover', button, function () {
this.setAttribute('class', 'blocklyDropDownButton blocklyDropDownButtonHover');
contentDiv.setAttribute('aria-activedescendant', this.id);
});
Blockly.bindEvent_(button, 'mouseout', button, function () {
this.setAttribute('class', 'blocklyDropDownButton');
contentDiv.removeAttribute('aria-activedescendant');
});
let buttonImg = document.createElement('img');
buttonImg.src = content.src;
//buttonImg.alt = icon.alt;
// Upon click/touch, we will be able to get the clicked element as e.target
// Store a data attribute on all possible click targets so we can match it to the icon.
button.setAttribute('data-value', value);
buttonImg.setAttribute('data-value', value);
button.appendChild(buttonImg);
if (this.addLabel_) {
const buttonText = this.createTextNode_(content.alt);
buttonText.setAttribute('data-value', value);
buttonText.style.whiteSpace = 'inherit';
buttonText.style.width = 'auto';
buttonText.style.padding = '0 10px';
button.appendChild(buttonText);
}
contentDiv.appendChild(button);
}
contentDiv.style.width = (this as any).width_ + 'px';
dropdownDiv.appendChild(contentDiv);
Blockly.DropDownDiv.setColour(sourceBlock.getColour(), sourceBlock.getColourTertiary());
// Position based on the field position.
Blockly.DropDownDiv.showPositionedByField(this, this.onHideCallback.bind(this));
// Update colour to look selected.
this.savedPrimary_ = sourceBlock?.getColour();
if (sourceBlock?.isShadow()) {
sourceBlock.setColour(sourceBlock.style.colourTertiary);
} else if (this.borderRect_) {
this.borderRect_.setAttribute('fill', sourceBlock.style.colourTertiary);
}
}
trimOptions_() {
}
protected buttonClick_ = function (e: any) {
let value = e.target.getAttribute('data-value');
this.setValue(value);
Blockly.DropDownDiv.hide();
};
}

View File

@ -49,7 +49,7 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
Blockly.DropDownDiv.hideWithoutAnimation();
Blockly.DropDownDiv.clearContent();
// Populate the drop-down with the icons for this field.
let dropdownDiv = Blockly.DropDownDiv.getContentDiv();
let dropdownDiv = Blockly.DropDownDiv.getContentDiv() as HTMLElement;
let contentDiv = document.createElement('div');
// Accessibility properties
contentDiv.setAttribute('role', 'menu');
@ -67,8 +67,7 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
// Accessibility properties
categoriesDiv.setAttribute('role', 'menu');
categoriesDiv.setAttribute('aria-haspopup', 'true');
// FIXME: tertiary color?
categoriesDiv.style.backgroundColor = this.sourceBlock_.getColour();
categoriesDiv.style.backgroundColor = (this.sourceBlock_ as Blockly.BlockSvg).getColourTertiary();
categoriesDiv.className = 'blocklyMusicFieldCategories';
this.refreshCategories(categoriesDiv, categories);
@ -82,31 +81,18 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
dropdownDiv.appendChild(categoriesDiv);
dropdownDiv.appendChild(contentDiv);
Blockly.DropDownDiv.setColour(this.sourceBlock_.getColour(),
// FIXME: tertiary color?
this.sourceBlock_.getColour());
// Calculate positioning based on the field position.
let scale = (<Blockly.WorkspaceSvg>this.sourceBlock_.workspace).scale;
let bBox = { width: this.size_.width, height: this.size_.height };
bBox.width *= scale;
bBox.height *= scale;
let position = this.fieldGroup_.getBoundingClientRect();
let primaryX = position.left + bBox.width / 2;
let primaryY = position.top + bBox.height;
let secondaryX = primaryX;
let secondaryY = position.top;
// Set bounds to workspace; show the drop-down.
(Blockly.DropDownDiv as any).setBoundsElement((<Blockly.WorkspaceSvg>this.sourceBlock_.workspace).getParentSvg().parentNode);
(Blockly.DropDownDiv as any).show(this, primaryX, primaryY, secondaryX, secondaryY,
this.onHide_.bind(this));
Blockly.DropDownDiv.setColour(this.sourceBlock_.getColour(), (this.sourceBlock_ as Blockly.BlockSvg).getColourTertiary());
// Position based on the field position.
Blockly.DropDownDiv.showPositionedByField(this, this.onHide_.bind(this));
// Update colour to look selected.
if (this.sourceBlock_.isShadow()) {
this.savedPrimary_ = this.sourceBlock_.getColour();
// FIXME
// this.sourceBlock_.setColour(this.sourceBlock_.getColourTertiary(),
// this.sourceBlock_.getColourSecondary(), this.sourceBlock_.getColourTertiary());
let source = this.sourceBlock_ as Blockly.BlockSvg;
this.savedPrimary_ = source?.getColour();
if (source?.isShadow()) {
source.setColour(source.getColourTertiary());
} else if (this.borderRect_) {
this.borderRect_.setAttribute('fill', (this.sourceBlock_ as Blockly.BlockSvg).getColourTertiary());
}
}
@ -187,13 +173,11 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
let backgroundColor = this.savedPrimary_ || this.sourceBlock_.getColour();
if (value == this.getValue()) {
// This icon is selected, show it in a different colour
// FIXME: tertiary color?
backgroundColor = this.sourceBlock_.getColour();
backgroundColor = (this.sourceBlock_ as Blockly.BlockSvg).getColourTertiary();
button.setAttribute('aria-selected', 'true');
}
button.style.backgroundColor = backgroundColor;
// FIXME: tertiary color?
button.style.borderColor = this.sourceBlock_.getColour();
button.style.borderColor = (this.sourceBlock_ as Blockly.BlockSvg).getColourTertiary();
Blockly.bindEvent_(button, 'click', this, this.buttonClick_);
Blockly.bindEvent_(button, 'mouseup', this, this.buttonClick_);
// These are applied manually instead of using the :hover pseudoclass
@ -241,6 +225,13 @@ export class FieldMusic extends pxtblockly.FieldImages implements Blockly.FieldC
super.onHide_();
(Blockly.DropDownDiv.getContentDiv() as HTMLElement).style.maxHeight = '';
this.stopSounds();
// Update color (deselect) on dropdown hide
let source = this.sourceBlock_ as Blockly.BlockSvg;
if (source?.isShadow()) {
source.setColour(this.savedPrimary_);
} else if (this.borderRect_) {
this.borderRect_.setAttribute('fill', this.savedPrimary_);
}
}
protected createTextNode_(content: string) {

View File

@ -1,6 +1,6 @@
{
"compilerOptions": {
"target": "es5",
"target": "es2017",
"noImplicitAny": false,
"noImplicitReturns": true,
"module": "commonjs",