CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-04 23:50:12 +01:00
Code Issues Packages Projects Releases Wiki Activity

Basic linting

Browse Source 
Untested.
This commit is contained in:
Neil Fraser
2019-07-29 13:28:43 -07:00
committed by Neil Fraser
parent 826409b01a
commit 95b26d3f23
1 changed files with 59 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
demos/keyboard_nav/index.html
View File

@@ -24,22 +24,23 @@
<p>Keyboard Navigation is our first step towards an accessible Blockly.<br>
You can enter accessibility mode by <b>shift clicking anywhere on the
workspace or on a block.</b> <br>Some basic commands for moving around are below.
workspace or on a block</b>. <br>Some basic commands for moving around are below.
More complete documentation is still in progress.<br><br>
<b>Workspace Navigation</b><br>
W: Previous block/field/input at the same level<br>
A: Up one level (Field (or input) -> Block -> Input (or field) -> Block ->
Stack -> Workspace)<br>
S: Next block/field/input at the same level<br>
D: Down one level (Workspace -> Stack -> Block -> Input ( or field) -> Block
-> Field (orinput))<br>
D: Down one level (Workspace -> Stack -> Block -> Input (or field) -> Block
-> Field (or input))<br>
T: Will open the toolbox. Once in there you can moving around using the WASD keys. And insert a block by hitting Enter<br>
X: While on a connection hit X to disconnect the block after the cursor<br><br>
<b>Pre Order Traversal</b><br>
Feel free to just play around in accessibility mode or hit the button below to
see the demo. The demo uses <a href="https://en.wikipedia.org/wiki/Tree_traversal#Pre-order_(NLR)">preorder tree traversal</a> as an alternative way to navigate the blocks,
connections, and fields on the workspace.<br><br>
Feel free to just play around in accessibility mode or hit the button below to see the demo.
The demo uses <a href="https://en.wikipedia.org/wiki/Tree_traversal#Pre-order_(NLR)">preorder tree traversal</a>
as an alternative way to navigate the blocks,
connections, and fields on the workspace.
</p>
<!-- TODO: Update when we add keyboard navigation to site -->
@@ -52,7 +53,7 @@
<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>
<xml id="toolbox" style="display: none">
<xml xmlns="https://developers.google.com/blockly/xml" id="toolbox" style="display: none">
<category name="Logic" colour="%{BKY_LOGIC_HUE}">
<block type="controls_if"></block>
<block type="logic_compare"></block>
@@ -84,38 +85,38 @@
</category>
</xml>
<xml id="startBlocks" style="display: none">
<xml xmlns="https://developers.google.com/blockly/xml" id="startBlocks" style="display: none">
<variables>
<variable type="" id="~GNXm@Z(wclI]t3zTf.g">list</variable>
<variable type="" id="8]s[S+Gy+%k7HoFup])m">item</variable>
<variable id="~GNXm@Z(wclI]t3zTf.g">list</variable>
<variable id="8]s[S+Gy+%k7HoFup])m">item</variable>
</variables>
<block type="controls_if" id="^^hRiX{cCPHWJr}?8M^5" x="37" y="162">
<block type="controls_if" x="37" y="162">
<value name="IF0">
<block type="logic_compare" id="#yzPl3=N6CIpUKvJ0b1(">
<block type="logic_compare">
<field name="OP">EQ</field>
<value name="A">
<block type="math_arithmetic" id="h#NOs2/B*.f{5N=9L|m|">
<block type="math_arithmetic">
<field name="OP">ADD</field>
<value name="A">
<shadow type="math_number" id="~4Z2|fDhdniR@Z=9m.]5">
<shadow type="math_number">
<field name="NUM">1</field>
</shadow>
</value>
<value name="B">
<shadow type="math_number" id="X9ywC|L-2$E#DHd[75bJ">
<shadow type="math_number">
<field name="NUM">1</field>
</shadow>
</value>
</block>
</value>
<value name="B">
<block type="math_single" id="Ad|PE{k|OX2k,ef#S1sC">
<block type="math_single">
<field name="OP">ROOT</field>
<value name="NUM">
<shadow type="math_number" id=",d-)d1gr[f%EYC)jryuz">
<shadow type="math_number">
<field name="NUM">9</field>
</shadow>
<block type="math_number" id="xn[NF$ps1cPK(;q8K1PM">
<block type="math_number">
<field name="NUM">123</field>
</block>
</value>
@@ -124,20 +125,20 @@
</block>
</value>
<statement name="DO0">
<block type="lists_setIndex" id="EX~e8#P8]I7BOSH%]11H">
<block type="lists_setIndex">
<mutation at="true"></mutation>
<field name="MODE">SET</field>
<field name="WHERE">FROM_START</field>
<value name="LIST">
<block type="variables_get" id="#(o=|qGel$T_MJkZU,%1">
<field name="VAR" id="~GNXm@Z(wclI]t3zTf.g" variabletype="">list</field>
<block type="variables_get">
<field name="VAR" id="~GNXm@Z(wclI]t3zTf.g">list</field>
</block>
</value>
<next>
<block type="text_append" id="gB,Xu47i^C//_e-J7NiY">
<field name="VAR" id="8]s[S+Gy+%k7HoFup])m" variabletype="">item</field>
<block type="text_append">
<field name="VAR" id="8]s[S+Gy+%k7HoFup])m">item</field>
<value name="TEXT">
<shadow type="text" id="|PcJ2q-,B,gRn7Bz%gm|">
<shadow type="text">
<field name="TEXT"></field>
</shadow>
</value>
@@ -146,9 +147,9 @@
</block>
</statement>
<next>
<block type="controls_repeat_ext" id="O=qqWbd:drvugOFlDR3R">
<block type="controls_repeat_ext">
<value name="TIMES">
<shadow type="math_number" id="0Y^xJhJqlh$.1C?5}B`;">
<shadow type="math_number">
<field name="NUM">10</field>
</shadow>
</value>
@@ -163,28 +164,31 @@
toolbox: document.getElementById('toolbox')});
Blockly.Xml.domToWorkspace(document.getElementById('startBlocks'),
demoWorkspace);
/**
* Decides what nodes to traverse and which ones to skip. Currently, it
* skips output, stack and workspace nodes.
* @param {Blockly.ASTNode} node The ast node to check whether it is valid.
* @return {Boolean} True if the node should be visited, false otherwise.
* @param {Blockly.ASTNode} node The AST node to check whether it is valid.
* @return {boolean} True if the node should be visited, false otherwise.
* @package
*/
function validNode(node) {
var isValid = false;
if (node && (node.getType() === Blockly.ASTNode.types.BLOCK
|| node.getType() === Blockly.ASTNode.types.INPUT
|| node.getType() === Blockly.ASTNode.types.FIELD
|| node.getType() === Blockly.ASTNode.types.NEXT
|| node.getType() === Blockly.ASTNode.types.PREVIOUS)) {
isValid = true;
var type = node && node.getType();
if (type == Blockly.ASTNode.types.BLOCK ||
type == Blockly.ASTNode.types.INPUT ||
type == Blockly.ASTNode.types.FIELD ||
type == Blockly.ASTNode.types.NEXT ||
type == Blockly.ASTNode.types.PREVIOUS) {
isValid = true;
}
return isValid;
}
/**
* From the given node find either the next valid sibling or parent.
* @param {Blockly.ASTNode} node The current position in the ast.
* @return {Blockly.ASTNode} The parent ast node or null if there are no
* @param {Blockly.ASTNode} node The current position in the AST.
* @return {Blockly.ASTNode} The parent AST node or null if there are no
* valid parents.
* @package
*/
@@ -198,11 +202,12 @@
}
return findSiblingOrParent(node.out());
}
/**
* Uses pre order traversal to go navigate the blockly ast. This will allow
* a user to easily navigate the entire blockly AST without having to go in
* Uses pre order traversal to go navigate the Blockly AST. This will allow
* a user to easily navigate the entire Blockly AST without having to go in
* and out levels on the tree.
* @param {Blockly.ASTNode} node The current position in the ast.
* @param {Blockly.ASTNode} node The current position in the AST.
* @return {Blockly.ASTNode} The next node in the traversal.
* @package
*/
@@ -215,18 +220,17 @@
return newNode;
} else if (newNode) {
return treeTraversal(newNode);
} else {
var siblingOrParent = findSiblingOrParent(node.out());
if (validNode(siblingOrParent)) {
return siblingOrParent;
} else if (siblingOrParent
&& siblingOrParent.getType() !== Blockly.ASTNode.types.WORKSPACE) {
return treeTraversal(siblingOrParent);
} else {
return null;
}
}
var siblingOrParent = findSiblingOrParent(node.out());
if (validNode(siblingOrParent)) {
return siblingOrParent;
} else if (siblingOrParent &&
siblingOrParent.getType() !== Blockly.ASTNode.types.WORKSPACE) {
return treeTraversal(siblingOrParent);
}
return null;
}
/**
* Finds the next node in the tree traversal starting at the location of
* the cursor.
@@ -234,15 +238,16 @@
* @package
*/
function findNext() {
var cursor = Blockly.Navigation.cursor_;
var curNode = cursor.getCurNode();
return treeTraversal(curNode);
var cursor = Blockly.Navigation.cursor_;
var curNode = cursor.getCurNode();
return treeTraversal(curNode);
}
/**
* Shows the next node in the tree traversal every second.
* @package
*/
function demo () {
function demo() {
var doNext = function() {
var node = findNext();
Blockly.Navigation.cursor_.setLocation(node);
@@ -252,6 +257,7 @@
}
doNext();
}
/**
* Sets up accessibility mode so that the demo can successfully run.
* @package