code-dot-org/blockly

Blockly (Code Studio fork)

Code.org

Welcome! You've found the source code for the Code.org website and the Code Studio platform. Code.org is a non-profit dedicated to expanding access to computer science education. You can read more about our efforts at code.org/about.

Quick start

1. Follow our setup guide to configure your workstation.
2. rake build to build the application if you have not done so already
3. bin/dashboard-server to launch the development server.
4. Open your browser to http://localhost-studio.code.org:3000/.

To see a list of all build commands, run rake from the repository root.

How to help

Wondering where to start? See our contribution guidelines.

What's in this repo?

Here's a quick overview of the major landmarks:

Documentation

• SETUP: Instructions to get everything up and running.
• TESTING: How to be sure nothing broke.
• STYLEGUIDE: Our code style conventions.
• Our LICENSE and NOTICE.
• There are many more topical guides in the docs folder.
• In addition, several sections of the repository have their own documentation:
  • apps/README
  • blockly/README

dashboard

The server for our Code Studio learning platform, a Ruby on Rails application responsible for:

• Our courses, tutorials, and puzzle configurations
• User accounts
• Student progress and projects
• The "levelbuilder" content creation tools

pegasus

The server for the Code.org website, a Sinatra application responsible for:

• code.org
• hourofcode.com
• csedweek.org

apps

The JavaScript 'engine' for all of our tutorials, puzzle types and online tools. It gets built into a static package that we serve through dashboard. Though there are currently some exceptions, the goal is that all JS code ultimately lives here, so that it gets the benefit of linting/JSX/ES6/etc. Start here if you are looking for:

• The Hour of Code tutorials: Star Wars, Minecraft, Frozen and Classic Maze
• Tools like Artist, Play Lab and App Lab
• Other core puzzle types: Maze, Farmer, Bee, Bounce, Calc, Eval
• Other JS code consumed by dashboard and pegasus.

Everything else

• aws: Configuration and scripts that manage our deployments.
• bin: Developer utilities.
• cookbooks: Configuration management through Chef.
• shared: Source and assets used by many parts of our application.
• tools: Git commit hooks.

blockly's Issues

Generator tests are never run

AFAICT, we were never able to run the tests under tests/generators/ from the command line. In upstream blockly, the tests are run by opening up tests/generators/index.html in Firefox/Safari (security restrictions prevent them from working in Chrome) and clicking a button.

That page has been completely broken since my compilation changes in #135, but it was mostly broken ever since we spun out the separate blockly repo (it throws javascript errors attempting to load blocks, before even trying to run the tests).

Unknown blocks with a "next" connection should still codegen the rest of the stack

Given the following stack of blocks:

We'll only generate:

// Unknown block: Zzzzz_myFunc

We should continue down the stack, to the "next" connections of unknown blocks.

Use closure-compiler-js

https://github.com/google/closure-compiler-js is a version of Google closure compiler that runs in pure JS, with no Java requirement at all.

User shouldn't be able to delete "when run" block

The user can't drag the when run block out of the workspace, but they can delete with keyboard shortcuts (CMD+X/CTRL+X). The screenshot below is from the first level of the Frozen activity after deleting the when run block, but the same behavior happens in all block-based puzzles:

Make changeHandlers identifiable by type in a consistent way

See #157 (comment) for context. Right now we identify some change handlers by identity and others by a string property. We should at least make them consistent, at best have a more coherent concept of "type!"

Undo/redo stack

Tracking issue.

Scrollable dropdowns not discoverable

When there is a dropdown with a lot of options on a block, it isn't apparent that you can scroll and see more options. One example of this is from the Minecraft: Hero's Journey activity.

Some possible solutions:

• Make the scrollbar always visible, so it's clear to the user that it is scrollable.
• Show a small arrow at the bottom (this would especially be helpful for touch users).
• Make the last viewable item on the list only half shown so it's clear that there are more options.

Separately, it might also be helpful if the dropdown menu took up more space (height) on the screen to reduce times when the user would have to scroll.

Roll custom RTL positioning code into this repo

