mirror of
https://github.com/google/blockly.git
synced 2026-01-10 18:37:09 +01:00
Accessible demo (#373)
* adding a folder in demos for blind and setting up the package.json file for development. Adding package.json to .gitignore
* removing gitignore~ file
* copied blind blockly demo code over. set up a new dev environment. Up for review: the blind blockly demo code. Much of the drop downs don't actually do anything, but a general look at the way angular is used would be helpful in shaping future development.
* adding an index file that was being ignored by .gitignore
* adding required angular files and libraries previously ignored by git add --a for some unknown reason.
* starting work on toolbox
* got workspace and toolbox connected. Copy to workspace annd copy to clipboard working at 80%.
* cleaning up autogenerated files
* adding my own files. Not sure why the test files are being added.
* cleaning up comments
* removed empty html_formatter.html file from project and put on git ignore list. The file is used on my end to help with formatting the html in javascript files.
* getting rid of unnecessary html_formatter file
* removing merge conflicts
* cleaned up comments
* cleaned up comments, organized file structure, made ToolboxXML a file that can be changed by other developers porting this code, added copyright and file summaries to js files, linted files, moved third party libraries to lib folder
* removing lint files that shouldn't be tracked.
* Made the clipboard a service instead of multiple pieces embedded within the app. Not sold on the name ClipboardService. Open to suggestions.
* syncing up demo updates
* adding insert block menus above and below appropriate blocks.
* hacky version of getting code to run.
* changing toolbox to be a menu. making both the toolbox and workspace ordered lists
* adding new folder dev-old containing a version of blind blockly that uses nested lists for the toolbox
* getting rid of menubar experiment
* adding treeview shenanigans part 1
* adding treeview experiment page and finishing up treeview.
* getting a treeview implementation working in the toolbox
* creating a fishfood folder for fishfood development
* making first level of fishfood
* fixing something
* adding index file for fishfood
* beginning merging the treeview system.
* creating two treeviews
* fishfood level 1 without working music blocks
* fixes to treeview navigation
* final fishfood features done
* adding support for toolboxes without categories
* beginning integration of Sean's new music code
* adding Sean's music blocks and beginning music_player integration.
* merged Sean's music block code into fishfood
* merged Sean's music code and fixed treeview bug with toolbox when no categories
* adding blank_demo
* fixing tab navigation.
* fixing bug with shift-tab. New bug found in alt+tab not opening dropdown?
* fixing labels
* fixing bugs and finding more.
* removing dropdowns in favor of buttons part 1. Still need to change field options.
* index.html for blank_demo
* beginning cleanup
* adding blockly- prefix to label ids.
* integrating AccessibleBlockly with Blockly library.
* remove closure library
* removing testing files that aren't in develop
* removing all demo stuff for a later pull request
* removing gitignore file that doesn't exist in developer branch
* syncing with develop branch files
* removing music files from this pull request
* doing some lint cleanup
* rolling back accidental package.json change
* removing var blocklyApp = blocklyApp || {} from each extraneous file
* adding last debug statement
* changed name of inputType function
* renaming _service arguments
* fixing function names
* fixing all comments.
* fixing minor comments
* renaming variables, etc
* fixing bugs that break demo. Adding the run code and clear workspace buttons back to the workspaceview as their current position breaks tab navigation.
* fixing minor comments
* fixing function names, etc.
* adding comments to getInputTypeLabel function
* removing addClass() calls from the template
* small change to clipboardService
* splitting getCategoryDependantId into two functions: getCategoryId and setActiveDesc
* fixing minor bug with last commit
* using conditional attributes to remove setActiveAttributes function from treeService and do same work in template.
* deleting unnecessary comment created in previous commit.
* adding a utilsService to remove duplicated code.
* changing function names in utilsService
* changing delete to [delete] to allow HTMLText functions to return an empty string instead of undefined. Also renaming concatStringWithSpaces to generateAriaLabelledByAttr
* generating ids in ngOnInit instead of on the fly, allowing us to use [attr.aria-labelledBy] in the template instead of using setLabelledBy(element). Deleting function utilsService.setLabelledBy.
* fixing small bug with tree service left arrow: was throwing an error when you can't go any further left.
* reformatting html to make it easier to read.
* moving from importing the xml file to using an xml toolbox in the demo.
* fixing minor bugs and removing code relevant only to the music game.
* minor fixes
* adding alerts to copy, paste, and mark actions. renaming blocklyApp.TreeView to blocklyApp.WorkspaceTreeView
* Beginning to add Blockly.msg strings.
* making sure index file is being tracked
* adding all demo bits
* removing demo files from this pull request
* fixing providers, some linting, and removing getInfo() function.
* adding small todo comment for sll@
* adding minimal blockly accessible demo
* removing unnecessary files
* putting package file back
* fixing package file
* fixing msg file
* fixing boot.js file
* fixing boot.js file
* fixing indentation on boot
* fixing indentation on index file.
This commit is contained in:
27
demos/accessible/boot.js
Normal file
27
demos/accessible/boot.js
Normal file
@@ -0,0 +1,27 @@
|
||||
/**
|
||||
* Blockly Demos: AccessibleBlockly
|
||||
*
|
||||
* Copyright 2016 Google Inc.
|
||||
* https://developers.google.com/blockly/
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the 'License');
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an 'AS IS' BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @fileoverview Starts up Angular app.
|
||||
* @author madeeha@google.com (Madeeha Ghori)
|
||||
*/
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
ng.platform.browser.bootstrap(blocklyApp.AppView);
|
||||
});
|
||||
342
demos/accessible/index.html
Normal file
342
demos/accessible/index.html
Normal file
@@ -0,0 +1,342 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<title>accessibleBlockly Basic Demo</title>
|
||||
|
||||
<!-- Load Blockly -->
|
||||
<script src='../../../blockly_compressed.js'></script>
|
||||
<script src='../../../blocks_compressed.js'></script>
|
||||
<script src='../../../javascript_compressed.js'></script>
|
||||
<script src='../../../msg/js/en.js'></script>
|
||||
<script src='../../../msg/messages.js'></script>
|
||||
|
||||
<!-- Load accessibleBlockly -->
|
||||
<script src='../../../accessible/libs/es6-shim.min.js'></script>
|
||||
<script src='../../../accessible/libs/angular2-polyfills.min.js'></script>
|
||||
<script src='../../../accessible/libs/Rx.umd.min.js'></script>
|
||||
<script src='../../../accessible/libs/angular2-all.umd.min.js'></script>
|
||||
<script src='../../../accessible/utils.service.js'></script>
|
||||
<script src='../../../accessible/clipboard.service.js'></script>
|
||||
<script src='../../../accessible/tree.service.js'></script>
|
||||
<script src='../../../accessible/fieldview.component.js'></script>
|
||||
<script src='../../../accessible/workspace_treeview.component.js'></script>
|
||||
<script src='../../../accessible/toolbox_treeview.component.js'></script>
|
||||
<script src='../../../accessible/toolboxview.component.js'></script>
|
||||
<script src='../../../accessible/workspaceview.component.js'></script>
|
||||
<script src='../../../accessible/appview.component.js'></script>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="../../../media/accessible.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<blockly-app></blockly-app>
|
||||
|
||||
<script src='boot.js'></script>
|
||||
|
||||
<xml id="blockly-toolbox-xml" style='display: none'>
|
||||
<category name='Logic' colour='210'>
|
||||
<block type='controls_if'></block>
|
||||
<block type='logic_compare'></block>
|
||||
<block type='logic_operation'></block>
|
||||
<block type='logic_negate'></block>
|
||||
<block type='logic_boolean'></block>
|
||||
<block type='logic_null' disabled='true'></block>
|
||||
<block type='logic_ternary'></block>
|
||||
</category>
|
||||
<category name='Loops' colour='120'>
|
||||
<block type='controls_repeat_ext'>
|
||||
<value name='TIMES'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>10</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='controls_repeat' disabled='true'></block>
|
||||
<block type='controls_whileUntil'></block>
|
||||
<block type='controls_for'>
|
||||
<value name='FROM'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='TO'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>10</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='BY'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='controls_forEach'></block>
|
||||
<block type='controls_flow_statements'></block>
|
||||
</category>
|
||||
<category name='Math' colour='230'>
|
||||
<block type='math_number' gap='32'></block>
|
||||
<block type='math_arithmetic'>
|
||||
<value name='A'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='B'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_single'>
|
||||
<value name='NUM'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>9</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_trig'>
|
||||
<value name='NUM'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>45</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_constant'></block>
|
||||
<block type='math_number_property'>
|
||||
<value name='NUMBER_TO_CHECK'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>0</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_change'>
|
||||
<value name='DELTA'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_round'>
|
||||
<value name='NUM'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>3.1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_on_list'></block>
|
||||
<block type='math_modulo'>
|
||||
<value name='DIVIDEND'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>64</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='DIVISOR'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>10</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_constrain'>
|
||||
<value name='VALUE'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>50</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='LOW'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='HIGH'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>100</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_random_int'>
|
||||
<value name='FROM'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>1</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='TO'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>100</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='math_random_float'></block>
|
||||
</category>
|
||||
<category name='Text' colour='160'>
|
||||
<block type='text'></block>
|
||||
<block type='text_join'></block>
|
||||
<block type='text_append'>
|
||||
<value name='TEXT'>
|
||||
<shadow type='text'></shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_length'>
|
||||
<value name='VALUE'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'>abc</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_isEmpty'>
|
||||
<value name='VALUE'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'></field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_indexOf'>
|
||||
<value name='VALUE'>
|
||||
<block type='variables_get'>
|
||||
<field name='VAR'>text</field>
|
||||
</block>
|
||||
</value>
|
||||
<value name='FIND'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'>abc</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_charAt'>
|
||||
<value name='VALUE'>
|
||||
<block type='variables_get'>
|
||||
<field name='VAR'>text</field>
|
||||
</block>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_getSubstring'>
|
||||
<value name='STRING'>
|
||||
<block type='variables_get'>
|
||||
<field name='VAR'>text</field>
|
||||
</block>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_changeCase'>
|
||||
<value name='TEXT'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'>abc</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_trim'>
|
||||
<value name='TEXT'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'>abc</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_print'>
|
||||
<value name='TEXT'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'>abc</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='text_prompt_ext'>
|
||||
<value name='TEXT'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'>abc</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
</category>
|
||||
<category name='Lists' colour='260'>
|
||||
<block type='lists_create_with'>
|
||||
<mutation items='0'></mutation>
|
||||
</block>
|
||||
<block type='lists_create_with'></block>
|
||||
<block type='lists_repeat'>
|
||||
<value name='NUM'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>5</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='lists_length'></block>
|
||||
<block type='lists_isEmpty'></block>
|
||||
<block type='lists_indexOf'>
|
||||
<value name='VALUE'>
|
||||
<block type='variables_get'>
|
||||
<field name='VAR'>list</field>
|
||||
</block>
|
||||
</value>
|
||||
</block>
|
||||
<block type='lists_getIndex'>
|
||||
<value name='VALUE'>
|
||||
<block type='variables_get'>
|
||||
<field name='VAR'>list</field>
|
||||
</block>
|
||||
</value>
|
||||
</block>
|
||||
<block type='lists_setIndex'>
|
||||
<value name='LIST'>
|
||||
<block type='variables_get'>
|
||||
<field name='VAR'>list</field>
|
||||
</block>
|
||||
</value>
|
||||
</block>
|
||||
<block type='lists_getSublist'>
|
||||
<value name='LIST'>
|
||||
<block type='variables_get'>
|
||||
<field name='VAR'>list</field>
|
||||
</block>
|
||||
</value>
|
||||
</block>
|
||||
<block type='lists_split'>
|
||||
<value name='DELIM'>
|
||||
<shadow type='text'>
|
||||
<field name='TEXT'>,</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
</category>
|
||||
<category name='Colour' colour='20'>
|
||||
<block type='colour_picker'></block>
|
||||
<block type='colour_random'></block>
|
||||
<block type='colour_rgb'>
|
||||
<value name='RED'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>100</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='GREEN'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>50</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='BLUE'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>0</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
<block type='colour_blend'>
|
||||
<value name='COLOUR1'>
|
||||
<shadow type='colour_picker'>
|
||||
<field name='COLOUR'>#ff0000</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='COLOUR2'>
|
||||
<shadow type='colour_picker'>
|
||||
<field name='COLOUR'>#3333ff</field>
|
||||
</shadow>
|
||||
</value>
|
||||
<value name='RATIO'>
|
||||
<shadow type='math_number'>
|
||||
<field name='NUM'>0.5</field>
|
||||
</shadow>
|
||||
</value>
|
||||
</block>
|
||||
</category>
|
||||
<sep></sep>
|
||||
<category name='Variables' colour='330' custom='VARIABLE'></category>
|
||||
<category name='Functions' colour='290' custom='PROCEDURE'></category>
|
||||
</xml>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user