CodeSwitch Documentation

Web Architect makes it easy to build professional websites using a visual interface. Add elements by dragging and dropping blocks from the toolbox.

Basic Workflow:

1. Drag blocks from the toolbox to your workspace
2. Customize block properties in the right panel
3. Preview your changes in real-time
4. Save or export your finished website

You can start with a blank canvas or choose from example templates to jumpstart your project.

Web Architect provides a variety of blocks to build your website, including:

• Document Block: The foundation of your page that sets up title and theme
• Navigation Elements: Headers, menus, and navigation links
• Content Blocks: Text, images, cards, and other content elements
• Forms: Interactive forms with various input fields
• Dynamic Content: Gallery, accordion, and other interactive elements

You can customize each block's properties using the panel on the right side of the editor.

Pro tip: Double-click on any block to collapse or expand it, making it easier to manage complex layouts and focus on specific sections.

Web Architect provides multiple ways to save and export your work:

Saving Projects:

• Page Naming: Save pages with specific filenames (e.g., "about" for about.html)
• Multi-page Projects: Create multiple HTML pages that work together
• Page Switching: Navigate between your created pages during editing

Exporting Options:

• Export HTML Project: Download a zip file containing all HTML files
• JSON Structure: View and edit the underlying JSON structure

Turtle Studio provides a simple way to learn programming by controlling a virtual turtle that can draw on a canvas.

Interface Overview:

• Code Editor: Write JavaScript or Python code
• Canvas: See your turtle drawings in real-time
• Playback Controls: Run, pause, and control execution speed
• Language Tabs: Switch between JavaScript and Python

You can select from pre-built lessons or create your own code from scratch.

Pro tip: When running your code, the currently executing line will be highlighted in the code editor, making it easier to follow the program flow.

Control the turtle with these basic commands:

Movement Commands:

• forward(distance): Move the turtle forward
• backward(distance): Move the turtle backward
• right(degrees): Turn right by specified degrees
• left(degrees): Turn left by specified degrees
• goto(x, y): Move directly to coordinates
• setHeading(angle): Set the turtle's direction

Pen Controls:

• penUp(): Stop drawing when moving
• penDown(): Start drawing when moving
• penColor(color): Change pen color
• penSize(width): Change pen thickness
• hide() / show(): Control turtle visibility

Fill Commands:

• beginFill(): Start filling shape
• endFill(): Complete shape and fill it
• fillColor(color): Set fill color

Language Limitations:

Turtle Studio supports basic programming constructs but has some limitations:

• Supported: Variables, loops (for/while), if/else statements, arrays, basic operators
• Not Supported: Ternary operators, switch/case statements, dictionaries/objects, function definitions, classes, try/catch blocks
• Language Conversion: When switching between JavaScript and Python, only supported features will be converted correctly
• Execution Environment: Only JavaScript code can be executed directly in the browser. Python code can be written and translated, but must be exported and run in a Python environment elsewhere

Turtle Studio provides several options for saving and sharing your code:

Saving Options:

• Copy Code: Copy your JavaScript or Python code to clipboard
• Download Code: Save your code as a JavaScript or Python file
• Import Code: Upload existing code files

Working with Lessons:

• Select Lessons: Choose from pre-built examples
• Programming Languages: Switch between JavaScript and Python

p5 Playground allows you to copy your p5.js sketches and debug them with enhanced tools. Simply paste your existing p5.js code and start debugging immediately.

Interface Overview:

• Code Editor: Write or paste your p5.js sketches
• Canvas: See your sketch running in real-time
• Speed Controls: Adjust execution speed for detailed debugging
• Variable Tracer: Monitor variable values as they change

Perfect for debugging complex animations and interactive sketches by slowing down execution and watching variables change.

Pro tip: Use the speed controls to slow down complex animations and trace exactly how your variables change over time.

RoboHub provides a beginner-friendly environment for learning Python robotics with a simplified API that hides boilerplate code.

