DTL (Test > Levelbuilder): a1797c4f

apps/i18n/common/en_us.json

@@ -584,6 +584,7 @@
   "deleteAsset": "Delete {assetType}",
   "deleteAssetConfirm": "Are you sure you want to delete this {assetType}? You cannot undo this action.",
   "deleteConfirm": "Delete?",
+  "deleteGroup": "Delete group",
   "deleteProject": "Delete Project",
   "deleteProjectConfirm": "Do you really want to delete your project? You cannot undo this action.",
   "deleteSection": "Delete Section",
@@ -795,6 +796,7 @@
   "end": "end",
   "englishOnly": "English-only",
   "englishOnlyWarning": "Sorry! This lesson is not available in your language. The levels in this lesson use a mix of English words and characters that can’t be translated right now. You can move on to Lesson {nextStage}.",
+  "enterGroupName": "Enter a group name",
   "enterSectionCode": "Enter section code",
   "enrollmentDescription": "Join your teacher's classroom by entering their section code below. Teachers will be able to see your course progress, projects, and reset your password in case you forget it.",
   "equalTo": "Equal to",
@@ -1454,6 +1456,9 @@
   "projectGroupPlaylabViewMore": "View more Play Lab projects",
   "projectLastUpdated": "Last updated",
   "projectName": "Project Name",
+  "projectPromoButton": "View Project Ideas",
+  "projectPromoDescription": "Take a look at our Project Ideas page for starter projects in Sprite Lab, Game Lab, App Lab, and Web Lab. These include project descriptions, tips, and demo projects you can remix to make your own!",
+  "projectPromoHeading": "Project Inspiration",
   "projectSaveError": "Error saving project",
   "projectSaveErrorTooltip": "It looks like we couldn't save your progress. Make sure you have a good internet connection and try running the project again to save it.",
   "projectShareLinkImportBadLinkHeader": "Share link not recognized",

apps/script/generateSharedConstants.rb

@@ -38,9 +38,17 @@ def generate_shared_js_file(content, path)
 # @param [Boolean] transform_keys: (optional, default false) if true, transform the hash keys into js style lowerCamelCase.
 def generate_constants(shared_const_name, source_module: SharedConstants, transform_keys: false)
   raw = source_module.const_get(shared_const_name)
-  hash_or_array = parse_raw(raw)
-  hash_or_array = hash_or_array.deep_transform_keys {|k| k.to_s.camelize(:lower)} if transform_keys && hash_or_array.is_a?(Hash)
-  "export const #{shared_const_name.downcase.camelize} = #{JSON.pretty_generate(hash_or_array)};"
+  begin
+    hash_or_array = parse_raw(raw)
+    hash_or_array = hash_or_array.deep_transform_keys {|k| k.to_s.camelize(:lower)} if transform_keys && hash_or_array.is_a?(Hash)
+    "export const #{shared_const_name.downcase.camelize} = #{JSON.pretty_generate(hash_or_array)};"
+  rescue JSON::ParserError
+    if raw.is_a?(String)
+      "export const #{shared_const_name.downcase.camelize} = '#{raw}';"
+    else
+      raise "unrecognized raw type: #{raw.class}"
+    end
+  end
 end
 
 # Generate a set of JS objects from their ruby equivalents
