Project by: Adam Klein, Ian Strachan, Brandon Slater

The project that we set out to complete was to store, parse, and display information from a USB mouse in the form of a painting program. The idea behind the project is to be able to plug the mouse and VGA cables into the Basys board in its built-in ports, and have the mouse displayed as a moveable painting square on the monitor, changing different colors when left and right clicks are used. In essence, we’d be creating a driver for using the mouse with the basys board, and having the monitor as our verification of functionality. What ended up really happening was the creation of a drawing program with the basys board as an input system, and a semi-functional data capturing system for the mouse.

In this instructable, we'll break down the steps from mouse input to vga output.

Step 1: Motivation and Problem

Motivation:

The main motivation for our project was to create a mouse driver for the Basys3 board that future CPE 133 students would be able to use for their final projects in the future. However, we took this idea a step further by creating a painting program, one that future students could build off of as well.

Problem:

The problem we discovered was that there is no clear mouse module ready to download and use for the Basys3 board. To solve this problem, we attempted to create one ourselves. By doing so, we were striving to create a mouse module that would allow future students to more easily implement mouse input in their projects.

Step 2: Getting the Raw Bit Information From the Basys USB

Much of what we did for the mouse in this project came from the Basys3 documentation. From the small guide on the Basys USB port in that pdf, we found that the Basys board has a built in clock for reading bits at the right speed from USB devices.
Essentially, the mouse sends bits to usb starting from an idle state, reads 32 bits representing the mouses status, x position, and y position, and finally ends with another idle bit. To do this, the mouse input component uses a shift register and 32 bit counter where the shift register is used to store 32 bits of incoming data from the mouse and the 32 bit counter is used to count the number of bits being stored allowing the state register to reset and store the next set of 32 incoming bits.
The code for the shift register, 32 bit counter, and data reader are downloadable below, as well as the constraints file adapted to our use of the USB port as an input

Step 3: Parsing the Usb Information

After creating the mouse input to usb component, the next step was to create the usb bits to vector information component that would make the data received by the mouse readable for the vga.
This component uses a state machine that takes in the set of bits outputted by the mouse input to usb and moves through the states based on whether new bits that change the status and position of the mouse were inputted.
The block diagram for the first two steps of the project is shown here, and the two vhdl files are for testing the implementation of the mouse using the basys LED's (a test that was unfortunately never passed) and for casting the bit stream from the USB port to speed and position vectors that the VGA can use.
The image next to the block diagram above is a small snapshot (Instructables isn't allowing us to display the full wide image) of the bit information we found in the basys documentation for completing this step.

Step 4: Displaying the Painted Image Over VGA and Editing What's Being Drawn

The VGA cable has 14 bits of output, 4 bits for each of the three colors and a bit for horizontal sync and vertical sync.
OtherVGA is the provided VGA module and it functions as the following:
- The monitor is broken up into 40x30 blocks of 16x16 pixels for a 640x480 resolution screen as seen in the picture above. The module selects a block address to represent one of the 1200 blocks on the monitor. The block address is selected through the following equation: address = 40y + x
- The color is represented by a 12 bit signal which correlates to an RRRRGGGGBBBB value that colors the selected block.
Our control code, VGAtest and VGAtestconst, functions as the following:
- It first sets the selected block to the center of the monitor.
- The color of the block is determined by 12 switches on the board, setting the RRRRGGGGBBBB value.
- The four directional buttons on the board change the selected address. For example, pressing the right button will add 1 to the address, selecting the block one to the right of the previous block. Pressing the down button will add 40 to the address, selecting the block one below the previous block.
- The center button is used to set all of the color values to 0 when pressed. This is meant to behave as an erase button that is easy for the user to use, so the user does not have to flip every switch to 0 in order to erase.
The last image is the block diagram for the controller. It is fairly wide since it includes components of the module and may not be displayed fully.

Step 5: Enjoy Your Creation!

Linked here is a quick timelapse of the fun you can have with the final project, even just with using the switches and buttons on the basys board as input.

Thanks for reading!