CodeCrafter - Building App Inventor Extensions With Blocks

:+1: :+1: :+1:

More specifically, the runtime code will convert an implementation of Java's List interface into a YailList when it is returned by a component. However, all lists received as an argument to a method call will be YailList, so if you write:

@SimpleFunction
public void CalculateOnList(List<Object> foo) {
  // foo will be a YailList since all YailList are List
}
4 Likes
Microsoft Windows [Version 10.0.19045.5131]
(c) Microsoft Corporation. All rights reserved.

F:\CodeCrafterAIX\server\PythonServer>python server.py
Traceback (most recent call last):
  File "F:\CodeCrafterAIX\server\PythonServer\server.py", line 7, in <module>
    import requests
ModuleNotFoundError: No module named 'requests'

F:\CodeCrafterAIX\server\PythonServer>

found error what issue

You must install dependencies with pip, in this case pip install requests

New version

- Now you can create helper classes that will be allocated directly in helpers.

3 Likes

Are you willing to release prebuilt binaries for this builder?

2 Likes

It's open source, so you can do everything under the MIT license.

2 Likes

Test here: CodeCrafter AIX

2 Likes

I've noticed that it doesn't seem responsive to mobile users. You might take a look at this issue.

3 Likes

You're right. It's not optimized for mobile yet.

1 Like

Its Difficult to handle Blockly on mobile like device and small screen device. and Mouse and Screen is essential for Blockly Work for easy GUI .

1 Like

You're right. I'll be uploading a mobile optimization soon.

2 Likes

I have created mobile responsive with theme customisation check here :point_down:

1 Like

Very good. Have you submitted the pull request on GitHub?

Not yet..
Submit later.. :boom:

  1. I have find the :point_up_2: this background I'd class to change the theme color.

  2. 2nd issue block aria invisible of 1st time code preview Toggle button click.:point_down:

  3. If mobile device by default code preview collapse then better view of block aria.

2 Likes

Very good



The next version will be compatible with the new version of Fast Cli and the IDE will be able to:

  • search for blocks added to the workspace
  • Generate proguard-rules.pro files
Code added to IDE

main.js

document.addEventListener('keydown', function (event) {
    if (event.ctrlKey && event.key === 'f') {
        event.preventDefault();
        openSearchWorkspaceModal();
    }
});

function openSearchWorkspaceModal() {
    const existingModal = document.getElementById('workspaceSearchModal');
    if (existingModal) {
        existingModal.remove(); // Remove if already exists
    }

    const modal = document.createElement('div');
    modal.id = 'workspaceSearchModal';
    modal.style.position = 'fixed';
    modal.style.top = '20px';
    modal.style.left = '50%';
    modal.style.transform = 'translateX(-50%)';
    modal.style.backgroundColor = '#fff';
    modal.style.border = '1px solid #ccc';
    modal.style.padding = '10px';
    modal.style.zIndex = 1000;
    modal.style.display = 'flex';
    modal.style.alignItems = 'center';

    const input = document.createElement('input');
    input.type = 'text';
    input.placeholder = 'Search blocks in workspace...';
    input.style.marginRight = '10px';
    input.style.padding = '5px';
    input.style.flexGrow = '1';

    const searchButton = document.createElement('button');
    searchButton.textContent = 'Search';
    searchButton.style.padding = '5px 10px';
    searchButton.addEventListener('click', () => {
        const query = input.value.toLowerCase();
        resetHighlightedBlocks(); // Reset any previously highlighted blocks
        highlightMatchingBlocks(query);
    });

    const closeButton = document.createElement('button');
    closeButton.textContent = 'Close';
    closeButton.style.padding = '5px 10px';
    closeButton.addEventListener('click', () => modal.remove());

    modal.appendChild(input);
    modal.appendChild(searchButton);
    modal.appendChild(closeButton);
    document.body.appendChild(modal);
    input.focus();
}

function highlightMatchingBlocks(query) {
    const workspace = Blockly.getMainWorkspace();
    if (!workspace) return;

    const allBlocks = workspace.getAllBlocks();
    let foundBlocks = false;

    allBlocks.forEach(block => {
        const blockText = `${block.type} ${block.toString()}`.toLowerCase();
        if (blockText.includes(query)) {
            foundBlocks = true;
            if (!block.originalColour) {
                block.originalColour = block.getColour(); // Save the original color
            }
            block.setColour('#FFD700'); // Highlight color (gold)

            // Add click listener to reset color on click
            block.clickHandler = function () {
                block.setColour(block.originalColour);
                block.originalColour = null;
                block.clickHandler = null; // Remove listener
            };
            block.getSvgRoot().addEventListener('click', block.clickHandler);
        }
    });

    if (!foundBlocks) {
        alert('No matching blocks found.');
    }
}

function resetHighlightedBlocks() {
    const workspace = Blockly.getMainWorkspace();
    if (!workspace) return;

    const allBlocks = workspace.getAllBlocks();
    allBlocks.forEach(block => {
        if (block.originalColour) {
            block.setColour(block.originalColour);
            block.originalColour = null;

            // Remove any attached click listener
            if (block.clickHandler) {
                block.getSvgRoot().removeEventListener('click', block.clickHandler);
                block.clickHandler = null;
            }
        }
    });
}

blockly.css

#searchModal input {
    width: 300px;
    font-size: 16px;
    border: 1px solid #ccc;
}

Will this also move the workspace to the found block?

All blocks found will be painted yellow.

New upgrade

+ Update with the new version of Fast Cli
+ Fixed Blockly workspace resizing
+  Standardizing the building block with Fast Cli
+ Colorization of selected Tabs
+ Resize the screen with F11 or manually without changing the Blockly workspace design.
+ Search for blocks using Ctrl+F keys
- Fixed screen removal with F11 key.

Happy coding! :tada:

2 Likes