diff --git a/demos/blockfactory/app_controller.js b/demos/blockfactory/app_controller.js index 225078b81..c82d525c7 100644 --- a/demos/blockfactory/app_controller.js +++ b/demos/blockfactory/app_controller.js @@ -32,7 +32,6 @@ goog.require('FactoryUtils'); goog.require('BlockLibraryController'); goog.require('BlockExporterController'); goog.require('goog.dom.classlist'); -goog.require('goog.string'); goog.require('goog.ui.PopupColorPicker'); goog.require('goog.ui.ColorPicker'); @@ -59,11 +58,11 @@ AppController = function() { // Map of tab type to the div element for the tab. this.tabMap = Object.create(null); this.tabMap[AppController.BLOCK_FACTORY] = - goog.dom.getElement('blockFactory_tab'); + document.getElementById('blockFactory_tab'); this.tabMap[AppController.WORKSPACE_FACTORY] = - goog.dom.getElement('workspaceFactory_tab'); + document.getElementById('workspaceFactory_tab'); this.tabMap[AppController.EXPORTER] = - goog.dom.getElement('blocklibraryExporter_tab'); + document.getElementById('blocklibraryExporter_tab'); // Last selected tab. this.lastSelectedTab = null; @@ -535,7 +534,7 @@ AppController.prototype.assignBlockFactoryClickHandlers = function() { self.blockLibraryController.setNoneSelected(); // Close the Block Library Dropdown. - goog.dom.getElement('dropdownDiv_blockLib').classList.remove("show"); + document.getElementById('dropdownDiv_blockLib').classList.remove('show'); }); }; diff --git a/demos/blockfactory/block_exporter_tools.js b/demos/blockfactory/block_exporter_tools.js index 88e17a2e2..596ad8764 100644 --- a/demos/blockfactory/block_exporter_tools.js +++ b/demos/blockfactory/block_exporter_tools.js @@ -47,7 +47,7 @@ BlockExporterTools = function() { }, ''); // Empty quotes for empty div. // Hide hidden workspace. this.container.style.display = 'none'; - goog.dom.appendChild(document.body, this.container); + document.body.appendChild(this.container); /** * Hidden workspace for the Block Exporter that holds pieces that make * up the block @@ -251,9 +251,12 @@ BlockExporterTools.prototype.createBlockSelectorFromLib = // them in the exporter workspace. this.addBlockDefinitions(blockXmlMap); - var blockSelector = goog.dom.getElement(blockSelectorID); + var blockSelector = document.getElementById(blockSelectorID); // Clear the block selector. - goog.dom.removeChildren(blockSelector); + var child; + while ((child = blockSelector.firstChild)) { + blockSelector.removeChild(child); + } // Append each block option's dom to the selector. var blockOptions = Object.create(null); @@ -266,7 +269,7 @@ BlockExporterTools.prototype.createBlockSelectorFromLib = // option to block selector. var blockOpt = new BlockOption(blockSelector, blockType, previewBlockXml); blockOpt.createDom(); - goog.dom.appendChild(blockSelector, blockOpt.dom); + blockSelector.appendChild(blockOpt.dom); blockOpt.showPreviewBlock(); blockOptions[blockType] = blockOpt; } diff --git a/demos/blockfactory/block_exporter_view.js b/demos/blockfactory/block_exporter_view.js index fbeddaf47..011fc2bf5 100644 --- a/demos/blockfactory/block_exporter_view.js +++ b/demos/blockfactory/block_exporter_view.js @@ -61,10 +61,10 @@ BlockExporterView.prototype.setBlockOptions = function(blockOptions) { */ BlockExporterView.prototype.updateHelperText = function(newText, opt_append) { if (opt_append) { - goog.dom.getElement('helperText').textContent = - goog.dom.getElement('helperText').textContent + newText; + document.getElementById('helperText').textContent = + document.getElementById('helperText').textContent + newText; } else { - goog.dom.getElement('helperText').textContent = newText; + document.getElementById('helperText').textContent = newText; } }; @@ -74,7 +74,7 @@ BlockExporterView.prototype.updateHelperText = function(newText, opt_append) { BlockExporterView.prototype.listSelectedBlocks = function() { var selectedBlocksText = this.getSelectedBlockTypes().join(",\n "); - goog.dom.getElement('selectedBlocksText').textContent = selectedBlocksText; + document.getElementById('selectedBlocksText').textContent = selectedBlocksText; }; /** diff --git a/demos/blockfactory/block_library_view.js b/demos/blockfactory/block_library_view.js index 444c91c6d..6179841cd 100644 --- a/demos/blockfactory/block_library_view.js +++ b/demos/blockfactory/block_library_view.js @@ -41,13 +41,13 @@ var BlockLibraryView = function() { // Div element to contain the block types to choose from. // Id of the div that holds the block library view. this.blockLibraryViewDivID = 'dropdownDiv_blockLib'; - this.dropdown = goog.dom.getElement('dropdownDiv_blockLib'); + this.dropdown = document.getElementById('dropdownDiv_blockLib'); // Map of block type to corresponding 'a' element that is the option in the // dropdown. Used to quickly and easily get a specific option. this.optionMap = Object.create(null); // Save and delete buttons. - this.saveButton = goog.dom.getElement('saveToBlockLibraryButton'); - this.deleteButton = goog.dom.getElement('removeBlockFromLibraryButton'); + this.saveButton = document.getElementById('saveToBlockLibraryButton'); + this.deleteButton = document.getElementById('removeBlockFromLibraryButton'); // Initially, user should not be able to delete a block. They must save a // block or select a stored block first. this.deleteButton.disabled = true; @@ -202,17 +202,15 @@ BlockLibraryView.prototype.getSelectedBlockType = function() { * @return {!Element} HTML 'a' element that is the option for a block type. */ BlockLibraryView.prototype.getSelectedOption = function() { - return goog.dom.getElementByClass('dropdown-content-selected', this.dropdown); + return this.dropdown.getElementsByClassName('dropdown-content-selected')[0]; }; /** * Removes all options from dropdown. */ BlockLibraryView.prototype.clearOptions = function() { - var blockOpts = goog.dom.getElementsByClass('blockLibOpt', this.dropdown); - if (blockOpts) { - for (var i = 0, option; option = blockOpts[i]; i++) { - goog.dom.removeNode(option); - } + var blockOpts = this.dropdown.getElementsByClassName('blockLibOpt'); + for (var i = 0, option; option = blockOpts[i]; i++) { + option.parentNode.removeChild(option); } }; diff --git a/demos/blockfactory/block_option.js b/demos/blockfactory/block_option.js index 90efe405f..9e03b601a 100644 --- a/demos/blockfactory/block_option.js +++ b/demos/blockfactory/block_option.js @@ -81,38 +81,38 @@ BlockOption.prototype.createDom = function() { 'id' : this.blockType + '_workspace', 'class': 'blockOption_preview' }, ''); - goog.dom.appendChild(blockOptContainer,blockOptionPreview); + blockOptContainer.appendChild(blockOptionPreview); // Create and append container to hold checkbox and label. var checkLabelContainer = goog.dom.createDom('div', { 'class': 'blockOption_checkLabel' }, ''); - goog.dom.appendChild(blockOptContainer,checkLabelContainer); + blockOptContainer.appendChild(checkLabelContainer); // Create and append container for checkbox. var checkContainer = goog.dom.createDom('div', { 'class': 'blockOption_check' }, ''); - goog.dom.appendChild(checkLabelContainer, checkContainer); + checkLabelContainer.appendChild(checkContainer); // Create and append checkbox. this.checkbox = goog.dom.createDom('input', { 'type': 'checkbox', 'id': this.blockType + '_check' }, ''); - goog.dom.appendChild(checkContainer, this.checkbox); + checkContainer.appendChild(this.checkbox); // Create and append container for block label. var labelContainer = goog.dom.createDom('div', { 'class': 'blockOption_label' }, ''); - goog.dom.appendChild(checkLabelContainer, labelContainer); + checkLabelContainer.appendChild(labelContainer); // Create and append text node for the label. var labelText = goog.dom.createDom('p', { 'id': this.blockType + '_text' }, this.blockType); - goog.dom.appendChild(labelContainer, labelText); + labelContainer.appendChild(labelText); this.dom = blockOptContainer; return this.dom; diff --git a/demos/blockfactory/devtools.png b/demos/blockfactory/devtools.png new file mode 100644 index 000000000..b38a8894b Binary files /dev/null and b/demos/blockfactory/devtools.png differ diff --git a/demos/blockfactory/factory_utils.js b/demos/blockfactory/factory_utils.js index f961c0bdf..17c2c4817 100644 --- a/demos/blockfactory/factory_utils.js +++ b/demos/blockfactory/factory_utils.js @@ -884,8 +884,8 @@ FactoryUtils.injectCode = function(code, id) { */ FactoryUtils.sameBlockXml = function(blockXml1, blockXml2) { // Each XML element should contain a single child element with a 'block' tag - if (goog.string.caseInsensitiveCompare(blockXml1.tagName, 'xml') || - goog.string.caseInsensitiveCompare(blockXml2.tagName, 'xml')) { + if (!blockXml1.tagName.toLowerCase() == 'xml' || + !blockXml2.tagName.toLowerCase() == 'xml') { throw new Error('Expected two XML elements, recieved elements with tag ' + 'names: ' + blockXml1.tagName + ' and ' + blockXml2.tagName + '.'); } diff --git a/demos/blockfactory/index.html b/demos/blockfactory/index.html index 72ddce573..0ac9176da 100644 --- a/demos/blockfactory/index.html +++ b/demos/blockfactory/index.html @@ -43,7 +43,7 @@

Blockly > - Demos > Blockly Factory + Demos > Blockly Developer Tools diff --git a/demos/blockfactory/workspacefactory/index.html b/demos/blockfactory/workspacefactory/index.html deleted file mode 100644 index 92b4668e0..000000000 --- a/demos/blockfactory/workspacefactory/index.html +++ /dev/null @@ -1,769 +0,0 @@ - - -Blockly Workspace Factory - - - - - - - - - - - - - - - - - - - - - -
-

Blockly‏ > - Demos‏ > - Workspace Factory -

-
-

-

- -
- - - - -
-
- -
- -
- Toolbox - Workspace Blocks - Inject Options - All -
-
- - - -

-
- -
-

Drag blocks into your toolbox:

- - - -
ToolboxWorkspace
-
-
-
-
- - - -
- -
- Add Shadow -
-
- Remove Shadow -
-
- - - -
- - - - - - diff --git a/demos/blockfactory/workspacefactory/wfactory_controller.js b/demos/blockfactory/workspacefactory/wfactory_controller.js index c4da7257e..344da0e14 100644 --- a/demos/blockfactory/workspacefactory/wfactory_controller.js +++ b/demos/blockfactory/workspacefactory/wfactory_controller.js @@ -277,7 +277,7 @@ WorkspaceFactoryController.prototype.switchElement = function(id) { /** * Switches to a new tab for the element by ID. Helper for switchElement. * Updates selected, clears the workspace and clears undo, loads a new element. - * @param {string} id ID of category to load + * @param {string} id ID of category to load. */ WorkspaceFactoryController.prototype.clearAndLoadElement = function(id) { // Unselect current tab if switching to and from an element. @@ -1242,7 +1242,7 @@ WorkspaceFactoryController.prototype.setBlockLibCategory = function(categoryXml, libBlockTypes) { var blockLibCategory = document.getElementById('blockLibCategory'); - // Set category id so that it can be easily replaced, and set a standard, + // Set category ID so that it can be easily replaced, and set a standard, // arbitrary block library color. categoryXml.setAttribute('id', 'blockLibCategory'); categoryXml.setAttribute('colour', 260); diff --git a/demos/blockfactory/workspacefactory/wfactory_view.js b/demos/blockfactory/workspacefactory/wfactory_view.js index 245c7e5cb..cd652b951 100644 --- a/demos/blockfactory/workspacefactory/wfactory_view.js +++ b/demos/blockfactory/workspacefactory/wfactory_view.js @@ -121,7 +121,7 @@ WorkspaceFactoryView.prototype.updateState = function(selectedIndex, selected) { }; /** - * Determines the DOM id for a category given its name. + * Determines the DOM ID for a category given its name. * @param {string} name Name of category * @return {string} ID of category tab */ @@ -146,8 +146,8 @@ WorkspaceFactoryView.prototype.setCategoryTabSelection = /** * Used to bind a click to a certain DOM element (used for category tabs). * Taken directly from code.js - * @param {string|!Element} e1 tab element or corresponding id string - * @param {!Function} func Function to be executed on click + * @param {string|!Element} e1 Tab element or corresponding ID string. + * @param {!Function} func Function to be executed on click. */ WorkspaceFactoryView.prototype.bindClick = function(el, func) { if (typeof el == 'string') { diff --git a/demos/index.html b/demos/index.html index bd745ce88..7501bfa1f 100644 --- a/demos/index.html +++ b/demos/index.html @@ -199,12 +199,12 @@ - + -
Block Factory
-
Build custom blocks using Blockly.
+
Blockly Developer Tools
+
Build custom blocks and setup a toolbox using Blockly.