Files
blockly/tests/playgrounds/advanced_playground.html
Christopher Allen 52a0d525d7 chore(build): Remove build products from the Blockly repository (#6475)
* feat(build): Make build tasks invoke their prerequisites

  - Divide gulp targets into three kinds: main sequence,
    manually invokable, and script-only.  The first two categories
    automatically invoke their prerequisites.
  - Give (most of) the affected gulp targets shorter and more memorable
    names that could become their npm script names in future.

* feat(build): Make package tasks invoke their prerequisites

  Have the package task invoke the cleanBuildDir (as well as
  cleanPackageDir) and build tasks.  Remove the checkBuildDir
  task as it is now redundant since a fresh build is done every
  time.

* feat(build): Make git tasks invoke their prerequisites

* feat(build): Make cleanup, license [sic] tasks invoke their prerequisites

  Turns out they don't have any, so this commit just classifies
  their gulp targets according to the established scheme.

* feat(build): Make appengine tasks invoke their prerequisites

  In this case prepareDeployDir will eventually depend on package
  but does not for now.

* feat(build): Have npm scripts run npm ci first where applicable

  Have any npm script that have external effects (e.g. publishing an
  npm package, pushing a new version to appengine, or updating GitHub
  Pages) start by running npm ci to ensure that all dependencies are
  up-to-date with respect to package-lock.json.

  (This is done by npm and not a gulp script because gulp itself
  might need updating.  So might npm, but that is less likely to
  make any difference to what gets published/pushed.)

* chore(build): have tests use package target

  Have the tests just run the package target (with debug flags)
  since that runs the the build target automatically.

* feat(tests): Write Closure Compiler output directly to dist/

  Since they are already UMD-wrapped, have Closure Compiler write
  output chunks directly to RELEASE_DIR, i.e. dist/.

* chore(tests): Use freshly-build files in compressed mode.

  Use the freshly-built build/*_compresssed.js files when bootstrapping
  in compressed mode, rather than using the checked-in files in the
  repository root.

  This helps ensure that compressed and uncompressed mode will be
  testing (as closely as possible) the same code.

  Obsoletes #6218 (though the issues discussed there have not actually
  yet been addressed in this branch).

* chore(build): Write intermediate langfiles to build/msg

  Write the results of create_messages.py to build/msg instead of
  build/msg/js.

* fix(build): Use build/msg/en.js instead of msg/messages.js in tests

  This has no direct effect but fixes a long-standing misdesign
  where we are testing against the input to, rather than the output
  of, the language file processing pipeline.

* feat(demos): Use freshly-built files

  Use the freshly-built dist/*_compresssed.js and build/msg/* files
  rather than using the checked-in files in the repository root.

  This helps ensure that these demos are using the most recent
  version of Blockly (even in the develop branch).

* fix(build): Update appengine deployment to include built files

  Modify the prepareDemos task as follows:

  - Use the git index instead of HEAD, so that most local changes
    will be applied (without copying whatever .gitignored cruft
    might be in the local directory).
  - Run clean and build and then copy build/msg and
    dist/*_compressed.js* to the deploy directory.

  This fixes the problem created by the previous commit, wherein the
  demos relied on built files that were not being deployed to
  appengine.

* fix(build): Update GitHub Pages deployment to include built files

  Modify the updateGithubPages task to run clean and build and
  then git add build/msg dist/*_compressed.js*, so that they will
  be included in the deployed pages.

  This fixes the problem created by the previous^2 commit,
  wherein the demos relied on built files that were not being
  deployed to GitHub Pages.

* chore(build): Remove build products from repository

  Remove *_compressed.js* and msg/js/* from the blockly repository.
  Also remove the now-obsolete checkinBuilt gulp task.

* chore(build): Apply relevant changes to test_tasks.js

  Apply changes made to run_all_tests.sh and check_metadata.sh to
  the corresponding parts of their JS replacements in
  test_tasks.js.

* chore(build): Make updates suggested in PR #6475

  - Remove `clean:builddir` and `clean:releasedir` - `clean`
    is sufficient.
  - Remove duplicate `require` from `appengine_tasks.js`.

* feat(build): Use shorter npm script names

  Since scripts that run build tasks now automatically run their
  prerequisite tasks, the previous naming scheme of task `build`
  running all the `build:subtask`s no longe really makes very
  much sense.

  Additionally, following a chat discussion, there seems to be a
  rough consensus to use "messages" to refer to the .json input
  files, and "langfiles" to the generated .js output files.

  Consequently, simplify npm script names by renaming as follows:

  - "generate:langfiles" -> "messages"
  - "build:langfiles" -> "langfiles"
  - "build:js" -> "tsc"
  - "build:deps" -> "deps"
  - "build:compiled" -> "minify"
  - "build:compressed": delete this synonym for "build:compiled",

  ("minify" was chosen as agnostic to Closure Compiler vs. WebPack.)

* chores(build): Add deprecation notice for old scripts

  To reduce potential confusion/frustration, restore the previous
  npm scripts but have them display a deprecation notice instead
  (note that npm prints the script contents before running it, so
  echo is not needed).

* docs(build): Add comments distinguishing 'messages' from 'langfiles'
2022-11-03 13:15:10 +00:00

169 lines
4.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Advanced Blockly Playground</title>
<script>
var BLOCKLY_BOOTSTRAP_OPTIONS = {
additionalScripts: [
'build/msg/en.js',
'tests/playgrounds/screenshot.js',
'tests/themes/test_themes.js',
'node_modules/@blockly/dev-tools/dist/index.js',
'node_modules/@blockly/theme-modern/dist/index.js',
],
}
</script>
<script src="../bootstrap.js"></script>
<script type="module">
// Wait for Blockly to finish loading.
import '../bootstrap_done.mjs';
function start() {
setBackgroundColour();
initPlayground();
}
function createWorkspace(blocklyDiv, options) {
var workspace = Blockly.inject(blocklyDiv, options);
workspace.configureContextMenu = configureContextMenu.bind(workspace);
return workspace;
}
function configurePlayground(playground) {
// Rendering options.
var gui = playground.getGUI();
var renderingFolder = gui.addFolder('Rendering');
var renderingOptions = {
'font Size': 10,
};
renderingFolder.add(renderingOptions, 'font Size', 0, 50)
.onChange(function(value) {
var ws = playground.getWorkspace();
var fontStyle = {
'size': value
};
ws.getTheme().setFontStyle(fontStyle);
// Refresh theme.
ws.setTheme(ws.getTheme());
});
}
function initPlayground() {
if (typeof window.createPlayground === 'undefined') {
alert('You need to run \'npm install\' in order to use this playground.');
return;
}
var defaultOptions = {
comments: true,
collapse: true,
disable: true,
grid:
{
spacing: 25,
length: 3,
colour: '#ccc',
snap: true
},
horizontalLayout: false,
maxBlocks: Infinity,
maxInstances: {'test_basic_limit_instances': 3},
maxTrashcanContents: 256,
media: '../../media/',
oneBasedIndex: true,
readOnly: false,
rtl: false,
move: {
scrollbars: true,
drag: true,
wheel: false,
},
toolbox: toolboxCategories,
toolboxPosition: 'start',
renderer: 'geras',
zoom:
{
controls: true,
wheel: true,
startScale: 1.0,
maxScale: 4,
minScale: 0.25,
scaleSpeed: 1.1
}
};
const playgroundConfig = {
toolboxes: {
'categories': toolboxCategories,
'simple': toolboxSimple,
'test blocks': toolboxTestBlocks,
}
}
createPlayground(document.getElementById('root'), createWorkspace,
defaultOptions, playgroundConfig,
'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.19.2/min/vs')
.then(function(playground) {
configurePlayground(playground);
});
}
function setBackgroundColour() {
// Set background colour to differentiate file: vs. localhost
// vs. server copy.
if (location.protocol == 'file:') {
document.body.style.backgroundColor = '#89A203'; // Unpleasant green.
} else if (location.hostname === 'localhost' ||
location.hostname === '127.0.0.1' ||
location.hostname === '[::1]') {
document.body.style.backgroundColor = '#d6d6ff'; // Familliar lilac.
}
}
function configureContextMenu(menuOptions, e) {
var workspace = this;
var screenshotOption = {
text: 'Download Screenshot',
enabled: workspace.getTopBlocks().length,
callback: function() {
downloadScreenshot(workspace);
}
};
menuOptions.push(screenshotOption);
// Adds a default-sized workspace comment to the workspace.
menuOptions.push(Blockly.ContextMenu.workspaceCommentOption(workspace, e));
}
start();
</script>
<style>
html, body {
margin: 0;
}
.ioLabel>.blocklyFlyoutLabelText {
font-style: italic;
}
.playgroundToggleOptions {
list-style: none;
padding: 0;
}
.playgroundToggleOptions li {
margin-top: 1em;
}
.zelos-renderer .blocklyFlyoutButton .blocklyText {
font-size: 1.5rem;
}
</style>
</head>
<body>
<div id="root"></div>
</body>
</html>