mirror of
https://github.com/google/blockly.git
synced 2025-12-16 06:10:12 +01:00
f9c865b1b3
* feat(generators): Add block generator function dictionary Add a dictionary of block generator functions, provisionally called .forBlock. Look up generator functions there first, but fall back to looking up on 'this' (with deprecation notice) for backwards compatibility. Also tweak error message generation to use template literal. * refactor(generators)!: Update generator definitions to use dictionary * fix(tests): Have blockToCodeTest clean up after itself Have the blockToCodeTest helper function delete the block generator functions it adds to generator once the test is done. * refactor(tests): Use generator dictionary in insertion marker test The use of generators in insertion_marker_test.js was overlooked in the earlier commit making such updates, and some test here were failing due to lack of cleanup in cleanup in the generator_test.js. BREAKING CHANGE: this PR moves the generator functions we provide from their previous location directly on the CodeGenerator instances to the new .forBlock dictionary on each instance. This does not oblige external developers to do the same for their custom generators, but they will need to update any code that references the generator functions we provide (in generators/*/*, i.e. on javascriptGenerator, dartGenerator etc.) e.g. to replace the implementation or reuse the implementation for a different block type.
86 lines
3.2 KiB
JavaScript
86 lines
3.2 KiB
JavaScript
/**
|
|
* @license
|
|
* Copyright 2012 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
|
|
/**
|
|
* @fileoverview Generating JavaScript for colour blocks.
|
|
*/
|
|
|
|
import * as goog from '../../closure/goog/goog.js';
|
|
goog.declareModuleId('Blockly.JavaScript.colour');
|
|
|
|
import {javascriptGenerator as JavaScript} from '../javascript.js';
|
|
|
|
|
|
JavaScript.forBlock['colour_picker'] = function(block) {
|
|
// Colour picker.
|
|
const code = JavaScript.quote_(block.getFieldValue('COLOUR'));
|
|
return [code, JavaScript.ORDER_ATOMIC];
|
|
};
|
|
|
|
JavaScript.forBlock['colour_random'] = function(block) {
|
|
// Generate a random colour.
|
|
const functionName = JavaScript.provideFunction_('colourRandom', `
|
|
function ${JavaScript.FUNCTION_NAME_PLACEHOLDER_}() {
|
|
var num = Math.floor(Math.random() * Math.pow(2, 24));
|
|
return '#' + ('00000' + num.toString(16)).substr(-6);
|
|
}
|
|
`);
|
|
const code = functionName + '()';
|
|
return [code, JavaScript.ORDER_FUNCTION_CALL];
|
|
};
|
|
|
|
JavaScript.forBlock['colour_rgb'] = function(block) {
|
|
// Compose a colour from RGB components expressed as percentages.
|
|
const red = JavaScript.valueToCode(block, 'RED', JavaScript.ORDER_NONE) || 0;
|
|
const green =
|
|
JavaScript.valueToCode(block, 'GREEN', JavaScript.ORDER_NONE) || 0;
|
|
const blue =
|
|
JavaScript.valueToCode(block, 'BLUE', JavaScript.ORDER_NONE) || 0;
|
|
const functionName = JavaScript.provideFunction_('colourRgb', `
|
|
function ${JavaScript.FUNCTION_NAME_PLACEHOLDER_}(r, g, b) {
|
|
r = Math.max(Math.min(Number(r), 100), 0) * 2.55;
|
|
g = Math.max(Math.min(Number(g), 100), 0) * 2.55;
|
|
b = Math.max(Math.min(Number(b), 100), 0) * 2.55;
|
|
r = ('0' + (Math.round(r) || 0).toString(16)).slice(-2);
|
|
g = ('0' + (Math.round(g) || 0).toString(16)).slice(-2);
|
|
b = ('0' + (Math.round(b) || 0).toString(16)).slice(-2);
|
|
return '#' + r + g + b;
|
|
}
|
|
`);
|
|
const code = functionName + '(' + red + ', ' + green + ', ' + blue + ')';
|
|
return [code, JavaScript.ORDER_FUNCTION_CALL];
|
|
};
|
|
|
|
JavaScript.forBlock['colour_blend'] = function(block) {
|
|
// Blend two colours together.
|
|
const c1 = JavaScript.valueToCode(block, 'COLOUR1', JavaScript.ORDER_NONE) ||
|
|
"'#000000'";
|
|
const c2 = JavaScript.valueToCode(block, 'COLOUR2', JavaScript.ORDER_NONE) ||
|
|
"'#000000'";
|
|
const ratio =
|
|
JavaScript.valueToCode(block, 'RATIO', JavaScript.ORDER_NONE) || 0.5;
|
|
const functionName = JavaScript.provideFunction_('colourBlend', `
|
|
function ${JavaScript.FUNCTION_NAME_PLACEHOLDER_}(c1, c2, ratio) {
|
|
ratio = Math.max(Math.min(Number(ratio), 1), 0);
|
|
var r1 = parseInt(c1.substring(1, 3), 16);
|
|
var g1 = parseInt(c1.substring(3, 5), 16);
|
|
var b1 = parseInt(c1.substring(5, 7), 16);
|
|
var r2 = parseInt(c2.substring(1, 3), 16);
|
|
var g2 = parseInt(c2.substring(3, 5), 16);
|
|
var b2 = parseInt(c2.substring(5, 7), 16);
|
|
var r = Math.round(r1 * (1 - ratio) + r2 * ratio);
|
|
var g = Math.round(g1 * (1 - ratio) + g2 * ratio);
|
|
var b = Math.round(b1 * (1 - ratio) + b2 * ratio);
|
|
r = ('0' + (r || 0).toString(16)).slice(-2);
|
|
g = ('0' + (g || 0).toString(16)).slice(-2);
|
|
b = ('0' + (b || 0).toString(16)).slice(-2);
|
|
return '#' + r + g + b;
|
|
}
|
|
`);
|
|
const code = functionName + '(' + c1 + ', ' + c2 + ', ' + ratio + ')';
|
|
return [code, JavaScript.ORDER_FUNCTION_CALL];
|
|
};
|