@@ -144,7 +152,7 @@ def main
 
   generate_shared_js_file(
     generate_multiple_constants(
-      %w(SECTION_HEADERS PAGE_LABELS VALID_SCORES LABEL_OVERRIDES TEXT_FIELDS MULTI_ANSWER_QUESTION_FIELDS SCOREABLE_QUESTIONS),
+      %w(YEAR SECTION_HEADERS PAGE_LABELS VALID_SCORES LABEL_OVERRIDES TEXT_FIELDS MULTI_ANSWER_QUESTION_FIELDS SCOREABLE_QUESTIONS),
       source_module: Pd::TeacherApplicationConstants,
       transform_keys: true
     ),

apps/src/blockly/addons/cdoTrashcan.js

@@ -64,14 +64,17 @@ export default class CdoTrashcan extends GoogleBlockly.Trashcan {
       return;
     }
 
-    let toolboxWidth = 0;
+    let toolboxWidth;
     switch (this.workspace_.getToolboxType()) {
       case ToolboxType.CATEGORIZED:
         toolboxWidth = this.workspace_.toolbox_.width_;
         break;
       case ToolboxType.UNCATEGORIZED:
         toolboxWidth = metrics.flyoutWidth;
         break;
+      case ToolboxType.NONE:
+        toolboxWidth = 0;
+        break;
     }
 
     this.left_ = Math.round(toolboxWidth / 2 - this.WIDTH_ / 2);

apps/src/blockly/addons/cdoWorkspaceSvg.js

@@ -7,6 +7,10 @@ export default class WorkspaceSvg extends GoogleBlockly.WorkspaceSvg {
     this.getVariableMap().addVariables(variableList);
   }
 
+  getContainer() {
+    return this.svgGroup_.parentNode;
+  }
+
   clear() {
     super.clear();
 
@@ -36,7 +40,7 @@ export default class WorkspaceSvg extends GoogleBlockly.WorkspaceSvg {
     } else if (this.toolbox_) {
       return ToolboxType.CATEGORIZED;
     } else {
-      return ToolboxType.UNKNOWN;
+      return ToolboxType.NONE;
     }
   }
 
@@ -98,6 +102,11 @@ export default class WorkspaceSvg extends GoogleBlockly.WorkspaceSvg {
    * it doesn't interfere with click events on the toolbox categories.
    */
   hideTrashcan() {
+    // If there's no toolbox, there's no trashcan.
+    if (this.getToolboxType() === ToolboxType.NONE) {
+      return;
+    }
+
     /**
      * NodeList.forEach() is not supported on IE. Use Array.prototype.forEach.call() as a workaround.
      * https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach
@@ -128,6 +137,11 @@ export default class WorkspaceSvg extends GoogleBlockly.WorkspaceSvg {
   }
   setEnableToolbox() {} // TODO - called by StudioApp, not sure whether it's still needed.
   showTrashcan() {
+    // If there's no toolbox, there's no trashcan.
+    if (this.getToolboxType() === ToolboxType.NONE) {
+      return;
+    }
+
     /**
      * NodeList.forEach() is not supported on IE. Use Array.prototype.forEach.call() as a workaround.
      * https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach

apps/src/blockly/addons/cdoXml.js

@@ -88,6 +88,10 @@ export default function initializeBlocklyXml(blocklyWrapper) {
      * https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach
      */
     Array.prototype.forEach.call(xml.childNodes, function(xmlChild) {
+      if (xmlChild.nodeName.toLowerCase() !== 'block') {
+        // skip non-block xml elements
+        return;
+      }
       const blockly_block = Blockly.Xml.domToBlock(xmlChild, blockSpace);
       const x = parseInt(xmlChild.getAttribute('x'), 10);
       const y = parseInt(xmlChild.getAttribute('y'), 10);

apps/src/blockly/cdoBlocklyWrapper.js

@@ -152,6 +152,10 @@ function initializeBlocklyWrapper(blocklyInstance) {
 
   blocklyWrapper.BlockSpace.prototype.registerGlobalVariables = function() {}; // Not implemented.
 
+  blocklyWrapper.BlockSpace.prototype.getContainer = function() {
+    return this.blockSpaceEditor.getSVGElement().parentNode;
+  };
+
   blocklyWrapper.getFieldForInputType = function(type) {
     return blocklyWrapper.FieldTextInput;
   };

apps/src/blockly/constants.js

@@ -1,3 +1,3 @@
 import {makeEnum} from '@cdo/apps/utils';
 
-export const ToolboxType = makeEnum('CATEGORIZED', 'UNCATEGORIZED', 'UNKNOWN');
+export const ToolboxType = makeEnum('CATEGORIZED', 'UNCATEGORIZED', 'NONE');

apps/src/blockly/googleBlocklyWrapper.js

@@ -1,6 +1,7 @@
 import {ScrollOptions} from '@blockly/plugin-scroll-options';
 import {BlocklyVersion} from '@cdo/apps/constants';
 import styleConstants from '@cdo/apps/styleConstants';
+import * as utils from '@cdo/apps/utils';
 import CdoBlockDragger from './addons/cdoBlockDragger';
 import CdoBlockSvg from './addons/cdoBlockSvg';
 import initializeCdoConstants from './addons/cdoConstants';
@@ -257,7 +258,17 @@ function initializeBlocklyWrapper(blocklyInstance) {
       BLOCK_SPACE_SCROLLED: 'blockSpaceScrolled',
       RUN_BUTTON_CLICKED: 'runButtonClicked'
     },
-    onMainBlockSpaceCreated: () => {}, // TODO
+    onMainBlockSpaceCreated: callback => {
+      if (Blockly.mainBlockSpace) {
+        callback();
+      } else {
+        document.addEventListener(
+          Blockly.BlockSpace.EVENTS.MAIN_BLOCK_SPACE_CREATED,
+          callback
+        );
+      }
+    },
+
     createReadOnlyBlockSpace: (container, xml, options) => {
       const workspace = new Blockly.WorkspaceSvg({
         readOnly: true,
@@ -316,6 +327,10 @@ function initializeBlocklyWrapper(blocklyInstance) {
     blocklyWrapper.editBlocks = opt_options.editBlocks;
     const workspace = blocklyWrapper.blockly_.inject(container, options);
 
+    document.dispatchEvent(
+      utils.createEvent(Blockly.BlockSpace.EVENTS.MAIN_BLOCK_SPACE_CREATED)
+    );
+
     const scrollOptionsPlugin = new ScrollOptions(workspace);
     scrollOptionsPlugin.init();
   };

apps/src/code-studio/components/progress/teacherPanel/TeacherPanel.jsx

@@ -15,13 +15,16 @@ import SelectedStudentInfo from '@cdo/apps/code-studio/components/progress/teach
 import Button from '@cdo/apps/templates/Button';
 import i18n from '@cdo/locale';
 import firehoseClient from '@cdo/apps/lib/util/firehose';
-import {hasLockableLessons} from '@cdo/apps/code-studio/progressRedux';
+import {
+  hasLockableLessons,
+  queryUserProgress
+} from '@cdo/apps/code-studio/progressRedux';
+import {reload} from '@cdo/apps/utils';
+import {updateQueryParam, queryParams} from '@cdo/apps/code-studio/utils';
 import {studentShape, levelWithProgress} from './types';
 
 class TeacherPanel extends React.Component {
   static propTypes = {
-    onSelectUser: PropTypes.func,
-    getSelectedUserId: PropTypes.func,
     unitName: PropTypes.string,
     pageType: PropTypes.oneOf([
       pageTypes.level,
@@ -43,7 +46,8 @@ class TeacherPanel extends React.Component {
     levelsWithProgress: PropTypes.arrayOf(levelWithProgress),
     loadLevelsWithProgress: PropTypes.func.isRequired,
     teacherId: PropTypes.number,
-    exampleSolutions: PropTypes.array
+    exampleSolutions: PropTypes.array,
+    selectUser: PropTypes.func.isRequired
   };
 
   UNSAFE_componentWillReceiveProps(nextProps) {
@@ -73,7 +77,13 @@ class TeacherPanel extends React.Component {
 
   onSelectUser = (id, selectType) => {
     this.logToFirehose('select_student', {select_type: selectType});
-    this.props.onSelectUser(id);
+    const isAsync = this.props.pageType === pageTypes.scriptOverview;
+    this.props.selectUser(id, isAsync);
+  };
+
+  getSelectedUserId = () => {
+    const userIdStr = queryParams('user_id');
+    return userIdStr ? parseInt(userIdStr, 10) : null;
   };
 
   render() {
@@ -87,13 +97,12 @@ class TeacherPanel extends React.Component {
       students,
       unitName,
       levelsWithProgress,
-      getSelectedUserId,
       pageType,
       teacherId,
       exampleSolutions
     } = this.props;
 
-    const selectedUserId = getSelectedUserId();
+    const selectedUserId = this.getSelectedUserId();
 
     const sectionId = selectedSection && selectedSection.id;
 
@@ -287,6 +296,10 @@ export default connect(
     };
   },
   dispatch => ({
-    loadLevelsWithProgress: () => dispatch(loadLevelsWithProgress())
+    loadLevelsWithProgress: () => dispatch(loadLevelsWithProgress()),
+    selectUser: (userId, isAsync = false) => {
+      updateQueryParam('user_id', userId);
+      isAsync ? dispatch(queryUserProgress(userId)) : reload();
+    }
   })
 )(TeacherPanel);

apps/src/code-studio/pd/application/principalApproval/PrincipalApprovalComponent.jsx

@@ -4,12 +4,13 @@ import {
   PageLabels,
   TextFields
 } from '@cdo/apps/generated/pd/principalApprovalApplicationConstants';
+import {Year} from '@cdo/apps/generated/pd/teacherApplicationConstants';
 import LabeledFormComponent from '../../form_components/LabeledFormComponent';
 import PrivacyDialog from '../PrivacyDialog';
 import {PrivacyDialogMode} from '../../constants';
 import SchoolAutocompleteDropdown from '@cdo/apps/templates/SchoolAutocompleteDropdown';
 import {isInt, isPercent, isZipCode} from '@cdo/apps/util/formatValidation';
-import {YEAR, styles} from '../teacher/TeacherApplicationConstants';
+import {styles} from '../teacher/TeacherApplicationConstants';
 
 const MANUAL_SCHOOL_FIELDS = [
   'schoolName',
@@ -129,7 +130,7 @@ export default class PrincipalApprovalComponent extends LabeledFormComponent {
     let showPayFeeNote =
       this.props.data.committedToMasterSchedule &&
       !this.props.data.committedToMasterSchedule.includes(
-        `Yes, I plan to include this course in the ${YEAR} master schedule`
+        `Yes, I plan to include this course in the ${Year} master schedule`
       ) &&
       this.props.data.payFee &&
       this.props.data.payFee.includes('No, ');
@@ -165,7 +166,7 @@ export default class PrincipalApprovalComponent extends LabeledFormComponent {
             label: `Are you committed to including ${
               this.props.teacherApplication.course
             }
-                    on the master schedule in ${YEAR} if ${
+                    on the master schedule in ${Year} if ${
               this.props.teacherApplication.name
             }
                     is accepted into the program? Note: the program may be listed under a different
@@ -215,8 +216,8 @@ export default class PrincipalApprovalComponent extends LabeledFormComponent {
             <div>
               <p style={styles.red}>
                 Note: To be eligible for scholarship support, your school must
-                commit to including this course in the {YEAR} master schedule.
-                If you are able to commit to offering this course in {YEAR} ,
+                commit to including this course in the {Year} master schedule.
+                If you are able to commit to offering this course in {Year} ,
                 please update your answer above before submitting in order to
                 retain scholarship eligibility.
               </p>
@@ -305,7 +306,7 @@ export default class PrincipalApprovalComponent extends LabeledFormComponent {
           >
             {this.props.teacherApplication.course} curriculum
           </a>{' '}
-          during the {YEAR} school year. We know that administrative support is
+          during the {Year} school year. We know that administrative support is
           essential to a teacher’s ability to fully commit to a) participating
           in a yearlong Professional Learning program and b) teaching a new
           course. That’s why your approval is required for the teacher's
@@ -339,7 +340,7 @@ export default class PrincipalApprovalComponent extends LabeledFormComponent {
             label: `Do you approve of ${
               this.props.teacherApplication.name
             } participating
-                    in Code.org's ${YEAR} Professional Learning Program?`
+                    in Code.org's ${Year} Professional Learning Program?`
           }
         )}
         {this.props.data.doYouApprove !== 'No' &&

apps/src/code-studio/pd/application/teacher/ChooseYourProgram.jsx

@@ -1,18 +1,18 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import {FormGroup, Row, Col} from 'react-bootstrap';
+import color from '@cdo/apps/util/color';
 import {
   PageLabels,
   SectionHeaders,
-  TextFields
+  TextFields,
+  Year
 } from '@cdo/apps/generated/pd/teacherApplicationConstants';
-import {FormGroup, Row, Col} from 'react-bootstrap';
 import {
   PROGRAM_CSD,
   PROGRAM_CSP,
-  PROGRAM_CSA,
-  YEAR
+  PROGRAM_CSA
 } from './TeacherApplicationConstants';
-import color from '@cdo/apps/util/color';
 import {LabelsContext} from '../../form_components_func/LabeledFormComponent';
 import {LabeledCheckBoxes} from '../../form_components_func/labeled/LabeledCheckBoxes';
 import {LabeledNumberInput} from '../../form_components_func/labeled/LabeledInput';
@@ -85,7 +85,7 @@ const ChooseYourProgram = props => {
           {data.program === PROGRAM_CSA && !isOffered && (
             <p style={styles.error}>
               The Computer Science A Professional Learning Program is not yet
-              offered in your region for the {YEAR} academic year. We are
+              offered in your region for the {Year} academic year. We are
               working with our national network of Regional Partners to expand
               the program to all regions by 2023-24.{' '}
               {regionalPartner &&
@@ -193,7 +193,7 @@ const ChooseYourProgram = props => {
               Note: {minCourseHours} or more hours of instruction per{' '}
               {programInfo.name} section are strongly recommended. We suggest
               checking with your school administration to see if additional time
-              can be allotted for this course in {YEAR}.
+              can be allotted for this course in {Year}.
             </p>
           )}
 
@@ -206,9 +206,9 @@ const ChooseYourProgram = props => {
           {showTeachingPlansNote && (
             <p style={styles.error}>
               Note: This program is designed to work best for teachers who are
-              teaching this course in the {YEAR} school year. Scholarship
+              teaching this course in the {Year} school year. Scholarship
               eligibility is dependent on whether or not you will be teaching
-              the course during the {YEAR} school year.
+              the course during the {Year} school year.
             </p>
           )}
 

apps/src/code-studio/pd/application/teacher/TeacherApplicationConstants.js

@@ -7,8 +7,6 @@ const PROGRAM_CSP =
 const PROGRAM_CSA =
   'Computer Science A (appropriate for 10th - 12th grade, and can be implemented as an AP or non-AP introductory Java programming course)';
 
-const YEAR = '2021-2022';
-
 const styles = {
   indented: {
     marginLeft: 20
@@ -18,7 +16,7 @@ const styles = {
   },
   questionText: {
     fontSize: 14,
-    lineHeight: '20px',
+    lineHeight: 20,
     fontWeight: 'bold'
   },
   checkBoxAfterButtonList: {
@@ -37,4 +35,4 @@ const styles = {
   }
 };
 
-export {PROGRAM_CSD, PROGRAM_CSP, PROGRAM_CSA, YEAR, styles};
+export {PROGRAM_CSD, PROGRAM_CSP, PROGRAM_CSA, styles};