Interface Overview:

• Python Code Editor: Write robot control code using simplified Python syntax
• 2D Simulation: Watch your robot in a realistic physics environment powered by Godot
• Real-time Feedback: See console output and sensor data as your code runs
• Progressive Lessons: Learn step-by-step with guided curriculum (Modules 0-2)
• Spike Prime Export: Generate and copy code that runs directly on Spike Prime hardware

Basic Workflow:

1. Select a lesson or start with an example
2. Write or modify Python code in the editor
3. Click Run to test in simulation
4. Complete lesson objectives for feedback
5. Export working code to Spike Prime when ready

The simplified API means you can focus on robotics logic without worrying about imports, initialization, or connection setup.

Control your robot using a simplified Python API designed for beginners:

Motor Control:

• motor_a.start(speed): Start motor A at given speed (-100 to 100)
• motor_b.start(speed): Start motor B at given speed (-100 to 100)
• motor_a.stop(): Stop motor A
• motor_b.stop(): Stop motor B

Timing:

• await wait(seconds): Pause execution for specified time

Sensor Reading:

• color_sensor.color(): Read current color detected
• color_sensor.reflection(): Read reflection value (0-100)
• distance_sensor.distance(): Read distance in centimeters

Example Code:

# Drive forward for 2 seconds
motor_a.start(50)
motor_b.start(50)
await wait(2)
motor_a.stop()
motor_b.stop()

Spike Prime Export: All code you write automatically generates equivalent Spike Prime Python code that you can copy and run on real hardware!

RoboHub includes a progressive curriculum with lessons organized into modules:

Module 0: Basic Movement

• Single Motor: Control one motor
• Dual Motors: Control both motors together
• Drive Forward: Move in a straight line
• Turning: Rotate in place and make turns
• Navigate to Goal: Reach a target position

Module 1: Line Following

• Color Detection: Read color sensor values
• Basic Line Follow: Follow a colored line
• Smooth Following: Improved line tracking

Module 2: Distance Sensor

• Reading Distance: Use ultrasonic sensor
• Obstacle Detection: Stop when detecting obstacles
• Wall Following: Navigate alongside walls

Example Programs:

Load pre-built examples to see working code:

• Movement patterns (square, circle, zigzag)
• Sensor demonstrations (obstacle avoid, line follow)
• Advanced behaviors (maze solving, smart explorer)

Each lesson provides objectives, hints, and automatic feedback to guide your learning.

RoboHub offers two ways to practice RoboCup Junior Soccer strategies:

1. Soccer Arena (Lesson Mode)

Practice soccer algorithms in the guided lesson environment:

• Select "Soccer Arena" from the course dropdown in lesson mode
• Load Examples: Try the "Simple Soccer" example program
• Single Robot Practice: Focus on your algorithm without distractions
• Export to Spike Prime: Generate code for real hardware

2. Competition Mode (Main Menu)

Simulate full matches with multiple robots:

• Multi-Robot Matches: Test team strategies with 2v2 gameplay
• Code vs Code: Upload different strategies and watch them compete
• Tournament Testing: Perfect for competition preparation
• Team Collaboration: Work with teammates on coordinated strategies

Soccer Features:

• Physics-Based Ball: Realistic ball movement and robot interactions
• IR Ball Sensor: Simulated infrared sensor for ball detection
• Gyro Sensor: Maintain orientation on the field
• Line Detection: Detect and stay within field boundaries
• Regulation Field: Standard RoboCup Junior Soccer dimensions

Workflow:

1. Develop: Write and test algorithms in Soccer Arena (lesson mode)
2. Refine: Practice unlimited iterations with instant feedback
3. Compete: Test against other strategies in Competition Mode
4. Deploy: Export proven code to Spike Prime for tournaments

Why This Matters: RoboCup teams typically get limited practice time with expensive hardware. RoboHub lets you test dozens of strategies in the time it takes to test one approach on physical robots, making competition prep much more effective.