Files
blockly/demos/mobile
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
..
2020-03-25 15:47:27 -07:00

Blockly on Mobile Devices

This directory contains three examples of running the Blockly library on mobile devices. The html/ directory is a example of configuring a webpage for touch devices, with a Blockly workspace that fills the screen.

The mobile/html/ is also the basis for the Android and iOS demos. Each native app copies this demo into the app's local resources, and required Blockly library files, and hosts them in an embedded WebView.

Thus, developers can quickly iterate within the mobile/html/ directory, and see changes in both the Android and iOS native apps.

Running the Mobile HTML Demo

Before running the mobile HTML demo, you need to create some symbolic links in your local file system. Run the mobile/html/ln_resources.sh file from the mobile/html/ directory. This mimics the relative locations of the Blockly files seen when loading the page in a native app's embedded WebView.

After doing this, opening mobile/html/index.html should open normally, filling the page with one large Blockly workspace.

The Android App

Build and Run

Open the demos/mobile/android/ directory in Android Studio. The project files in the directory should be ready to build and run the demo in an emulator or connected device.

Android Copy Tasks

If you edit the mobile/html/ demo to include new files, you will need to update the native app project files to also copy those files.

In the Android project, two Gradle tasks are responsible for the copies. In mobile/android/app/build.gradle, the tasks copyBlocklyHtmlFile and copyBlocklyMoreFiles configure the copy actions.

The iOS App

Build and Run

Open the demos/mobile/iOS/ directory in XCode. The project files in the directory should be ready to build and run the demo in a simulator or connected device.

iOS Copy Script

The XCode project call out to mobile/ios/cp_resources.sh to copy the required HTML and related files. If you've edited the mobile/html/ demo to require new files, update this script to copy these files, too.