https://github.com/code-dot-org/code-dot-org/blob/8ec4f3aafe97968dd18f8f318bb15a6c6b50a422/apps/src/StudioApp.js#L1183-L1192

    // Keep blocks static relative to the right edge in RTL mode
    if (this.isUsingBlockly() && Blockly.RTL) {
      if (this.lastWorkspaceWidth && (this.lastWorkspaceWidth !== workspaceWidth)) {
        var blockOffset = workspaceWidth - this.lastWorkspaceWidth;
        Blockly.mainBlockSpace.getTopBlocks().forEach(function (topBlock) {
          topBlock.moveBy(blockOffset, 0);
        });
      }
    }
    this.lastWorkspaceWidth = workspaceWidth;

Block copy/paste maintains absolute position

When pasting in a copied block it goes to the absolute position from which it was copied. This results in a few confusing behaviors, including:

• Copy/pasting a block attached to an event shifts the whole event block stack instead of shifting the pasted block
• Copying from the top (or another page) and scrolling down lower to paste appears to not work because the block gets pasted outside of the canvas view

Function call blocks should bump out incompatible types when the signature is modified

Sample repro:

Blocks dragged directly from toolbox are slightly offset

Originally reported in code-dot-org/craft#236

Should use the PointerEvent API for touch support in chrome

As recommended by https://www.chromestatus.com/feature/4764225348042752; also see #154

Blocks bumped out of sockets aren't marked as "unused"

Super minor bug I found while working on a related feature:

The "random color" block should be partly transparent, after it gets bumped out of the socket and becomes an unattached block.

Pressing tab should move the cursor to the next input field

Keyboard Copy/Paste is inconsistent in some browsers

Doesn't work in Firefox or IE right now

RTL: Color dropdown doesn't align with block

Sample repro: https://studio.code.org/s/frozen/stage/1/puzzle/20

LTR:

RTL:

How to add python code generator support?

I found that the code of google's blockly is not applicable, example:

Blockly.Python.init = function(workspace) {
  /**
   * Empty loops or conditionals are not allowed in Python.
   */
  Blockly.Python.PASS = this.INDENT + 'pass\n';
  // Create a dictionary of definitions to be printed before the code.
  Blockly.Python.definitions_ = Object.create(null);
  // Create a dictionary mapping desired function names in definitions_
  // to actual function names (to avoid collisions with user functions).
  Blockly.Python.functionNames_ = Object.create(null);

  if (!Blockly.Python.variableDB_) {
    Blockly.Python.variableDB_ =
        new Blockly.Names(Blockly.Python.RESERVED_WORDS_);
  } else {
    Blockly.Python.variableDB_.reset();
  }

  Blockly.Python.variableDB_.setVariableMap(workspace.getVariableMap());

  var defvars = [];
  // Add developer variables (not created or named by the user).
  var devVarList = Blockly.Variables.allDeveloperVariables(workspace);
  for (var i = 0; i < devVarList.length; i++) {
    defvars.push(Blockly.Python.variableDB_.getName(devVarList[i],
        Blockly.Names.DEVELOPER_VARIABLE_TYPE) + ' = None');
  }

  // Add user variables, but only ones that are being used.
  var variables = Blockly.Variables.allUsedVarModels(workspace);
  for (var i = 0; i < variables.length; i++) {
    defvars.push(Blockly.Python.variableDB_.getName(variables[i].getId(),
        Blockly.VARIABLE_CATEGORY_NAME) + ' = None');
  }

  Blockly.Python.definitions_['variables'] = defvars.join('\n');
};

Holding right mouse button while adding blocks to the workspace incorrectly adds them to active blocks

Originally reported in code-dot-org/craft#407

Translations of core.json really outdated (e.g. german de_DE)

Hi there,
please point me to the right place, if this isn't appropriate:
I wanted to help with code.org translations, but then noticed, that even the most aggressive translation mistakes, were already corrected up to five years ago in crowdin, though not approved in crowdin.

What can I do help get the blockly/core.json file updated or incorrect translations unapproved in crowdin?

I'd love to contribute by translating code.org blockly core or materials into german, but it doesn't seem worthwhile if files are not updated. Would it be easier if I generate a pull request for german core.json?

Thank you.