Once you are familiar and comfortable with the concepts of RipDraw Web Portal Projects and GUI Designs, it is time to download load a RipDraw Web Portal Project to an actual RipDraw Display and give it a spin!
You can use either use a RipDraw Project that you put together or any of the public 1U RipDraw Projects on the RipDraw Web Portal. If you need to review the RipDraw Web Portal Projects and GUI Designs concepts again, just go back to the "Introduction to RipDraw Web Portal"
Initially, the Windows PC provided access to the RipDraw Web Portal, now we will use the Windows PC to download the project from the RipDraw Web Portal Project, transfer the images and fonts directly to the RipDraw display and finally drive the 1U RipDraw Display with the Windows PC.
We will be using the DIY project from our previous example for this discussion.
Here are the things that you will need:
The three steps are:
The Windows PC will be used to transfer the project from the RipDraw Web Portal to the 1U RipDraw display. First the project needs to be “packaged” by the RipDraw Web Portal before it can be downloaded.
Step 1. Login to the RipDraw Web Portal and go to the DIY Project and edit the project by clicking on the “Pencil” icon under the Actions column
Step 2. From the Edit DIY Project page, click on the Export button to configure the project for export
Step 3. The default export configuration is “With Source”, for this example, we want to the RipDraw Web Portal to prepare the download without source, so uncheck the With Source“ option.
Step 4. When the package is ready, the text “download” will appear, click on it to start the download of a zip file to the Windows PC. When the download is complete, unzip the file and we will be ready to transfer the images to the 1U RipDraw Display.
Step 1. Connect the 1U RipDraw Display to your Windows PC via the USB ports. The 1U RipDraw Display will draw power from the Windows PC Host USB port. If com port is recognized by the Windows PC and the hardware is hunky-dory, we can proceed with the next step.
Step 2. Start the RipDraw Native Windows Emulator on the Windows PC. The Emulator is the software utility that we will use to transfer the images and fonts from the Windows PC to the flash into the nonvolatile memory of the 1U RipDraw Display. Once the images and fonts are flashed on to the 1U RipDraw Display, the images and fonts are retained after any power off cycles and can only be removed only by explicitly deleting them from the nonvolatile memory.
Click on the Detect button and then the Get button. The Detect button will tell the Emulator to find the com port where the 1U RipDraw Display is connected to. The Get button will poll the 1U RipDraw Display for system status information to be displayed. If everything is working, we can starting transferring the images and fonts to the 1U RipDraw Display.
Step 3. Now using the Browse button, navigate the Emulator to the directory where you downloaded and unzipped your project. The directory location is the one just above the folders fonts, imagelist, images. If you are at the correct directory the lower buttons like Download All, Run All will turn blue to signify that these functions are enabled.
Now click Download ALL, when the download is successful and complete, click Run All. The Emulator will then drive the RipDraw Display the project based on the GUI Design. Below is the screen shot of the 1U RipDraw Display running the DIY project. We are done!
If you look back at your project on the RipDraw Web portal, you will notice that the Emulator drew the images onto the 1U RipDraw Display in the same locations as specified by the GUI Buttons Design. As part of the project download an emulator “script” file is included for all GUI Designs in the project. This script file are instructions for the Emulator on where to place each image when driving the display. In the DIY project we only had one GUI Design with the name Buttons hence the only script file for this project is 1_Buttons.txt. If a project had more GUI Designs, there would be additional script files 2_xxx.txt, 3_xxx.txt, and so on. The number is the sequence for the Emulator to run them with and the “xxx” would be the name of the GUI Design.
For projects with more than multiple GUI Designs, manipulating the sequence number of your GUI Designs on the RipDraw Web Portal allow you create a “story board” of these GUI Designs. Once this project is download, the Emulator can be used to run the full story board.
At this point, you have been able to create a RipDraw Project, download the project images from the RipDraw Web Portal, load the 1U RipDraw with the images and then using the Emulator, drive the 1U RipDraw Display to draw the project. Now you can go back and create more complicated projects and play with them using the Emulator. Or you can start developing a “embedded” host system to drive the 1U RipDraw display directly. Current the Emulator is driving the 1U RipDraw Display. An embedded host system will replace the Emulator functionality. Check out our Beagle Bone Black Tutorials for the 1U RipDraw Display that does just that!